@douyinfe/semi-ui 2.14.0 → 2.15.0-beta.0

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

@@ -34,12 +34,14 @@ export interface RatingProps {
     size?: 'small' | 'default' | number;
     tooltips?: string[];
     id?: string;
+    preventScroll?: boolean;
 }
 export interface RatingState {
     value: number;
     hoverValue: number;
     focused: boolean;
     clearedValue: number;
+    emptyStarFocusVisible: boolean;
 }
 export default class Rating extends BaseComponent<RatingProps, RatingState> {
     static contextType: React.Context<import("../configProvider/context").ContextValue>;
@@ -70,6 +72,7 @@ export default class Rating extends BaseComponent<RatingProps, RatingState> {
         size: PropTypes.Requireable<number | "default" | "small">;
         tooltips: PropTypes.Requireable<string[]>;
         id: PropTypes.Requireable<string>;
+        preventScroll: PropTypes.Requireable<boolean>;
     };
     static defaultProps: {
         defaultValue: number;
@@ -101,5 +104,9 @@ export default class Rating extends BaseComponent<RatingProps, RatingState> {
     blur: () => void;
     saveRef: (index: number) => (node: Item) => void;
     saveRate: (node: HTMLUListElement) => void;
+    handleStarFocusVisible: (event: React.FocusEvent) => void;
+    handleStarBlur: (event: React.FocusEvent) => void;
+    getAriaLabelPrefix: () => string;
+    getItemList: (ariaLabelPrefix: string) => JSX.Element[];
     render(): JSX.Element;
 }

package/lib/cjs/rating/index.js

@@ -10,14 +10,14 @@ _Object$defineProperty(exports, "__esModule", {
 
 exports.default = void 0;
 
-var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
-
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
 
 var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/keys"));
 
 var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
 
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _reactDom = _interopRequireDefault(require("react-dom"));
@@ -26,7 +26,7 @@ var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _context4 = _interopRequireDefault(require("../configProvider/context"));
+var _context7 = _interopRequireDefault(require("../configProvider/context"));
 
 var _constants = require("@douyinfe/semi-foundation/lib/cjs/rating/constants");
 
@@ -76,11 +76,14 @@ class Rating extends _baseComponent.default {
 
     this.focus = () => {
       const {
-        disabled
+        disabled,
+        preventScroll
       } = this.props;
 
       if (!disabled) {
-        this.rate.focus();
+        this.rate.focus({
+          preventScroll
+        });
       }
     };
 
@@ -102,13 +105,95 @@ class Rating extends _baseComponent.default {
       this.rate = node;
     };
 
+    this.handleStarFocusVisible = event => {
+      this.foundation.handleStarFocusVisible(event);
+    };
+
+    this.handleStarBlur = event => {
+      this.foundation.handleStarBlur(event);
+    };
+
+    this.getAriaLabelPrefix = () => {
+      if (this.props['aria-label']) {
+        return this.props['aria-label'];
+      }
+
+      let prefix = 'star';
+      const {
+        character
+      } = this.props;
+
+      if (typeof character === 'string') {
+        prefix = character;
+      }
+
+      return prefix;
+    };
+
+    this.getItemList = ariaLabelPrefix => {
+      var _context, _context2;
+
+      const {
+        count,
+        allowHalf,
+        prefixCls,
+        disabled,
+        character,
+        size,
+        tooltips
+      } = this.props;
+      const {
+        value,
+        hoverValue,
+        focused
+      } = this.state; // index == count is for Empty rating
+
+      const itemList = (0, _map.default)(_context = [...(0, _keys.default)(_context2 = Array(count + 1)).call(_context2)]).call(_context, ind => {
+        const content = /*#__PURE__*/_react.default.createElement(_item.default, {
+          ref: this.saveRef(ind),
+          index: ind,
+          count: count,
+          prefixCls: "".concat(prefixCls, "-star"),
+          allowHalf: allowHalf,
+          value: hoverValue === undefined ? value : hoverValue,
+          onClick: disabled ? _function.noop : this.onClick,
+          onHover: disabled ? _function.noop : this.onHover,
+          key: ind,
+          disabled: disabled,
+          character: character,
+          focused: focused,
+          size: ind === count ? 0 : size,
+          ariaLabelPrefix: ariaLabelPrefix,
+          onFocus: disabled || count !== ind ? _function.noop : this.handleStarFocusVisible,
+          onBlur: disabled || count !== ind ? _function.noop : this.handleStarBlur
+        });
+
+        if (tooltips) {
+          var _context3;
+
+          const text = tooltips[ind] ? tooltips[ind] : '';
+          const showTips = hoverValue - 1 === ind;
+          return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+            visible: showTips,
+            trigger: "custom",
+            content: text,
+            key: (0, _concat.default)(_context3 = "".concat(ind, "-")).call(_context3, showTips)
+          }, content);
+        }
+
+        return content;
+      });
+      return itemList;
+    };
+
     const value = props.value === undefined ? props.defaultValue : props.value;
     this.stars = {};
     this.state = {
       value,
       focused: false,
       hoverValue: undefined,
-      clearedValue: null
+      clearedValue: null,
+      emptyStarFocusVisible: false
     };
     this.foundation = new _foundation.default(this.adapter);
   }
@@ -127,11 +212,16 @@ class Rating extends _baseComponent.default {
     return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
       focus: () => {
         const {
-          disabled
+          disabled,
+          count
         } = this.props;
+        const {
+          value
+        } = this.state;
 
         if (!disabled) {
-          this.rate.focus();
+          const index = Math.ceil(value) - 1;
+          this.stars[index < 0 ? count : index].starFocus();
         }
       },
       getStarDOM: index => {
@@ -193,6 +283,11 @@ class Rating extends _baseComponent.default {
           focused: false
         });
         onKeyDown && onKeyDown(e);
+      },
+      setEmptyStarFocusVisible: focusVisible => {
+        this.setState({
+          emptyStarFocusVisible: focusVisible
+        });
       }
     });
   }
