@douyinfe/semi-ui 2.10.4 → 2.10.5

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.10.4",
+    "version": "2.10.5",
     "description": "",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -14,12 +14,12 @@
     },
     "dependencies": {
         "@babel/runtime-corejs3": "^7.15.4",
-        "@douyinfe/semi-animation": "2.10.4",
-        "@douyinfe/semi-animation-react": "2.10.4",
-        "@douyinfe/semi-foundation": "2.10.4",
-        "@douyinfe/semi-icons": "2.10.4",
-        "@douyinfe/semi-illustrations": "2.10.4",
-        "@douyinfe/semi-theme-default": "2.10.4",
+        "@douyinfe/semi-animation": "2.10.5",
+        "@douyinfe/semi-animation-react": "2.10.5",
+        "@douyinfe/semi-foundation": "2.10.5",
+        "@douyinfe/semi-icons": "2.10.5",
+        "@douyinfe/semi-illustrations": "2.10.5",
+        "@douyinfe/semi-theme-default": "2.10.5",
         "@types/react-window": "^1.8.2",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
@@ -69,13 +69,13 @@
     ],
     "author": "",
     "license": "MIT",
-    "gitHead": "5c0370819f1ab319ceded2fbf0c9c7a12e4f1b77",
+    "gitHead": "17a549be94b38a44d7cd9a4d3f77c23da7df460a",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",
         "@babel/preset-react": "^7.14.5",
-        "@douyinfe/semi-scss-compile": "2.10.4",
+        "@douyinfe/semi-scss-compile": "2.10.5",
         "@storybook/addon-knobs": "^6.3.1",
         "@types/lodash": "^4.14.176",
         "babel-loader": "^8.2.2",

package/radio/radio.tsx

