@douyinfe/semi-foundation 2.3.0 → 2.4.1

package/lib/cjs/select/select.scss

@@ -24,14 +24,16 @@ $multiple: #{$module}-multiple;
 
     &:hover {
         background-color: $color-select-bg-hover;
+        border: $width-select-border-hover solid $color-select-border-hover;
     }
 
     &:active {
         background-color: $color-select-bg-active;
+        border: $width-select-border-active solid $color-select-border-active;
     }
 
     &:focus {
-        border: $border-thickness-control-focus solid $color-select_default-border-focus;
+        border: $width-select-border-focus solid $color-select-border-focus;
         outline: 0;
     }
 
@@ -383,7 +385,7 @@ $multiple: #{$module}-multiple;
 .#{$module}-option-list {
     overflow-x: hidden;
     overflow-y: auto;
-
+    padding: $spacing-select_option_list-paddingTop $spacing-select_option_list-paddingRight $spacing-select_option_list-paddingBottom $spacing-select_option_list-paddingLeft;
     &-chosen {
         .#{$module}-option-icon {
             display: flex;

package/lib/cjs/select/variables.scss

@@ -3,6 +3,9 @@ $color-select-bg-default: var(--semi-color-fill-0); // 选择器输入框背景
 $color-select-bg-hover: var(--semi-color-fill-1); // 选择器输入框背景色 - 悬停态
 $color-select-bg-active: var(--semi-color-fill-2); // 选择器输入框背景色 - 按下态
 $color-select-border-default: transparent; // 选择器输入框描边颜色
+$color-select-border-hover: $color-select-border-default;  // 选择器输入框描边颜色 - 悬浮
+$color-select-border-active: var(--semi-color-focus-border); // 选择器输入框描边颜色 - 按下态
+$color-select-border-focus: $color-select-border-active;// 选择器输入框描边颜色 - 悬停态
 $color-select_warning-bg-default: var(--semi-color-warning-light-default); // 警示选择器输入框背景色 - 默认态
 $color-select_warning-border-default: var(--semi-color-warning-light-default); // 警示选择器输入框描边颜色 - 默认态
 $color-select_warning-bg-hover: var(--semi-color-warning-light-hover); // 警示选择器输入框背景色 - 悬停态
@@ -56,7 +59,9 @@ $width-select_arrow_empty: 12px; // 选择器输入框下拉箭头为空时（
 $width-select_clear-icon: 32px; // 选择器输入框清空按钮宽度
 $width-select_group_top-border: $border-thickness-control; // 选择器菜单分组标题描边宽度
 $height-select_multiple_content_wrapper-minHeight: $height-select_default - 2; // 多项选择器标签组最小宽度
-
+$width-select-border-hover: $width-select-border;  // 选择器输入框描边宽度 - 悬浮
+$width-select-border-focus: $width-select-border-hover; // 选择器输入框描边宽度 - 按下
+$width-select-border-active: $width-select-border-focus; // 选择器输入框描边宽度 - 选中
 // Spacing
 $spacing-select_option_tick-marginRight: $spacing-tight; // 选择器菜单选中对勾右侧外边距
 $spacing-select_prefix_suffix_text-marginX: $spacing-base-tight; // 选择器输入框前后缀文本水平内边距
@@ -86,9 +91,14 @@ $spacing-select_tag-marginRight: $spacing-extra-tight; // 多项选择器标签
 $spacing-select_tag-marginBottom: $spacing-super-tight - 1; // 多项选择器标签底部外边距
 $spacing-select_selection-marginLeft: $spacing-base-tight; // 选择器内容区左侧外边距
 $spacing-select_insetLabel-marginRight: $spacing-base-tight; // 选择器内嵌标签右侧外边距
+$spacing-select_option_list-paddingTop: 0; // 选择器内容区顶部内边距
+$spacing-select_option_list-paddingRight: 0; // 选择器内容区右侧内边距
+$spacing-select_option_list-paddingBottom: 0; // 选择器内容区底部内边距
+$spacing-select_option_list-paddingLeft: 0; // 选择器内容区左侧内边距
 
 // Radius
 $radius-select: var(--semi-border-radius-small); // 选择器输入框圆角
+$radius-select_option: 0; // 选择器待选项圆角
 
 // Font
 $font-select-fontWeight: $font-weight-regular; // 选择器文本字重

package/lib/cjs/table/table.css

@@ -52,6 +52,9 @@
   color: var(--semi-color-text-0);
   width: 100%;
 }
