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

package/lib/es/tagInput/index.js

@@ -35,61 +35,46 @@ const SortableList = SortableContainer(_ref => {
     item: item.item
   })));
 });
-
 class TagInput extends BaseComponent {
   constructor(props) {
     super(props);
-
     this.handleInputChange = e => {
       this.foundation.handleInputChange(e);
     };
-
     this.handleKeyDown = e => {
       this.foundation.handleKeyDown(e);
     };
-
     this.handleInputFocus = e => {
       this.foundation.handleInputFocus(e);
     };
-
     this.handleInputBlur = e => {
       this.foundation.handleInputBlur(e);
     };
-
     this.handleClearBtn = e => {
       this.foundation.handleClearBtn(e);
     };
     /* istanbul ignore next */
-
-
     this.handleClearEnterPress = e => {
       this.foundation.handleClearEnterPress(e);
     };
-
     this.handleTagClose = idx => {
       this.foundation.handleTagClose(idx);
     };
-
     this.handleInputMouseLeave = e => {
       this.foundation.handleInputMouseLeave();
     };
-
     this.handleClick = e => {
       this.foundation.handleClick(e);
     };
-
     this.handleInputMouseEnter = e => {
       this.foundation.handleInputMouseEnter();
     };
-
     this.handleClickPrefixOrSuffix = e => {
       this.foundation.handleClickPrefixOrSuffix(e);
     };
-
     this.handlePreventMouseDown = e => {
       this.foundation.handlePreventMouseDown(e);
     };
-
     this.getAllTags = () => {
       const {
         size,
@@ -119,11 +104,9 @@ class TagInput extends BaseComponent {
       }));
       return tagsArray.map((value, index) => {
         const elementKey = showIconHandler ? value : `${index}${value}`;
-
         const onClose = () => {
           !disabled && this.handleTagClose(index);
         };
-
         if (_isFunction(renderTagItem)) {
           return showIconHandler ? /*#__PURE__*/React.createElement("div", {
             className: itemWrapperCls,
@@ -150,19 +133,15 @@ class TagInput extends BaseComponent {
         }
       });
     };
-
     this.onSortEnd = callbackProps => {
       this.foundation.handleSortEnd(callbackProps);
     };
-
     this.handleInputCompositionStart = e => {
       this.foundation.handleInputCompositionStart(e);
     };
-
     this.handleInputCompositionEnd = e => {
       this.foundation.handleInputCompositionEnd(e);
     };
-
     this.foundation = new TagInputFoundation(this.adapter);
     this.state = {
       tagsArray: props.defaultValue || [],
@@ -176,7 +155,6 @@ class TagInput extends BaseComponent {
     this.tagInputRef = /*#__PURE__*/React.createRef();
     this.clickOutsideHandler = null;
   }
-
   static getDerivedStateFromProps(nextProps, prevState) {
     const {
       value,
@@ -186,7 +164,6 @@ class TagInput extends BaseComponent {
       tagsArray: prevTagsArray
     } = prevState;
     let tagsArray;
-
     if (_isArray(value)) {
       tagsArray = value;
     } else if ('value' in nextProps && !value) {
@@ -194,13 +171,11 @@ class TagInput extends BaseComponent {
     } else {
       tagsArray = prevTagsArray;
     }
-
     return {
       tagsArray,
       inputValue: _isString(inputValue) ? inputValue : prevState.inputValue
     };
   }
-
   get adapter() {
     return Object.assign(Object.assign({}, super.adapter), {
       setInputValue: inputValue => {
@@ -223,7 +198,6 @@ class TagInput extends BaseComponent {
           preventScroll
         } = this.props;
         const input = this.inputRef && this.inputRef.current;
-
         if (isFocus) {
           input && input.focus({
             preventScroll
@@ -231,7 +205,6 @@ class TagInput extends BaseComponent {
         } else {
           input && input.blur();
         }
-
         this.setState({
           focusing: isFocus
         });
@@ -279,12 +252,10 @@ class TagInput extends BaseComponent {
         const clickOutsideHandler = e => {
           const tagInputDom = this.tagInputRef && this.tagInputRef.current;
           const target = e.target;
-
           if (tagInputDom && !tagInputDom.contains(target)) {
             cb(e);
           }
         };
-
         this.clickOutsideHandler = clickOutsideHandler;
         document.addEventListener('click', clickOutsideHandler, false);
       },
@@ -294,24 +265,20 @@ class TagInput extends BaseComponent {
       }
     });
   }
-
   componentDidMount() {
     const {
       disabled,
       autoFocus,
       preventScroll
     } = this.props;
-
     if (!disabled && autoFocus) {
       this.inputRef.current.focus({
         preventScroll
       });
       this.foundation.handleClick();
     }
-
     this.foundation.init();
   }
-
   renderClearBtn() {
     const {
       hovering,
@@ -326,7 +293,6 @@ class TagInput extends BaseComponent {
     const clearCls = cls(`${prefixCls}-clearBtn`, {
       [`${prefixCls}-clearBtn-invisible`]: !hovering || inputValue === '' && tagsArray.length === 0 || disabled
     });
-
     if (showClear) {
       return /*#__PURE__*/React.createElement("div", {
         role: "button",
@@ -337,10 +303,8 @@ class TagInput extends BaseComponent {
         onKeyPress: e => this.handleClearEnterPress(e)
       }, clearIcon ? clearIcon : /*#__PURE__*/React.createElement(IconClear, null));
     }
-
     return null;
   }
-
   renderPrefix() {
     const {
       prefix,
@@ -348,11 +312,9 @@ class TagInput extends BaseComponent {
       insetLabelId
     } = this.props;
     const labelNode = prefix || insetLabel;
-
     if (_isNull(labelNode) || _isUndefined(labelNode)) {
       return null;
     }
-
     const prefixWrapperCls = cls(`${prefixCls}-prefix`, {
       [`${prefixCls}-inset-label`]: insetLabel,
       [`${prefixCls}-prefix-text`]: labelNode && _isString(labelNode),
@@ -371,16 +333,13 @@ class TagInput extends BaseComponent {
       }, labelNode)
     );
   }
-
   renderSuffix() {
     const {
       suffix
     } = this.props;
-
     if (_isNull(suffix) || _isUndefined(suffix)) {
       return null;
     }
-
     const suffixWrapperCls = cls(`${prefixCls}-suffix`, {
       [`${prefixCls}-suffix-text`]: suffix && _isString(suffix),
       // eslint-disable-next-line max-len
@@ -397,7 +356,6 @@ class TagInput extends BaseComponent {
       }, suffix)
     );
   }
-
   renderTags() {
     const {
       disabled,
@@ -417,12 +375,10 @@ class TagInput extends BaseComponent {
     const allTags = this.getAllTags();
     let restTags = [];
     let tags = [...allTags];
-
     if ((!active || !expandRestTagsOnClick) && maxTagCount && maxTagCount < allTags.length) {
       tags = allTags.slice(0, maxTagCount);
       restTags = allTags.slice(maxTagCount);
     }
-
     const restTagsContent = /*#__PURE__*/React.createElement("span", {
       className: restTagsCls
     }, "+", tagsArray.length - maxTagCount);
@@ -430,7 +386,6 @@ class TagInput extends BaseComponent {
       item: item,
       key: tagsArray[index]
     }));
-
     if (active && draggable && sortableListItems.length > 0) {
       // helperClass：add styles to the helper(item being dragged) https://github.com/clauderic/react-sortable-hoc/issues/87
       // @ts-ignore skip SortableItem type check
@@ -442,7 +397,6 @@ class TagInput extends BaseComponent {
         axis: "xy"
       });
     }
-
     return /*#__PURE__*/React.createElement(React.Fragment, null, tags, restTags.length > 0 && (showRestTagsPopover ? /*#__PURE__*/React.createElement(Popover, Object.assign({
       content: restTags,
       showArrow: true,
@@ -451,13 +405,11 @@ class TagInput extends BaseComponent {
       autoAdjustOverflow: true
     }, restTagsPopoverProps), restTagsContent) : restTagsContent));
   }
-
   blur() {
-    this.inputRef.current.blur(); // unregister clickOutside event
-
+    this.inputRef.current.blur();
+    // unregister clickOutside event
     this.foundation.clickOutsideCallBack();
   }
-
   focus() {
     const {
       preventScroll,
@@ -466,13 +418,11 @@ class TagInput extends BaseComponent {
     this.inputRef.current.focus({
       preventScroll
     });
-
     if (!disabled) {
       // register clickOutside event
       this.foundation.handleClick();
     }
   }
-
   render() {
     const {
       size,
@@ -546,9 +496,7 @@ class TagInput extends BaseComponent {
       })), this.renderClearBtn(), this.renderSuffix())
     );
   }
-
 }
-
 TagInput.propTypes = {
   children: PropTypes.node,
   clearIcon: PropTypes.node,

package/lib/es/timePicker/Combobox.d.ts

@@ -5,7 +5,7 @@ import ScrollItem from '../scrollList/scrollItem';
 import ComboboxFoundation, { formatOption } from '@douyinfe/semi-foundation/lib/es/timePicker/ComboxFoundation';
 import { TimePickerProps } from './TimePicker';
 import { Locale } from '../locale/interface';
-export declare type ComboboxProps = Pick<TimePickerProps, 'format' | 'prefixCls' | 'disabledHours' | 'disabledMinutes' | 'disabledSeconds' | 'hideDisabledOptions' | 'use12Hours' | 'scrollItemProps' | 'panelFooter' | 'panelHeader'> & BaseProps & {
+export type ComboboxProps = Pick<TimePickerProps, 'format' | 'prefixCls' | 'disabledHours' | 'disabledMinutes' | 'disabledSeconds' | 'hideDisabledOptions' | 'use12Hours' | 'scrollItemProps' | 'panelFooter' | 'panelHeader'> & BaseProps & {
     defaultOpenValue?: TimePickerProps['value'];
     showHour?: boolean;
     showMinute?: boolean;
@@ -27,7 +27,7 @@ export interface ComboboxState {
     minuteOptions: number[];
     secondOptions: number[];
 }
-export declare type FormatOptionReturn = ReturnType<typeof formatOption>;
+export type FormatOptionReturn = ReturnType<typeof formatOption>;
 export interface AMPMOptionItem {
     value: string;
     text: string;

package/lib/es/timePicker/Combobox.js

@@ -1,7 +1,5 @@
 import _noop from "lodash/noop";
-
 /* eslint-disable max-len */
-
 /* eslint-disable react/no-did-update-set-state */
 import React from 'react';
 import PropTypes from 'prop-types';
@@ -12,28 +10,23 @@ import ScrollList from '../scrollList/index';
 import ScrollItem from '../scrollList/scrollItem';
 import ComboboxFoundation, { formatOption } from '@douyinfe/semi-foundation/lib/es/timePicker/ComboxFoundation';
 import LocaleConsumer from '../locale/localeConsumer';
-
 class Combobox extends BaseComponent {
   constructor(props) {
     super(props);
-
     this.cacheRefCurrent = (key, current) => {
       if (key && typeof key === 'string') {
         this.adapter.setCache(key, current);
       }
     };
-
     this.reselect = () => {
       const currentKeys = ['ampm', 'hour', 'minute', 'second'];
       currentKeys.forEach(key => {
         const current = this.adapter.getCache(key);
-
         if (current && current.scrollToIndex) {
           current.scrollToIndex();
         }
       });
     };
-
     this.onItemChange = _ref => {
       let {
         type,
@@ -48,8 +41,8 @@ class Combobox extends BaseComponent {
         format,
         timeStampValue
       } = this.props;
-      const transformValue = this.foundation.getDisplayDateFromTimeStamp(timeStampValue); // TODO: foundation
-
+      const transformValue = this.foundation.getDisplayDateFromTimeStamp(timeStampValue);
+      // TODO: foundation
       if (type === 'hour') {
         if (use12Hours) {
           if (isAM) {
@@ -64,13 +57,11 @@ class Combobox extends BaseComponent {
         transformValue.setMinutes(Number(value));
       } else if (type === 'ampm') {
         const ampm = value.toUpperCase();
-
         if (use12Hours) {
           if (ampm === 'PM') {
             isAM = false;
             transformValue.getHours() < 12 && transformValue.setHours(transformValue.getHours() % 12 + 12);
           }
-
           if (ampm === 'AM') {
             isAM = true;
             transformValue.getHours() >= 12 && transformValue.setHours(transformValue.getHours() - 12);
@@ -79,39 +70,33 @@ class Combobox extends BaseComponent {
       } else {
         transformValue.setSeconds(Number(value));
       }
-
       onChange && onChange({
         isAM,
         value: dateFnsFormat(transformValue, format && format.replace(/(\s+)A/g, '$1a')),
         timeStampValue: Number(transformValue)
       });
     };
-
     this.onEnterSelectPanel = range => {
       const {
         onCurrentSelectPanelChange
       } = this.props;
       onCurrentSelectPanelChange(range);
     };
-
     this.getDisplayDateFromTimeStamp = timeStampValue => this.foundation.getDisplayDateFromTimeStamp(timeStampValue);
-
     this.foundation = new ComboboxFoundation(this.adapter);
     this.state = Object.assign({}, this.foundation.initData());
   }
-
   componentDidUpdate(prevProps, prevState) {
     if (prevProps.timeStampValue !== this.props.timeStampValue || prevProps.format !== this.props.format) {
       this.setState(Object.assign({}, this.foundation.initData()));
     }
   }
-
-  componentWillUnmount() {// this.foundation.destroy();
+  componentWillUnmount() {
+    // this.foundation.destroy();
   }
-
-  componentDidMount() {// this.foundation.init();
+  componentDidMount() {
+    // this.foundation.init();
   }
-
   renderHourSelect(hour, locale) {
     const {
       prefixCls,
@@ -123,14 +108,11 @@ class Combobox extends BaseComponent {
       showHour,
       hourOptions
     } = this.state;
-
     if (!showHour) {
       return null;
     }
-
     const disabledOptions = disabledHours();
     let hourOptionsAdj, hourAdj;
-
     if (use12Hours) {
       hourOptionsAdj = [12].concat(hourOptions.filter(h => h < 12 && h > 0));
       hourAdj = hour % 12 || 12;
@@ -138,9 +120,7 @@ class Combobox extends BaseComponent {
       hourOptionsAdj = hourOptions;
       hourAdj = hour;
     }
-
     const transformHour = value => value + locale.hour;
-
     const className = `${prefixCls}-list-hour`;
     return /*#__PURE__*/React.createElement(ScrollItem, Object.assign({
       ref: current => this.cacheRefCurrent('hour', current),
@@ -153,7 +133,6 @@ class Combobox extends BaseComponent {
       onSelect: this.onItemChange
     }, scrollItemProps));
   }
-
   renderMinuteSelect(minute, locale) {
     const {
       prefixCls,
@@ -165,17 +144,13 @@ class Combobox extends BaseComponent {
       showMinute,
       minuteOptions
     } = this.state;
-
     if (!showMinute) {
       return null;
     }
-
     const value = new Date(timeStampValue);
     const disabledOptions = disabledMinutes && disabledMinutes(value.getHours());
     const className = `${prefixCls}-list-minute`;
-
     const transformMinute = min => min + locale.minute;
-
     return /*#__PURE__*/React.createElement(ScrollItem, Object.assign({
       ref: current => this.cacheRefCurrent('minute', current),
       mode: 'normal',
@@ -187,7 +162,6 @@ class Combobox extends BaseComponent {
       className: className
     }, scrollItemProps));
   }
-
   renderSecondSelect(second, locale) {
     const {
       prefixCls,
@@ -199,17 +173,13 @@ class Combobox extends BaseComponent {
       showSecond,
       secondOptions
     } = this.state;
-
     if (!showSecond) {
       return null;
     }
-
     const value = new Date(timeStampValue);
     const disabledOptions = disabledSeconds && disabledSeconds(value.getHours(), value.getMinutes());
     const className = `${prefixCls}-list-second`;
-
     const transformSecond = sec => String(sec) + locale.second;
-
     return /*#__PURE__*/React.createElement(ScrollItem, Object.assign({
       ref: current => this.cacheRefCurrent('second', current),
       mode: 'normal',
@@ -221,7 +191,6 @@ class Combobox extends BaseComponent {
       onSelect: this.onItemChange
     }, scrollItemProps));
   }
-
   renderAMPMSelect(locale, localeCode) {
     const {
       prefixCls,
@@ -229,11 +198,9 @@ class Combobox extends BaseComponent {
       isAM,
       scrollItemProps
     } = this.props;
-
     if (!use12Hours) {
       return null;
     }
-
     const AMPMOptions = [{
       value: 'AM',
       text: locale.AM || '上午'
@@ -253,7 +220,6 @@ class Combobox extends BaseComponent {
       onSelect: this.onItemChange
     }, scrollItemProps));
   }
-
   render() {
     const {
       timeStampValue,
@@ -270,9 +236,7 @@ class Combobox extends BaseComponent {
       "x-semi-footer-alias": "panelFooter"
     }, this.renderAMPMSelect(locale, localeCode), this.renderHourSelect(value.getHours(), locale), this.renderMinuteSelect(value.getMinutes(), locale), this.renderSecondSelect(value.getSeconds(), locale)));
   }
-
 }
-
 Combobox.propTypes = {
   format: PropTypes.string,
   defaultOpenValue: PropTypes.object,

package/lib/es/timePicker/TimeInput.d.ts

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import BaseComponent, { BaseProps } from '../_base/baseComponent';
 import InputFoundation, { TimeInputAdapter } from '@douyinfe/semi-foundation/lib/es/timePicker/inputFoundation';
 import { TimePickerProps } from './TimePicker';
-export declare type TimeInputProps = Pick<TimePickerProps, 'value' | 'format' | 'prefixCls' | 'placeholder' | 'clearText' | 'inputReadOnly' | 'disabled' | 'type' | 'timeZone' | 'defaultOpen' | 'disabledHours' | 'disabledMinutes' | 'disabledSeconds' | 'dateFnsLocale' | 'onFocus' | 'onBlur' | 'focusOnOpen' | 'locale' | 'localeCode' | 'insetLabel' | 'validateStatus' | 'borderless' | 'preventScroll'> & BaseProps & {
+export type TimeInputProps = Pick<TimePickerProps, 'value' | 'format' | 'prefixCls' | 'placeholder' | 'clearText' | 'inputReadOnly' | 'disabled' | 'type' | 'timeZone' | 'defaultOpen' | 'disabledHours' | 'disabledMinutes' | 'disabledSeconds' | 'dateFnsLocale' | 'onFocus' | 'onBlur' | 'focusOnOpen' | 'locale' | 'localeCode' | 'insetLabel' | 'validateStatus' | 'borderless' | 'preventScroll'> & BaseProps & {
     onChange?: (value: string) => void;
     onEsc?: () => void;
     onClick?: React.MouseEventHandler;