@@ -206,81 +301,52 @@ class Rating extends _baseComponent.default {
   }
 
   render() {
-    var _context, _context2;
+    var _context4, _context5, _context6;
 
     const {
-      count,
-      allowHalf,
       style,
       prefixCls,
       disabled,
       className,
-      character,
-      tabIndex,
-      size,
-      tooltips,
-      id
+      id,
+      count,
+      tabIndex
     } = this.props;
     const {
       value,
-      hoverValue,
-      focused
+      emptyStarFocusVisible
     } = this.state;
-    const itemList = (0, _map.default)(_context = [...(0, _keys.default)(_context2 = Array(count)).call(_context2)]).call(_context, ind => {
-      const content = /*#__PURE__*/_react.default.createElement(_item.default, {
-        ref: this.saveRef(ind),
-        index: ind,
-        count: count,
-        prefixCls: "".concat(prefixCls, "-star"),
-        allowHalf: allowHalf,
-        value: hoverValue === undefined ? value : hoverValue,
-        onClick: this.onClick,
-        onHover: this.onHover,
-        key: ind,
-        disabled: disabled,
-        character: character,
-        focused: focused,
-        size: size
-      });
-
-      if (tooltips) {
-        var _context3;
-
-        const text = tooltips[ind] ? tooltips[ind] : '';
-        const showTips = hoverValue - 1 === ind;
-        return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
-          visible: showTips,
-          trigger: "custom",
-          content: text,
-          key: (0, _concat.default)(_context3 = "".concat(ind, "-")).call(_context3, showTips)
-        }, content);
-      }
-
-      return content;
-    });
+    const ariaLabelPrefix = this.getAriaLabelPrefix();
+    const ariaLabel = (0, _concat.default)(_context4 = (0, _concat.default)(_context5 = (0, _concat.default)(_context6 = "Rating: ".concat(value, " of ")).call(_context6, count, " ")).call(_context5, ariaLabelPrefix)).call(_context4, value === 1 ? '' : 's', ",");
+    const itemList = this.getItemList(ariaLabelPrefix);
     const listCls = (0, _classnames.default)(prefixCls, {
-      ["".concat(prefixCls, "-disabled")]: disabled
+      ["".concat(prefixCls, "-disabled")]: disabled,
+      ["".concat(prefixCls, "-focus")]: emptyStarFocusVisible
     }, className);