+.semi-table-wrapper[data-column-fixed=true] {
+  z-index: 1;
+}
 .semi-table-middle .semi-table-tbody > .semi-table-row > .semi-table-row-cell {
   padding-top: 12px;
   padding-bottom: 12px;

package/lib/cjs/table/table.scss

@@ -22,6 +22,10 @@ $module: #{$prefix}-table;
         @include font-size-regular;
         color: $color-table-text-default;
         width: 100%;
+
+        &[data-column-fixed=true] {
+            z-index: 1;
+        }
     }
 
     &-middle {

package/lib/cjs/table/variables.scss

@@ -79,8 +79,8 @@ $font-table_base-fontSize: 14px; // 表格默认文本字号
 $border-table_base-borderStyle: solid; // 表格描边样式
 $shadow-table_left: -3px 0 0 0 $color-table_shadow-bg-default; // 表格滚动阴影 - 左侧
 $shadow-table_right: 3px 0 0 0 $color-table_shadow-bg-default; // 表格滚动阴影 - 右侧
-$border-table: #{$width-table_base_border} #{$border-table_base-borderStyle} $color-table-border-default; // 表格默认描边
-$border-table_head-bottom: #{$width-table_header_border} #{$border-table_base-borderStyle} $color-table_th-border-default; // 表头单元格描边 - 底部
+$border-table: $width-table_base_border $border-table_base-borderStyle $color-table-border-default; // 表格默认描边
+$border-table_head-bottom: $width-table_header_border $border-table_base-borderStyle $color-table_th-border-default; // 表头单元格描边 - 底部
 $border-table_resizer: $width-table_resizer_border solid $color-table_resizer-bg-default; // 表格拉伸标识描边
 
 $z-table-fixed: 101!default; // fixed列的zIndex值

package/lib/cjs/tagInput/tagInput.css

@@ -12,6 +12,7 @@
 }
 .semi-tagInput-hover {
   background-color: var(--semi-color-fill-1);
+  border: 1px transparent solid;
 }
 .semi-tagInput-focus {
   background-color: var(--semi-color-fill-0);

package/lib/cjs/tagInput/tagInput.scss

@@ -4,7 +4,7 @@ $module: #{$prefix}-tagInput;
 
 .#{$module} {
     background-color: $color-tagInput_default-bg-default;
-    border: $border-thickness-control-focus $color-textarea-border-default solid;
+    border: $width-tagInput-border-default $color-tagInput-border-default solid;
     border-radius: $radius-tagInput;
     display: inline-flex;
     font-weight: $font-weight-regular;
@@ -13,11 +13,12 @@ $module: #{$prefix}-tagInput;
     
     &-hover {
         background-color: $color-tagInput_default-bg-hover;
+        border: $width-tagInput-border-hover $color-tagInput-border-hover solid;
     }
     
     &-focus {
         background-color: $color-tagInput_default-bg-focus;
-        border: $border-thickness-control-focus $color-tagInput_default-border-focus solid;
+        border: $width-tagInput-border-focus $color-tagInput-border-focus solid;
     }
 
     &-warning {

package/lib/cjs/tagInput/variables.scss

@@ -3,13 +3,16 @@ $color-tagInput-maxTagCount-default: var(--semi-color-text-0); // 标签输入
 $color-tagInput-icon-hover: var(--semi-color-primary-hover); // 标签输入框图标颜色 - 悬浮
 $color-tagInput_disabled-text-default: var(--semi-color-disabled-text); // 标签输入框禁用文字颜色
 $color-tagInput_default-bg-focus: var(--semi-color-fill-0); // 标签输入框背景颜色 - 选中态
-$color-tagInput_default-border-focus: var(--semi-color-focus-border); // 标签输入框描边颜色 - 选中态
+
+$color-tagInput-border-default: transparent; // 标签输入框描边颜色 - 默认
+$color-tagInput-border-hover: transparent ; // 标签输入框描边颜色 - 悬浮
+$color-tagInput-border-focus: var(--semi-color-focus-border); // 标签输入框描边颜色 - 选中态
 $color-tagInput_prefix-default: var(--semi-color-text-2); // 标签输入框 prefix 颜色
 $color-tagInput_suffix-default: var(--semi-color-text-1); // 标签输入框 suffix 颜色
 
 $color-tagInput_default-bg-default: var(--semi-color-fill-0); // 标签输入框背景颜色 - 默认
 $color-tagInput_default-bg-hover: var(--semi-color-fill-1); // 标签输入框背景颜色 - 悬浮
-$color-textarea-border-default: transparent; // 标签输入框描边颜色 - 默认
+// $color-textarea-border-default: transparent; // 标签输入框描边颜色 - 默认，已废弃 deprecated-v2.4
 
 $color-tagInput_warning-bg-default: var(--semi-color-warning-light-default); // 警告标签输入框背景颜色 - 默认
 $color-tagInput_warning-border-default: var(--semi-color-warning-light-default); // 警告标签输入框描边颜色 - 默认
@@ -35,5 +38,8 @@ $height-tagInput-default: $height-control-default; // 默认尺寸标签输入
 $height-tagInput-small: $height-control-small; // 小尺寸标签输入框高度
 
 $width-tagInput-clear-medium: $width-icon-medium * 2; // 标签输入框清空按钮宽度
+$width-tagInput-border-default: $border-thickness-control; // 标签输入框描边描边宽度 - 默认
+$width-tagInput-border-hover: $width-tagInput-border-default; // 标签输入框描边描边宽度 - 悬浮
+$width-tagInput-border-focus: $border-thickness-control-focus; // 标签输入框描边宽度 - 选中态
 
 $radius-tagInput: var(--semi-border-radius-small); // 标签输入框圆角

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

@@ -6,7 +6,8 @@ export interface TimePickerAdapter<P = Record<string, any>, S = Record<string, a
     setInputValue: (inputValue: string, cb?: () => void) => void;
     unregisterClickOutSide: () => void;
     notifyOpenChange: (open: boolean) => void;
-    notifyChange: (value: Date | Date[], input: string | string[]) => void;
+    notifyChange(value: Date | Date[], input: string | string[]): void;
+    notifyChange(input: string | string[], value: Date | Date[]): void;
     notifyFocus: (e: any) => void;
     notifyBlur: (e: any) => void;
     isRangePicker: () => boolean;

package/lib/cjs/timePicker/foundation.js

@@ -440,7 +440,13 @@ class TimePickerFoundation extends _foundation.default {
       }
     }
 
-    this._adapter.notifyChange(_value, str);
+    const onChangeWithDateFirst = this.getProp('onChangeWithDateFirst');
+
+    if (onChangeWithDateFirst) {
+      this._adapter.notifyChange(_value, str);
+    } else {
+      this._adapter.notifyChange(str, _value);
+    }
   }
 
   _hasChanged() {

package/lib/cjs/tree/treeUtil.d.ts

@@ -72,7 +72,7 @@ export declare function filterTreeData(info: any): {
 };
 export declare function getValueOrKey(data: any): any;
 export declare function normalizeValue(value: any, withObject: boolean): any;
-export declare function updateKeys(keySet: Set<string>, keyEntities: KeyEntities): string[];
+export declare function updateKeys(keySet: Set<string> | string[], keyEntities: KeyEntities): string[];
 export declare function calcDisabledKeys(keyEntities: KeyEntities): Set<string>;
 export declare function calcDropRelativePosition(event: any, treeNode: any): 1 | -1 | 0;
 export declare function getDragNodesKeys(key: string, keyEntities: KeyEntities): string[];

package/lib/cjs/treeSelect/treeSelect.css

@@ -17,6 +17,7 @@
 }
 .semi-tree-select:hover {
   background-color: var(--semi-color-fill-1);
+  border: 1px solid inherit;
 }
 .semi-tree-select-focus {
   border: 1px solid var(--semi-color-focus-border);

package/lib/cjs/treeSelect/treeSelect.scss

@@ -18,6 +18,7 @@ $module: #{$prefix}-tree-select;
 
     &:hover {
         background-color: $color-treeSelect_default-bg-hover;
+        border: $width-treeSelect_hover-border solid $color-treeSelect_default-border-hover;
     }
 
     &-focus {
@@ -329,4 +330,4 @@ $module: #{$prefix}-tree-select;
     }
 }
 