@@ -41,6 +41,10 @@ export type RadioProps = {
     addonClassName?: string;
     type?: RadioType;
     'aria-label'?: React.AriaAttributes['aria-label'];
+    addonId?: string;
+    extraId?: string;
+    name?: string;
+    preventScroll?: boolean;
 };
 
 export interface RadioState {
@@ -71,6 +75,7 @@ class Radio extends BaseComponent<RadioProps, RadioState> {
         addonClassName: PropTypes.string,
         type: PropTypes.oneOf([strings.TYPE_DEFAULT, strings.TYPE_BUTTON, strings.TYPE_CARD, strings.TYPE_PURECARD]), // Button style type
         'aria-label': PropTypes.string,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps: Partial<RadioProps> = {

package/radio/radioInner.tsx

@@ -23,6 +23,10 @@ export interface RadioInnerProps extends BaseProps {
     addonId?: string;
     extraId?: string;
     'aria-label'?: React.AriaAttributes['aria-label'];
+    focusInner?: boolean;
+    onInputFocus?: (e: any) => void;
+    onInputBlur?: (e: any) => void;
+    preventScroll?: boolean;
 }
 
 interface RadioInnerState {
@@ -39,6 +43,10 @@ class RadioInner extends BaseComponent<RadioInnerProps, RadioInnerState> {
         onChange: PropTypes.func,
         mode: PropTypes.oneOf(['advanced', '']),
         'aria-label': PropTypes.string,
+        focusInner: PropTypes.bool,
+        onInputFocus: PropTypes.func,
+        onInputBlur: PropTypes.func,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {
@@ -89,7 +97,8 @@ class RadioInner extends BaseComponent<RadioInnerProps, RadioInnerState> {
     }
 
     focus() {
-        this.inputEntity.focus();
+        const { preventScroll } = this.props;
+        this.inputEntity.focus({ preventScroll });
     }
 
     onChange(e: React.ChangeEvent<HTMLInputElement>) {

package/rating/index.tsx

@@ -41,6 +41,7 @@ export interface RatingProps {
     size?: 'small' | 'default' | number;
     tooltips?: string[];
     id?: string;
+    preventScroll?: boolean;
 }
 
 export interface RatingState {
@@ -79,6 +80,7 @@ export default class Rating extends BaseComponent<RatingProps, RatingState> {
         size: PropTypes.oneOfType([PropTypes.oneOf(strings.SIZE_SET), PropTypes.number]),
         tooltips: PropTypes.arrayOf(PropTypes.string),
         id: PropTypes.string,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {
@@ -127,9 +129,9 @@ export default class Rating extends BaseComponent<RatingProps, RatingState> {
         return {
             ...super.adapter,
             focus: () => {
-                const { disabled } = this.props;
+                const { disabled, preventScroll } = this.props;
                 if (!disabled) {
-                    this.rate.focus();
+                    this.rate.focus({ preventScroll });
                 }
             },
             getStarDOM: (index: number) => {
@@ -217,9 +219,9 @@ export default class Rating extends BaseComponent<RatingProps, RatingState> {
     };
 
     focus = () => {
-        const { disabled } = this.props;
+        const { disabled, preventScroll } = this.props;
         if (!disabled) {
-            this.rate.focus();
+            this.rate.focus({ preventScroll });
         }
     };
 

package/rating/item.tsx

@@ -21,6 +21,14 @@ export interface RatingItemProps {
     count: number;
     size: number | ArrayElement<typeof strings.SIZE_SET>;
     'aria-describedby'?: React.AriaAttributes['aria-describedby'];
+    onFocus?: (e: React.FocusEvent) => void;
+    onBlur?: (e: React.FocusEvent) => void;
+    preventScroll?: boolean;
+}
+
+export interface RatingItemState {
+    firstStarFocus: boolean,
+    secondStarFocus: boolean,
 }
 
 export default class Item extends PureComponent<RatingItemProps> {
@@ -40,6 +48,9 @@ export default class Item extends PureComponent<RatingItemProps> {
             PropTypes.number,
         ]),
         'aria-describedby': PropTypes.string,
+        onFocus: PropTypes.func,
+        onBlur: PropTypes.func,
+        preventScroll: PropTypes.bool,
     };
 
     onHover: React.MouseEventHandler = e => {

package/select/index.tsx

@@ -152,6 +152,7 @@ export type SelectProps = {
     onBlur?: (e: React.FocusEvent) => void;
     onListScroll?: (e: React.UIEvent<HTMLDivElement>) => void;
     children?: React.ReactNode;
+    preventScroll?: boolean;
 } & Pick<
 TooltipProps,
 | 'spacing'
@@ -271,6 +272,7 @@ class Select extends BaseComponent<SelectProps, SelectState> {
         renderOptionItem: PropTypes.func,
         onListScroll: PropTypes.func,
         arrowIcon: PropTypes.node,
+        preventScroll: PropTypes.bool,
     // open: PropTypes.bool,
     // tagClosable: PropTypes.bool,
     };
@@ -396,8 +398,9 @@ class Select extends BaseComponent<SelectProps, SelectState> {
                 });
             },
             focusInput: () => {
+                const { preventScroll } = this.props;
                 if (this.inputRef && this.inputRef.current) {
-                    this.inputRef.current.focus();
+                    this.inputRef.current.focus({ preventScroll });
                 }
             },
         };
@@ -526,8 +529,9 @@ class Select extends BaseComponent<SelectProps, SelectState> {
             },
             focusTrigger: () => {
                 try {
+                    const { preventScroll } = this.props;
                     const el = (this.triggerRef.current) as any;
-                    el.focus();
+                    el.focus({ preventScroll });
                 } catch (error) {
 
                 }

package/tabs/index.tsx

@@ -48,6 +48,7 @@ class Tabs extends BaseComponent<TabsProps, TabsState> {
         tabPosition: PropTypes.oneOf(strings.POSITION_MAP),
         type: PropTypes.oneOf(strings.TYPE_MAP),
         onTabClose: PropTypes.func,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps: TabsProps = {

package/tabs/interface.ts

@@ -36,6 +36,7 @@ export interface TabsProps {
     tabPosition?: TabPosition;
     type?: TabType;
     onTabClose?: (tabKey: string) => void;
+    preventScroll?: boolean;
 }
 
 export interface TabBarProps {

package/tagInput/index.tsx

@@ -58,6 +58,7 @@ export interface TagInputProps {
     value?: string[] | undefined;
     autoFocus?: boolean;
     'aria-label'?: string;
+    preventScroll?: boolean;
 }
 
 export interface TagInputState {
@@ -105,6 +106,7 @@ class TagInput extends BaseComponent<TagInputProps, TagInputState> {
         prefix: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
         suffix: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
         'aria-label': PropTypes.string,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {
@@ -198,9 +200,9 @@ class TagInput extends BaseComponent<TagInputProps, TagInputState> {
     }
 
     componentDidMount() {
-        const { disabled, autoFocus } = this.props;
+        const { disabled, autoFocus, preventScroll } = this.props;
         if (!disabled && autoFocus) {
-            this.inputRef.current.focus();
+            this.inputRef.current.focus({ preventScroll });
         }
     }
 
@@ -381,7 +383,8 @@ class TagInput extends BaseComponent<TagInputProps, TagInputState> {
     }
 
     focus() {
-        this.inputRef.current.focus();
+        const { preventScroll } = this.props;
+        this.inputRef.current.focus({ preventScroll });
     }
 
     render() {

package/timePicker/TimeInput.tsx

@@ -33,7 +33,8 @@ export type TimeInputProps = Pick<TimePickerProps,
 'locale' |
 'localeCode' |
 'insetLabel' |
-'validateStatus'> & BaseProps & {
+'validateStatus' |
+'preventScroll'> & BaseProps & {
     onChange?: (value: string) => void;
     onEsc?: () => void;
     onClick?: React.MouseEventHandler;
@@ -69,6 +70,7 @@ class TimeInput extends BaseComponent<TimeInputProps, any> {
         localeCode: PropTypes.string,
         insetLabel: PropTypes.node,
         validateStatus: PropTypes.string,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {
@@ -96,13 +98,13 @@ class TimeInput extends BaseComponent<TimeInputProps, any> {
 
     componentDidMount() {
         super.componentDidMount();
-        const { focusOnOpen } = this.props;
+        const { focusOnOpen, preventScroll } = this.props;
         if (focusOnOpen) {
             const requestAnimationFrame = window.requestAnimationFrame || window.setTimeout;
             requestAnimationFrame(() => {
                 const inputNode = this.adapter.getCache('inputNode');
                 if (inputNode) {
-                    inputNode.focus();
+                    inputNode.focus({ preventScroll });
                     inputNode.select();
                 }
             });

package/timePicker/TimePicker.tsx

@@ -75,6 +75,7 @@ export type TimePickerProps = {
     popupStyle?: React.CSSProperties;
     position?: Position;
     prefixCls?: string;
+    preventScroll?: boolean;
     rangeSeparator?: string;
     scrollItemProps?: ScrollItemProps<any>;
     secondStep?: number;
@@ -164,6 +165,7 @@ export default class TimePicker extends BaseComponent<TimePickerProps, TimePicke
         autoAdjustOverflow: PropTypes.bool,
         ...PanelShape,
         inputStyle: PropTypes.object,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {

package/tooltip/index.tsx

@@ -75,6 +75,8 @@ export interface TooltipProps extends BaseProps {
     guardFocus?: boolean;
     returnFocusOnClose?: boolean;
     onEscKeyDown?: (e: React.KeyboardEvent) => void;
+    wrapperId?: string;
+    preventScroll?: boolean;
 }
 interface TooltipState {
     visible: boolean;
@@ -135,6 +137,7 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
         wrapWhenSpecial: PropTypes.bool, // when trigger has special status such as "disabled" or "loading", wrap span
         guardFocus: PropTypes.bool,
         returnFocusOnClose: PropTypes.bool,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {
@@ -421,9 +424,10 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
                 return getActiveElement();
             },
             setInitialFocus: () => {
+                const { preventScroll } = this.props;
                 const focusRefNode = get(this, 'initialFocusRef.current');
                 if (focusRefNode && 'focus' in focusRefNode) {
-                    focusRefNode.focus();
+                    focusRefNode.focus({ preventScroll });
                 } 
             },
             notifyEscKeydown: (event: React.KeyboardEvent) => {

package/tree/index.tsx

@@ -114,6 +114,7 @@ class Tree extends BaseComponent<TreeProps, TreeState> {
         labelEllipsis: PropTypes.bool,
         checkRelation: PropTypes.string,
         'aria-label': PropTypes.string,
+        preventScroll: PropTypes.bool,
     };
 
     static defaultProps = {
@@ -445,8 +446,9 @@ class Tree extends BaseComponent<TreeProps, TreeState> {
                 this.setState({ inputValue: value });
             },
             focusInput: () => {
+                const { preventScroll } = this.props;
                 if (this.inputRef && this.inputRef.current) {
-                    (this.inputRef.current as any).focus();
+                    (this.inputRef.current as any).focus({ preventScroll });
                 }
             },
         };