-    return /*#__PURE__*/_react.default.createElement("ul", {
-      "aria-label": this.props['aria-label'],
-      "aria-labelledby": this.props['aria-labelledby'],
-      "aria-describedby": this.props['aria-describedby'],
-      className: listCls,
-      style: style,
-      onMouseLeave: disabled ? null : this.onMouseLeave,
-      tabIndex: disabled ? -1 : tabIndex,
-      onFocus: disabled ? null : this.onFocus,
-      onBlur: disabled ? null : this.onBlur,
-      onKeyDown: disabled ? null : this.onKeyDown,
-      ref: this.saveRate,
-      id: id
-    }, itemList);
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+      _react.default.createElement("ul", {
+        "aria-label": ariaLabel,
+        "aria-labelledby": this.props['aria-labelledby'],
+        "aria-describedby": this.props['aria-describedby'],
+        className: listCls,
+        style: style,
+        onMouseLeave: disabled ? _function.noop : this.onMouseLeave,
+        tabIndex: disabled ? -1 : tabIndex,
+        onFocus: disabled ? _function.noop : this.onFocus,
+        onBlur: disabled ? _function.noop : this.onBlur,
+        onKeyDown: disabled ? _function.noop : this.onKeyDown,
+        ref: this.saveRate,
+        id: id
+      }, itemList)
+    );
   }
 
 }
 
 exports.default = Rating;
