@douyinfe/semi-foundation 2.1.1 → 2.1.5

package/lib/cjs/radio/rtl.scss

@@ -0,0 +1,78 @@
+$module: #{$prefix}-radio;
+$inner-width: $width-icon-medium;
+
+.#{$prefix}-rtl,
+.#{$prefix}-portal-rtl {
+    .#{$module} {
+        direction: rtl;
+
+        input[type="checkbox"],
+        input[type="radio"] {
+            left: auto;
+            right: 0;
+        }
+
+        &-buttonRadioGroup {
+            &:not(:last-child) {
+                padding-left: $spacing-radio_buttonRadioGroup-paddingRight;
+            }
+        }
+
+        &-inner {
+            left: auto;
+            right: 0;
+
+            &-display {
+                left: auto;
+                right: 0;
+            }
+        }
+
+        &-addon {
+            padding-left: 0;
+            margin-left: 0;
+            padding-right: $spacing-radio_addon-paddingLeft;
+            margin-right: $spacing-radio_addon-marginLeft;
+            
+            &-buttonRadio {
+                margin-right: $spacing-none;
+            }
+        }
+
+        &-extra {
+            padding-left: 0;
+            padding-right: $spacing-radio_extra-paddingLeft;
+        }
+    }
+
+    &-isCardRadioGroup {
+        .#{$module}-inner {
+            margin-right: 0;
+            margin-left: $spacing-radio_cardRadioGroup_inner-marginRight;
+        }
+
+        .#{$module}-addon {
+            margin-right: 0;
+            padding-right: 0;
+        }
+
+        .#{$module}-extra {
+            padding-right: 0;
+        }
+    }
+
+    .#{$module}Group {
+        direction: rtl;
+
+        &-horizontal {
+            .#{$module} {
+                margin-right: 0;
+                margin-left: $spacing-radio_group_horizontal-marginRight;
+
+                &:last-of-type {
+                    margin-left: 0;
+                }
+            }
+        }
+    }
+}

package/lib/cjs/radio/variables.scss

