@douyinfe/semi-ui 2.0.8 → 2.0.9-alpha.4

package/lib/es/autoComplete/index.d.ts

@@ -5,7 +5,6 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
 import { Position } from '../tooltip';
 import Option from '../select/option';
 import '@douyinfe/semi-foundation/lib/es/autoComplete/autoComplete.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 import { Motion } from '../_base/base';
 /**
  * AutoComplete is an enhanced Input (candidates suggest that users can choose or not),
@@ -17,15 +16,16 @@ import { Motion } from '../_base/base';
 export interface BaseDataItem extends DataItem {
     label?: React.ReactNode;
 }
-export interface AutoCompleteProps<Item extends BaseDataItem = BaseDataItem> {
+export declare type AutoCompleteItems = BaseDataItem | string | number;
+export interface AutoCompleteProps<T extends AutoCompleteItems> {
     autoAdjustOverflow?: boolean;
     autoFocus?: boolean;
     className?: string;
     children?: React.ReactNode;
-    data?: Array<string | Item | number>;
+    data?: T[];
     disabled?: boolean;
     defaultOpen?: boolean;
-    defaultValue?: string | number | Item;
+    defaultValue?: T;
     defaultActiveFirstOption?: boolean;
     dropdownMatchSelectWidth?: boolean;
     dropdownClassName?: string;
@@ -42,7 +42,7 @@ export interface AutoCompleteProps<Item extends BaseDataItem = BaseDataItem> {
     onBlur?: (e: React.FocusEvent) => void;
     onChange?: (value: string | number) => void;
     onSearch?: (inputValue: string) => void;
-    onSelect?: (value: string | Item | number) => void;
+    onSelect?: (value: T) => void;
     onClear?: () => void;
     onChangeWithObject?: boolean;
     onSelectWithObject?: boolean;
@@ -50,8 +50,8 @@ export interface AutoCompleteProps<Item extends BaseDataItem = BaseDataItem> {
     prefix?: React.ReactNode;
     placeholder?: string;
     position?: Position;
-    renderItem?: (option: Item | string) => React.ReactNode;
-    renderSelectedItem?: (option: Item) => string;
+    renderItem?: (option: T) => React.ReactNode;
+    renderSelectedItem?: (option: T) => string;
     size?: 'small' | 'default' | 'large';
     style?: React.CSSProperties;
     suffix?: React.ReactNode;
@@ -75,7 +75,7 @@ interface AutoCompleteState {
     rePosKey: number;
     keyboardEventSet?: KeyboardEventType;
 }
-declare class AutoComplete extends BaseComponent<AutoCompleteProps, AutoCompleteState> {
+declare class AutoComplete<T extends AutoCompleteItems> extends BaseComponent<AutoCompleteProps<T>, AutoCompleteState> {
     static propTypes: {
         autoFocus: PropTypes.Requireable<boolean>;
         autoAdjustOverflow: PropTypes.Requireable<boolean>;
@@ -119,15 +119,39 @@ declare class AutoComplete extends BaseComponent<AutoCompleteProps, AutoComplete
         zIndex: PropTypes.Requireable<number>;
     };
     static Option: typeof Option;
-    static defaultProps: Partial<AutoCompleteProps>;
+    static defaultProps: {
+        stopPropagation: boolean;
+        motion: boolean;
+        zIndex: number;
+        position: "bottomLeft";
+        data: [];
+        showClear: boolean;
+        disabled: boolean;
+        size: "default";
+        onFocus: (...args: any[]) => void;
+        onSearch: (...args: any[]) => void;
+        onClear: (...args: any[]) => void;
+        onBlur: (...args: any[]) => void;
+        onSelect: (...args: any[]) => void;
+        onChange: (...args: any[]) => void;
+        onSelectWithObject: boolean;
+        onDropdownVisibleChange: (...args: any[]) => void;
+        defaultActiveFirstOption: boolean;
+        dropdownMatchSelectWidth: boolean;
+        loading: boolean;
+        maxHeight: number;
+        validateStatus: "default";
+        autoFocus: boolean;
+        emptyContent: null;
+    };
     triggerRef: React.RefObject<HTMLDivElement> | null;
     optionsRef: React.RefObject<HTMLDivElement> | null;
     private clickOutsideHandler;
-    constructor(props: AutoCompleteProps);
-    get adapter(): AutoCompleteAdapter<AutoCompleteProps, AutoCompleteState>;
+    constructor(props: AutoCompleteProps<T>);
+    get adapter(): AutoCompleteAdapter<AutoCompleteProps<T>, AutoCompleteState>;
     componentDidMount(): void;
     componentWillUnmount(): void;
-    componentDidUpdate(prevProps: AutoCompleteProps, prevState: AutoCompleteState): void;
+    componentDidUpdate(prevProps: AutoCompleteProps<T>, prevState: AutoCompleteState): void;
     onSelect: (option: StateOptionItem, optionIndex: number, e: React.MouseEvent | React.KeyboardEvent) => void;
     onSearch: (value: string) => void;
     onBlur: (e: React.FocusEvent) => void;

package/lib/es/autoComplete/index.js

@@ -21,7 +21,6 @@ import Trigger from '../trigger';
 import Option from '../select/option';
 import warning from '@douyinfe/semi-foundation/lib/es/utils/warning';
 import '@douyinfe/semi-foundation/lib/es/autoComplete/autoComplete.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 const prefixCls = cssClasses.PREFIX;
 const sizeSet = strings.SIZE;
 const positionSet = strings.POSITION;

package/lib/es/calendar/dayCalendar.js

@@ -95,7 +95,7 @@ export default class DayCalendar extends BaseComponent {
       },
       setParsedEvents: parsedEvents => {
         this.setState({
-          parsedEvents
+          parsedEvents: parsedEvents
         });
       },
       cacheEventKeys: cachedKeys => {

package/lib/es/calendar/monthCalendar.js

@@ -331,7 +331,7 @@ export default class monthCalendar extends BaseComponent {
       },
       setParsedEvents: parsedEvents => {
         this.setState({
-          parsedEvents
+          parsedEvents: parsedEvents
         });
       },
       setItemLimit: itemLimit => {

package/lib/es/calendar/rangeCalendar.js

@@ -206,7 +206,7 @@ export default class RangeCalendar extends BaseComponent {
       },
       setParsedEvents: parsedEvents => {
         this.setState({
-          parsedEvents
+          parsedEvents: parsedEvents
         });
       },
       cacheEventKeys: cachedKeys => {

package/lib/es/calendar/weekCalendar.js

@@ -208,7 +208,7 @@ export default class WeekCalendar extends BaseComponent {
       },
       setParsedEvents: parsedEvents => {
         this.setState({
-          parsedEvents
+          parsedEvents: parsedEvents
         });
       },
       cacheEventKeys: cachedKeys => {

package/lib/es/collapse/index.js

@@ -47,12 +47,8 @@ class Collapse extends BaseComponent {
   }
 
   get adapter() {
-    var _this = this;
-
     return _Object$assign(_Object$assign({}, super.adapter), {
-      handleChange: function () {
-        return _this.props.onChange(...arguments);
-      },
+      handleChange: (activeKey, e) => this.props.onChange(activeKey, e),
       addActiveKey: activeSet => this.setState({
         activeSet
       })

package/lib/es/datePicker/index.d.ts

@@ -8,4 +8,4 @@ export { QuickControlProps } from './quickControl';
 export { YearAndMonthProps } from './yearAndMonth';
 declare const _default: React.ForwardRefExoticComponent<DatePickerProps & React.RefAttributes<DatePicker>>;
 export default _default;
-export { BaseValueType, DayStatusType, DisabledDateOptions, DisabledDateType, DisabledTimeType, InputSize, Position, PresetType, PresetsType, TriggerRenderProps, ValidateStatus, ValueType, } from '@douyinfe/semi-foundation/datePicker/foundation';
+export { BaseValueType, DayStatusType, DisabledDateOptions, DisabledDateType, DisabledTimeType, InputSize, Position, PresetType, PresetsType, TriggerRenderProps, ValidateStatus, ValueType, } from '@douyinfe/semi-foundation/lib/es/datePicker/foundation';

package/lib/es/datePicker/yearAndMonth.d.ts

@@ -32,8 +32,8 @@ declare class YearAndMonth extends BaseComponent<YearAndMonthProps, YearAndMonth
         onSelect: (...args: any[]) => void;
     };
     foundation: YearAndMonthFoundation;
-    yearRef: React.RefObject<ScrollItem>;
-    monthRef: React.RefObject<ScrollItem>;
+    yearRef: React.RefObject<ScrollItem<YearScrollItem>>;
+    monthRef: React.RefObject<ScrollItem<MonthScrollItem>>;
     constructor(props: YearAndMonthProps);
     get adapter(): YearAndMonthAdapter;
     static getDerivedStateFromProps(props: YearAndMonthProps, state: YearAndMonthState): Partial<YearAndMonthFoundationState>;

package/lib/es/form/baseForm.d.ts

@@ -128,7 +128,7 @@ declare class Form extends BaseComponent<BaseFormProps, BaseFormState> {
         children?: React.ReactNode;
     }), import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Rating: React.ComponentType<import("utility-types").Subtract<import("../rating").RatingProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
-    static AutoComplete: React.ComponentType<import("utility-types").Subtract<import("../autoComplete").AutoCompleteProps<import("../autoComplete").BaseDataItem>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
+    static AutoComplete: React.ComponentType<import("utility-types").Subtract<import("../autoComplete").AutoCompleteProps<import("../autoComplete").AutoCompleteItems>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Upload: React.ComponentType<import("utility-types").Subtract<import("../upload").UploadProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static TagInput: React.ComponentType<import("utility-types").Subtract<import("../tagInput").TagInputProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Slot: (props: import("./slot").SlotProps) => JSX.Element;

package/lib/es/form/baseForm.js

@@ -49,8 +49,7 @@ class Form extends BaseComponent {
     this.state = {
       formId: getUuidv4()
     };
-    warning( // @ts-ignore special usage
-    props.component && props.render, '[Semi Form] You should not use <Form component> and <Form render> in ths same time; <Form render> will be ignored');
+    warning(Boolean(props.component && props.render), '[Semi Form] You should not use <Form component> and <Form render> in ths same time; <Form render> will be ignored');
     warning(props.component && props.children && !isEmptyChildren(props.children), '[Semi Form] You should not use <Form component> and <Form>{children}</Form> in ths same time; <Form>{children}</Form> will be ignored');
     warning(props.render && props.children && !isEmptyChildren(props.children), '[Semi Form] You should not use <Form render> and <Form>{children}</Form> in ths same time; <Form>{children}</Form> will be ignored');
     this.submit = _bindInstanceProperty(_context = this.submit).call(_context, this);

package/lib/es/form/field.d.ts

@@ -90,7 +90,7 @@ declare const FormCascader: import("react").ComponentType<import("utility-types"
     children?: import("react").ReactNode;
 }), import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormRating: import("react").ComponentType<import("utility-types").Subtract<import("../rating/index").RatingProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
-declare const FormAutoComplete: import("react").ComponentType<import("utility-types").Subtract<import("../autoComplete/index").AutoCompleteProps<import("../autoComplete/index").BaseDataItem>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
+declare const FormAutoComplete: import("react").ComponentType<import("utility-types").Subtract<import("../autoComplete/index").AutoCompleteProps<import("../autoComplete/index").AutoCompleteItems>, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormUpload: import("react").ComponentType<import("utility-types").Subtract<import("../upload/index").UploadProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormTagInput: import("react").ComponentType<import("utility-types").Subtract<import("../tagInput/index").TagInputProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 export { FormInput, FormInputNumber, FormTextArea, FormSelect, FormCheckboxGroup, FormCheckbox, FormRadioGroup, FormRadio, FormDatePicker, FormSwitch, FormSlider, FormTimePicker, FormTreeSelect, FormCascader, FormRating, FormAutoComplete, FormUpload, FormTagInput };

package/lib/es/form/hoc/withField.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { withFieldOption } from '@douyinfe/semi-foundation/lib/es/form/interface';
+import { WithFieldOption } from '@douyinfe/semi-foundation/lib/es/form/interface';
 import { CommonFieldProps, CommonexcludeType } from '../interface';
 import { Subtract } from 'utility-types';
 /**
@@ -8,5 +8,5 @@ import { Subtract } from 'utility-types';
  * 2. Insert <Label>
  * 3. Insert <ErrorMessage>
  */