-@import './rtl.scss';
+@import './rtl.scss';

package/lib/cjs/treeSelect/variables.scss

@@ -6,6 +6,7 @@ $color-treeSelect_default-icon-hover: var(--semi-color-primary-hover); // 树选
 $color-treeSelect_default-icon-active: var(--semi-color-primary-active); // 树选择器选择框清空按钮颜色 - 按下
 $color-treeSelect_default-bg-hover: var(--semi-color-fill-1); // 树选择器选择框背景颜色 - 悬停
 
+$color-treeSelect_default-border-hover: inherit; // 树选择器选择框描边颜色 - 悬浮
 $color-treeSelect_default-border-focus: var(--semi-color-focus-border);// 树选择器选择框描边颜色 - 选中
 
 $color-treeSelect_search-border-default: var(--semi-color-fill-0); // 树选择器菜单搜索框描边颜色 - 默认
@@ -46,7 +47,8 @@ $radius-treeSelect: var(--semi-border-radius-small); // 树选择器圆角
 $width-treeSelect-border: 1px; // 树选择器描边宽度
 $width-treeSelect_search_wrapper-border: 1px; // 树选择器搜索框描边宽度
 
-$width-treeSelect_focus-border: $border-thickness-control-focus; // 树选择器选择框描边宽度
+$width-treeSelect_hover-border: $border-thickness-control-focus; // 树选择器选择框描边宽度 - 悬浮
+$width-treeSelect_focus-border: $width-treeSelect_hover-border; // 树选择器选择框描边宽度 - 选中
 
 $width-treeSelect_default: 80px; // 树选择器最小宽度
 $height-treeSelect_default: $height-control-default; // 树选择器选择器高度 - 默认