@@ -0,0 +1,101 @@
+$color-radio_default-border-default: var(--semi-color-text-3); // 默认态描边颜色
+$color-radio_default-bg-default: transparent; // 默认态背景颜色
+$color-radio_default-bg-hover: var(--semi-color-fill-0); // 悬浮态背景颜色
+$color-radio_default-bg-active: var(--semi-color-fill-1); // 按下态背景颜色
+$color-radio_default-border-hover: var(--semi-color-focus-border); // 悬浮态描边颜色
+$color-radio_checked-border-hover: var(--semi-color-primary-hover); // 选中时悬浮态描边颜色
+$color-radio_checked-border-active: var(--semi-color-primary-active); // 选中时按下态描边颜色
+
+$color-radio_default-text-default: var(--semi-color-text-0); // 选项文本颜色
+$color-radio_extra-text-default: var(--semi-color-text-2); // 辅助文本颜色
+
+$color-radio_primary-bg-hover: var(--semi-color-primary-hover); // 选中项悬浮态背景颜色
+$color-radio_primary-bg-active: var(--semi-color-primary-active); // 选中项按下态背景颜色
+$color-radio_primary-border-default: var(--semi-color-primary); // 选中项描边颜色
+$color-radio_primary-bg-default: var(--semi-color-primary); // 选中项背景颜色
+$color-radio_primary-text-default: white; // 选中项原点颜色
+
+$color-radio_checked-bg-disabled: var(--semi-color-primary-disabled); // 选中项禁用态背景颜色
+$color-radio_default-border-disabled: var(--semi-color-border); // 禁用态描边颜色
+$color-radio_checked-border-disabled: var(--semi-color-primary-disabled); // 选中项禁用态描边颜色
+
+$color-radio_disabled-bg-default: var(--semi-color-disabled-fill); // 禁用态背景颜色
+$color-radio_disabled-bg-hover: transparent;
+$color-radio_disabled-text-default: var(--semi-color-disabled-text); // 禁用态文本颜色
+$color-radio_disabled-border-default: var(--semi-color-border); // 禁用态描边颜色
+
+$color-radio_buttonRadio-text-default: var(--semi-color-text-1); // 按钮样式单选文本颜色
+$color-radio_buttonRadio-bg-default: var(--semi-color-fill-0); // 按钮样式单选背景颜色
+$color-radio_buttonRadio-text-checked-hover: var(--semi-color-primary); // 按钮样式单选选中项文本颜色
+$color-radio_buttonRadio-text-disabled: var(--semi-color-disabled-text); // 按钮样式单选禁用态文本颜色
+
+$color-radio_addon_buttonRadio-bg-hover: var(--semi-color-fill-1); // 按钮样式单选悬浮态背景色
+$color-radio_addon_buttonRadio-text-checked: var(--semi-color-primary); // 按钮样式单选选中项文字颜色
+$color-radio_addon_buttonRadio-bg-checked: var(--semi-color-bg-3); // 按钮样式单选选中项背景颜色
+$color-radio_cardRadioGroup-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中态背景色
+$color-radio_cardRadioGroup_disabled-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中且禁用时的背景色
+$color-radio_cardRadioGroup-bg-hover: var(--semi-color-fill-0); // 卡片样式单选悬浮态背景色
+$color-radio_cardRadioGroup-bg-active: var(--semi-color-fill-1); // 卡片样式单选按下态背景色
+$color-radio_cardRadioGroup_border-active: var(--semi-color-primary); // 卡片样式单选选中态描边颜色
+$color-radio_cardRadioGroup_checked_border-active: var(--semi-color-primary-active); // 卡片样式单选选中态描边颜色 - 按下态
+$color-radio_cardRadioGroup_checked_border-hover: var(--semi-color-primary-hover); // 卡片样式单选选中态描边颜色 - 悬浮态
+$color-radio_cardRadioGroup_border_disabled-active: var(--semi-color-primary-disabled); // 卡片样式单选选中且禁用时的描边颜色
+$color-radio_cardRadioGroup_addon-text-default: var(--semi-color-text-0); // 卡片样式单选标题文字颜色
+$color-radio_cardRadioGroup_extra-text-default: var(--semi-color-text-2); // 卡片样式单选辅助文字颜色
+$color-radio_cardRadioGroup_checked_disabled-border-default: var(--semi-color-primary-disabled); // 卡片样式选中项禁用态描边颜色 - 默认态
+$color-radio_cardRadioGroup_checked_disabled-border-hover:  var(--semi-color-primary-disabled); // 卡片样式选中项禁用态描边颜色 - 悬浮态
+$color-radio_card-bg-hover: var(--semi-color-white); // 单选圆点颜色
+$color-radio_card-bg-active: var(--semi-color-white); // 单选圆点颜色 - 按下态
+$color-radio_card-bg-default: var(--semi-color-white); // 单选圆点颜色 - 悬浮态
+
+$radius-radio_cardRadioGroup: var(--semi-border-radius-small); // 卡片式单选圆角大小
+$radius-radio_addon_buttonRadio: var(--semi-border-radius-small); // 按钮式单选圆点圆角大小
+$radius-radio_buttonRadio: var(--semi-border-radius-small); // 按钮式单选圆角大小
+
+$width-radio_cardRadioGroup_checked-border: 1px; // 卡片式单选描边宽度
+$width-radio_cardRadioGroup_checked_disabled-border: 1px; // 卡片式单选选中且禁用时的描边宽度
+$width-radio_hover-border: $border-thickness-control; // 描边宽度 - 悬浮态
+$width-radio_disabled-border: $border-thickness-control; // 描边宽度 - 禁用态
+$width-radio_innder-border: $border-thickness-control; // 描边宽度 - 禁用态
+
+$height-radio_inner_min: 20px; // 单选按钮高度
+$width-radio_inner: $width-icon-medium; // 单选按钮宽度
+$spacing-radio_addon-paddingLeft: $spacing-tight; //单选标题到单选按钮左侧边距
+$spacing-radio_addon-marginLeft: $width-radio_inner; //单选标题左侧整体外边距
+$spacing-radio_addon_buttonRadio_large-paddingX: $spacing-loose; // 大尺寸按钮式单选按钮水平内边距
+$spacing-radio_addon_buttonRadio_large-paddingY: $spacing-base-tight / 2; // 大尺寸按钮式单选按钮垂直内边距
+$spacing-radio_addon_buttonRadio_small-paddingX: $spacing-base; // 小尺寸按钮式单选按钮水平内边距
+$spacing-radio_addon_buttonRadio_small-paddingY: $spacing-super-tight; // 中尺寸按钮式单选按钮垂直内边距
+$spacing-radio_addon_buttonRadio_middle-paddingX: $spacing-base; // 中尺寸按钮式单选按钮水平内边距
+$spacing-radio_addon_buttonRadio_middle-paddingY: $spacing-extra-tight; // 中尺寸按钮式单选按钮垂直内边距
+$spacing-radio_addon_buttonRadio_marginLeft: $spacing-none; // 按钮式单选按钮左侧外边距
+$spacing-radio_extra-paddingLeft: $width-radio_inner + $spacing-tight; // 单选副标题左侧内边距
+
+$spacing-radio_group_vertical-marginBottom: $spacing-base-tight; // 垂直布局单选框组底部外边距
+$spacing-radio_card_group_vertical-marginBottom: $spacing-base; // 垂直布局卡片式单选框组底部外边距
+$spacing-radio_group_horizontal-marginRight: $spacing-base; // 水平单选框组右侧外边距
+$spacing-radio_buttonRadio-padding: $spacing-extra-tight; // 按钮式单选内边距
+$spacing-radio_buttonRadioGroup_small-paddingX: $spacing-super-tight; // 小尺寸按钮式单选组水平内边距
+$spacing-radio_buttonRadioGroup_small-paddingY: $spacing-extra-tight; // 小尺寸按钮式单选组垂直内边距
+$spacing-radio_buttonRadioGroup_middle-padding: $spacing-extra-tight; // 中尺寸按钮式单选组内边距
+$spacing-radio_buttonRadioGroup_large-padding: $spacing-extra-tight; // 大尺寸按钮式单选组内边距
+$spacing-radio_buttonRadioGroup-paddingRight: $spacing-none; // 中尺寸按钮式单选组右侧内边距
+$spacing-radio_cardRadioGroup-paddingX: $spacing-base; // 卡片式单选组水平内边距
+$spacing-radio_cardRadioGroup-paddingY: $spacing-base-tight; // 卡片式单选组垂直内边距
+$spacing-radio_cardRadioGroup_inner-marginRight: $spacing-tight; // 卡片式单选按钮右侧外边距
+
+$font-radio_buttonRadio_large-default-size: $font-size-regular; // 大尺寸按钮式单选标题字体大小
+$font-radio_buttonRadio_small-default-size: $font-size-small; // 中尺寸按钮式单选标题字体大小
+$font-radio_buttonRadio_middle-default-size: $font-size-small; // 小尺寸按钮式单选标题字体大小
+$font-radio_buttonRadio-default-fontWeight: $font-weight-bold; // 按钮式单选标题字重 - 默认态
+$font-radio_buttonRadio-hover-fontWeight: $font-weight-bold; // 按钮式单选标题字重 - 悬浮态
+$font-radio_buttonRadio-checked-fontWeight: $font-weight-bold; // 按钮式单选标题字重 - 选中态
+$font-radio_buttonRadioGroup_small-lineHeight: 16px; // 小尺寸按钮式单选标题行高
+$font-radio_buttonRadioGroup_middle-lineHeight: 16px; // 中尺寸按钮式单选标题行高
+$font-radio_buttonRadioGroup_large-lineHeight: 20px; // 大尺寸按钮式单选标题行高
+$font-radio_cardRadioGroup_addon-size: $font-size-regular; // 卡片式单选组标题字体大小
+$font-radio_cardRadioGroup_addon-fontWeight: $font-weight-bold; // 卡片式单选组标题字体大小
+$font-radio_cardRadioGroup_addon-lineHeight: 20px; // 卡片式单选组标题行高
+$font-radio_cardRadioGroup_extra-size: $font-size-regular; // 卡片式单选组副标题字体大小
+$font-radio_cardRadioGroup_extra-fontWeight: normal; // 卡片式单选组副标题字重
+$font-radio_cardRadioGroup_extra-lineHeight: 20px; // 卡片式单选组副标题行高

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