-Rating.contextType = _context4.default;
+Rating.contextType = _context7.default;
 Rating.propTypes = {
   'aria-describedby': _propTypes.default.string,
   'aria-errormessage': _propTypes.default.string,
@@ -307,7 +373,8 @@ Rating.propTypes = {
   autoFocus: _propTypes.default.bool,
   size: _propTypes.default.oneOfType([_propTypes.default.oneOf(_constants.strings.SIZE_SET), _propTypes.default.number]),
   tooltips: _propTypes.default.arrayOf(_propTypes.default.string),
-  id: _propTypes.default.string
+  id: _propTypes.default.string,
+  preventScroll: _propTypes.default.bool
 };
 Rating.defaultProps = {
   defaultValue: 0,
@@ -318,6 +385,6 @@ Rating.defaultProps = {
   prefixCls: _constants.cssClasses.PREFIX,
   onChange: _function.noop,
   onHoverChange: _function.noop,
-  tabIndex: 0,
+  tabIndex: -1,
   size: 'default'
 };

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

@@ -1,9 +1,11 @@
-import React, { PureComponent } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { strings } from '@douyinfe/semi-foundation/lib/cjs/rating/constants';
 import '@douyinfe/semi-foundation/lib/cjs/rating/rating.css';
+import { RatingItemFoundation, RatingItemAdapter } from '@douyinfe/semi-foundation/lib/cjs/rating/foundation';
+import BaseComponent, { BaseProps } from '../_base/baseComponent';
 declare type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
-export interface RatingItemProps {
+export interface RatingItemProps extends BaseProps {
     value: number;
     index: number;
     prefixCls: string;
@@ -14,10 +16,18 @@ export interface RatingItemProps {
     focused: boolean;
     disabled: boolean;
     count: number;
+    ariaLabelPrefix: string;
     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 default class Item extends PureComponent<RatingItemProps> {
+export interface RatingItemState {
+    firstStarFocus: boolean;
+    secondStarFocus: boolean;
+}
+export default class Item extends BaseComponent<RatingItemProps, RatingItemState> {
     static propTypes: {
         value: PropTypes.Requireable<number>;
         index: PropTypes.Requireable<number>;
@@ -29,12 +39,26 @@ export default class Item extends PureComponent<RatingItemProps> {
         focused: PropTypes.Requireable<boolean>;
         disabled: PropTypes.Requireable<boolean>;
         count: PropTypes.Requireable<number>;
+        ariaLabelPrefix: PropTypes.Requireable<string>;
         size: PropTypes.Requireable<number | "default" | "small">;
         'aria-describedby': PropTypes.Requireable<string>;
+        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
+        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
+        preventScroll: PropTypes.Requireable<boolean>;
     };
+    foundation: RatingItemFoundation;
+    constructor(props: RatingItemProps);
+    get adapter(): RatingItemAdapter<RatingItemProps, RatingItemState>;
+    firstStar: HTMLDivElement;
+    secondStar: HTMLDivElement;
     onHover: React.MouseEventHandler;
     onClick: React.MouseEventHandler;
+    onFocus: (e: any, star: any) => void;
+    onBlur: (e: any, star: any) => void;
     onKeyDown: React.KeyboardEventHandler;
+    starFocus: () => void;
+    saveFirstStar: (node: HTMLDivElement) => void;
+    saveSecondStar: (node: HTMLDivElement) => void;
     render(): JSX.Element;
 }
 export {};

package/lib/cjs/rating/item.js

@@ -1,11 +1,7 @@
 "use strict";
 
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
 
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
 
 _Object$defineProperty(exports, "__esModule", {
@@ -14,11 +10,11 @@ _Object$defineProperty(exports, "__esModule", {
 
 exports.default = void 0;
 
-var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
-
 var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
 
-var _react = _interopRequireWildcard(require("react"));
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+
+var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
@@ -30,13 +26,15 @@ require("@douyinfe/semi-foundation/lib/cjs/rating/rating.css");
 
 var _semiIcons = require("@douyinfe/semi-icons");
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+var _foundation = require("@douyinfe/semi-foundation/lib/cjs/rating/foundation");
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var _baseComponent = _interopRequireDefault(require("../_base/baseComponent"));
 
-class Item extends _react.PureComponent {
-  constructor() {
-    super(...arguments);
+class Item extends _baseComponent.default {
+  constructor(props) {
+    super(props);
+    this.firstStar = null;
+    this.secondStar = null;
 
     this.onHover = e => {
       const {
@@ -54,6 +52,22 @@ class Item extends _react.PureComponent {
       onClick(e, index);
     };
 
+    this.onFocus = (e, star) => {
+      const {
+        onFocus
+      } = this.props;
+      onFocus && onFocus(e);
+      this.foundation.handleFocusVisible(e, star);
+    };
+
+    this.onBlur = (e, star) => {
+      const {
+        onBlur
+      } = this.props;
+      onBlur && onBlur(e);
+      this.foundation.handleBlur(e, star);
+    };
+
     this.onKeyDown = e => {
       const {
         onClick,
@@ -64,10 +78,57 @@ class Item extends _react.PureComponent {
         onClick(e, index);
       }
     };
+
+    this.starFocus = () => {
+      const {
+        value,
+        index,
+        preventScroll
+      } = this.props;
+
+      if (value - index === 0.5) {
+        this.firstStar.focus({
+          preventScroll
+        });
+      } else {
+        this.secondStar.focus({
+          preventScroll
+        });
+      }
+    };
+
+    this.saveFirstStar = node => {
+      this.firstStar = node;
+    };
+
+    this.saveSecondStar = node => {
+      this.secondStar = node;
+    };
+
+    this.state = {
+      firstStarFocus: false,
+      secondStarFocus: false
+    };
+    this.foundation = new _foundation.RatingItemFoundation(this.adapter);
+  }
+
+  get adapter() {
+    return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
+      setFirstStarFocus: value => {
+        this.setState({
+          firstStarFocus: value
+        });
+      },
+      setSecondStarFocus: value => {
+        this.setState({
+          secondStarFocus: value
+        });
+      }
+    });
   }
 
   render() {
-    var _context;
+    var _context, _context2, _context3, _context4;
 
     const {
       index,
@@ -78,18 +139,21 @@ class Item extends _react.PureComponent {
       disabled,
       allowHalf,
       focused,
-      size
+      size,
+      ariaLabelPrefix
     } = this.props;
+    const {
+      firstStarFocus,
+      secondStarFocus
+    } = this.state;
     const starValue = index + 1;
-    const diff = starValue - value;
-    const isFocused = value === 0 && index === 0 && focused; // 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 = isHalf ? 1 - diff : 0.5;
+    const firstWidth = 1 - diff;
     const isFull = starValue <= value;
     const isCustomSize = typeof size === 'number';
     const starCls = (0, _classnames.default)(prefixCls, {
-      ["".concat(prefixCls, "-focused")]: isFocused,
       ["".concat(prefixCls, "-half")]: isHalf,
       ["".concat(prefixCls, "-full")]: isFull,
       [(0, _concat.default)(_context = "".concat(prefixCls, "-")).call(_context, size)]: !isCustomSize
@@ -101,34 +165,73 @@ class Item extends _react.PureComponent {
     } : {};
     const iconSize = isCustomSize ? 'inherit' : size === 'small' ? 'default' : 'extra-large';
     const content = character ? character : /*#__PURE__*/_react.default.createElement(_semiIcons.IconStar, {
-      size: iconSize
+      size: iconSize,
+      style: {
+        display: 'block'
+      }
     });
-    return /*#__PURE__*/_react.default.createElement("li", {
-      className: starCls,
-      style: (0, _assign.default)({}, sizeStyle)
-    }, /*#__PURE__*/_react.default.createElement("div", {
+    const isEmpty = index === count;
+    const starWrapCls = (0, _classnames.default)("".concat(prefixCls, "-wrapper"), {
+      ["".concat(prefixCls, "-disabled")]: disabled,
+      ["".concat(_constants.cssClasses.PREFIX, "-focus")]: (firstStarFocus || secondStarFocus) && value !== 0
+    });
+    const starWrapProps = {
       onClick: disabled ? null : this.onClick,
       onKeyDown: disabled ? null : this.onKeyDown,
       onMouseMove: disabled ? null : this.onHover,
+      className: starWrapCls
+    };
+    const AriaSetSize = allowHalf ? count * 2 + 1 : count + 1;
+    const firstStarProps = {
+      ref: this.saveFirstStar,
       role: "radio",
-      "aria-checked": value > index ? 'true' : 'false',
-      "aria-posinset": index + 1,
-      "aria-setsize": count,
-      "aria-disabled": disabled,
-      "aria-label": "Rating ".concat(index + (isHalf ? 0.5 : 1)),
-      "aria-labelledby": this.props['aria-describedby'],
-      "aria-describedby": this.props['aria-describedby'],
-      tabIndex: 0,
-      className: "".concat(prefixCls, "-wrapper")
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(prefixCls, "-first"),
+      'aria-checked': value === index + 0.5,
+      'aria-posinset': 2 * index + 1,
+      'aria-setsize': AriaSetSize,
+      'aria-disabled': disabled,
+      'aria-label': (0, _concat.default)(_context2 = "".concat(index + 0.5, " ")).call(_context2, ariaLabelPrefix, "s"),
+      'aria-labelledby': this.props['aria-describedby'],
+      'aria-describedby': this.props['aria-describedby'],
+      className: (0, _classnames.default)("".concat(prefixCls, "-first"), "".concat(_constants.cssClasses.PREFIX, "-no-focus")),
+      tabIndex: !disabled && value === index + 0.5 ? 0 : -1,
+      onFocus: e => {
+        this.onFocus(e, 'first');
+      },
+      onBlur: e => {
+        this.onBlur(e, 'first');
+      }
+    };
+    const secondStarTabIndex = !disabled && (value === index + 1 || isEmpty && value === 0) ? 0 : -1;
+    const secondStarProps = {
+      ref: this.saveSecondStar,
+      role: "radio",
+      'aria-checked': isEmpty ? value === 0 : value === index + 1,
+      'aria-posinset': allowHalf ? 2 * (index + 1) : index + 1,
+      'aria-setsize': AriaSetSize,
+      'aria-disabled': disabled,
+      'aria-label': (0, _concat.default)(_context3 = (0, _concat.default)(_context4 = "".concat(isEmpty ? 0 : index + 1, " ")).call(_context4, ariaLabelPrefix)).call(_context3, index === 0 ? '' : 's'),
+      'aria-labelledby': this.props['aria-describedby'],
+      'aria-describedby': this.props['aria-describedby'],
+      className: (0, _classnames.default)("".concat(prefixCls, "-second"), "".concat(_constants.cssClasses.PREFIX, "-no-focus")),
+      tabIndex: secondStarTabIndex,
+      onFocus: e => {
+        this.onFocus(e, 'second');
+      },
+      onBlur: e => {
+        this.onBlur(e, 'second');
+      }
+    };
+    return /*#__PURE__*/_react.default.createElement("li", {
+      className: starCls,
+      style: (0, _assign.default)({}, sizeStyle),
+      key: index
+    }, /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, starWrapProps), allowHalf && !isEmpty && /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, firstStarProps, {
       style: {
         width: "".concat(firstWidth * 100, "%")
       }
-    }, content), /*#__PURE__*/_react.default.createElement("div", {
-      className: "".concat(prefixCls, "-second"),
+    }), content), /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, secondStarProps, {
       "x-semi-prop": "character"
-    }, content)));
+    }), content)));
   }
 
 }
@@ -145,6 +248,10 @@ Item.propTypes = {
   focused: _propTypes.default.bool,
   disabled: _propTypes.default.bool,
   count: _propTypes.default.number,
+  ariaLabelPrefix: _propTypes.default.string,
   size: _propTypes.default.oneOfType([_propTypes.default.oneOf(_constants.strings.SIZE_SET), _propTypes.default.number]),
-  'aria-describedby': _propTypes.default.string
+  'aria-describedby': _propTypes.default.string,
+  onFocus: _propTypes.default.func,
+  onBlur: _propTypes.default.func,
+  preventScroll: _propTypes.default.bool
 };

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

@@ -122,6 +122,7 @@ export declare type SelectProps = {
     onBlur?: (e: React.FocusEvent) => void;
     onListScroll?: (e: React.UIEvent<HTMLDivElement>) => void;
     children?: React.ReactNode;
+    preventScroll?: boolean;
 } & Pick<TooltipProps, 'spacing' | 'getPopupContainer' | 'motion' | 'autoAdjustOverflow' | 'mouseLeaveDelay' | 'mouseEnterDelay' | 'stopPropagation'> & React.RefAttributes<any>;
 export interface SelectState {
     isOpen: boolean;
@@ -214,6 +215,7 @@ declare class Select extends BaseComponent<SelectProps, SelectState> {
         renderOptionItem: PropTypes.Requireable<(...args: any[]) => any>;
         onListScroll: PropTypes.Requireable<(...args: any[]) => any>;
         arrowIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        preventScroll: PropTypes.Requireable<boolean>;
     };
     static defaultProps: Partial<SelectProps>;
     inputRef: React.RefObject<HTMLInputElement>;