@douyinfe/semi-ui 2.10.0-alpha.0 → 2.10.1

package/lib/cjs/checkbox/checkbox.js

@@ -51,11 +51,15 @@ class Checkbox extends _baseComponent.default {
 
     const checked = false;
     this.state = {
-      checked: props.checked || props.defaultChecked || checked,
-      addonId: props.addonId,
-      extraId: props.extraId
+      checked: props.checked || props.defaultChecked || checked
     };
     this.checkboxEntity = null;
+    this.addonId = (0, _uuid.getUuidShort)({
+      prefix: 'addon'
+    });
+    this.extraId = (0, _uuid.getUuidShort)({
+      prefix: 'extra'
+    });
     this.foundation = new _checkboxFoundation.default(this.adapter);
   }
 
@@ -77,21 +81,7 @@ class Checkbox extends _baseComponent.default {
       notifyGroupChange: cbContent => {
         this.context.checkboxGroup.onChange(cbContent);
       },
-      getGroupDisabled: () => this.context && this.context.checkboxGroup.disabled,
-      setAddonId: () => {
-        this.setState({
-          addonId: (0, _uuid.getUuidShort)({
-            prefix: 'addon'
-          })
-        });
-      },
-      setExtraId: () => {
-        this.setState({
-          extraId: (0, _uuid.getUuidShort)({
-            prefix: 'extra'
-          })
-        });
-      }
+      getGroupDisabled: () => this.context && this.context.checkboxGroup.disabled
     });
   }
 