@@ -0,0 +1,7 @@
+declare const cssClasses: {
+    PREFIX: string;
+};
+declare const strings: {
+    readonly SIZE_SET: readonly ["default", "small"];
+};
+export { cssClasses, strings };

package/lib/cjs/rating/constants.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.strings = exports.cssClasses = void 0;
+
+var _constants = require("../base/constants");
+
+const cssClasses = {
+  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-rating")
+};
+exports.cssClasses = cssClasses;
+const strings = {
+  SIZE_SET: ['default', 'small']
+};
+exports.strings = strings;

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

@@ -0,0 +1,28 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+export interface RatingAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
+    focus: () => void;
+    getStarDOM: (index: number) => Element;
+    notifyHoverChange: (hoverValue: number, clearedValue: number) => void;
+    updateValue: (value: number) => void;
+    clearValue: (clearedValue: number) => void;
+    notifyFocus: (e: any) => void;
+    notifyBlur: (e: any) => void;
+    notifyKeyDown: (e: any) => void;
+}
+export default class RatingFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<RatingAdapter<P, S>, P, S> {
+    constructor(adapter: RatingAdapter<P, S>);
+    init(): void;
+    _getScroll(w: Window, top?: boolean): number;
+    _getClientPosition(elem: Element): {
+        left: any;
+        top: any;
+    };
+    _getOffsetLeft(el: Element): any;
+    getStarValue(index: number, pos: number): number;
+    handleHover(event: any, index: number): void;
+    handleMouseLeave(): void;
+    handleClick(event: any, index: number): void;
+    handleFocus(e: any): void;
+    handleBlur(e: any): void;
+    handleKeyDown(event: any, value: number): void;
+}