-declare function withField<C extends React.ComponentType<React.ComponentProps<C>>, T extends React.ComponentType<Subtract<React.ComponentProps<C>, CommonexcludeType> & CommonFieldProps>>(Component: C, opts?: withFieldOption): T;
+declare function withField<C extends React.ComponentType<React.ComponentProps<C>>, T extends React.ComponentType<Subtract<React.ComponentProps<C>, CommonexcludeType> & CommonFieldProps>>(Component: C, opts?: WithFieldOption): T;
 export default withField;

package/lib/es/form/hoc/withField.js

@@ -507,10 +507,14 @@ function withField(Component, opts) {
       return useMemo(() => FieldComponent, [...shouldUpdate]);
     } else {
       // Some Custom Component with inner state shouldn't be memo, otherwise the component will not updated when the internal state is updated
-      // Fixed issue 328
       return FieldComponent;
     }
   };
+  /**
+   * Reasons for using ts-igonre: skip strict check of ref
+   */
+  // @ts-ignore-next-line 
+
 
   SemiField = /*#__PURE__*/forwardRef(SemiField);
   SemiField.displayName = getDisplayName(Component);

package/lib/es/form/interface.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Subtract } from 'utility-types';
 import type { RuleItem } from 'async-validator';
 import { Options as scrollIntoViewOptions } from 'scroll-into-view-if-needed';