@@ -134,9 +124,7 @@ class Checkbox extends _baseComponent.default {
       id
     } = this.props;
     const {
-      checked,
-      addonId,
-      extraId
+      checked
     } = this.state;
     const props = {
       checked,
@@ -183,10 +171,10 @@ class Checkbox extends _baseComponent.default {
     const name = inGroup && this.context.checkboxGroup.name;
 
     const renderContent = () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children ? /*#__PURE__*/_react.default.createElement("span", {
-      id: addonId,
+      id: this.addonId,
       className: "".concat(prefix, "-addon")
     }, children) : null, extra ? /*#__PURE__*/_react.default.createElement("div", {
-      id: extraId,
+      id: this.extraId,
       className: extraCls
     }, extra) : null);
 
@@ -206,8 +194,8 @@ class Checkbox extends _baseComponent.default {
         onKeyPress: this.handleEnterPress,
         "aria-labelledby": this.props['aria-labelledby']
       }, /*#__PURE__*/_react.default.createElement(_checkboxInner.default, (0, _assign.default)({}, this.props, props, {
-        addonId: children && addonId,
-        extraId: extra && extraId,
+        addonId: children && this.addonId,
+        extraId: extra && this.extraId,
         name: name,
         isPureCardType: props.isPureCardType,
         ref: ref => {

package/lib/cjs/datePicker/dateInput.d.ts

@@ -26,7 +26,7 @@ export default class DateInput extends BaseComponent<DateInputProps, {}> {
         onFocus: PropTypes.Requireable<(...args: any[]) => any>;
         value: PropTypes.Requireable<any[]>;
         disabled: PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         showClear: PropTypes.Requireable<boolean>;
         format: PropTypes.Requireable<string>;
         inputStyle: PropTypes.Requireable<object>;

package/lib/cjs/datePicker/datePicker.d.ts

@@ -41,7 +41,7 @@ export default class DatePicker extends BaseComponent<DatePickerProps, DatePicke
         'aria-invalid': PropTypes.Requireable<boolean>;
         'aria-labelledby': PropTypes.Requireable<string>;
         'aria-required': PropTypes.Requireable<boolean>;
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         size: PropTypes.Requireable<"default" | "small" | "large">;
         density: PropTypes.Requireable<"default" | "compact">;
         defaultValue: PropTypes.Requireable<string | number | object>;

package/lib/cjs/datePicker/insetInput.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InsetInputValue, Type, InsetInputChangeFoundationProps } from '@douyinfe/semi-foundation/lib/cjs/datePicker/inputFoundation';
 import { InputProps } from '../input';
 export interface InsetDateInputProps {

package/lib/cjs/datePicker/monthsGrid.d.ts

@@ -17,7 +17,7 @@ export interface MonthsGridProps extends MonthsGridFoundationProps, BaseProps {
 export declare type MonthsGridState = MonthsGridFoundationState;
 export default class MonthsGrid extends BaseComponent<MonthsGridProps, MonthsGridState> {
     static propTypes: {
-        type: PropTypes.Requireable<"date" | "month" | "dateTime" | "dateRange" | "year" | "dateTimeRange">;
+        type: PropTypes.Requireable<"dateTime" | "date" | "month" | "dateRange" | "year" | "dateTimeRange">;
         defaultValue: PropTypes.Requireable<string | number | object>;
         defaultPickerValue: PropTypes.Requireable<string | number | object>;
         multiple: PropTypes.Requireable<boolean>;

package/lib/cjs/datePicker/monthsGrid.js

@@ -505,7 +505,7 @@ class MonthsGrid extends _baseComponent.default {
     const dateFormat = this.foundation.getValidDateFormat();
     let startDate, endDate;
 
-    if (type === 'dateTimeRange' && rangeStart && rangeEnd && (0, _dateFns.isSameDay)(startDate = (0, _parser.compatiableParse)(rangeStart, dateFormat, undefined, dateFnsLocale), endDate = (0, _parser.compatiableParse)(rangeEnd, dateFormat, undefined, dateFnsLocale))) {
+    if (type === 'dateTimeRange' && rangeStart && rangeEnd && (0, _dateFns.isSameDay)(startDate = (0, _parser.compatibleParse)(rangeStart, dateFormat, undefined, dateFnsLocale), endDate = (0, _parser.compatibleParse)(rangeEnd, dateFormat, undefined, dateFnsLocale))) {
       if (panelType === _constants.strings.PANEL_TYPE_RIGHT) {
         rangeStart && (restProps.startDate = startDate);
       } else {
@@ -591,10 +591,10 @@ class MonthsGrid extends _baseComponent.default {
 
     if (panelType === _constants.strings.PANEL_TYPE_LEFT) {
       panelDetail = monthLeft;
-      dateText = rangeStart ? (0, _dateFns.format)((0, _parser.compatiableParse)(rangeStart, dateFormat, undefined, dateFnsLocale), FORMAT_SWITCH_DATE) : '';
+      dateText = rangeStart ? (0, _dateFns.format)((0, _parser.compatibleParse)(rangeStart, dateFormat, undefined, dateFnsLocale), FORMAT_SWITCH_DATE) : '';
     } else {
       panelDetail = monthRight;
-      dateText = rangeEnd ? (0, _dateFns.format)((0, _parser.compatiableParse)(rangeEnd, dateFormat, undefined, dateFnsLocale), FORMAT_SWITCH_DATE) : '';
+      dateText = rangeEnd ? (0, _dateFns.format)((0, _parser.compatibleParse)(rangeEnd, dateFormat, undefined, dateFnsLocale), FORMAT_SWITCH_DATE) : '';
     }
 
     const {
@@ -603,7 +603,7 @@ class MonthsGrid extends _baseComponent.default {
     } = panelDetail;
     const monthText = showDate ? (0, _dateFns.format)(showDate, FORMAT_SWITCH_DATE) : '';
     const timeText = showDate ? (0, _dateFns.format)(showDate, formatTimePicker) : '';
-    const showSwithIcon = (0, _includes.default)(_context3 = ['default']).call(_context3, density);
+    const showSwitchIcon = (0, _includes.default)(_context3 = ['default']).call(_context3, density);
     const switchCls = (0, _classnames.default)("".concat(prefixCls, "-switch"));
     const dateCls = (0, _classnames.default)({
       ["".concat(prefixCls, "-switch-date")]: true,
@@ -623,7 +623,7 @@ class MonthsGrid extends _baseComponent.default {
       "aria-label": "Switch to date panel",
       className: dateCls,
       onClick: e => this.foundation.showDatePanel(panelType)
-    }, showSwithIcon && /*#__PURE__*/_react.default.createElement(_semiIcons.IconCalendar, {
+    }, showSwitchIcon && /*#__PURE__*/_react.default.createElement(_semiIcons.IconCalendar, {
       "aria-hidden": true
     }), /*#__PURE__*/_react.default.createElement("span", {
       className: textCls
@@ -632,7 +632,7 @@ class MonthsGrid extends _baseComponent.default {
       "aria-label": "Switch to time panel",
       className: timeCls,
       onClick: e => this.foundation.showTimePicker(panelType, true)
-    }, showSwithIcon && /*#__PURE__*/_react.default.createElement(_semiIcons.IconClock, {
+    }, showSwitchIcon && /*#__PURE__*/_react.default.createElement(_semiIcons.IconClock, {
       "aria-hidden": true
     }), /*#__PURE__*/_react.default.createElement("span", {
       className: textCls

package/lib/cjs/dropdown/dropdownMenu.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import PropTypes from 'prop-types';
 import BaseComponent, { BaseProps } from '../_base/baseComponent';
 export declare type DropdownMenuProps = BaseProps;

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

@@ -125,7 +125,7 @@ declare class Form extends BaseComponent<BaseFormProps, BaseFormState> {
         onBlur?: (e: React.FocusEvent<Element, Element>) => void;
         onListScroll?: (e: React.UIEvent<HTMLDivElement, UIEvent>) => void;
         children?: React.ReactNode;
-    } & Pick<import("../tooltip").TooltipProps, "getPopupContainer" | "stopPropagation" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+    } & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & React.RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
     static Checkbox: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox").CheckboxProps & import("./interface").RCIncludeType>;
     static CheckboxGroup: React.ComponentType<import("utility-types").Subtract<import("../checkbox").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
     static Radio: React.ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../radio").RadioProps & import("./interface").RCIncludeType>;
@@ -147,6 +147,7 @@ declare class Form extends BaseComponent<BaseFormProps, BaseFormState> {
     static Section: typeof Section;
     formApi: FormApi;
     constructor(props: BaseFormProps);
+    componentDidMount(): void;
     componentWillUnmount(): void;
     get adapter(): BaseFormAdapter<BaseFormProps, BaseFormState>;
     get content(): React.ReactNode;

package/lib/cjs/form/baseForm.js

@@ -85,7 +85,7 @@ class Form extends _baseComponent.default {
 
     super(props);
     this.state = {
-      formId: (0, _uuid.getUuidv4)()
+      formId: ''
     };
     (0, _warning.default)(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');
     (0, _warning.default)(props.component && props.children && !(0, _reactUtils.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');
@@ -100,6 +100,10 @@ class Form extends _baseComponent.default {
     }
   }
 
+  componentDidMount() {
+    this.foundation.init();
+  }
+
   componentWillUnmount() {
     this.foundation.destroy();
     this.foundation = null;
@@ -127,6 +131,11 @@ class Form extends _baseComponent.default {
       notifyReset: () => {
         this.props.onReset();
       },
+      initFormId: () => {
+        this.setState({
+          formId: (0, _uuid.getUuidv4)()
+        });
+      },
       getInitValues: () => this.props.initValues,
       getFormProps: keys => {
         if (typeof keys === 'undefined') {

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

@@ -73,7 +73,7 @@ declare const FormSelect: import("react").ComponentType<import("utility-types").
     onBlur?: (e: import("react").FocusEvent<Element, Element>) => void;
     onListScroll?: (e: import("react").UIEvent<HTMLDivElement, UIEvent>) => void;
     children?: import("react").ReactNode;
-} & Pick<import("../tooltip").TooltipProps, "getPopupContainer" | "stopPropagation" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
+} & Pick<import("../tooltip").TooltipProps, "stopPropagation" | "getPopupContainer" | "spacing" | "mouseEnterDelay" | "autoAdjustOverflow" | "mouseLeaveDelay" | "motion"> & import("react").RefAttributes<any> & import("./interface").CommonFieldProps, import("./interface").CommonexcludeType>> & import("./interface").SelectStatic;
 declare const FormCheckboxGroup: import("react").ComponentType<import("utility-types").Subtract<import("../checkbox/checkboxGroup").CheckboxGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;
 declare const FormCheckbox: import("react").ComponentType<import("utility-types").Subtract<import("./interface").CommonFieldProps, import("./interface").RadioCheckboxExcludeProps> & import("../checkbox/checkbox").CheckboxProps & import("./interface").RCIncludeType>;
 declare const FormRadioGroup: import("react").ComponentType<import("utility-types").Subtract<import("../radio/radioGroup").RadioGroupProps, import("./interface").CommonexcludeType> & import("./interface").CommonFieldProps>;

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

@@ -147,7 +147,8 @@ function withField(Component, opts) {
     const [cursor, setCursor, getCursor] = (0, _index.useStateWithGetter)(0);
     const [status, setStatus] = (0, _react.useState)(validateStatus); // use props.validateStatus to init
 
-    const rulesRef = (0, _react.useRef)(rules); // notNotify is true means that the onChange of the Form does not need to be triggered
+    const rulesRef = (0, _react.useRef)(rules);
+    const validateRef = (0, _react.useRef)(validate); // notNotify is true means that the onChange of the Form does not need to be triggered
     // notUpdate is true means that this operation does not need to trigger the forceUpdate
 
     const updateTouched = (isTouched, callOpts) => {
@@ -246,7 +247,7 @@ function withField(Component, opts) {
       let maybePromisedErrors; // let errorThrowSync;
 
       try {
-        maybePromisedErrors = validate(val, values);
+        maybePromisedErrors = validateRef.current(val, values);
       } catch (err) {
         // error throw by syncValidate
         maybePromisedErrors = err;
@@ -286,7 +287,7 @@ function withField(Component, opts) {
         finalVal = transform(val);
       }
 
-      if (validate) {
+      if (validateRef.current) {
         return _validate(finalVal, updater.getValue(), callOpts);
       } else if (latestRules) {
         return _validateInternal(finalVal, callOpts);
@@ -395,7 +396,8 @@ function withField(Component, opts) {
 
     (0, _react.useLayoutEffect)(() => {
       rulesRef.current = rules;
-    }, [rules]); // exec validate once when trigger inlcude 'mount'
+      validateRef.current = validate;
+    }, [rules, validate]); // exec validate once when trigger inlcude 'mount'
 
     (0, _react.useLayoutEffect)(() => {
       if (validateOnMount) {
@@ -411,9 +413,16 @@ function withField(Component, opts) {
         // eslint-disable-next-line @typescript-eslint/no-empty-function
         return () => {};
       } // log('register: ' + field);
+      // field value may change after field component mounted, we use ref value here to get changed value
 
 
-      updater.register(field, fieldState, {
+      const refValue = getVal();
+      updater.register(field, {
+        value: refValue,
+        error,
+        touched,
+        status
+      }, {
         field,
         fieldApi,
         keepState,

package/lib/cjs/index.d.ts

@@ -12,6 +12,7 @@ export { default as ButtonGroup } from './button/buttonGroup';
 export { default as Calendar } from './calendar';
 export { default as Card } from './card';
 export { default as CardGroup } from './card/cardGroup';
+export { default as Carousel } from './carousel';
 export { default as Cascader } from './cascader';
 export { default as Checkbox } from './checkbox';
 export { default as CheckboxGroup } from './checkbox/checkboxGroup';

package/lib/cjs/index.js

@@ -110,6 +110,13 @@ _Object$defineProperty(exports, "CardGroup", {
   }
 });
 
+_Object$defineProperty(exports, "Carousel", {
+  enumerable: true,
+  get: function () {
+    return _carousel.default;
+  }
+});
+
 _Object$defineProperty(exports, "Cascader", {
   enumerable: true,
   get: function () {
@@ -656,6 +663,8 @@ var _card = _interopRequireDefault(require("./card"));
 
 var _cardGroup = _interopRequireDefault(require("./card/cardGroup"));
 
+var _carousel = _interopRequireDefault(require("./carousel"));
+
 var _cascader = _interopRequireDefault(require("./cascader"));
 
 var _checkbox = _interopRequireDefault(require("./checkbox"));

package/lib/cjs/inputNumber/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { InputProps } from '../input';
-import InputNumberFoundation, { InputNumberAdapter } from '@douyinfe/semi-foundation/lib/cjs/inputNumber/foundation';
+import InputNumberFoundation, { BaseInputNumberState, InputNumberAdapter } from '@douyinfe/semi-foundation/lib/cjs/inputNumber/foundation';
 import BaseComponent from '../_base/baseComponent';
 import { strings } from '@douyinfe/semi-foundation/lib/cjs/inputNumber/constants';
 import '@douyinfe/semi-foundation/lib/cjs/inputNumber/inputNumber.css';
@@ -40,11 +40,7 @@ export interface InputNumberProps extends InputProps {
     onNumberChange?: (value: number, e?: React.ChangeEvent) => void;
     onUpClick?: (value: string, e: React.MouseEvent<HTMLButtonElement>) => void;
 }
-export interface InputNumberState {
-    value?: number | string;
-    number?: number | null;
-    focusing?: boolean;
-    hovering?: boolean;
+export interface InputNumberState extends BaseInputNumberState {
 }
 declare class InputNumber extends BaseComponent<InputNumberProps, InputNumberState> {
     static propTypes: {

package/lib/cjs/inputNumber/index.js

@@ -24,6 +24,8 @@ var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-sta
 
 var _noop2 = _interopRequireDefault(require("lodash/noop"));
 
+var _isString2 = _interopRequireDefault(require("lodash/isString"));
+
 var _isNaN2 = _interopRequireDefault(require("lodash/isNaN"));
 
 var _react = _interopRequireDefault(require("react"));
@@ -300,6 +302,9 @@ class InputNumber extends _baseComponent.default {
       },
       setClickUpOrDown: value => {
         this.clickUpOrDown = value;
+      },
+      updateStates: (states, callback) => {
+        this.setState(states, callback);
       }
     });
   }
@@ -311,6 +316,7 @@ class InputNumber extends _baseComponent.default {
     const {
       focusing
     } = this.state;
+    let newValue;
     /**
      * To determine whether the front and back are equal
      * NaN need to check whether both are NaN
@@ -318,8 +324,9 @@ class InputNumber extends _baseComponent.default {
 
     if (value !== prevProps.value && !(0, _isBothNaN.default)(value, prevProps.value)) {
       if ((0, _isNullOrUndefined.default)(value) || value === '') {
-        this.setState({
-          value: '',
+        newValue = '';
+        this.foundation.updateStates({
+          value: newValue,
           number: null
         });
       } else {
@@ -375,33 +382,42 @@ class InputNumber extends _baseComponent.default {
 
             if (this.clickUpOrDown) {
               obj.value = this.foundation.doFormat(valueStr, true);
+              newValue = obj.value;
             }
 
-            this.setState(obj, () => this.adapter.restoreCursor());
+            this.foundation.updateStates(obj, () => this.adapter.restoreCursor());
           } else if (!(0, _isNaN2.default)(toNum)) {
             // Update input content when controlled input is illegal and not NaN
-            this.setState({
-              value: this.foundation.doFormat(toNum, false)
+            newValue = this.foundation.doFormat(toNum, false);
+            this.foundation.updateStates({
+              value: newValue
             });
           } else {
             // Update input content when controlled input NaN
-            this.setState({
-              value: this.foundation.doFormat(valueStr, false)
+            newValue = this.foundation.doFormat(valueStr, false);
+            this.foundation.updateStates({
+              value: newValue
             });
           }
         } else if (this.foundation.isValidNumber(parsedNum)) {
-          this.setState({
+          newValue = this.foundation.doFormat(parsedNum);
+          this.foundation.updateStates({
             number: parsedNum,
-            value: this.foundation.doFormat(parsedNum)
+            value: newValue
           });
         } else {
           // Invalid digital analog blurring effect instead of controlled failure
-          this.setState({
+          newValue = '';
+          this.foundation.updateStates({
             number: null,
-            value: ''
+            value: newValue
           });
         }
       }
+
+      if ((0, _isString2.default)(newValue) && newValue !== String(this.props.value)) {
+        this.foundation.notifyChange(newValue, null);
+      }
     }
 
     if (!this.clickUpOrDown) {

package/lib/cjs/modal/useModal/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ConfirmProps } from '../confirm';
 import { ModalReactProps } from '../Modal';
 export default function useModal(): (JSX.Element | {

package/lib/cjs/notification/useNotification/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import '@douyinfe/semi-foundation/lib/cjs/notification/notification.css';
 import { NoticeProps } from '@douyinfe/semi-foundation/lib/cjs/notification/notificationFoundation';
 export default function useNotification(): (JSX.Element | {

package/lib/cjs/radio/radio.d.ts

@@ -29,13 +29,9 @@ export declare type RadioProps = {
     addonClassName?: string;
     type?: RadioType;
     'aria-label'?: React.AriaAttributes['aria-label'];
-    addonId?: string;
-    extraId?: string;
 };
 export interface RadioState {
     hover?: boolean;
-    addonId?: string;
-    extraId?: string;
 }
 export { RadioChangeEvent };
 declare class Radio extends BaseComponent<RadioProps, RadioState> {
@@ -75,7 +71,7 @@ declare class Radio extends BaseComponent<RadioProps, RadioState> {
         prefixCls?: string;
         name?: string;
         onChange?: (e: RadioChangeEvent) => void;
-        buttonSize?: "small" | "large" | "middle";
+        buttonSize?: "small" | "middle" | "large";
         isCardRadio?: boolean;
         isPureCardRadio?: boolean;
     };

package/lib/cjs/radio/radio.js

@@ -67,12 +67,16 @@ class Radio extends _baseComponent.default {
     };
 
     this.state = {
-      hover: false,
-      addonId: props.addonId,
-      extraId: props.extraId
+      hover: false
     };
     this.foundation = new _radioFoundation.default(this.adapter);
     this.radioEntity = null;
+    this.addonId = (0, _uuid.getUuidShort)({
+      prefix: 'addon'
+    });
+    this.extraId = (0, _uuid.getUuidShort)({
+      prefix: 'extra'
+    });
   }
 
   get adapter() {
@@ -81,20 +85,6 @@ class Radio extends _baseComponent.default {
         this.setState({
           hover
         });
-      },
-      setAddonId: () => {
-        this.setState({
-          addonId: (0, _uuid.getUuidShort)({
-            prefix: 'addon'
-          })
-        });
-      },
-      setExtraId: () => {
-        this.setState({
-          extraId: (0, _uuid.getUuidShort)({
-            prefix: 'extra'
-          })
-        });
       }
     });
   }
@@ -131,11 +121,7 @@ class Radio extends _baseComponent.default {
       value: propValue
     } = this.props;
     let realChecked, isDisabled, realMode, isButtonRadioGroup, isCardRadioGroup, isPureCardRadioGroup, isButtonRadioComponent, buttonSize, realPrefixCls;
-    const {
-      hover: isHover,
-      addonId,
-      extraId
-    } = this.state;
+    const isHover = this.state.hover;
     let props = {};
 
     if (this.isInGroup()) {
@@ -188,10 +174,10 @@ class Radio extends _baseComponent.default {
     const renderContent = () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children ? /*#__PURE__*/_react.default.createElement("span", {
       className: addonCls,
       style: addonStyle,
-      id: addonId
+      id: this.addonId
     }, children) : null, extra && !isButtonRadio ? /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(prefix, "-extra"),
-      id: extraId
+      id: this.extraId
     }, extra) : null);
 
     return /*#__PURE__*/_react.default.createElement("label", {
@@ -208,8 +194,8 @@ class Radio extends _baseComponent.default {
       ref: ref => {
         this.radioEntity = ref;
       },
-      addonId: children && addonId,
-      extraId: extra && extraId
+      addonId: children && this.addonId,
+      extraId: extra && this.extraId
     })), isCardRadioGroup ? /*#__PURE__*/_react.default.createElement("div", {
       className: "".concat(prefix, "-isCardRadioGroup_content")
     }, renderContent()) : renderContent());

package/lib/cjs/radio/radioGroup.d.ts

@@ -48,7 +48,7 @@ declare class RadioGroup extends BaseComponent<RadioGroupProps, RadioGroupState>
         disabled: PropTypes.Requireable<boolean>;
         name: PropTypes.Requireable<string>;
         options: PropTypes.Requireable<any[]>;
-        buttonSize: PropTypes.Requireable<"small" | "large" | "middle">;
+        buttonSize: PropTypes.Requireable<"small" | "middle" | "large">;
         type: PropTypes.Requireable<"default" | "button" | "card" | "pureCard">;
         value: PropTypes.Requireable<any>;
         onChange: PropTypes.Requireable<(...args: any[]) => any>;

package/lib/cjs/scrollList/scrollItem.js

@@ -201,7 +201,7 @@ class ScrollItem extends _baseComponent.default {
       } = this;
       const wrapperHeight = wrapper.offsetHeight;
       const itemHeight = this.getItmHeight(node);
-      const targetTop = node.offsetTop - (wrapperHeight - itemHeight) / 2;
+      const targetTop = (node.offsetTop || this.list.children.length * itemHeight / 2) - (wrapperHeight - itemHeight) / 2;
       this.scrollToPos(targetTop, duration);
     };
 

package/lib/cjs/switch/index.d.ts

@@ -26,6 +26,7 @@ export interface SwitchProps {
 export interface SwitchState {
     nativeControlChecked: boolean;
     nativeControlDisabled: boolean;
+    focusVisible: boolean;
 }
 declare class Switch extends BaseComponent<SwitchProps, SwitchState> {
     static propTypes: {
@@ -55,6 +56,8 @@ declare class Switch extends BaseComponent<SwitchProps, SwitchState> {
     componentDidUpdate(prevProps: SwitchProps): void;
     componentWillUnmount(): void;
     get adapter(): SwitchAdapter<SwitchProps, SwitchState>;
+    handleFocusVisible: (event: React.FocusEvent) => void;
+    handleBlur: (event: React.FocusEvent) => void;
     render(): JSX.Element;
 }
 export default Switch;