@douyinfe/semi-foundation 2.8.0 → 2.9.0-beta.0

package/lib/es/form/variables.scss

@@ -1,24 +1,24 @@
-$spacing-form_label-paddingTop: ($height-control-default - 20) / 2; // 水平布局表单标题顶部内边距
-$spacing-form_label_small-paddingTop: ($height-control-default - 24) / 2; // 水平布局 小尺寸表单标题顶部内边距
+$spacing-form_label-paddingTop: ($height-control-default - 20px) / 2; // 水平布局表单标题顶部内边距
+$spacing-form_label_small-paddingTop: ($height-control-default - 24px) / 2; // 水平布局 小尺寸表单标题顶部内边距
 
 $spacing-form_field_horizontal-paddingRight: $spacing-base; // 水平布局表单标题右侧内边距
-$spacing-form_field_group_horizontal-paddingRight: $spacing-base; // 水平布局表单组标题右侧内边距 
+$spacing-form_field_group_horizontal-paddingRight: $spacing-base; // 水平布局表单组标题右侧内边距
 
 $spacing-form_field_vertical-paddingTop: $spacing-base-tight; // 垂直布局表单顶部内边距
 $spacing-form_field_vertical-paddingBottom: $spacing-base-tight; // 垂直布局表单底部内边距
 
-$spacing-form_field_group_vertical-paddingTop: $spacing-base-tight; // 垂直布局表单组顶部内边距 
-$spacing-form_field_group_vertical-paddingBottom: $spacing-base-tight; // 垂直布局表单组底部内边距 
-$spacing-form_section-marginTop: $spacing-super-loose - $spacing-base-tight; // 表单分组顶部内边距 
-$spacing-form_section_text-paddingBottom: $spacing-tight; // 表单分组标题底部内边距 
-$spacing-form_section_text-marginBottom: $spacing-extra-tight; // 表单分组标题底部外边距 
-
-$spacing-form_label-paddingRight: $spacing-base; // 表单标题右侧内边距 
-$spacing-form_label-marginBottom: $spacing-extra-tight; // 表单标题底部外边距 
-$spacing-form_label_extra-marginLeft: $spacing-extra-tight; // 表单标题图标左侧内边距 
-$spacing-form_label_required-marginLeft: $spacing-extra-tight; // 表单标题必填标志左侧内边距 
-$spacing-form_label_posLeft-marginRight: 0; // 水平布局表单标题右侧外边距 
-$spacing-form_label_posLeft-marginBottom: 0; // 水平布局表单标题底部外边距 
+$spacing-form_field_group_vertical-paddingTop: $spacing-base-tight; // 垂直布局表单组顶部内边距
+$spacing-form_field_group_vertical-paddingBottom: $spacing-base-tight; // 垂直布局表单组底部内边距
+$spacing-form_section-marginTop: $spacing-super-loose - $spacing-base-tight; // 表单分组顶部内边距
+$spacing-form_section_text-paddingBottom: $spacing-tight; // 表单分组标题底部内边距
+$spacing-form_section_text-marginBottom: $spacing-extra-tight; // 表单分组标题底部外边距
+
+$spacing-form_label-paddingRight: $spacing-base; // 表单标题右侧内边距
+$spacing-form_label-marginBottom: $spacing-extra-tight; // 表单标题底部外边距
+$spacing-form_label_extra-marginLeft: $spacing-extra-tight; // 表单标题图标左侧内边距
+$spacing-form_label_required-marginLeft: $spacing-extra-tight; // 表单标题必填标志左侧内边距
+$spacing-form_label_posLeft-marginRight: 0; // 水平布局表单标题右侧外边距
+$spacing-form_label_posLeft-marginBottom: 0; // 水平布局表单标题底部外边距
 $spacing-form_label_posTop-paddingTop: $spacing-extra-tight; // 垂直布局表单标题顶部内边距
 $spacing-form_label_posTop-paddingBottom: $spacing-extra-tight; // 垂直布局表单标题底部内边距
 $spacing-form_label_extra_posMid-marginTop: $spacing-extra-tight; // 表单额外信息辅助文字顶部外边距 - 居中
@@ -41,4 +41,4 @@ $color-form_alertIcon-icon-default: var(--semi-color-warning); // 警告表单
 $color-form_message_error-text-default: var(--semi-color-danger); // 错误表单项图标颜色
 $color-form_section-text-default: var(--semi-color-text-0); // 表单分组标题文字颜色
 $color-form_section-border-default: var(--semi-color-border); // 表单分组描边颜色
