@douyinfe/semi-ui 2.36.0-beta.0 → 2.36.1-alpha.0

package/lib/es/rating/item.d.ts

@@ -4,7 +4,7 @@ import { strings } from '@douyinfe/semi-foundation/lib/es/rating/constants';
 import '@douyinfe/semi-foundation/lib/es/rating/rating.css';
 import { RatingItemFoundation, RatingItemAdapter } from '@douyinfe/semi-foundation/lib/es/rating/foundation';
 import BaseComponent, { BaseProps } from '../_base/baseComponent';
-declare type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
+type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
 export interface RatingItemProps extends BaseProps {
     value: number;
     index: number;

package/lib/es/rating/item.js

@@ -11,7 +11,6 @@ export default class Item extends BaseComponent {
     super(props);
     this.firstStar = null;
     this.secondStar = null;
-
     this.onHover = e => {
       const {
         onHover,
@@ -19,7 +18,6 @@ export default class Item extends BaseComponent {
       } = this.props;
       onHover(e, index);
     };
-
     this.onClick = e => {
       const {
         onClick,
@@ -27,7 +25,6 @@ export default class Item extends BaseComponent {
       } = this.props;
       onClick(e, index);
     };
-
     this.onFocus = (e, star) => {
       const {
         onFocus
@@ -35,7 +32,6 @@ export default class Item extends BaseComponent {
       onFocus && onFocus(e);
       this.foundation.handleFocusVisible(e, star);
     };
-
     this.onBlur = (e, star) => {
       const {
         onBlur
@@ -43,25 +39,21 @@ export default class Item extends BaseComponent {
       onBlur && onBlur(e);
       this.foundation.handleBlur(e, star);
     };
-
     this.onKeyDown = e => {
       const {
         onClick,
         index
       } = this.props;
-
       if (e.keyCode === 13) {
         onClick(e, index);
       }
     };
-
     this.starFocus = () => {
       const {
         value,
         index,
         preventScroll
       } = this.props;
-
       if (value - index === 0.5) {
         this.firstStar.focus({
           preventScroll
@@ -72,22 +64,18 @@ export default class Item extends BaseComponent {
         });
       }
     };
-
     this.saveFirstStar = node => {
       this.firstStar = node;
     };
-
     this.saveSecondStar = node => {
       this.secondStar = node;
     };
-
     this.state = {
       firstStarFocus: false,
       secondStarFocus: false
     };
     this.foundation = new RatingItemFoundation(this.adapter);
   }
-
   get adapter() {
     return Object.assign(Object.assign({}, super.adapter), {
       setFirstStarFocus: value => {
@@ -102,7 +90,6 @@ export default class Item extends BaseComponent {
       }
     });
   }
-
   render() {
     const {
       index,
@@ -121,8 +108,8 @@ export default class Item extends BaseComponent {
       secondStarFocus
     } = this.state;
     const starValue = index + 1;
-    const diff = starValue - value; // const isHalf = allowHalf && value + 0.5 === starValue;
-
+    const diff = starValue - value;
+    // const isHalf = allowHalf && value + 0.5 === starValue;
     const isHalf = allowHalf && diff < 1 && diff > 0;
     const firstWidth = 1 - diff;
     const isFull = starValue <= value;
@@ -207,7 +194,6 @@ export default class Item extends BaseComponent {
       "x-semi-prop": "character"
     }), content)));
   }
-
 }
 Item.propTypes = {
   value: PropTypes.number,

package/lib/es/resizeObserver/index.js

@@ -6,7 +6,6 @@ import ResizeObserver from 'resize-observer-polyfill';
 export default class ReactResizeObserver extends BaseComponent {
   constructor(props) {
     super(props);
-
     this.getElement = () => {
       try {
         // using findDOMNode for two reasons:
@@ -19,28 +18,22 @@ export default class ReactResizeObserver extends BaseComponent {
         return null;
       }
     };
-
     this.mergeRef = (ref, node) => {
       this.childNode = node;
-
       if (typeof ref === 'function') {
         ref(node);
       } else if (typeof ref === 'object' && ref && 'current' in ref) {
         ref.current = node;
       }
     };
-
     this.observer = new ResizeObserver(props.onResize);
   }
-
   componentDidMount() {
     this.observeElement();
   }
-
   componentDidUpdate(prevProps) {
     this.observeElement(this.props.observeParent !== prevProps.observeParent);
   }
-
   componentWillUnmount() {
     if (this.observer) {
       this.observer.disconnect();
@@ -48,40 +41,33 @@ export default class ReactResizeObserver extends BaseComponent {
       this.element = null;
     }
   }
-
   observeElement() {
     let force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     const element = this.getElement();
-
     if (!this.observer) {
       this.observer = new ResizeObserver(this.props.onResize);
     }
-
     if (!(element && element instanceof Element)) {
       // stop everything if not defined
       this.observer.disconnect();
       return;
     }
-
     if (element === this.element && !force) {
       // abort if given same element -- nothing to update (unless forced)
       return;
     } else {
       // clear observer list if new element
-      this.observer.disconnect(); // remember element reference for next time
-
+      this.observer.disconnect();
+      // remember element reference for next time
       this.element = element;
-    } // observer callback is invoked immediately when observing new elements
-
-
+    }
+    // observer callback is invoked immediately when observing new elements
     this.observer.observe(element);
-
     if (this.props.observeParent && element.parentNode && element.parentNode.ownerDocument && element.parentNode.ownerDocument.defaultView && element.parentNode instanceof element.parentNode.ownerDocument.defaultView.HTMLElement) {
       this._parentNode = element.parentNode;
       this.observer.observe(this._parentNode);
     }
   }
-
   render() {
     const child = React.Children.only(this.props.children);
     const {
@@ -91,7 +77,6 @@ export default class ReactResizeObserver extends BaseComponent {
       ref: node => this.mergeRef(ref, node)
     });
   }
-
 }
 ReactResizeObserver.propTypes = {
   onResize: PropTypes.func,

package/lib/es/scrollList/index.js

@@ -5,14 +5,13 @@ import classnames from 'classnames';
 import propTypes from 'prop-types';
 import ScrollItem from './scrollItem';
 import Foundation from '@douyinfe/semi-foundation/lib/es/scrollList/foundation';
-import '@douyinfe/semi-foundation/lib/es/scrollList/scrollList.css'; // eslint-disable-next-line @typescript-eslint/ban-types
-
+import '@douyinfe/semi-foundation/lib/es/scrollList/scrollList.css';
+// eslint-disable-next-line @typescript-eslint/ban-types
 class ScrollList extends BaseComponent {
   constructor(props) {
     super(props);
     this.foundation = new Foundation(this.adapter);
   }
-
   render() {
     const {
       children,
@@ -50,9 +49,7 @@ class ScrollList extends BaseComponent {
       "x-semi-prop": this.props['x-semi-footer-alias'] || "footer"
     }, footer) : null);
   }
-
 }
-
 ScrollList.Item = ScrollItem;
 ScrollList.propTypes = {
   className: propTypes.string,

package/lib/es/scrollList/scrollItem.js

@@ -19,124 +19,88 @@ const wheelMode = 'wheel';
 export default class ScrollItem extends BaseComponent {
   constructor() {
     var _this;
-
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     super(props);
     _this = this;
-
     this._cacheNode = (name, node) => name && node && Object.prototype.hasOwnProperty.call(this, name) && (this[name] = node);
-
     this._cacheSelectedNode = selectedNode => this._cacheNode('selectedNode', selectedNode);
-
     this._cacheWillSelectNode = node => this._cacheNode('willSelectNode', node);
-
     this._cacheListNode = list => this._cacheNode('list', list);
-
     this._cacheSelectorNode = selector => this._cacheNode('selector', selector);
-
     this._cacheWrapperNode = wrapper => this._cacheNode('wrapper', wrapper);
     /* istanbul ignore next */
-
-
     this._isFirst = node => {
       const {
         list
       } = this;
-
       if (isElement(node) && isElement(list)) {
         const chilren = list.children;
-
         const index = _findIndex(chilren, node);
-
         return index === 0;
       }
-
       return false;
     };
     /* istanbul ignore next */
-
-
     this._isLast = node => {
       const {
         list
       } = this;
-
       if (isElement(node) && isElement(list)) {
         const {
           children
         } = list;
-
         const index = _findIndex(children, node);
-
         return index === children.length - 1;
       }
-
       return false;
     };
-
     this.indexIsSame = (index1, index2) => {
       const {
         list
       } = this.props;
-
       if (list.length) {
         return index1 % list.length === index2 % list.length;
       }
-
       return undefined;
     };
-
     this.isDisabledIndex = index => {
       const {
         list
       } = this.props;
-
       if (Array.isArray(list) && list.length && index > -1) {
         const size = list.length;
         const indexInData = index % size;
         return this.isDisabledData(list[indexInData]);
       }
-
       return false;
     };
-
     this.isDisabledNode = node => {
       const listWrapper = this.list;
-
       if (isElement(node) && isElement(listWrapper)) {
         const index = _findIndex(listWrapper.children, child => child === node);
-
         return this.isDisabledIndex(index);
       }
-
       return false;
     };
-
     this.isDisabledData = data => data && typeof data === 'object' && data.disabled;
-
     this.isWheelMode = () => this.props.mode === wheelMode;
-
     this.addClassToNode = function (selectedNode) {
       let selectedCls = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : cssClasses.SELECTED;
       const {
         list
       } = _this;
       selectedNode = selectedNode || _this.selectedNode;
-
       if (isElement(selectedNode) && isElement(list)) {
         const {
           children
         } = list;
         const reg = new RegExp(`\\s*${selectedCls}\\s*`, 'g');
-
         _map(children, node => {
           node.className = node.className && node.className.replace(reg, ' ');
-
           if (blankReg.test(node.className)) {
             node.className = '';
           }
         });
-
         if (selectedNode.className && !blankReg.test(selectedNode.className)) {
           selectedNode.className += ` ${selectedCls}`;
         } else {
@@ -144,28 +108,22 @@ export default class ScrollItem extends BaseComponent {
         }
       }
     };
-
     this.getIndexByNode = node => _findIndex(this.list.children, node);
-
     this.getNodeByIndex = index => {
       if (index > -1) {
         return _find(this.list.children, (node, idx) => idx === index);
       }
-
       const defaultSelectedNode = _find(this.list.children, child => !this.isDisabledNode(child));
-
       return defaultSelectedNode;
     };
-
     this.scrollToIndex = (selectedIndex, duration) => {
       // move to selected item
-      duration = typeof duration === 'number' ? duration : numbers.DEFAULT_SCROLL_DURATION; // eslint-disable-next-line
-
-      selectedIndex = selectedIndex == null ? this.props.selectedIndex : selectedIndex; // this.isWheelMode() && this.addClassToNode();
-
+      duration = typeof duration === 'number' ? duration : numbers.DEFAULT_SCROLL_DURATION;
+      // eslint-disable-next-line
+      selectedIndex = selectedIndex == null ? this.props.selectedIndex : selectedIndex;
+      // this.isWheelMode() && this.addClassToNode();
       this.scrollToNode(this.selectedNode, duration);
     };
-
     this.scrollToNode = (node, duration) => {
       const {
         wrapper
@@ -175,53 +133,43 @@ export default class ScrollItem extends BaseComponent {
       const targetTop = (node.offsetTop || this.list.children.length * itemHeight / 2) - (wrapperHeight - itemHeight) / 2;
       this.scrollToPos(targetTop, duration);
     };
-
     this.scrollToPos = function (targetTop) {
       let duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : numbers.DEFAULT_SCROLL_DURATION;
       const {
         wrapper
-      } = _this; // this.isWheelMode() && this.addClassToNode();
-
+      } = _this;
+      // this.isWheelMode() && this.addClassToNode();
       if (duration && _this.props.motion) {
         if (_this.scrollAnimation) {
           _this.scrollAnimation.destroy();
-
           _this.scrolling = false;
         }
-
         if (wrapper.scrollTop === targetTop) {
           if (_this.isWheelMode()) {
             const nodeInfo = _this.foundation.getNearestNodeInfo(_this.list, _this.selector);
-
             _this.addClassToNode(nodeInfo.nearestNode);
           }
         } else {
           _this.scrollAnimation = animatedScrollTo(wrapper, targetTop, duration);
-
           _this.scrollAnimation.on('rest', () => {
             if (_this.isWheelMode()) {
               const nodeInfo = _this.foundation.getNearestNodeInfo(_this.list, _this.selector);
-
               _this.addClassToNode(nodeInfo.nearestNode);
             }
           });
-
           _this.scrollAnimation.start();
         }
       } else {
         wrapper.scrollTop = targetTop;
       }
     };
-
     this.scrollToSelectItem = e => {
       const {
         nearestNode
       } = this.foundation.getNearestNodeInfo(this.list, this.selector);
-
       if (this.props.cycled) {
         this.throttledAdjustList(e, nearestNode);
       }
-
       this.debouncedSelect(e, nearestNode);
     };
     /**
@@ -232,12 +180,9 @@ export default class ScrollItem extends BaseComponent {
      * @param {HTMLElement} scrollWnumber
      * @param {number} duration
      */
-
-
     this.scrollToCenter = (selectedNode, scrollWrapper, duration) => {
       selectedNode = selectedNode || this.selectedNode;
       scrollWrapper = scrollWrapper || this.wrapper;
-
       if (isElement(selectedNode) && isElement(scrollWrapper)) {
         const scrollRect = scrollWrapper.getBoundingClientRect();
         const selectedRect = selectedNode.getBoundingClientRect();
@@ -245,7 +190,6 @@ export default class ScrollItem extends BaseComponent {
         this.scrollToPos(targetTop, typeof duration === 'number' ? duration : numbers.DEFAULT_SCROLL_DURATION);
       }
     };
-
     this.clickToSelectItem = e => {
       // const index = this.foundation.selectNearestIndex(e.nativeEvent, this.list);
       e && e.nativeEvent && e.nativeEvent.stopImmediatePropagation();
@@ -253,14 +197,11 @@ export default class ScrollItem extends BaseComponent {
         targetNode: node,
         infoInList
       } = this.foundation.getTargetNode(e, this.list);
-
       if (node && infoInList && !infoInList.disabled) {
         this.debouncedSelect(null, node);
       }
     };
-
     this.getItmHeight = itm => itm && itm.offsetHeight || numbers.DEFAULT_ITEM_HEIGHT;
-
     this.renderItemList = function () {
       let prefixKey = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
       const {
@@ -280,7 +221,6 @@ export default class ScrollItem extends BaseComponent {
           [`${cssClasses.PREFIX}-item-disabled`]: Boolean(item.disabled)
         });
         let text = '';
-
         if (selected) {
           if (typeof transform === 'function') {
             text = transform(item.value, item.text);
@@ -292,13 +232,10 @@ export default class ScrollItem extends BaseComponent {
           // eslint-disable-next-line
           text = item.text == null ? item.value : item.text;
         }
-
         const events = {};
-
         if (!_this.isWheelMode() && !item.disabled) {
           events.onClick = () => _this.foundation.selectIndex(index, _this.list);
         }
-
         return (
           /*#__PURE__*/
           // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
@@ -313,7 +250,6 @@ export default class ScrollItem extends BaseComponent {
         );
       });
     };
-
     this.renderNormalList = () => {
       const {
         list,
@@ -336,8 +272,6 @@ export default class ScrollItem extends BaseComponent {
     /**
      * List of Rendering Unlimited Modes
      */
-
-
     this.renderInfiniteList = () => {
       const {
         list,
@@ -349,19 +283,16 @@ export default class ScrollItem extends BaseComponent {
         prependCount,
         appendCount
       } = this.state;
-
       const prependList = _times(prependCount).reduce((arr, num) => {
         const items = this.renderItemList(`pre_${num}_`);
         arr.unshift(...items);
         return arr;
       }, []);
-
       const appendList = _times(appendCount).reduce((arr, num) => {
         const items = this.renderItemList(`app_${num}_`);
         arr.push(...items);
         return arr;
       }, []);
-
       const inner = this.renderItemList();
       const listWrapperCls = classnames(`${cssClasses.PREFIX}-list-outer`, {
         [`${cssClasses.PREFIX}-list-outer-nocycle`]: !cycled
@@ -392,34 +323,31 @@ export default class ScrollItem extends BaseComponent {
         onClick: this.clickToSelectItem
       }, prependList, inner, appendList)));
     };
-
     this.state = {
       prependCount: 0,
-      appendCount: 0 // selectedIndex: props.selectedIndex,
+      appendCount: 0
+      // selectedIndex: props.selectedIndex,
       // fakeSelectedIndex: props.selectedIndex,
-
     };
+
     this.selectedNode = null;
     this.willSelectNode = null;
     this.list = null;
     this.wrapper = null;
     this.selector = null;
-    this.scrollAnimation = null; // cache if select action comes from outside
-
+    this.scrollAnimation = null;
+    // cache if select action comes from outside
     this.foundation = new ItemFoundation(this.adapter);
     this.throttledAdjustList = _throttle((e, nearestNode) => {
       this.foundation.adjustInfiniteList(this.list, this.wrapper, nearestNode);
     }, msPerFrame);
     this.debouncedSelect = _debounce((e, nearestNode) => {
       this._cacheSelectedNode(nearestNode);
-
       this.foundation.selectNode(nearestNode, this.list);
     }, msPerFrame * 2);
   }
-
   get adapter() {
     var _this2 = this;
-
     return Object.assign(Object.assign({}, super.adapter), {
       setState: (states, callback) => this.setState(Object.assign({}, states), callback),
       setPrependCount: prependCount => this.setState({
@@ -436,14 +364,12 @@ export default class ScrollItem extends BaseComponent {
       scrollToCenter: this.scrollToCenter
     });
   }
-
   componentWillUnmount() {
     if (this.props.cycled) {
       this.throttledAdjustList.cancel();
       this.debouncedSelect.cancel();
     }
   }
-
   componentDidMount() {
     this.foundation.init();
     const {
@@ -453,38 +379,31 @@ export default class ScrollItem extends BaseComponent {
       list
     } = this.props;
     const selectedNode = this.getNodeByIndex(typeof selectedIndex === 'number' && selectedIndex > -1 ? selectedIndex : 0);
-
     this._cacheSelectedNode(selectedNode);
-
     this._cacheWillSelectNode(selectedNode);
-
     if (mode === wheelMode && cycled) {
       this.foundation.initWheelList(this.list, this.wrapper, () => {
         // we have to scroll in next tick
         // setTimeout(() => {
-        this.scrollToNode(selectedNode, 0); // });
+        this.scrollToNode(selectedNode, 0);
+        // });
       });
     } else {
       this.scrollToNode(selectedNode, 0);
     }
   }
-
   componentDidUpdate(prevProps) {
     const {
       selectedIndex
-    } = this.props; // smooth scroll to selected option
-
+    } = this.props;
+    // smooth scroll to selected option
     if (prevProps.selectedIndex !== selectedIndex) {
       const willSelectIndex = this.getIndexByNode(this.willSelectNode);
-
       if (!this.indexIsSame(willSelectIndex, selectedIndex)) {
         const newSelectedNode = this.getNodeByOffset(this.selectedNode, selectedIndex - prevProps.selectedIndex, this.list);
-
         this._cacheWillSelectNode(newSelectedNode);
       }
-
       this._cacheSelectedNode(this.willSelectNode);
-
       this.scrollToIndex(selectedIndex);
     }
   }
@@ -496,34 +415,26 @@ export default class ScrollItem extends BaseComponent {
    *
    * @returns {HTMLElement}
    */
-
-
   getNodeByOffset(refNode, offset, listWrapper) {
     const {
       list
     } = this.props;
-
     if (isElement(refNode) && isElement(listWrapper) && typeof offset === 'number' && Array.isArray(list) && list.length) {
       offset = offset % list.length;
       const refIndex = this.getIndexByNode(refNode);
       let targetIndex = refIndex + offset;
-
       while (targetIndex < 0) {
         targetIndex += list.length;
       }
-
       if (offset) {
         return this.getNodeByIndex(targetIndex);
       }
     }
-
     return refNode;
   }
-
   render() {
     return this.isWheelMode() ? this.renderInfiniteList() : this.renderNormalList();
   }
-
 }
 ScrollItem.propTypes = {
   mode: PropTypes.oneOf(strings.MODE),