package/lib/cjs/rating/foundation.js

@@ -0,0 +1,202 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
+var _foundation = _interopRequireDefault(require("../base/foundation"));
+
+/* eslint-disable no-param-reassign */
+const KeyCode = {
+  LEFT: 37,
+  RIGHT: 39
+};
+
+class RatingFoundation extends _foundation.default {
+  constructor(adapter) {
+    super((0, _assign.default)((0, _assign.default)({}, RatingFoundation.defaultAdapter), adapter));
+  }
+
+  init() {
+    const {
+      autoFocus,
+      disabled
+    } = this.getProps();
+
+    if (autoFocus && !disabled) {
+      this._adapter.focus();
+    }
+  }
+
+  _getScroll(w, top) {
+    let ret = top ? w.pageYOffset : w.pageXOffset;
+    const method = top ? 'scrollTop' : 'scrollLeft';
+
+    if (typeof ret !== 'number') {
+      const d = w.document; // ie6,7,8 standard mode
+
+      ret = d.documentElement[method];
+
+      if (typeof ret !== 'number') {
+        // quirks mode
+        ret = d.body[method];
+      }
+    }
+
+    return ret;
+  }
+
+  _getClientPosition(elem) {
+    let x, y;
+    const doc = elem.ownerDocument;
+    const {
+      body
+    } = doc;
+    const docElem = doc && doc.documentElement;
+    const box = elem.getBoundingClientRect();
+    x = box.left;
+    y = box.top;
+    x -= docElem.clientLeft || body.clientLeft || 0;
+    y -= docElem.clientTop || body.clientTop || 0;
+    return {
+      left: x,
+      top: y
+    };
+  }
+
+  _getOffsetLeft(el) {
+    const pos = this._getClientPosition(el);
+
+    const doc = el.ownerDocument;
+    const w = doc.defaultView || doc.parentWindow;
+    pos.left += this._getScroll(w);
+    return pos.left;
+  }
+
+  getStarValue(index, pos) {
+    const {
+      allowHalf
+    } = this.getProps();
+
+    const direction = this._adapter.getContext('direction');
+
+    const reverse = direction === 'rtl';
+    let value = index + 1;
+
+    if (allowHalf) {
+      const starEle = this._adapter.getStarDOM(index);
+
+      const leftDis = this._getOffsetLeft(starEle);
+
+      const width = starEle.clientWidth;
+
+      if (reverse && pos - leftDis > width / 2) {
+        value -= 0.5;
+      } else if (!reverse && pos - leftDis < width / 2) {
+        value -= 0.5;
+      }
+    }
+
+    return value;
+  }
+
+  handleHover(event, index) {
+    const currValue = this.getStarValue(index, event.pageX);
+    const {
+      clearedValue,
+      hoverValue
+    } = this.getStates();
+
+    if (currValue !== hoverValue && currValue !== clearedValue) {
+      this._adapter.notifyHoverChange(currValue, null);
+    }
+  }
+
+  handleMouseLeave() {
+    this._adapter.notifyHoverChange(undefined, null);
+  }
+
+  handleClick(event, index) {
+    const {
+      allowClear
+    } = this.getProps();
+    const {
+      value
+    } = this.getStates();
+    const newValue = this.getStarValue(index, event.pageX);
+    const isReset = allowClear ? newValue === value : false;
+
+    this._adapter.updateValue(isReset ? 0 : newValue);
+
+    if (isReset) {
+      this._adapter.notifyHoverChange(undefined, newValue);
+    } else {
+      this._adapter.clearValue(null);
+    }
+  }
+
+  handleFocus(e) {
+    this._adapter.notifyFocus(e);
+  }
+
+  handleBlur(e) {
+    this._adapter.notifyBlur(e);
+  }
+
+  handleKeyDown(event, value) {
+    const {
+      keyCode
+    } = event;
+    const {
+      count,
+      allowHalf
+    } = this.getProps();
+
+    const direction = this._adapter.getContext('direction');
+
+    const reverse = direction === 'rtl';
+
+    if (keyCode === KeyCode.RIGHT && value < count && !reverse) {
+      if (allowHalf) {
+        value += 0.5;
+      } else {
+        value += 1;
+      }
+    } else if (keyCode === KeyCode.LEFT && value > 0 && !reverse) {
+      if (allowHalf) {
+        value -= 0.5;
+      } else {
+        value -= 1;
+      }
+    } else if (keyCode === KeyCode.RIGHT && value > 0 && reverse) {
+      if (allowHalf) {
+        value -= 0.5;
+      } else {
+        value -= 1;
+      }
+    } else if (keyCode === KeyCode.LEFT && value < count && reverse) {
+      if (allowHalf) {
+        value += 0.5;
+      } else {
+        value += 1;
+      }
+    }
+
+    this._adapter.updateValue(value);
+
+    event.preventDefault();
+
+    this._adapter.notifyKeyDown(event);
+  }
+
+}
+
+exports.default = RatingFoundation;