-$width-form_section-border: $border-thickness-control; // 表单分组描边宽度
+$width-form_section-border: $border-thickness-control; // 表单分组描边宽度

package/lib/es/input/variables.scss

@@ -56,9 +56,9 @@ $color-input_counter_danger-text-default: var(--semi-color-danger); // 多行文
 
 $color-input_group-border-default: var(--semi-color-border); // 输入框组合分割线颜色
 
-$height-input_large: $height-control-large - 2; // 输入框高度 & 行高 - 大尺寸
-$height-input_small: $height-control-small - 2; // 输入框高度 & 行高 - 小尺寸
-$height-input_default: $height-control-default - 2; // 输入框高度 & 行高 - 默认尺寸
+$height-input_large: $height-control-large - 2px; // 输入框高度 & 行高 - 大尺寸
+$height-input_small: $height-control-small - 2px; // 输入框高度 & 行高 - 小尺寸
+$height-input_default: $height-control-default - 2px; // 输入框高度 & 行高 - 默认尺寸
 $height-input_wrapper_large: $height-control-large;
 $height-input_wrapper_small: $height-control-small;
 $height-input_wrapper_default: $height-control-default;
@@ -72,7 +72,7 @@ $motion-scale_size-inactive: 1;
 
 $width-input_append-border: $border-thickness-control; // 后置标签描边宽度
 $width-input_prepend-border: $border-thickness-control; // 前置标签描边宽度
-$width-input_group_pseudo-border: $border-thickness-control; 
+$width-input_group_pseudo-border: $border-thickness-control;
 $width-input_wrapper-border: $border-thickness-control-focus; // 输入框描边宽度
 $width-input_wrapper_focus-border: $border-thickness-control-focus; // 输入框描边宽度 - 选中态
 

package/lib/es/popover/variables.scss

@@ -4,25 +4,23 @@ $color-popover-bg-default: var(--semi-color-bg-3); // 默认背景色
 $color-popover-border-default: var(--semi-color-border); // 默认描边颜色
 
 // Width/Height
-$width-popover_arrow: 24px; // 水平箭头宽度
+$width-popover_arrow: 24px; // 水平箭头宽度 ignore-semi-css-trans
 $height-popover_arrow: 8px; // 水平箭头高度
 $height-popover_arrow_vertical: 24px; // 垂直箭头高度
 $width-popover_arrow_vertical: 8px; // 垂直箭头宽度
 $height-tooltip_arrow: $height-popover_arrow;
-$width-tooltip_arrow: $width-popover_arrow;
+$width-tooltip_arrow: $width-popover_arrow; //ignore-semi-css-trans
 $width-tooltip_arrow_vertical: $width-popover_arrow_vertical;
 $height-tooltip_arrow_vertical: $height-popover_arrow_vertical;
-$width-popover_title-border: 1px; 
+$width-popover_title-border: 1px;
 
 
 // Spacing
 $spacing-popover_title-padding: 8px; // 气泡卡片标题内边距
 $spacing-popover_withArrow-padding: 12px; // 带箭头的气泡卡片标题内边距
-$spacing-popover_arrow_adjusted_offset-y: 6; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
+$spacing-popover_arrow_adjusted_offset-y: 6px; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
 $spacing-tooltip_arrow_adjusted_offset-y: $spacing-popover_arrow_adjusted_offset-y; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
-$spacing-tooltip_arrow_adjusted_offset-x: round(
-    $horizontal-rate * $width-tooltip_arrow
-); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题
+$spacing-tooltip_arrow_adjusted_offset-x: round($horizontal-rate * $width-tooltip_arrow); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题 ignore-semi-css-trans
 
 // Radius
 $radius-popover: var(--semi-border-radius-medium); // 气泡卡片的圆角大小

package/lib/es/scrollList/variables.scss

@@ -13,7 +13,7 @@ $color-scrollList_selected_item-icon: var(--semi-color-text-2); // 滚动列表
 $color-scrollList_footer-border: var(--semi-color-border); // 滚动列表底部描边颜色
 
 // Width/Height
-$height-scrollList: 300px; 
+$height-scrollList: 300px;
 $height-scrollList_item: 36px;
 $width-scrollList_item-border: $border-thickness-control;
 $width-scrollList_item_sel_svg: 16px;