package/lib/es/autoComplete/autoComplete.css

@@ -11,6 +11,7 @@
   padding-top: 8px;
   padding-bottom: 8px;
   color: var(--semi-color-text-0);
+  border-radius: 0;
   position: relative;
   display: flex;
   flex-wrap: nowrap;

package/lib/es/button/button.css

@@ -124,21 +124,27 @@
 }
 .semi-button-borderless {
   background-color: transparent;
+  border: 0 transparent solid;
 }
 .semi-button-borderless:not(.semi-button-disabled):hover {
   background-color: var(--semi-color-fill-0);
+  border: 0 transparent solid;
 }
 .semi-button-borderless:not(.semi-button-disabled):active {
   background-color: var(--semi-color-fill-1);
+  border: 0 transparent solid;
 }
 .semi-button-light {
   background-color: var(--semi-color-fill-0);
+  border: 0 transparent solid;
 }
 .semi-button-light:not(.semi-button-disabled):hover {
   background-color: var(--semi-color-fill-1);
+  border: 0 transparent solid;
 }
 .semi-button-light:not(.semi-button-disabled):active {
   background-color: var(--semi-color-fill-2);
+  border: 0 transparent solid;
 }
 .semi-button-size-small {
   height: 24px;

package/lib/es/button/button.scss

@@ -112,21 +112,27 @@ $module: #{$prefix}-button;
     }
     &-borderless {
         background-color: transparent;
+        border: $width-button_borderless-border $color-button_borderless-border-default solid;
         &:not(.#{$module}-disabled):hover {
             background-color: $color-button_borderless-bg-hover;
+            border: $width-button_borderless-border $color-button_borderless-border-hover solid;
         }
         &:not(.#{$module}-disabled):active {
             background-color: $color-button_borderless-bg-active;
+            border: $width-button_borderless-border $color-button_borderless-border-active solid;
         }
     }
 
     &-light {
         background-color: $color-button_light-bg-default;
+        border: $width-button_light-border $color-button_light-border-default solid;
         &:not(.#{$module}-disabled):hover {
             background-color: $color-button_light-bg-hover;
+            border: $width-button_light-border $color-button_light-border-hover solid;
         }
         &:not(.#{$module}-disabled):active {
             background-color: $color-button_light-bg-active;
+            border: $width-button_light-border $color-button_light-border-active solid;
         }
     }
     &-size-small {

package/lib/es/button/variables.scss

@@ -76,11 +76,19 @@ $color-button_disabled-bg-hover: var(--semi-color-disabled-bg); // 禁用按钮
 $color-button_light-bg-default: var(--semi-color-fill-0); // 浅色按钮背景颜色
 $color-button_light-bg-hover: var(--semi-color-fill-1); // 禁用按钮背景颜色 - 悬浮
 $color-button_light-bg-active: var(--semi-color-fill-2); // 禁用按钮背景颜色 - 按下
+$color-button_light-border-default: transparent; // 浅色按钮描边颜色 
+$color-button_light-border-hover: $color-button_light-border-default; // 浅色按钮描边颜色 - 悬浮
+$color-button_light-border-active: $color-button_light-border-hover; // 浅色按钮描边颜色 - 按下
+$width-button_light-border: 0;  // 浅色按钮描边宽度
 
 // borderless
 $color-button_borderless-text-default: var(--semi-color-primary); // 无背景按钮背景颜色
 $color-button_borderless-bg-hover: var(--semi-color-fill-0); // 无背景按钮背景颜色 - 悬浮
 $color-button_borderless-bg-active: var(--semi-color-fill-1); // 无背景按钮背景颜色 - 按下
+$color-button_borderless-border-default: transparent; // 无背景按钮描边颜色
+$color-button_borderless-border-hover: $color-button_borderless-border-default; // 无背景按钮描边颜色 - 悬浮
+$color-button_borderless-border-active: $color-button_borderless-border-hover; // 无背景按钮描边颜色 - 按下
+$width-button_borderless-border: 0; // 无背景按钮描边宽度
 
 // buttongroup
 
@@ -125,4 +133,4 @@ $height-button_default: $height-control-default; // 按钮高度 - 默认
 
 $width-button-border: $border-thickness;  // 按钮描边宽度
 $radius-button: var(--semi-border-radius-small); // 按钮圆角大小
-$radius-button_group: $radius-button; // 按钮组圆角大小
+$radius-button_group: $radius-button; // 按钮组圆角大小

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

@@ -246,6 +246,6 @@ export default class MonthsGridFoundation extends BaseFoundation<MonthsGridAdapt
      *  - When yam open type is 'left' or 'right', weeks minHeight should be set
      *    If the minHeight is not set, the change of the number of weeks will cause the scrollList to be unstable
      */
-    getYAMOpenType(): "left" | "right" | "both" | "none";
+    getYAMOpenType(): "left" | "right" | "none" | "both";
 }
 export {};