package/lib/cjs/rating/rating.css

@@ -0,0 +1,84 @@
+/* shadow */
+/* sizing */
+/* spacing */
+.semi-rating {
+  display: inline-block;
+  margin: 0px;
+  padding: 0px;
+  color: rgba(var(--semi-yellow-5), 1);
+  font-size: 20px;
+  line-height: unset;
+  list-style: none;
+  outline: none;
+}
+.semi-rating-disabled .semi-rating-star {
+  cursor: default;
+}
+.semi-rating-disabled .semi-rating-star:hover {
+  transform: scale(1);
+}
+.semi-rating-star {
+  position: relative;
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  color: inherit;
+  cursor: pointer;
+  transition: all 0.5s;
+}
+.semi-rating-star:not(:last-child) {
+  margin-right: 6px;
+}
+.semi-rating-star > div:focus {
+  outline: 0;
+}
+.semi-rating-star > div:hover, .semi-rating-star > div:focus {
+  transform: scale(1.1);
+}
+.semi-rating-star-small {
+  width: 16px;
+  height: 16px;
+  font-size: 16px;
+}
+.semi-rating-star-default {
+  width: 24px;
+  height: 24px;
+  font-size: 24px;
+}
+.semi-rating-star-wrapper {
+  position: relative;
+}
+.semi-rating-star-first, .semi-rating-star-second {
+  color: var(--semi-color-fill-0);
+  user-select: none;
+}
+.semi-rating-star-first {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 50%;
+  height: 100%;
+  overflow: hidden;
+  opacity: 0;
+}
+.semi-rating-star-half .semi-rating-star-first, .semi-rating-star-half .semi-rating-star-second {
+  opacity: 1;
+}
+.semi-rating-star-half .semi-rating-star-first, .semi-rating-star-full .semi-rating-star-second {
+  color: inherit;
+}
+
+.semi-rtl .semi-rating,
+.semi-portal-rtl .semi-rating {
+  direction: rtl;
+}
+.semi-rtl .semi-rating-star:not(:last-child),
+.semi-portal-rtl .semi-rating-star:not(:last-child) {
+  margin-right: 0;
+  margin-left: 6px;
+}
+.semi-rtl .semi-rating-star-first,
+.semi-portal-rtl .semi-rating-star-first {
+  left: auto;
+  right: 0;
+}

package/lib/cjs/rating/rating.scss