@@ -34,7 +34,7 @@ $spacing-scrollList_item_ul-margin: 0;
 $spacing-scrollList_item_ul-paddingBottom: ($height-scrollList - $height-scrollList_item) / 2;
 $spacing-scrollList_item_sel_svg-marginRight: 12px;
 $spacing-scrollList_item_wheel_list_outer-paddingRight: $height-scrollList_item / 2;
-$spacing-scrollList_item_wheel_list_shade_pre-marginTop: -($height-scrollList_item / 2 + $border-thickness-control);
+$spacing-scrollList_item_wheel_list_shade_pre-marginTop: -1 * ($height-scrollList_item / 2 + $border-thickness-control);
 $spacing-scrollList_item_wheel_list_shade_post-marginTop: $height-scrollList_item / 2 + $border-thickness-control;
 $spacing-scrollList_footer-padding: 10px;
 

package/lib/es/select/variables.scss

@@ -86,9 +86,9 @@ $spacing-select_option-paddingTop: $spacing-tight; // 选择器菜单项顶部
 $spacing-select_option-paddingBottom: $spacing-tight; // 选择器菜单项底部内边距
 $spacing-select_option_first-marginTop: $spacing-extra-tight; // 选择器第一个菜单项顶部外边距
 $spacing-select_option_last-marginBottom: $spacing-extra-tight; // 选择器最后一个菜单项顶部外边距
-$spacing-select_tag-marginTop: $spacing-super-tight - 1; // 多项选择器标签顶部外边距
+$spacing-select_tag-marginTop: $spacing-super-tight - 1px; // 多项选择器标签顶部外边距
 $spacing-select_tag-marginRight: $spacing-extra-tight; // 多项选择器标签右侧外边距
-$spacing-select_tag-marginBottom: $spacing-super-tight - 1; // 多项选择器标签底部外边距
+$spacing-select_tag-marginBottom: $spacing-super-tight - 1px; // 多项选择器标签底部外边距
 $spacing-select_selection-marginLeft: $spacing-base-tight; // 选择器内容区左侧外边距
 $spacing-select_insetLabel-marginRight: $spacing-base-tight; // 选择器内嵌标签右侧外边距
 $spacing-select_option_list-paddingTop: 0; // 选择器内容区顶部内边距

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

@@ -74,7 +74,7 @@ export interface SliderAdapter extends DefaultAdapter<SliderProps, SliderState>
         current: HTMLElement;
     };
     onHandleDown: (e: any) => any;
-    onHandleMove: (mousePos: number, isMin: boolean, stateChangeCallback?: () => void, clickTrack?: boolean) => boolean | void;
+    onHandleMove: (mousePos: number, isMin: boolean, stateChangeCallback?: () => void, clickTrack?: boolean, outPutValue?: number | number[]) => boolean | void;
     setEventDefault: (e: any) => void;
     setStateVal: (state: keyof SliderState, value: any) => void;
     onHandleEnter: (position: SliderState['focusPos']) => void;