-import { BaseFormApi as FormApi, FormState } from '@douyinfe/semi-foundation/lib/es/form/interface';
+import { BaseFormApi as FormApi, FormState, WithFieldOption } from '@douyinfe/semi-foundation/lib/es/form/interface';
 import { SelectProps } from '../select/index';
 import Option from '../select/option';
 import OptGroup from '../select/optionGroup';
@@ -10,7 +10,7 @@ import { CheckboxProps } from '../checkbox/index';
 import { RadioProps } from '../radio/index';
 import { ReactFieldError as FieldError } from './errorMessage';
 import { LabelProps } from './label';
-export { FormState, FormApi };
+export { FormState, FormApi, WithFieldOption };
 export declare type CommonFieldProps = {
     /** Field is required (except Form. Checkbox within the Group, Form. Radio) */
     field: string;

package/lib/es/locale/localeConsumer.d.ts

@@ -2,12 +2,12 @@ import React, { Component } from 'react';
 import { Locale as dateFns } from 'date-fns';
 import PropTypes from 'prop-types';
 import { Locale } from './interface';
-declare type ChildrenRender = (componentLocal: Locale[keyof Locale], localeCode: string, dateFnsLocale: dateFns) => React.ReactNode;
-export interface LocaleConsumerProps {
+declare type ChildrenRender<T> = (componentLocal: T, localeCode: string, dateFnsLocale: dateFns) => React.ReactNode;
+export interface LocaleConsumerProps<T> {
     componentName: string;
-    children?: ChildrenRender;
+    children?: ChildrenRender<T>;
 }
-export default class LocaleConsumer extends Component<LocaleConsumerProps> {
+export default class LocaleConsumer<T> extends Component<LocaleConsumerProps<T>> {
     static propTypes: {
         componentName: PropTypes.Validator<string>;
         children: PropTypes.Requireable<any>;
@@ -15,7 +15,7 @@ export default class LocaleConsumer extends Component<LocaleConsumerProps> {
     static defaultProps: {
         componentName: string;
     };
-    renderChildren(localeData: Locale, children: ChildrenRender): React.ReactNode;
+    renderChildren(localeData: Locale, children: ChildrenRender<T>): React.ReactNode;
     render(): JSX.Element;
 }
 export {};

package/lib/es/modal/useModal/HookModal.d.ts

@@ -6,8 +6,9 @@ interface HookModalProps {
     config: ConfirmProps;
     motion?: Motion;
 }
-declare const _default: React.ForwardRefExoticComponent<HookModalProps & React.RefAttributes<{
+export interface HookModalRef {
     destroy: () => void;
     update: (newConfig: ConfirmProps) => void;
-}>>;
+}
+declare const _default: React.ForwardRefExoticComponent<HookModalProps & React.RefAttributes<HookModalRef>>;
 export default _default;

package/lib/es/modal/useModal/index.js

@@ -1,7 +1,7 @@
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import React from 'react';
 import HookModal from './HookModal';
-import { withConfirm, withInfo, withSuccess, withError, withWarning } from '../confirm';
+import { withConfirm, withError, withInfo, withSuccess, withWarning } from '../confirm';
 let uuid = 0;
 
 function usePatchElement() {

package/lib/es/navigation/index.d.ts

@@ -7,7 +7,7 @@ import Item, { NavItemProps } from './Item';
 import Footer, { NavFooterProps } from './Footer';
 import Header, { NavHeaderProps } from './Header';
 import '@douyinfe/semi-foundation/lib/es/navigation/navigation.css';
-import { Motion } from '_base/base';
+import { Motion } from '../_base/base';
 export { CollapseButtonProps } from './CollapseButton';
 export { NavFooterProps } from './Footer';
 export { NavHeaderProps } from './Header';

package/lib/es/notification/index.d.ts

@@ -9,7 +9,7 @@ export { NoticeTransitionProps } from './NoticeTransition';
 export interface NoticeReactProps extends NoticeProps {
     style?: CSSProperties;
 }
-export { NoticeState, NotificationListProps, NotificationListState };
+export { NoticeState, NotificationListProps, NotificationListState, ConfigProps };
 export declare type NoticesInPosition = {
     top: NoticeInstance[];
     topLeft: NoticeInstance[];
@@ -43,7 +43,7 @@ declare class NotificationList extends BaseComponent<NotificationListProps, Noti
     static destroyAll(): void;
     static config(opts: ConfigProps): void;
     add: (noticeOpts: NoticeProps) => any;
-    remove: (id: string) => void;
+    remove: (id: string | number) => void;
     destroyAll: () => any;
     renderNoticeInPosition: (notices: NoticeInstance[], position: NoticePosition, removedItems?: NoticeInstance[]) => JSX.Element;
     setPosInStyle(noticeInstance: NoticeInstance): {};

package/lib/es/notification/index.js

@@ -39,7 +39,7 @@ class NotificationList extends BaseComponent {
     this.add = noticeOpts => this.foundation.addNotice(noticeOpts);
 
     this.remove = id => {
-      this.foundation.removeNotice(id);
+      this.foundation.removeNotice(String(id));
     };
 
     this.destroyAll = () => this.foundation.destroyAll();

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

@@ -23,7 +23,7 @@ export interface RatingProps {
     onFocus?: (e: React.FocusEvent) => void;
     onBlur?: (e: React.FocusEvent) => void;
     onKeyDown?: (e: React.KeyboardEvent) => void;
-    onClick?: (e: React.MouseEvent, index: number) => void;
+    onClick?: (e: React.MouseEvent | React.KeyboardEvent, index: number) => void;
     autoFocus?: boolean;
     size?: 'small' | 'default' | number;
     tooltips?: string[];

package/lib/es/resizeObserver/index.js

@@ -12,6 +12,7 @@ export default class ReactResizeObserver extends BaseComponent {
         // using findDOMNode for two reasons:
         // 1. cloning to insert a ref is unwieldy and not performant.
         // 2. ensure that we resolve to an actual DOM node (instead of any JSX ref instance).
+        // eslint-disable-next-line
         return findDOMNode(this.childNode || this);
       } catch (error) {
         // swallow error if findDOMNode is run on unmounted component.

package/lib/es/scrollList/scrollItem.d.ts

@@ -1,15 +1,15 @@
-/// <reference types="lodash" />
 import React from 'react';
 import BaseComponent from '../_base/baseComponent';
 import PropTypes from 'prop-types';
 import { Item, ScrollItemAdapter } from '@douyinfe/semi-foundation/lib/es/scrollList/itemFoundation';
 import { Motion } from '../_base/base';
-export interface ScrollItemProps {
+declare type DebounceSelectFn = (e: React.UIEvent, newSelectedNode: HTMLElement) => void;
+export interface ScrollItemProps<T extends Item> {
     mode?: string;
     cycled?: boolean;
-    list?: Item[];
+    list?: T[];
     selectedIndex?: number;
-    onSelect?: (data: Item) => void;
+    onSelect?: (data: T) => void;
     transform?: (value: any, text: string) => string;
     className?: string;
     motion?: Motion;
@@ -20,7 +20,7 @@ export interface ScrollItemState {
     prependCount: number;
     appendCount: number;
 }
-export default class ScrollItem extends BaseComponent<ScrollItemProps, ScrollItemState> {
+export default class ScrollItem<T extends Item> extends BaseComponent<ScrollItemProps<T>, ScrollItemState> {
     static propTypes: {
         mode: PropTypes.Requireable<string>;
         cycled: PropTypes.Requireable<boolean>;
@@ -36,7 +36,7 @@ export default class ScrollItem extends BaseComponent<ScrollItemProps, ScrollIte
     static defaultProps: {
         selectedIndex: number;
         motion: boolean;
-        list: Item[];
+        list: readonly [];
         onSelect: (...args: any[]) => void;
         cycled: boolean;
         mode: string;
@@ -48,12 +48,12 @@ export default class ScrollItem extends BaseComponent<ScrollItemProps, ScrollIte
     selector: unknown;
     scrollAnimation: any;
     scrolling: boolean;
-    throttledAdjustList: import("lodash").DebouncedFunc<(e: any, nearestNode: any) => void>;
-    debouncedSelect: import("lodash").DebouncedFunc<(e: any, nearestNode: any) => void>;
+    throttledAdjustList: DebounceSelectFn;
+    debouncedSelect: DebounceSelectFn;
     constructor(props?: {});
-    get adapter(): ScrollItemAdapter<ScrollItemProps, ScrollItemState>;
+    get adapter(): ScrollItemAdapter<ScrollItemProps<T>, ScrollItemState, T>;
     componentDidMount(): void;
-    componentDidUpdate(prevProps: ScrollItemProps): void;
+    componentDidUpdate(prevProps: ScrollItemProps<T>): void;
     _cacheNode: (name: string, node: Element) => Element;
     _cacheSelectedNode: (selectedNode: Element) => Element;
     _cacheWillSelectNode: (node: Element) => Element;
@@ -74,7 +74,7 @@ export default class ScrollItem extends BaseComponent<ScrollItemProps, ScrollIte
     indexIsSame: (index1: number, index2: number) => boolean;
     isDisabledIndex: (index: number) => boolean;
     isDisabledNode: (node: Element) => boolean;
-    isDisabledData: (data: Item) => boolean;
+    isDisabledData: (data: T) => boolean;
     isWheelMode: () => boolean;
     addClassToNode: (selectedNode: Element, selectedCls?: string) => void;
     getIndexByNode: (node: Element) => number;
@@ -102,3 +102,4 @@ export default class ScrollItem extends BaseComponent<ScrollItemProps, ScrollIte
     renderInfiniteList: () => JSX.Element;
     render(): JSX.Element;
 }
+export {};

package/lib/es/scrollList/scrollItem.js

@@ -21,14 +21,6 @@ export default class ScrollItem extends BaseComponent {
     let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     super(props);
     _this = this;
-    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 * 5);
 
     this._cacheNode = (name, node) => name && node && Object.prototype.hasOwnProperty.call(this, name) && (this[name] = node);
 
@@ -394,6 +386,14 @@ export default class ScrollItem extends BaseComponent {
     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 * 5);
   }
 
   get adapter() {

package/lib/es/select/index.d.ts

@@ -5,7 +5,6 @@ import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
 import Option, { OptionProps } from './option';
 import OptionGroup from './optionGroup';
 import '@douyinfe/semi-foundation/lib/es/select/select.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 import { Position, TooltipProps } from '../tooltip';
 export { OptionProps } from './option';
 export { OptionGroupProps } from './optionGroup';

package/lib/es/select/index.js

@@ -25,7 +25,7 @@ import BaseComponent from '../_base/baseComponent';
 import { isEqual, isString, noop } from 'lodash-es';
 import Tag from '../tag/index';
 import TagGroup from '../tag/group';
-import LocaleCosumer from '../locale/localeConsumer';
+import LocaleConsumer from '../locale/localeConsumer';
 import Popover from '../popover/index';
 import { numbers as popoverNumbers } from '@douyinfe/semi-foundation/lib/es/popover/constants';
 import { FixedSizeList as List } from 'react-window';
@@ -40,7 +40,6 @@ import { IconChevronDown, IconClear } from '@douyinfe/semi-icons';
 import { isSemiIcon } from '../_utils';
 import warning from '@douyinfe/semi-foundation/lib/es/utils/warning';
 import '@douyinfe/semi-foundation/lib/es/select/select.css';
-import '@douyinfe/semi-foundation/lib/es/select/option.css';
 const prefixcls = cssClasses.PREFIX;
 const key = 0; // Notes: Use the label of the option as the identifier, that is, the option in Select, the value is allowed to be the same, but the label must be unique
 
@@ -475,7 +474,7 @@ class Select extends BaseComponent {
       }, option, {
         focused: isFocused,
         style: style
-      }), /*#__PURE__*/React.createElement(LocaleCosumer, {
+      }), /*#__PURE__*/React.createElement(LocaleConsumer, {
         componentName: "Select"
       }, locale => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
         className: "".concat(prefixcls, "-create-tips")

package/lib/es/select/option.js

@@ -20,7 +20,7 @@ import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import { isString } from 'lodash-es';
 import { cssClasses } from '@douyinfe/semi-foundation/lib/es/select/constants';
-import LocaleCosumer from '../locale/localeConsumer';
+import LocaleConsumer from '../locale/localeConsumer';
 import { IconTick } from '@douyinfe/semi-icons';
 import { getHighLightTextHTML } from '../_utils/index';
 
@@ -97,7 +97,7 @@ class Option extends PureComponent {
         return null;
       }
 
-      return /*#__PURE__*/React.createElement(LocaleCosumer, {
+      return /*#__PURE__*/React.createElement(LocaleConsumer, {
         componentName: "Select"
       }, locale => /*#__PURE__*/React.createElement("div", {
         className: optionClassName

package/lib/es/select/utils.js

@@ -41,8 +41,6 @@ const generateOption = (child, parent) => {
 };
 
 const getOptionsFromGroup = selectChildren => {
-  var _context;
-
   let optionGroups = [];
   let options = [];
   const emptyGroup = {
@@ -52,8 +50,8 @@ const getOptionsFromGroup = selectChildren => {
   }; // avoid null
   // eslint-disable-next-line max-len
 
-  const childNodes = _filterInstanceProperty(_context = React.Children.toArray(selectChildren)).call(_context, childNode => childNode && childNode.props);
-
+  let childNodes = React.Children.toArray(selectChildren);
+  childNodes = _filterInstanceProperty(childNodes).call(childNodes, childNode => childNode && childNode.props);
   let type = '';
 
   _forEachInstanceProperty(childNodes).call(childNodes, child => {

package/lib/es/sideSheet/SideSheetContent.d.ts

@@ -1,7 +1,7 @@
 import React, { CSSProperties } from 'react';
 import PropTypes from 'prop-types';
 export interface SideSheetContentProps {
-    onClose?: (e: React.MouseEvent | MouseEvent) => void;
+    onClose?: (e: React.MouseEvent) => void;
     mask?: boolean;
     maskStyle?: CSSProperties;
     maskClosable?: boolean;

package/lib/es/sideSheet/index.d.ts

@@ -13,7 +13,7 @@ export interface SideSheetReactProps extends SideSheetProps {
     title?: React.ReactNode;
     footer?: React.ReactNode;
     children?: React.ReactNode;
-    onCancel?: (e: React.MouseEvent) => void;
+    onCancel?: (e: React.MouseEvent | React.KeyboardEvent) => void;
 }
 export { SideSheetState };
 export default class SideSheet extends BaseComponent<SideSheetReactProps, SideSheetState> {
@@ -52,8 +52,8 @@ export default class SideSheet extends BaseComponent<SideSheetReactProps, SideSh
     componentDidMount(): void;
     componentDidUpdate(prevProps: SideSheetReactProps, prevState: SideSheetState, snapshot: any): void;
     componentWillUnmount(): void;
-    handleCancel: (e: MouseEvent) => void;
-    handleKeyDown: (e: MouseEvent) => void;
+    handleCancel: (e: React.MouseEvent) => void;
+    handleKeyDown: (e: KeyboardEvent) => void;
     renderContent(): JSX.Element;
     render(): JSX.Element;
 }

package/lib/es/slider/index.js

@@ -399,6 +399,7 @@ export default class Slider extends BaseComponent {
       },
       onHandleMove: function (mousePos, isMin) {
         let stateChangeCallback = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : noop;
+        let clickTrack = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
 
         const sliderDOMIsInRenderTree = _this.foundation.checkAndUpdateIsInRenderTreeState();
 
@@ -426,7 +427,8 @@ export default class Slider extends BaseComponent {
         if (!isEqual(_this.foundation.outPutValue(currentValue), outPutValue)) {
           onChange(outPutValue);
 
-          if (_this.foundation.valueFormatIsCorrect(value)) {
+          if (!clickTrack && _this.foundation.valueFormatIsCorrect(value)) {
+            // still require afterChangeCallback when click on the track directly, need skip here
             return false;
           }
 

package/lib/es/spin/index.d.ts

@@ -8,7 +8,7 @@ export interface SpinProps {
     spinning?: boolean;
     indicator?: React.ReactNode;
     delay?: number;
-    tip?: string;
+    tip?: React.ReactNode;
     wrapperClassName?: string;
     style?: React.CSSProperties;
     childStyle?: React.CSSProperties;
@@ -25,7 +25,7 @@ declare class Spin extends BaseComponent<SpinProps, SpinState> {
         children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         indicator: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         delay: PropTypes.Requireable<number>;
-        tip: PropTypes.Requireable<string>;
+        tip: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         wrapperClassName: PropTypes.Requireable<string>;
         childStyle: PropTypes.Requireable<object>;
         style: PropTypes.Requireable<object>;

package/lib/es/spin/index.js

@@ -107,7 +107,7 @@ Spin.propTypes = {
   children: PropTypes.node,
   indicator: PropTypes.node,
   delay: PropTypes.number,
-  tip: PropTypes.string,
+  tip: PropTypes.node,
   wrapperClassName: PropTypes.string,
   childStyle: PropTypes.object,
   style: PropTypes.object