@@ -0,0 +1,91 @@
+@import "./variables.scss";
+
+$module: #{$prefix}-rating;
+
+.#{$module} {
+    display: inline-block;
+    margin: $spacing-rating-margin;
+    padding: $spacing-rating-padding;
+    color: $color-rating-icon-default;
+    font-size: $font-rating-fontSize;
+    line-height: unset;
+    list-style: none;
+    outline: none;
+
+    &-disabled &-star {
+        cursor: default;
+
+        &:hover {
+            transform: scale(1);
+        }
+    }
+
+    &-star {
+        position: relative;
+        display: inline-block;
+        margin: 0;
+        padding: 0;
+        color: inherit;
+        cursor: pointer;
+        transition: all 0.5s;
+
+        &:not(:last-child) {
+            margin-right: $spacing-rating_item-marginRight;
+        }
+
+        & > div {
+            &:focus {
+                outline: 0;
+            }
+
+            &:hover,
+            &:focus {
+                transform: scale(1.1);
+            }
+        }
+
+        &-small {
+            width: $width-rating_item_small;
+            height: $width-rating_item_small;
+            font-size: $font-rating_item_small-fontSize;
+        }
+
+        &-default {
+            width: $width-rating_item_default;
+            height: $width-rating_item_default;
+            font-size: $font-rating_item_default-fontSize;
+        }
+
+        &-wrapper {
+            position: relative;
+        }
+
+        &-first,
+        &-second {
+            color: $color-rating-bg-default;
+            user-select: none;
+        }
+
+        &-first {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 50%;
+            height: 100%;
+            overflow: hidden;
+            opacity: 0;
+        }
+
+        &-half &-first,
+        &-half &-second {
+            opacity: 1;
+        }
+
+        &-half &-first,
+        &-full &-second {
+            color: inherit;
+        }
+    }
+}
+
+@import "./rtl.scss";

package/lib/cjs/rating/rtl.scss

@@ -0,0 +1,21 @@
+$module: #{$prefix}-rating;
+
+.#{$prefix}-rtl,
+.#{$prefix}-portal-rtl {
+    .#{$module} {
+        direction: rtl;
+
+        &-star {
+
+            &:not(:last-child) {
+                margin-right: 0;
+                margin-left: $spacing-rating_item-marginRight;
+            }
+
+            &-first {
+                left: auto;
+                right: 0;
+            }
+        }
+    }
+}

package/lib/cjs/rating/variables.scss

@@ -0,0 +1,14 @@
+$color-rating-icon-default: rgba(var(--semi-yellow-5), 1); // 评分图标按钮颜色 - 已填
+$color-rating-bg-default: var(--semi-color-fill-0); // 评分图标按钮颜色 - 未填
+
+$font-rating-fontSize: 20px; // 评分文本字体大小
+
+$spacing-rating-margin: 0px; // 整体外边距
+$spacing-rating-padding: 0px; // 整体内边距
+$spacing-rating_item-marginRight: 6px; // 评分项右侧外边距
+
+$width-rating_item_small: 16px; // 小尺寸评分项宽度
+$font-rating_item_small-fontSize: $width-rating_item_small; // 小尺寸评分项文本字体大小
+
+$width-rating_item_default: 24px; // 评分项宽度
+$font-rating_item_default-fontSize: $width-rating_item_default; // 评分项文本字体大小

package/lib/cjs/scrollList/constants.d.ts

@@ -0,0 +1,12 @@
+declare const cssClasses: {
+    PREFIX: string;
+    SELECTED: string;
+};
+declare const strings: {
+    readonly MODE: readonly ["normal", "wheel"];
+};
+declare const numbers: {
+    DEFAULT_ITEM_HEIGHT: number;
+    DEFAULT_SCROLL_DURATION: number;
+};
+export { cssClasses, strings, numbers };

package/lib/cjs/scrollList/constants.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.strings = exports.numbers = exports.cssClasses = void 0;
+
+var _constants = require("../base/constants");
+
+const cssClasses = {
+  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-scrolllist"),
+  SELECTED: "".concat(_constants.BASE_CLASS_PREFIX, "-scrolllist-item-selected")
+};
+exports.cssClasses = cssClasses;
+const strings = {
+  MODE: ['normal', 'wheel']
+};
+exports.strings = strings;
+const numbers = {
+  DEFAULT_ITEM_HEIGHT: 36,
+  DEFAULT_SCROLL_DURATION: 120
+};
+exports.numbers = numbers;