@@ -175,6 +175,7 @@ export default class SliderFoundation extends BaseFoundation<SliderAdapter> {
     outPutValue: (inputValue: SliderProps['value']) => number | number[];
     handleDisabledChange: (disabled: SliderState['disabled']) => void;
     checkAndUpdateIsInRenderTreeState: () => boolean;
+    calculateOutputValue: (position: number, isMin: boolean) => undefined | number | number[];
     /**
      *
      *
@@ -195,7 +196,7 @@ export default class SliderFoundation extends BaseFoundation<SliderAdapter> {
      *
      * @memberof SliderFoundation
      */
-    setHandlePos: (position: number, isMin: boolean, clickTrack?: boolean) => void;
+    setHandlePos: (position: number, isMin: boolean, clickTrack: boolean, outPutValue: number | number[]) => void;
     /**
      * Determine which slider should be moved currently
      *

package/lib/es/slider/foundation.js

@@ -385,6 +385,16 @@ export default class SliderFoundation extends BaseFoundation {
     };
 
     this.checkAndUpdateIsInRenderTreeState = () => this._adapter.checkAndUpdateIsInRenderTreeState();
+
+    this.calculateOutputValue = (position, isMin) => {
+      const moveValue = this.transPosToValue(position, isMin);
+
+      if (moveValue === false) {
+        return undefined;
+      }
+
+      return this.outPutValue(moveValue);
+    };
     /**
      *
      *
@@ -500,7 +510,16 @@ export default class SliderFoundation extends BaseFoundation {
       pagePos = pagePos - this._dragOffset;
 
       if (chooseMovePos === 'min' && dragging[0] || chooseMovePos === 'max' && dragging[1]) {
-        this._adapter.onHandleMove(pagePos, chooseMovePos === 'min');
+        const outPutValue = this.calculateOutputValue(pagePos, chooseMovePos === 'min');
+
+        if (outPutValue === undefined) {
+          return false;
+        }
+
+        this._adapter.notifyChange(outPutValue); // allow drag for controlled component, so no _isControlledComponent check
+
+
+        this._adapter.onHandleMove(pagePos, chooseMovePos === 'min', undefined, false, outPutValue);
       }
 
       return true;
@@ -607,7 +626,22 @@ export default class SliderFoundation extends BaseFoundation {
       const mousePos = this.handleMousePos(e.pageX, e.pageY);
       const position = vertical ? mousePos.y : mousePos.x;
       const isMin = this.checkWhichHandle(position);
-      this.setHandlePos(position, isMin, true);
+      const outPutValue = this.calculateOutputValue(position, isMin);
+
+      if (outPutValue === undefined) {
+        return;
+      }
+
+      this._adapter.notifyChange(outPutValue); // check if is controlled component
+
+
+      if (this._isControlledComponent()) {
+        // only perform callback ops, skip UI update
+        return;
+      } // trigger UI state update
+
+
+      this.setHandlePos(position, isMin, true, outPutValue);
     };
     /**
      * Move the slider to the current click position
@@ -618,8 +652,9 @@ export default class SliderFoundation extends BaseFoundation {
 
     this.setHandlePos = function (position, isMin) {
       let clickTrack = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+      let outPutValue = arguments.length > 3 ? arguments[3] : undefined;
 
-      _this._adapter.onHandleMove(position, isMin, () => _this._adapter.onHandleUpAfter(), clickTrack);
+      _this._adapter.onHandleMove(position, isMin, () => _this._adapter.onHandleUpAfter(), clickTrack, outPutValue);
     };
     /**
      * Determine which slider should be moved currently

package/lib/es/tabs/tabs.css

@@ -19,7 +19,7 @@
   flex-direction: column;
 }
 .semi-tabs-bar-extra {
-  padding: 0 5px;
+  padding: 0px 5px;
 }
 .semi-tabs-bar .semi-tabs-tab {
   font-size: 14px;

package/lib/es/tabs/variables.scss

@@ -61,7 +61,7 @@ $font-tabs_bar_extra_large-lineHeight: $height-tabs_bar_extra_large; // 大尺
 $height-tabs_bar_extra_small: 36px; // 小尺寸页签高度
 $font-tabs_bar_extra_small-lineHeight: $height-tabs_bar_extra_small; // 小尺寸页签文字行高
 
-$spacing-tabs_bar_extra-paddingY: 0; // 附加操作垂直内边距
+$spacing-tabs_bar_extra-paddingY: 0px; // 附加操作垂直内边距
 $spacing-tabs_bar_extra-paddingX: 5px; // 附加操作水平内边距
 $spacing-tabs_tab_icon-marginRight: $spacing-tight; // 附加操作垂直内边距
 $spacing-tabs_tab_icon-top: 3px; // 页签图标顶部位置
@@ -85,8 +85,8 @@ $spacing-tabs_bar_line_tab_medium-paddingBottom: $spacing-base-tight - $width-ta
 $spacing-tabs_bar_line_tab_medium-paddingLeft: $spacing-extra-tight; // 中等尺寸线条式页签左侧内边距
 
 $spacing-tabs_bar_line_tab_left-padding: 12px; // 垂直线条式页签左侧内边距
-$spacing-tabs_bar_line_tab_left_small-padding: $spacing-tight - 2;  // 小尺寸垂直线条式页签左侧内边距
-$spacing-tabs_bar_line_tab_left_medium-padding: $spacing-base-tight - 2; // 中等尺寸垂直线条式页签左侧内边距
+$spacing-tabs_bar_line_tab_left_small-padding: $spacing-tight - 2px;  // 小尺寸垂直线条式页签左侧内边距
+$spacing-tabs_bar_line_tab_left_medium-padding: $spacing-base-tight - 2px; // 中等尺寸垂直线条式页签左侧内边距
 
 $spacing-tabs_content-paddingY: 5px; // 页签内容区垂直方向内边距
 $spacing-tabs_content-paddingX: 0; // 页签内容区水平方向内边距
@@ -96,7 +96,7 @@ $spacing-tabs_content_left-paddingY: 0; // 垂直页签内容区水平方向内
 
 $spacing-tabs_bar_card_tab-marginRight: $spacing-tight; // 卡片式页签右侧外边距
 $spacing-tabs_bar_card_tab_active-paddingTop: $spacing-tight; // 卡片式选中页签顶部内边距
-$spacing-tabs_bar_card_tab_active-paddingBottom: $spacing-tight - 1; // 卡片式选中页签底部内边距
+$spacing-tabs_bar_card_tab_active-paddingBottom: $spacing-tight - 1px; // 卡片式选中页签底部内边距
 $spacing-tabs_bar_card_tab_active-paddingLeft: $spacing-base-tight; // 卡片式选中页签左侧内边距
 $spacing-tabs_bar_card_tab_active-paddingRight: $spacing-base-tight; // 卡片式选中页签右侧内边距
 $spacing-tabs_bar_card_tab_left-marginBottom: $spacing-tight; // 垂直卡片式页签底部外边距

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

@@ -3,6 +3,6 @@ declare const cssClasses: {
 };
 declare const strings: {
     readonly SIZE_SET: readonly ["large", "default", "small"];
-    readonly STATUS: readonly ["default", "error", "warning"];
+    readonly STATUS: readonly ["success", "default", "error", "warning"];
 };
 export { cssClasses, strings };

package/lib/es/tagInput/constants.js

@@ -4,6 +4,6 @@ const cssClasses = {
 };
 const strings = {
   SIZE_SET: ['large', 'default', 'small'],
-  STATUS: ["default", "error", "warning"]
+  STATUS: ["success", "default", "error", "warning"]
 };
 export { cssClasses, strings };

package/lib/es/tooltip/variables.scss

@@ -1,5 +1,5 @@
-$horizontal-rate: 0.24; // 水平方向矫正因子
-$vertical-rate: 0; // 垂直方向矫正因子
+$horizontal-rate: 0.24; // 水平方向矫正因子 ignore-semi-css-trans
+$vertical-rate: 0; // 垂直方向矫正因子 ignore-semi-css-trans
 
 $motion-zoom_scale-from: 0.8; // 初始缩放 - 动画用
 $motion-zoom_opacity-from: 0; // 初始透明度 - 动画用
@@ -24,8 +24,9 @@ $height-tooltip_arrow: 7px; // 工具提示小三角箭头高度 - 水平
 
 $height-tooltip_arrow_vertical: 24px; // 工具提示小三角箭头高度 - 垂直
 $width-tooltip_arrow_vertical: 7px; // 工具提示小三角箭头宽度度 - 垂直
-$spacing-tooltip_arrow_offset-x: 1; // 水平方向渲染会有缝隙，所以加个偏移量
-$spacing-tooltip_arrow_offset-y: 1; // 垂直方向渲染会有缝隙，所以加个偏移量
+$spacing-tooltip_arrow_offset-x: 1px; // 水平方向渲染会有缝隙，所以加个偏移量
+$spacing-tooltip_arrow_offset-y: 1px; // 垂直方向渲染会有缝隙，所以加个偏移量
 
-$spacing-tooltip_arrow_adjusted_offset-y: 5; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
-$spacing-tooltip_arrow_adjusted_offset-x: round($horizontal-rate * $width-tooltip_arrow); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题
+$spacing-tooltip_arrow_adjusted_offset-y: 5px; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
+
+$spacing-tooltip_arrow_adjusted_offset-x: round($horizontal-rate * $width-tooltip_arrow); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题 ignore-semi-css-trans

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.8.0",
+    "version": "2.9.0-beta.0",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
@@ -8,7 +8,7 @@
     },
     "dependencies": {
         "@babel/runtime-corejs3": "^7.15.4",
-        "@douyinfe/semi-animation": "2.8.0",
+        "@douyinfe/semi-animation": "2.9.0-beta.0",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "date-fns": "^2.9.0",
@@ -24,7 +24,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "756ffea15f08be07c1fe934d06a7fd033d88a96e",
+    "gitHead": "acb1db546e6d3b2a7a40467d83d4b1e1b51e2b21",
     "devDependencies": {
         "@babel/plugin-proposal-decorators": "^7.15.8",
         "@babel/plugin-transform-runtime": "^7.15.8",

package/popover/variables.scss

@@ -4,25 +4,23 @@ $color-popover-bg-default: var(--semi-color-bg-3); // 默认背景色
 $color-popover-border-default: var(--semi-color-border); // 默认描边颜色
 
 // Width/Height
-$width-popover_arrow: 24px; // 水平箭头宽度
+$width-popover_arrow: 24px; // 水平箭头宽度 ignore-semi-css-trans
 $height-popover_arrow: 8px; // 水平箭头高度
 $height-popover_arrow_vertical: 24px; // 垂直箭头高度
 $width-popover_arrow_vertical: 8px; // 垂直箭头宽度
 $height-tooltip_arrow: $height-popover_arrow;
-$width-tooltip_arrow: $width-popover_arrow;
+$width-tooltip_arrow: $width-popover_arrow; //ignore-semi-css-trans
 $width-tooltip_arrow_vertical: $width-popover_arrow_vertical;
 $height-tooltip_arrow_vertical: $height-popover_arrow_vertical;
-$width-popover_title-border: 1px; 
+$width-popover_title-border: 1px;
 
 
 // Spacing
 $spacing-popover_title-padding: 8px; // 气泡卡片标题内边距
 $spacing-popover_withArrow-padding: 12px; // 带箭头的气泡卡片标题内边距
-$spacing-popover_arrow_adjusted_offset-y: 6; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
+$spacing-popover_arrow_adjusted_offset-y: 6px; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
 $spacing-tooltip_arrow_adjusted_offset-y: $spacing-popover_arrow_adjusted_offset-y; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
-$spacing-tooltip_arrow_adjusted_offset-x: round(
-    $horizontal-rate * $width-tooltip_arrow
-); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题
+$spacing-tooltip_arrow_adjusted_offset-x: round($horizontal-rate * $width-tooltip_arrow); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题 ignore-semi-css-trans
 
 // Radius
 $radius-popover: var(--semi-border-radius-medium); // 气泡卡片的圆角大小

package/scrollList/variables.scss

@@ -13,7 +13,7 @@ $color-scrollList_selected_item-icon: var(--semi-color-text-2); // 滚动列表
 $color-scrollList_footer-border: var(--semi-color-border); // 滚动列表底部描边颜色
 
 // Width/Height
-$height-scrollList: 300px; 
+$height-scrollList: 300px;
 $height-scrollList_item: 36px;
 $width-scrollList_item-border: $border-thickness-control;
 $width-scrollList_item_sel_svg: 16px;
@@ -34,7 +34,7 @@ $spacing-scrollList_item_ul-margin: 0;
 $spacing-scrollList_item_ul-paddingBottom: ($height-scrollList - $height-scrollList_item) / 2;
 $spacing-scrollList_item_sel_svg-marginRight: 12px;
 $spacing-scrollList_item_wheel_list_outer-paddingRight: $height-scrollList_item / 2;
-$spacing-scrollList_item_wheel_list_shade_pre-marginTop: -($height-scrollList_item / 2 + $border-thickness-control);
+$spacing-scrollList_item_wheel_list_shade_pre-marginTop: -1 * ($height-scrollList_item / 2 + $border-thickness-control);
 $spacing-scrollList_item_wheel_list_shade_post-marginTop: $height-scrollList_item / 2 + $border-thickness-control;
 $spacing-scrollList_footer-padding: 10px;
 

package/select/variables.scss

@@ -86,9 +86,9 @@ $spacing-select_option-paddingTop: $spacing-tight; // 选择器菜单项顶部
 $spacing-select_option-paddingBottom: $spacing-tight; // 选择器菜单项底部内边距
 $spacing-select_option_first-marginTop: $spacing-extra-tight; // 选择器第一个菜单项顶部外边距
 $spacing-select_option_last-marginBottom: $spacing-extra-tight; // 选择器最后一个菜单项顶部外边距
-$spacing-select_tag-marginTop: $spacing-super-tight - 1; // 多项选择器标签顶部外边距
+$spacing-select_tag-marginTop: $spacing-super-tight - 1px; // 多项选择器标签顶部外边距
 $spacing-select_tag-marginRight: $spacing-extra-tight; // 多项选择器标签右侧外边距
-$spacing-select_tag-marginBottom: $spacing-super-tight - 1; // 多项选择器标签底部外边距
+$spacing-select_tag-marginBottom: $spacing-super-tight - 1px; // 多项选择器标签底部外边距
 $spacing-select_selection-marginLeft: $spacing-base-tight; // 选择器内容区左侧外边距
 $spacing-select_insetLabel-marginRight: $spacing-base-tight; // 选择器内嵌标签右侧外边距
 $spacing-select_option_list-paddingTop: 0; // 选择器内容区顶部内边距

package/slider/foundation.ts

@@ -83,7 +83,7 @@ export interface SliderAdapter extends DefaultAdapter<SliderProps, SliderState>{
     getMinHandleEl: () => { current: HTMLElement };
     getMaxHandleEl: () => { current: HTMLElement };
     onHandleDown: (e: any) => any;
-    onHandleMove: (mousePos: number, isMin: boolean, stateChangeCallback?: () => void, clickTrack?: boolean) => boolean | void;
+    onHandleMove: (mousePos: number, isMin: boolean, stateChangeCallback?: () => void, clickTrack?: boolean, outPutValue?: number | number[]) => boolean | void;
     setEventDefault: (e: any) => void;
     setStateVal: (state: keyof SliderState, value: any) => void;
     onHandleEnter: (position: SliderState['focusPos']) => void;
@@ -406,6 +406,14 @@ export default class SliderFoundation extends BaseFoundation<SliderAdapter> {
 
     checkAndUpdateIsInRenderTreeState = () => this._adapter.checkAndUpdateIsInRenderTreeState();
 
+    calculateOutputValue = (position: number, isMin: boolean): undefined | number | number[] => {
+        const moveValue = this.transPosToValue(position, isMin);
+        if (moveValue === false) {
+            return undefined;
+        }
+        return this.outPutValue(moveValue);
+    }
+
     /**
      *
      *
@@ -487,7 +495,16 @@ export default class SliderFoundation extends BaseFoundation<SliderAdapter> {
         let pagePos = vertical ? mousePos.y : mousePos.x;
         pagePos = pagePos - this._dragOffset;
         if ((chooseMovePos === 'min' && dragging[0]) || (chooseMovePos === 'max' && dragging[1])) {
-            this._adapter.onHandleMove(pagePos, chooseMovePos === 'min');
+            const outPutValue = this.calculateOutputValue(pagePos, chooseMovePos === 'min' );
+            
+            if (outPutValue === undefined) {
+                return false;
+            }
+            
+            this._adapter.notifyChange(outPutValue);
+
+            // allow drag for controlled component, so no _isControlledComponent check
+            this._adapter.onHandleMove(pagePos, chooseMovePos === 'min', undefined, false, outPutValue);
         }
         return true;
     };
@@ -565,7 +582,22 @@ export default class SliderFoundation extends BaseFoundation<SliderAdapter> {
         const mousePos = this.handleMousePos(e.pageX, e.pageY);
         const position = vertical ? mousePos.y : mousePos.x;
         const isMin = this.checkWhichHandle(position);
-        this.setHandlePos(position, isMin, true);
+
+        const outPutValue = this.calculateOutputValue(position, isMin);
+        if (outPutValue === undefined) {
+            return;
+        }
+
+        this._adapter.notifyChange(outPutValue);
+
+        // check if is controlled component
+        if (this._isControlledComponent()) {
+            // only perform callback ops, skip UI update
+            return;
+        }
+
+        // trigger UI state update
+        this.setHandlePos(position, isMin, true, outPutValue);
     };
 
     /**
@@ -573,8 +605,8 @@ export default class SliderFoundation extends BaseFoundation<SliderAdapter> {
      *
      * @memberof SliderFoundation
      */
-    setHandlePos = (position: number, isMin: boolean, clickTrack = false) => {
-        this._adapter.onHandleMove(position, isMin, () => this._adapter.onHandleUpAfter(), clickTrack);
+    setHandlePos = (position: number, isMin: boolean, clickTrack = false, outPutValue: number | number[]) => {
+        this._adapter.onHandleMove(position, isMin, () => this._adapter.onHandleUpAfter(), clickTrack, outPutValue);
     };
 
     /**

package/tabs/variables.scss

@@ -61,7 +61,7 @@ $font-tabs_bar_extra_large-lineHeight: $height-tabs_bar_extra_large; // 大尺
 $height-tabs_bar_extra_small: 36px; // 小尺寸页签高度
 $font-tabs_bar_extra_small-lineHeight: $height-tabs_bar_extra_small; // 小尺寸页签文字行高
 
-$spacing-tabs_bar_extra-paddingY: 0; // 附加操作垂直内边距
+$spacing-tabs_bar_extra-paddingY: 0px; // 附加操作垂直内边距
 $spacing-tabs_bar_extra-paddingX: 5px; // 附加操作水平内边距
 $spacing-tabs_tab_icon-marginRight: $spacing-tight; // 附加操作垂直内边距
 $spacing-tabs_tab_icon-top: 3px; // 页签图标顶部位置
@@ -85,8 +85,8 @@ $spacing-tabs_bar_line_tab_medium-paddingBottom: $spacing-base-tight - $width-ta
 $spacing-tabs_bar_line_tab_medium-paddingLeft: $spacing-extra-tight; // 中等尺寸线条式页签左侧内边距
 
 $spacing-tabs_bar_line_tab_left-padding: 12px; // 垂直线条式页签左侧内边距
-$spacing-tabs_bar_line_tab_left_small-padding: $spacing-tight - 2;  // 小尺寸垂直线条式页签左侧内边距
-$spacing-tabs_bar_line_tab_left_medium-padding: $spacing-base-tight - 2; // 中等尺寸垂直线条式页签左侧内边距
+$spacing-tabs_bar_line_tab_left_small-padding: $spacing-tight - 2px;  // 小尺寸垂直线条式页签左侧内边距
+$spacing-tabs_bar_line_tab_left_medium-padding: $spacing-base-tight - 2px; // 中等尺寸垂直线条式页签左侧内边距
 
 $spacing-tabs_content-paddingY: 5px; // 页签内容区垂直方向内边距
 $spacing-tabs_content-paddingX: 0; // 页签内容区水平方向内边距
@@ -96,7 +96,7 @@ $spacing-tabs_content_left-paddingY: 0; // 垂直页签内容区水平方向内
 
 $spacing-tabs_bar_card_tab-marginRight: $spacing-tight; // 卡片式页签右侧外边距
 $spacing-tabs_bar_card_tab_active-paddingTop: $spacing-tight; // 卡片式选中页签顶部内边距
-$spacing-tabs_bar_card_tab_active-paddingBottom: $spacing-tight - 1; // 卡片式选中页签底部内边距
+$spacing-tabs_bar_card_tab_active-paddingBottom: $spacing-tight - 1px; // 卡片式选中页签底部内边距
 $spacing-tabs_bar_card_tab_active-paddingLeft: $spacing-base-tight; // 卡片式选中页签左侧内边距
 $spacing-tabs_bar_card_tab_active-paddingRight: $spacing-base-tight; // 卡片式选中页签右侧内边距
 $spacing-tabs_bar_card_tab_left-marginBottom: $spacing-tight; // 垂直卡片式页签底部外边距

package/tagInput/constants.ts

@@ -6,7 +6,7 @@ const cssClasses = {
 
 const strings = {
     SIZE_SET: ['large', 'default', 'small'],
-    STATUS: ["default", "error", "warning"],
+    STATUS: ["success", "default", "error", "warning"],
 } as const;
 
 export {

package/tooltip/variables.scss

@@ -1,5 +1,5 @@
-$horizontal-rate: 0.24; // 水平方向矫正因子
-$vertical-rate: 0; // 垂直方向矫正因子
+$horizontal-rate: 0.24; // 水平方向矫正因子 ignore-semi-css-trans
+$vertical-rate: 0; // 垂直方向矫正因子 ignore-semi-css-trans
 
 $motion-zoom_scale-from: 0.8; // 初始缩放 - 动画用
 $motion-zoom_opacity-from: 0; // 初始透明度 - 动画用
@@ -24,8 +24,9 @@ $height-tooltip_arrow: 7px; // 工具提示小三角箭头高度 - 水平
 
 $height-tooltip_arrow_vertical: 24px; // 工具提示小三角箭头高度 - 垂直
 $width-tooltip_arrow_vertical: 7px; // 工具提示小三角箭头宽度度 - 垂直
-$spacing-tooltip_arrow_offset-x: 1; // 水平方向渲染会有缝隙，所以加个偏移量
-$spacing-tooltip_arrow_offset-y: 1; // 垂直方向渲染会有缝隙，所以加个偏移量
+$spacing-tooltip_arrow_offset-x: 1px; // 水平方向渲染会有缝隙，所以加个偏移量
+$spacing-tooltip_arrow_offset-y: 1px; // 垂直方向渲染会有缝隙，所以加个偏移量
 
-$spacing-tooltip_arrow_adjusted_offset-y: 5; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
-$spacing-tooltip_arrow_adjusted_offset-x: round($horizontal-rate * $width-tooltip_arrow); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题
+$spacing-tooltip_arrow_adjusted_offset-y: 5px; // 垂直方向上的校正偏移量，主要修正三角形有棱角的问题
+
+$spacing-tooltip_arrow_adjusted_offset-x: round($horizontal-rate * $width-tooltip_arrow); // 水平方向上的校正偏移量，主要修正三角形有棱角的问题 ignore-semi-css-trans