@douyinfe/semi-foundation 2.1.0-next.0 → 2.1.0

package/lib/cjs/treeSelect/foundation.js

@@ -1,778 +0,0 @@
-"use strict";
-
-var _filterInstanceProperty2 = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports.default = void 0;
-
-var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
-
-var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
-
-var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
-
-var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set"));
-
-var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-
-var _isArray = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/is-array"));
-
-var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
-
-var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/values"));
-
-var _some = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/some"));
-
-var _every = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/every"));
-
-var _lodashEs = require("lodash-es");
-
-var _constants = require("../treeSelect/constants");
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-var _treeUtil = require("../tree/treeUtil");
-
-// eslint-disable-next-line max-len
-class TreeSelectFoundation extends _foundation.default {
-  constructor(adapter) {
-    super((0, _assign.default)({}, adapter));
-  }
-
-  init() {
-    const {
-      searchAutoFocus,
-      searchPosition,
-      filterTreeNode
-    } = this.getProps();
-    const triggerSearch = searchPosition === _constants.strings.SEARCH_POSITION_TRIGGER && filterTreeNode;
-    const triggerSearchAutoFocus = searchAutoFocus && triggerSearch;
-
-    this._setDropdownWidth();
-
-    const isOpen = (this.getProp('defaultOpen') || triggerSearchAutoFocus) && !this._isDisabled();
-
-    if (isOpen) {
-      this.open();
-    }
-  }
-
-  destroy() {
-    // Ensure that event monitoring will be uninstalled, and the user may not trigger closePanel
-    this._adapter.unregisterClickOutsideHandler();
-  }
-
-  _setDropdownWidth() {
-    const {
-      style,
-      dropdownMatchSelectWidth
-    } = this.getProps();
-    let width;
-
-    if (dropdownMatchSelectWidth) {
-      var _context;
-
-      if (style && (0, _lodashEs.isNumber)(style.width)) {
-        width = style.width;
-      } else if (style && (0, _lodashEs.isString)(style.width) && !(0, _includes.default)(_context = style.width).call(_context, '%')) {
-        width = style.width;
-      } else {
-        width = this._adapter.getTriggerWidth();
-      }
-
-      this._adapter.setOptionWrapperWidth(width);
-    }
-  }
-
-  _isMultiple() {
-    return this.getProp('multiple');
-  }
-
-  _isAnimated() {
-    return this.getProp('motionExpand');
-  }
-
-  _isDisabled() {
-    let treeNode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    return this.getProp('disabled') || treeNode.disabled;
-  }
-
-  _isExpandControlled() {
-    return this.getProp('expandedKeys');
-  }
-
-  _isSelectToClose() {
-    return !this.getProp('expandAction');
-  }
-
-  _isLoadControlled() {
-    return this.getProp('loadedKeys');
-  }
-
-  _showFilteredOnly() {
-    const {
-      inputValue
-    } = this.getStates();
-    const {
-      showFilteredOnly
-    } = this.getProps();
-    return Boolean(inputValue) && showFilteredOnly;
-  }
-
-  getCopyFromState(items) {
-    var _context2;
-
-    const res = {};
-    (0, _forEach.default)(_context2 = (0, _treeUtil.normalizedArr)(items)).call(_context2, key => {
-      res[key] = (0, _lodashEs.cloneDeep)(this.getState(key));
-    });
-    return res;
-  }
-
-  getTreeNodeProps(key) {
-    const {
-      expandedKeys = new _set.default([]),
-      selectedKeys = [],
-      checkedKeys = new _set.default([]),
-      halfCheckedKeys = new _set.default([]),
-      keyEntities = {},
-      filteredKeys = new _set.default([]),
-      inputValue = '',
-      loadedKeys,
-      loadingKeys,
-      filteredExpandedKeys = new _set.default([]),
-      disabledKeys = new _set.default([])
-    } = this.getStates();
-    const {
-      treeNodeFilterProp
-    } = this.getProps();
-    const entity = keyEntities[key];
-    const notExist = !entity;
-
-    if (notExist) {
-      return null;
-    }
-
-    const isSearching = Boolean(inputValue);
-    const treeNodeProps = {
-      eventKey: key,
-      expanded: isSearching ? filteredExpandedKeys.has(key) : expandedKeys.has(key),
-      selected: (0, _includes.default)(selectedKeys).call(selectedKeys, key),
-      checked: checkedKeys.has(key),
-      halfChecked: halfCheckedKeys.has(key),
-      pos: String(entity ? entity.pos : ''),
-      level: entity.level,
-      filtered: filteredKeys.has(key),
-      keyword: inputValue,
-      treeNodeFilterProp,
-      loading: loadingKeys.has(key) && !loadedKeys.has(key),
-      loaded: loadedKeys.has(key)
-    };
-
-    if (this.getProp('disableStrictly') && disabledKeys.has(key)) {
-      treeNodeProps.disabled = true;
-    }
-
-    return treeNodeProps;
-  }
-
-  handleNodeLoad(loadedKeys, loadingKeys, data, resolve) {
-    const {
-      loadData
-    } = this.getProps();
-    const {
-      key
-    } = data;
-
-    if (!loadData || loadedKeys.has(key) || loadingKeys.has(key)) {
-      return {};
-    }
-
-    loadData(data).then(() => {
-      const {
-        loadedKeys: prevLoadedKeys,
-        loadingKeys: prevLoadingKeys
-      } = this.getCopyFromState(['loadedKeys', 'loadingKeys']);
-      const newLoadedKeys = prevLoadedKeys.add(key);
-      const newLoadingKeys = new _set.default([...prevLoadingKeys]);
-      newLoadingKeys.delete(key);
-
-      this._adapter.notifyLoad(newLoadedKeys, data);
-
-      if (!this._isLoadControlled()) {
-        this._adapter.updateState({
-          loadedKeys: newLoadedKeys
-        });
-      }
-
-      this._adapter.setState({
-        loadingKeys: newLoadingKeys
-      });
-
-      resolve();
-    });
-    return {
-      loadingKeys: loadingKeys.add(key)
-    };
-  }
-
-  focusInput(bool) {
-    this._adapter.updateInputFocus(bool);
-  }
-
-  _notifyMultipleChange(key, e) {
-    const {
-      keyEntities
-    } = this.getStates();
-    const {
-      leafOnly
-    } = this.getProps();
-    const keyList = (0, _treeUtil.normalizeKeyList)(key, keyEntities, leafOnly);
-    const nodes = (0, _map.default)(keyList).call(keyList, i => keyEntities[i].data);
-
-    if (this.getProp('onChangeWithObject')) {
-      this._adapter.notifyChangeWithObject(nodes, e);
-    } else {
-      const value = (0, _treeUtil.getValueOrKey)(nodes);
-
-      this._adapter.notifyChange(value, nodes, e);
-    }
-  }
-
-  _notifyChange(key, e) {
-    const {
-      keyEntities
-    } = this.getStates();
-
-    if (this._isMultiple() && (0, _isArray.default)(key)) {
-      this._notifyMultipleChange(key, e);
-    } else {
-      const nodes = (0, _lodashEs.isUndefined)(key) ? key : keyEntities[key].data;
-      const value = (0, _lodashEs.isUndefined)(key) ? key : (0, _treeUtil.getValueOrKey)(nodes);
-
-      if (this.getProp('onChangeWithObject')) {
-        this._adapter.notifyChangeWithObject(nodes, e);
-      } else {
-        this._adapter.notifyChange(value, nodes, e);
-      }
-    }
-  } // Scenes that may trigger focus:
-  //  1、click selection
-
-
-  _notifyFocus(e) {
-    this._adapter.notifyFocus(e);
-  } // Scenes that may trigger blur
-  //  1、clickOutSide
-  //  2、click option / press enter, and then select complete（when multiple is false
-  //  3、press esc when dropdown list open
-
-
-  _notifyBlur(e) {
-    this._adapter.notifyBlur(e);
-  }
-
-  toggleHoverState(bool) {
-    this._adapter.toggleHovering(bool);
-  }
-
-  open() {
-    this._adapter.openMenu();
-
-    this._setDropdownWidth();
-
-    this._adapter.registerClickOutsideHandler(e => {
-      this.close(e);
-    });
-  }
-
-  close(e) {
-    this._adapter.closeMenu();
-
-    this._adapter.unregisterClickOutsideHandler();
-
-    this._notifyBlur(e);
-
-    if (this.getProp('motionExpand')) {
-      this._adapter.updateState({
-        motionKeys: new _set.default([])
-      });
-    }
-  }
-
-  handleClick(e) {
-    const isDisabled = this._isDisabled();
-
-    const {
-      isOpen
-    } = this.getStates();
-
-    if (isDisabled) {
-      return;
-    } else if (!isOpen) {
-      this.open();
-
-      this._notifyFocus(e);
-    } else if (isOpen) {
-      this.close(e);
-    }
-  }
-
-  handleClear(e) {
-    const {
-      searchPosition,
-      filterTreeNode
-    } = this.getProps();
-    const {
-      inputValue,
-      selectedKeys
-    } = this.getStates();
-
-    const isMultiple = this._isMultiple();
-
-    const isControlled = this._isControlledComponent();
-
-    const value = isMultiple ? [] : undefined;
-
-    this._notifyChange(value, e);
-
-    if (!isControlled) {
-      // reposition dropdown when selected values change
-      this._adapter.rePositionDropdown();
-
-      this._adapter.updateState({
-        selectedKeys: [],
-        checkedKeys: new _set.default(),
-        halfCheckedKeys: new _set.default()
-      });
-    } // When triggerSearch, clicking the clear button will trigger to clear Input
-
-
-    if (filterTreeNode && searchPosition === _constants.strings.SEARCH_POSITION_TRIGGER) {
-      if (inputValue !== '') {
-        if ((0, _lodashEs.isEmpty)(selectedKeys)) {
-          this.handleInputChange('');
-        } else {
-          this.clearInput();
-        }
-      }
-    }
-  }
-
-  removeTag(eventKey) {
-    const {
-      disableStrictly
-    } = this.getProps();
-    const {
-      keyEntities,
-      disabledKeys
-    } = this.getStates();
-    const item = keyEntities[eventKey].data;
-
-    if (item.disabled || disableStrictly && disabledKeys.has(eventKey)) {
-      return;
-    }
-
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = this.calcCheckedKeys(eventKey, false);
-
-    this._notifyChange([...checkedKeys], null);
-
-    if (!this._isControlledComponent()) {
-      this._adapter.updateState({
-        checkedKeys,
-        halfCheckedKeys
-      });
-
-      this._adapter.rePositionDropdown();
-    }
-
-    this._adapter.notifySelect(eventKey, false, item); // reposition dropdown when selected values change
-
-
-    this._adapter.rePositionDropdown();
-  }
-
-  clearInput() {
-    const {
-      expandedKeys,
-      selectedKeys,
-      keyEntities,
-      treeData
-    } = this.getStates();
-    const expandedOptsKeys = (0, _treeUtil.findAncestorKeys)(selectedKeys, keyEntities);
-    (0, _forEach.default)(expandedOptsKeys).call(expandedOptsKeys, item => expandedKeys.add(item));
-    const flattenNodes = (0, _treeUtil.flattenTreeData)(treeData, expandedKeys);
-
-    this._adapter.updateState({
-      expandedKeys,
-      flattenNodes,
-      inputValue: '',
-      motionKeys: new _set.default([]),
-      filteredKeys: new _set.default([]),
-      filteredExpandedKeys: new _set.default(expandedOptsKeys),
-      filteredShownKeys: new _set.default([])
-    });
-  }
-
-  handleInputChange(sugInput) {
-    // Input is used as controlled component
-    this._adapter.updateInputValue(sugInput);
-
-    const {
-      expandedKeys,
-      selectedKeys,
-      keyEntities,
-      treeData
-    } = this.getStates();
-    const {
-      showFilteredOnly,
-      filterTreeNode,
-      treeNodeFilterProp
-    } = this.getProps();
-    let filteredOptsKeys = [];
-    let expandedOptsKeys = [];
-    let flattenNodes = [];
-    let filteredShownKeys = new _set.default([]);
-
-    if (!sugInput) {
-      expandedOptsKeys = (0, _treeUtil.findAncestorKeys)(selectedKeys, keyEntities);
-      (0, _forEach.default)(expandedOptsKeys).call(expandedOptsKeys, item => expandedKeys.add(item));
-      flattenNodes = (0, _treeUtil.flattenTreeData)(treeData, expandedKeys);
-    } else {
-      var _context3, _context4;
-
-      filteredOptsKeys = (0, _map.default)(_context3 = (0, _filter.default)(_context4 = (0, _values.default)(keyEntities)).call(_context4, item => {
-        const {
-          data
-        } = item;
-        return (0, _filterInstanceProperty2(_treeUtil))(sugInput, data, filterTreeNode, treeNodeFilterProp);
-      })).call(_context3, item => item.key);
-      expandedOptsKeys = (0, _treeUtil.findAncestorKeys)(filteredOptsKeys, keyEntities, false);
-      const shownChildKeys = (0, _treeUtil.findDescendantKeys)(filteredOptsKeys, keyEntities, true);
-      filteredShownKeys = new _set.default([...shownChildKeys, ...expandedOptsKeys]);
-      flattenNodes = (0, _treeUtil.flattenTreeData)(treeData, new _set.default(expandedOptsKeys), showFilteredOnly && filteredShownKeys);
-    }
-
-    this._adapter.notifySearch(sugInput);
-
-    this._adapter.updateState({
-      expandedKeys,
-      flattenNodes,
-      motionKeys: new _set.default([]),
-      filteredKeys: new _set.default(filteredOptsKeys),
-      filteredExpandedKeys: new _set.default(expandedOptsKeys),
-      filteredShownKeys
-    });
-  }
-
-  handleNodeSelect(e, treeNode) {
-    const isDisabled = this._isDisabled(treeNode);
-
-    if (isDisabled) {
-      return;
-    }
-
-    if (!this._isMultiple()) {
-      this.handleSingleSelect(e, treeNode);
-    } else {
-      this.handleMultipleSelect(e, treeNode);
-    }
-  }
-
-  handleSingleSelect(e, treeNode) {
-    let {
-      selectedKeys
-    } = this.getCopyFromState('selectedKeys');
-    const {
-      clickToHide
-    } = this.getProps();
-    const {
-      selected,
-      eventKey,
-      data
-    } = treeNode;
-
-    this._adapter.notifySelect(eventKey, true, data);
-
-    if (!(0, _includes.default)(selectedKeys).call(selectedKeys, eventKey) && !selected) {
-      selectedKeys = [eventKey];
-
-      this._notifyChange(eventKey, e);
-
-      if (!this._isControlledComponent()) {
-        this._adapter.updateState({
-          selectedKeys
-        });
-      }
-    }
-
-    if (clickToHide && (this._isSelectToClose() || !data.children)) {
-      this.close(e);
-    }
-  }
-
-  calcCheckedKeys(eventKey, targetStatus) {
-    const {
-      keyEntities
-    } = this.getStates();
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = this.getCopyFromState(['checkedKeys', 'halfCheckedKeys']);
-
-    if (targetStatus) {
-      return (0, _treeUtil.calcCheckedKeysForChecked)(eventKey, keyEntities, checkedKeys, halfCheckedKeys);
-    } else {
-      return (0, _treeUtil.calcCheckedKeysForUnchecked)(eventKey, keyEntities, checkedKeys, halfCheckedKeys);
-    }
-  }
-
-  handleMultipleSelect(e, treeNode) {
-    const {
-      searchPosition,
-      disableStrictly
-    } = this.getProps();
-    const {
-      inputValue
-    } = this.getStates();
-    const {
-      checked,
-      eventKey,
-      data
-    } = treeNode;
-    const targetStatus = disableStrictly ? this.calcChekcedStatus(!checked, eventKey) : !checked;
-    const {
-      checkedKeys,
-      halfCheckedKeys
-    } = disableStrictly ? this.calcNonDisabedCheckedKeys(eventKey, targetStatus) : this.calcCheckedKeys(eventKey, targetStatus);
-
-    this._adapter.notifySelect(eventKey, targetStatus, data);
-
-    this._notifyChange([...checkedKeys], e);
-
-    if (searchPosition === _constants.strings.SEARCH_POSITION_TRIGGER && inputValue !== '') {
-      this._adapter.updateState({
-        inputValue: ''
-      });
-    }
-
-    if (!this._isControlledComponent()) {
-      this._adapter.updateState({
-        checkedKeys,
-        halfCheckedKeys
-      });
-
-      this._adapter.rePositionDropdown();
-    }
-  }
-
-  calcNonDisabedCheckedKeys(eventKey, targetStatus) {
-    const {
-      keyEntities,
-      disabledKeys
-    } = this.getStates();
-    const {
-      checkedKeys
-    } = this.getCopyFromState(['checkedKeys']);
-    const descendantKeys = (0, _treeUtil.normalizeKeyList)((0, _treeUtil.findDescendantKeys)([eventKey], keyEntities, false), keyEntities, true);
-    const hasDisabled = (0, _some.default)(descendantKeys).call(descendantKeys, key => disabledKeys.has(key));
-
-    if (!hasDisabled) {
-      return this.calcCheckedKeys(eventKey, targetStatus);
-    }
-
-    const nonDisabled = (0, _filter.default)(descendantKeys).call(descendantKeys, key => !disabledKeys.has(key));
-    const newCheckedKeys = targetStatus ? [...nonDisabled, ...checkedKeys] : (0, _lodashEs.difference)((0, _treeUtil.normalizeKeyList)([...checkedKeys], keyEntities, true), nonDisabled);
-    return (0, _treeUtil.calcCheckedKeys)(newCheckedKeys, keyEntities);
-  }
-
-  calcChekcedStatus(targetStatus, eventKey) {
-    if (!targetStatus) {
-      return targetStatus;
-    }
-
-    const {
-      checkedKeys,
-      keyEntities,
-      disabledKeys
-    } = this.getStates();
-    const descendantKeys = (0, _treeUtil.normalizeKeyList)((0, _treeUtil.findDescendantKeys)([eventKey], keyEntities, false), keyEntities, true);
-    const hasDisabled = (0, _some.default)(descendantKeys).call(descendantKeys, key => disabledKeys.has(key));
-
-    if (!hasDisabled) {
-      return targetStatus;
-    }
-
-    const nonDisabledKeys = (0, _filter.default)(descendantKeys).call(descendantKeys, key => !disabledKeys.has(key));
-    const allChecked = (0, _every.default)(nonDisabledKeys).call(nonDisabledKeys, key => checkedKeys.has(key));
-    return !allChecked;
-  }
-
-  handleNodeExpandInSearch(e, treeNode) {
-    const {
-      treeData,
-      filteredShownKeys,
-      keyEntities
-    } = this.getStates();
-
-    const showFilteredOnly = this._showFilteredOnly(); // clone otherwise will be modified unexpectedly
-
-
-    const {
-      filteredExpandedKeys
-    } = this.getCopyFromState('filteredExpandedKeys');
-    let motionType = 'show';
-    const {
-      eventKey,
-      expanded,
-      data
-    } = treeNode;
-
-    if (!expanded) {
-      filteredExpandedKeys.add(eventKey);
-    } else if (filteredExpandedKeys.has(eventKey)) {
-      filteredExpandedKeys.delete(eventKey);
-      motionType = 'hide';
-    } // cache prev flattenNodes, otherwise the calculation will remove hidden items
-
-
-    this._adapter.cacheFlattenNodes(motionType === 'hide' && this._isAnimated());
-
-    if (!this._isExpandControlled()) {
-      const flattenNodes = (0, _treeUtil.flattenTreeData)(treeData, filteredExpandedKeys, showFilteredOnly && filteredShownKeys);
-      const motionKeys = this._isAnimated() ? (0, _treeUtil.getMotionKeys)(eventKey, filteredExpandedKeys, keyEntities) : [];
-      const newState = {
-        filteredExpandedKeys,
-        flattenNodes,
-        motionKeys: new _set.default(motionKeys),
-        motionType
-      };
-
-      this._adapter.updateState(newState);
-    }
-
-    this._adapter.notifyExpand(filteredExpandedKeys, {
-      expanded: !expanded,
-      node: data
-    });
-  }
-
-  handleNodeExpand(e, treeNode) {
-    const {
-      loadData
-    } = this.getProps();
-    const {
-      inputValue,
-      keyEntities
-    } = this.getStates();
-    const isSearching = Boolean(inputValue);
-
-    if (!loadData && (!treeNode.children || !treeNode.children.length)) {
-      return;
-    }
-
-    if (isSearching) {
-      this.handleNodeExpandInSearch(e, treeNode);
-      return;
-    }
-
-    const {
-      treeData
-    } = this.getStates(); // clone otherwise will be modified unexpectedly
-
-    const {
-      expandedKeys
-    } = this.getCopyFromState('expandedKeys');
-    let motionType = 'show';
-    const {
-      eventKey,
-      expanded,
-      data
-    } = treeNode;
-
-    if (!expanded) {
-      expandedKeys.add(eventKey);
-    } else if (expandedKeys.has(eventKey)) {
-      expandedKeys.delete(eventKey);
-      motionType = 'hide';
-    }
-
-    this._adapter.cacheFlattenNodes(motionType === 'hide' && this._isAnimated());
-
-    if (!this._isExpandControlled()) {
-      const flattenNodes = (0, _treeUtil.flattenTreeData)(treeData, expandedKeys);
-      const motionKeys = this._isAnimated() ? (0, _treeUtil.getMotionKeys)(eventKey, expandedKeys, keyEntities) : [];
-      const newState = {
-        expandedKeys,
-        flattenNodes,
-        motionKeys: new _set.default(motionKeys),
-        motionType
-      };
-
-      this._adapter.updateState(newState);
-    }
-
-    this._adapter.notifyExpand(expandedKeys, {
-      expanded: !expanded,
-      node: data
-    });
-  }
-  /**
-   * The selected items that need to be displayed in the search box when obtaining a single selection
-   */
-
-
-  getRenderTextInSingle() {
-    const {
-      renderSelectedItem: propRenderSelectedItem,
-      treeNodeLabelProp
-    } = this.getProps();
-    const {
-      selectedKeys,
-      keyEntities
-    } = this.getStates();
-    const renderSelectedItem = (0, _lodashEs.isFunction)(propRenderSelectedItem) ? propRenderSelectedItem : item => (0, _lodashEs.get)(item, treeNodeLabelProp, null);
-    const item = selectedKeys.length && keyEntities[selectedKeys[0]] ? keyEntities[selectedKeys[0]].data : undefined;
-    const renderText = item && treeNodeLabelProp in item ? renderSelectedItem(item) : null;
-    return renderText;
-  }
-  /**
-   * When the search box is on the trigger, the blur event handling method
-   */
-
-
-  handleInputTriggerBlur() {
-    this._adapter.updateState({
-      inputTriggerFocus: false
-    });
-  }
-  /**
-   * When the search box is on the trigger, the focus event processing method
-   */
-
-
-  handleInputTriggerFocus() {
-    this.clearInput();
-
-    this._adapter.updateState({
-      inputTriggerFocus: true
-    });
-  }
-
-  setLoadKeys(data, resolve) {
-    this._adapter.updateLoadKeys(data, resolve);
-  }
-
-}
-
-exports.default = TreeSelectFoundation;