package/lib/es/input/textarea.css

@@ -44,20 +44,20 @@
 .semi-input-textarea-wrapper .semi-input-clearbtn-hidden {
   visibility: hidden;
 }
-.semi-input-textarea-wrapper-readonly {
-  cursor: default;
-}
-.semi-input-textarea-wrapper-disabled {
+.semi-input-textarea-wrapper-disabled, .semi-input-textarea-wrapper-readonly {
   cursor: not-allowed;
   color: var(--semi-color-disabled-text);
   background-color: var(--semi-color-disabled-fill);
 }
-.semi-input-textarea-wrapper-disabled:hover {
+.semi-input-textarea-wrapper-disabled:hover, .semi-input-textarea-wrapper-readonly:hover {
   background-color: var(--semi-color-disabled-fill);
 }
-.semi-input-textarea-wrapper-disabled::placeholder {
+.semi-input-textarea-wrapper-disabled::placeholder, .semi-input-textarea-wrapper-readonly::placeholder {
   color: var(--semi-color-disabled-text);
 }
+.semi-input-textarea-wrapper-readonly {
+  cursor: text;
+}
 .semi-input-textarea-wrapper-error {
   background-color: var(--semi-color-danger-light-default);
   border-color: var(--semi-color-danger-light-default);
@@ -108,23 +108,29 @@
   box-sizing: border-box;
   color: var(--semi-color-text-0);
 }
+.semi-input-textarea:hover {
+  border-color: transparent;
+}
 .semi-input-textarea::placeholder {
   color: var(--semi-color-text-2);
 }
 .semi-input-textarea-showClear {
   padding-right: 36px;
 }
-.semi-input-textarea-disabled {
+.semi-input-textarea-disabled, .semi-input-textarea-readonly {
   cursor: not-allowed;
   color: var(--semi-color-disabled-text);
   background-color: transparent;
 }
-.semi-input-textarea-disabled:hover {
+.semi-input-textarea-disabled:hover, .semi-input-textarea-readonly:hover {
   background-color: transparent;
 }
-.semi-input-textarea-disabled::placeholder {
+.semi-input-textarea-disabled::placeholder, .semi-input-textarea-readonly::placeholder {
   color: var(--semi-color-disabled-text);
 }
+.semi-input-textarea-readonly {
+  cursor: text;
+}
 .semi-input-textarea-autosize {
   overflow: hidden;
 }

package/lib/es/input/textarea.scss

@@ -55,11 +55,7 @@ $module: #{$prefix}-input;
         }
     }
 
-    &-readonly {
-        cursor: default;
-    }
-
-    &-disabled {
+    &-disabled, &-readonly {
         cursor: not-allowed;
         // border: $border-thickness-control $color-input_disabled-border-default solid;
         color: $color-input_disabled-text-default;
@@ -74,6 +70,10 @@ $module: #{$prefix}-input;
         }
     }
 
+    &-readonly {
+        cursor: text;
+    }
+
     &-error {
         background-color: $color-input_danger-bg-default;
         border-color: $color-input_danger-border-default;
@@ -136,12 +136,15 @@ $module: #{$prefix}-input;
     background-color: transparent;
     border: $width-textarea-border solid $color-textarea-border-default;
     vertical-align: bottom;
-
     width: 100%;
     outline: none;
     cursor: text;
     box-sizing: border-box;
     color: $color-input_default-text-default;
+    
+    &:hover {
+        border-color: $color-textarea-border-hover;
+    }
 
     &::placeholder {
         color: $color-input_placeholder-text-default;
@@ -151,7 +154,7 @@ $module: #{$prefix}-input;
         padding-right: $spacing-textarea_withShowClear-paddingRight;
     }
 
-    &-disabled {
+    &-disabled, &-readonly {
         cursor: not-allowed;
         color: $color-input_disabled-text-default;
         background-color: transparent;
@@ -165,10 +168,14 @@ $module: #{$prefix}-input;
         }
     }
 
+    &-readonly {
+        cursor: text;
+    }
+
     &-autosize {
         overflow: hidden;
     }
-    
+
     &-counter {
         @include font-size-small;
         display: flex;

package/lib/es/input/variables.scss

@@ -100,6 +100,7 @@ $spacing-textarea_counter-paddingLeft: 12px; // 多行文本字数统计左侧
 $width-textarea-border: $border-thickness; // 多行文本描边宽度
 $height-textarea_counter: 24px; // 多行文本字数统计最小高度
 $color-textarea-border-default: transparent; // 多行文本描边颜色
+$color-textarea-border-hover: $color-textarea-border-default; // 多行文本描边颜色 - 悬浮
 
 $color-textarea-icon-default: var(--semi-color-text-2); // 多行文本 clear 图标颜色
 $color-textarea-icon-hover: var(--semi-color-primary-hover); // 多行文本 clear 图标颜色 - 悬浮

package/lib/es/inputNumber/constants.d.ts

@@ -6,6 +6,7 @@ declare const numbers: {
     DEFAULT_SHIFT_STEP: number;
     DEFAULT_PRESS_TIMEOUT: number;
     DEFAULT_PRESS_INTERVAL: number;
+    MOUSE_BUTTON_LEFT: number;
 };
 declare const strings: {
     SIZE: readonly ["small", "large", "default"];

package/lib/es/inputNumber/constants.js

@@ -7,7 +7,8 @@ const numbers = _Object$assign(_Object$assign({}, inputNumbers), {
   DEFAULT_STEP: 1,
   DEFAULT_SHIFT_STEP: 1,
   DEFAULT_PRESS_TIMEOUT: 250,
-  DEFAULT_PRESS_INTERVAL: 0
+  DEFAULT_PRESS_INTERVAL: 0,
+  MOUSE_BUTTON_LEFT: 0
 });
 
 const strings = _Object$assign({}, inputStrings);

package/lib/es/inputNumber/foundation.d.ts

@@ -47,6 +47,11 @@ declare class InputNumberFoundation extends BaseFoundation<InputNumberAdapter> {
     handleMouseUp(e?: any): void;
     handleUpClick(event: any): void;
     handleDownClick(event: any): void;
+    /**
+     * Whether it is a left mouse button click
+     * @see https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
+     */
+    _isMouseButtonLeft(event: any): boolean;
     _preventDefault(event: any): void;
     handleMouseLeave(event: any): void;
     upClick(event: any): void;

package/lib/es/inputNumber/foundation.js

@@ -1,3 +1,4 @@
+import _get from "lodash/get";
 import _toString from "lodash/toString";
 import _toNumber from "lodash/toNumber";
 import _setInterval from "@babel/runtime-corejs3/core-js-stable/set-interval";
@@ -293,6 +294,10 @@ class InputNumberFoundation extends BaseFoundation {
   }
 
   handleUpClick(event) {
+    if (!this._isMouseButtonLeft(event)) {
+      return;
+    }
+
     this._adapter.setClickUpOrDown(true);
 
     if (event) {
@@ -312,6 +317,10 @@ class InputNumberFoundation extends BaseFoundation {
   }
 
   handleDownClick(event) {
+    if (!this._isMouseButtonLeft(event)) {
+      return;
+    }
+
     this._adapter.setClickUpOrDown(true);
 
     if (event) {
@@ -329,6 +338,15 @@ class InputNumberFoundation extends BaseFoundation {
       });
     });
   }
+  /**
+   * Whether it is a left mouse button click
+   * @see https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
+   */
+
+
+  _isMouseButtonLeft(event) {
+    return _get(event, 'button') === numbers.MOUSE_BUTTON_LEFT;
+  }
 
   _preventDefault(event) {
     const keepFocus = this._adapter.getProp('keepFocus');

package/lib/es/modal/modal.css

@@ -70,6 +70,7 @@
   padding: 0 0;
   font-size: 14px;
   font-weight: 600;
+  background-color: transparent;
   color: var(--semi-color-text-0);
   border-bottom: 0 solid transparent;
 }
@@ -92,6 +93,7 @@
   text-align: right;
   border-radius: 0 0 5px 5px;
   border-top: 0 solid transparent;
+  background-color: transparent;
 }
 .semi-modal-footer .semi-button {
   margin-left: 12px;

package/lib/es/modal/modal.scss

@@ -84,6 +84,7 @@ $module: #{$prefix}-modal;
         padding: $spacing-modal_header-paddingY $spacing-modal_header-paddingX;
         font-size: $font-modal_header-fontSize;
         font-weight: $font-modal_header-fontWeight;
+        background-color: $color-modal_header-bg;
         color: $color-modal_main-text;
         border-bottom: $width-modal_header-border solid $color-modal_header-border;
     }
@@ -112,6 +113,7 @@ $module: #{$prefix}-modal;
         text-align: right;
         border-radius: $radius-modal_footer;
         border-top: $width-modal_footer-border solid $color-modal_footer-border;
+        background-color: $color-modal_footer-bg;
         
         .#{$prefix}-button {
             margin-left: $spacing-modal_footer_button-marginLeft;

package/lib/es/modal/variables.scss

@@ -8,6 +8,8 @@ $color-modal_success-icon: var(--semi-color-success); // 模态框成功图标
 $color-modal_danger-icon: var(--semi-color-danger); // 模态框危险图标颜色
 $color-modal_warning-icon: var(--semi-color-warning); // 模态框警告图标颜色
 $color-modal_content-border: var(--semi-color-border); // 模态框描边颜色
+$color-modal_header-bg: transparent;  // 模态框 header 背景填充色
+$color-modal_footer-bg: transparent;  // 模态框 footer 背景填充色
 
 // Spacing
 $spacing-modal-marginY: 80px; // 模态框距容器顶部外边距
@@ -62,8 +64,9 @@ $font-modal_header-fontSize: $font-size-regular; // 模态框 title 字号
 $font-modal_header-fontWeight: $font-weight-bold; // 模态框 title 字重
 
 //border
-$color-modal_header-border:transparent;
-$width-modal_header-border:0;
-$color-modal_footer-border:transparent;
-$width-modal_footer-border:0;
+$color-modal_header-border:transparent;  // 模态框 header 底部描边颜色
+$width-modal_header-border:0; // 模态框 header 底部描边宽度
+$color-modal_footer-border:transparent; // 模态框 footer 顶部描边颜色
+$width-modal_footer-border:0; // 模态框 footer 顶部描边宽度
+
 

package/lib/es/scrollList/scrollList.css

@@ -21,6 +21,7 @@
 .semi-scrolllist-header-title {
   padding: 16px 0;
   font-weight: 600;
+  color: var(--semi-color-text-0);
   font-size: 14px;
   line-height: 20px;
   font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;

package/lib/es/scrollList/scrollList.scss

@@ -24,6 +24,7 @@ $module: #{$prefix}-scrolllist;
         &-title {
             padding: $spacing-scrollList_header_title-paddingY $spacing-scrollList_header_title-paddingX;
             font-weight: $font-scrollList_header_title-fontWeight;
+            color: $color-scrollList_header-title;
 
             @include font-size-regular;
         }