@qsxy/element-plus-react 1.0.2 → 2.0.0

package/dist/Tree/MotionTreeNode.js

@@ -1,125 +0,0 @@
-var _excluded = ["className", "style", "motion", "motionNodes", "motionType", "onMotionStart", "onMotionEnd", "active", "treeNodeRequiredProps"];
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import classNames from 'classnames';
-import { useComposeRef } from 'rc-util';
-import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
-import * as React from 'react';
-import { useRef } from 'react';
-import Transition from "../Transition/Transition";
-import TreeNode from "./TreeNode";
-import { TreeContext } from "./contextTypes";
-import useUnmount from "./useUnmount";
-import { getTreeNodeProps } from "./utils/treeUtil";
-var MotionTreeNode = /*#__PURE__*/React.forwardRef(function (oriProps, ref) {
-  var className = oriProps.className,
-    style = oriProps.style,
-    motion = oriProps.motion,
-    motionNodes = oriProps.motionNodes,
-    motionType = oriProps.motionType,
-    onOriginMotionStart = oriProps.onMotionStart,
-    onOriginMotionEnd = oriProps.onMotionEnd,
-    active = oriProps.active,
-    treeNodeRequiredProps = oriProps.treeNodeRequiredProps,
-    props = _objectWithoutProperties(oriProps, _excluded);
-  var _React$useState = React.useState(true),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    visible = _React$useState2[0],
-    setVisible = _React$useState2[1];
-  var _React$useContext = React.useContext(TreeContext),
-    prefixCls = _React$useContext.prefixCls;
-
-  // Calculate target visible here.
-  // And apply in effect to make `leave` motion work.
-  var targetVisible = motionNodes && motionType !== 'hide';
-  var motionedRef = useRef(false);
-  var containerRef = useRef(null);
-  var mergedRef = useComposeRef(ref, containerRef);
-  var onMotionEnd = function onMotionEnd() {
-    if (!motionedRef.current) {
-      onOriginMotionEnd();
-    }
-    motionedRef.current = true;
-  };
-  useLayoutEffect(function () {
-    if (motionNodes) {
-      if (targetVisible !== visible) {
-        setVisible(targetVisible);
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [motionNodes]);
-  var triggerMotionStart = function triggerMotionStart() {
-    if (motionNodes) {
-      onOriginMotionStart();
-    }
-  };
-
-  // Should only trigger once
-  var triggerMotionEndRef = React.useRef(false);
-  var triggerMotionEnd = function triggerMotionEnd() {
-    if (motionNodes && !triggerMotionEndRef.current) {
-      triggerMotionEndRef.current = true;
-      onOriginMotionEnd();
-    }
-  };
-
-  // Effect if unmount
-  useUnmount(triggerMotionStart, triggerMotionEnd);
-
-  // Motion end event
-  var onVisibleChanged = function onVisibleChanged(nextVisible) {
-    if (targetVisible === nextVisible) {
-      triggerMotionEnd();
-    }
-  };
-  if (motionNodes) {
-    return /*#__PURE__*/React.createElement(Transition, _extends({
-      nodeRef: containerRef,
-      visible: visible
-    }, motion, {
-      transitionAppear: motionType === 'show',
-      afterEnter: onMotionEnd,
-      afterLeave: onMotionEnd
-    }), /*#__PURE__*/React.createElement("div", {
-      ref: mergedRef,
-      className: classNames("".concat(prefixCls, "-treenode-motion"), className),
-      style: style
-    }, motionNodes.map(function (treeNode) {
-      var restProps = Object.assign({}, (_objectDestructuringEmpty(treeNode.data), treeNode.data)),
-        title = treeNode.title,
-        key = treeNode.key,
-        isStart = treeNode.isStart,
-        isEnd = treeNode.isEnd;
-      delete restProps.children;
-      var treeNodeProps = getTreeNodeProps(key, treeNodeRequiredProps);
-      return /*#__PURE__*/React.createElement(TreeNode, _extends({}, restProps, treeNodeProps, {
-        title: title,
-        active: active,
-        data: treeNode.data,
-        key: key,
-        isStart: isStart,
-        isEnd: isEnd
-      }));
-    })));
-  }
-  return /*#__PURE__*/React.createElement(TreeNode, _extends({
-    domRef: ref,
-    className: className,
-    style: style
-  }, props, {
-    active: active
-  }));
-});
-if (process.env.NODE_ENV !== 'production') {
-  MotionTreeNode.displayName = 'MotionTreeNode';
-}
-export default MotionTreeNode;

package/dist/Tree/NodeList.d.ts

@@ -1,50 +0,0 @@
-/**
- * Handle virtual list of the TreeNodes.
- */
-import * as React from 'react';
-import type { BasicDataNode, DataEntity, DataNode, FlattenNode, Key, KeyEntities, ScrollTo } from './typings';
-export declare const MOTION_KEY: string;
-export declare const MotionEntity: DataEntity;
-export interface NodeListRef {
-    scrollTo: ScrollTo;
-    getIndentWidth: () => number;
-}
-interface NodeListProps<TreeDataType extends BasicDataNode> {
-    prefixCls: string;
-    style: React.CSSProperties;
-    data: FlattenNode<TreeDataType>[];
-    motion: any;
-    focusable?: boolean;
-    activeItem: FlattenNode<TreeDataType>;
-    focused?: boolean;
-    tabIndex: number;
-    checkable?: boolean;
-    selectable?: boolean;
-    disabled?: boolean;
-    expandedKeys: Key[];
-    selectedKeys: Key[];
-    checkedKeys: Key[];
-    loadedKeys: Key[];
-    loadingKeys: Key[];
-    halfCheckedKeys: Key[];
-    keyEntities: KeyEntities;
-    dragging: boolean;
-    dragOverNodeKey: Key;
-    dropPosition: number;
-    height: number;
-    itemHeight: number;
-    virtual?: boolean;
-    scrollWidth?: number;
-    onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
-    onFocus?: React.FocusEventHandler<HTMLDivElement>;
-    onBlur?: React.FocusEventHandler<HTMLDivElement>;
-    onActiveChange: (key: Key) => void;
-    onListChangeStart: () => void;
-    onListChangeEnd: () => void;
-}
-/**
- * We only need get visible content items to play the animation.
- */
-export declare function getMinimumRangeTransitionRange(list: FlattenNode[], virtual: boolean, height: number, itemHeight: number): FlattenNode<DataNode>[];
-declare const NodeList: React.ForwardRefExoticComponent<NodeListProps<any> & React.RefAttributes<NodeListRef>>;
-export default NodeList;

package/dist/Tree/NodeList.js

@@ -1,301 +0,0 @@
-var _excluded = ["prefixCls", "data", "selectable", "checkable", "expandedKeys", "selectedKeys", "checkedKeys", "loadedKeys", "loadingKeys", "halfCheckedKeys", "keyEntities", "disabled", "dragging", "dragOverNodeKey", "dropPosition", "motion", "height", "itemHeight", "virtual", "scrollWidth", "focusable", "activeItem", "focused", "tabIndex", "onKeyDown", "onFocus", "onBlur", "onActiveChange", "onListChangeStart", "onListChangeEnd"];
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-/**
- * Handle virtual list of the TreeNodes.
- */
-
-import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
-import VirtualList from 'rc-virtual-list';
-import * as React from 'react';
-import MotionTreeNode from "./MotionTreeNode";
-import { findExpandedKeys, getExpandRange } from "./utils/diffUtil";
-import { getKey, getTreeNodeProps } from "./utils/treeUtil";
-var HIDDEN_STYLE = {
-  width: 0,
-  height: 0,
-  display: 'flex',
-  overflow: 'hidden',
-  opacity: 0,
-  border: 0,
-  padding: 0,
-  margin: 0
-};
-
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-var noop = function noop() {};
-export var MOTION_KEY = "RC_TREE_MOTION_".concat(Math.random());
-var MotionNode = {
-  key: MOTION_KEY
-};
-export var MotionEntity = {
-  key: MOTION_KEY,
-  level: 0,
-  index: 0,
-  pos: '0',
-  node: MotionNode,
-  nodes: [MotionNode]
-};
-var MotionFlattenData = {
-  parent: null,
-  children: [],
-  pos: MotionEntity.pos,
-  data: MotionNode,
-  title: null,
-  key: MOTION_KEY,
-  /** Hold empty list here since we do not use it */
-  isStart: [],
-  isEnd: []
-};
-/**
- * We only need get visible content items to play the animation.
- */
-export function getMinimumRangeTransitionRange(list, virtual, height, itemHeight) {
-  if (virtual === false || !height) {
-    return list;
-  }
-  return list.slice(0, Math.ceil(height / itemHeight) + 1);
-}
-function itemKey(item) {
-  var key = item.key,
-    pos = item.pos;
-  return getKey(key, pos);
-}
-function getAccessibilityPath(item) {
-  var path = String(item.data.key);
-  var current = item;
-  while (current.parent) {
-    current = current.parent;
-    path = "".concat(current.data.key, " > ").concat(path);
-  }
-  return path;
-}
-var NodeList = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var prefixCls = props.prefixCls,
-    data = props.data,
-    selectable = props.selectable,
-    checkable = props.checkable,
-    expandedKeys = props.expandedKeys,
-    selectedKeys = props.selectedKeys,
-    checkedKeys = props.checkedKeys,
-    loadedKeys = props.loadedKeys,
-    loadingKeys = props.loadingKeys,
-    halfCheckedKeys = props.halfCheckedKeys,
-    keyEntities = props.keyEntities,
-    disabled = props.disabled,
-    dragging = props.dragging,
-    dragOverNodeKey = props.dragOverNodeKey,
-    dropPosition = props.dropPosition,
-    motion = props.motion,
-    height = props.height,
-    itemHeight = props.itemHeight,
-    virtual = props.virtual,
-    scrollWidth = props.scrollWidth,
-    focusable = props.focusable,
-    activeItem = props.activeItem,
-    focused = props.focused,
-    tabIndex = props.tabIndex,
-    onKeyDown = props.onKeyDown,
-    onFocus = props.onFocus,
-    onBlur = props.onBlur,
-    onActiveChange = props.onActiveChange,
-    onListChangeStart = props.onListChangeStart,
-    onListChangeEnd = props.onListChangeEnd,
-    domProps = _objectWithoutProperties(props, _excluded);
-
-  // =============================== Ref ================================
-  var listRef = React.useRef(null);
-  var indentMeasurerRef = React.useRef(null);
-  React.useImperativeHandle(ref, function () {
-    return {
-      scrollTo: function scrollTo(scroll) {
-        listRef.current.scrollTo(scroll);
-      },
-      getIndentWidth: function getIndentWidth() {
-        return indentMeasurerRef.current.offsetWidth;
-      }
-    };
-  });
-
-  // ============================== Motion ==============================
-  var _React$useState = React.useState(expandedKeys),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    prevExpandedKeys = _React$useState2[0],
-    setPrevExpandedKeys = _React$useState2[1];
-  var _React$useState3 = React.useState(data),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    prevData = _React$useState4[0],
-    setPrevData = _React$useState4[1];
-  var _React$useState5 = React.useState(data),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    transitionData = _React$useState6[0],
-    setTransitionData = _React$useState6[1];
-  var _React$useState7 = React.useState([]),
-    _React$useState8 = _slicedToArray(_React$useState7, 2),
-    transitionRange = _React$useState8[0],
-    setTransitionRange = _React$useState8[1];
-  var _React$useState9 = React.useState(null),
-    _React$useState10 = _slicedToArray(_React$useState9, 2),
-    motionType = _React$useState10[0],
-    setMotionType = _React$useState10[1];
-
-  // When motion end but data change, this will makes data back to previous one
-  var dataRef = React.useRef(data);
-  dataRef.current = data;
-  function onMotionEnd() {
-    var latestData = dataRef.current;
-    setPrevData(latestData);
-    setTransitionData(latestData);
-    setTransitionRange([]);
-    setMotionType(null);
-    onListChangeEnd();
-  }
-
-  // Do animation if expanded keys changed
-  // layoutEffect here to avoid blink of node removing
-  useLayoutEffect(function () {
-    setPrevExpandedKeys(expandedKeys);
-    var diffExpanded = findExpandedKeys(prevExpandedKeys, expandedKeys);
-    if (diffExpanded.key !== null) {
-      if (diffExpanded.add) {
-        var keyIndex = prevData.findIndex(function (_ref) {
-          var key = _ref.key;
-          return key === diffExpanded.key;
-        });
-        var rangeNodes = getMinimumRangeTransitionRange(getExpandRange(prevData, data, diffExpanded.key), virtual, height, itemHeight);
-        var newTransitionData = prevData.slice();
-        newTransitionData.splice(keyIndex + 1, 0, MotionFlattenData);
-        setTransitionData(newTransitionData);
-        setTransitionRange(rangeNodes);
-        setMotionType('show');
-      } else {
-        var _keyIndex = data.findIndex(function (_ref2) {
-          var key = _ref2.key;
-          return key === diffExpanded.key;
-        });
-        var _rangeNodes = getMinimumRangeTransitionRange(getExpandRange(data, prevData, diffExpanded.key), virtual, height, itemHeight);
-        var _newTransitionData = data.slice();
-        _newTransitionData.splice(_keyIndex + 1, 0, MotionFlattenData);
-        setTransitionData(_newTransitionData);
-        setTransitionRange(_rangeNodes);
-        setMotionType('hide');
-      }
-    } else if (prevData !== data) {
-      // If whole data changed, we just refresh the list
-      setPrevData(data);
-      setTransitionData(data);
-    }
-  }, [expandedKeys, data]);
-
-  // We should clean up motion if is changed by dragging
-  React.useEffect(function () {
-    if (!dragging) {
-      onMotionEnd();
-    }
-  }, [dragging]);
-  var mergedData = motion ? transitionData : data;
-  var treeNodeRequiredProps = {
-    expandedKeys: expandedKeys,
-    selectedKeys: selectedKeys,
-    loadedKeys: loadedKeys,
-    loadingKeys: loadingKeys,
-    checkedKeys: checkedKeys,
-    halfCheckedKeys: halfCheckedKeys,
-    dragOverNodeKey: dragOverNodeKey,
-    dropPosition: dropPosition,
-    keyEntities: keyEntities
-  };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, focused && activeItem && /*#__PURE__*/React.createElement("span", {
-    style: HIDDEN_STYLE,
-    "aria-live": "assertive"
-  }, getAccessibilityPath(activeItem)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
-    style: HIDDEN_STYLE,
-    disabled: focusable === false || disabled,
-    tabIndex: focusable !== false ? tabIndex : null,
-    onKeyDown: onKeyDown,
-    onFocus: onFocus,
-    onBlur: onBlur,
-    value: "",
-    onChange: noop,
-    "aria-label": "for screen reader"
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-treenode"),
-    "aria-hidden": true,
-    style: {
-      position: 'absolute',
-      pointerEvents: 'none',
-      visibility: 'hidden',
-      height: 0,
-      overflow: 'hidden',
-      border: 0,
-      padding: 0
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-indent")
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: indentMeasurerRef,
-    className: "".concat(prefixCls, "-indent-unit")
-  }))), /*#__PURE__*/React.createElement(VirtualList, _extends({}, domProps, {
-    data: mergedData,
-    itemKey: itemKey,
-    height: height,
-    fullHeight: false,
-    virtual: virtual,
-    itemHeight: itemHeight,
-    scrollWidth: scrollWidth,
-    prefixCls: "".concat(prefixCls, "-list"),
-    ref: listRef,
-    role: "tree",
-    onVisibleChange: function onVisibleChange(originList) {
-      // The best match is using `fullList` - `originList` = `restList`
-      // and check the `restList` to see if has the MOTION_KEY node
-      // but this will cause performance issue for long list compare
-      // we just check `originList` and repeat trigger `onMotionEnd`
-      if (originList.every(function (item) {
-        return itemKey(item) !== MOTION_KEY;
-      })) {
-        onMotionEnd();
-      }
-    }
-  }), function (treeNode) {
-    var pos = treeNode.pos,
-      restProps = Object.assign({}, (_objectDestructuringEmpty(treeNode.data), treeNode.data)),
-      title = treeNode.title,
-      key = treeNode.key,
-      isStart = treeNode.isStart,
-      isEnd = treeNode.isEnd;
-    var mergedKey = getKey(key, pos);
-    delete restProps.key;
-    delete restProps.children;
-    var treeNodeProps = getTreeNodeProps(mergedKey, treeNodeRequiredProps);
-    return /*#__PURE__*/React.createElement(MotionTreeNode, _extends({}, restProps, treeNodeProps, {
-      title: title,
-      active: !!activeItem && key === activeItem.key,
-      pos: pos,
-      data: treeNode.data,
-      isStart: isStart,
-      isEnd: isEnd,
-      motion: motion,
-      motionNodes: key === MOTION_KEY ? transitionRange : null,
-      motionType: motionType,
-      onMotionStart: onListChangeStart,
-      onMotionEnd: onMotionEnd,
-      treeNodeRequiredProps: treeNodeRequiredProps,
-      onMouseMove: function onMouseMove() {
-        onActiveChange(null);
-      }
-    }));
-  }));
-});
-if (process.env.NODE_ENV !== 'production') {
-  NodeList.displayName = 'NodeList';
-}
-export default NodeList;