style: [Cascader] fix cursor position incorrent in cascader, single-select, size small & large (#1477)

packages/semi-foundation/cascader/cascader.scss

@@ -324,6 +324,14 @@ $module: #{$prefix}-cascader;
             align-items: center;
             position: relative;
 
+            &-small {
+                height: $height-cascader_selection_wrapper_small;
+            }
+
+            &-large {
+                height: $height-cascader_selection_wrapper_large;
+            }
+
             .#{$prefix}-input-wrapper {
                 position: absolute;
                 top: 0;

packages/semi-foundation/cascader/variables.scss

@@ -96,7 +96,9 @@ $height-cascader_option_list: 180px; // 级联选择菜单高度
 $height-cascader_selection_tagInput_wrapper_small: 22px;  //级联选择多选搜索时搜索框最小高度 - 小尺寸
 $height-cascader_selection_tagInput_wrapper_default: 30px;  //级联选择多选搜索时搜索框最小高度 - 默认尺寸
 $height-cascader_selection_tagInput_wrapper_large: 38px;  //级联选择多选搜索时搜索框最小高度 - 大尺寸
-$height-cascader_selection_wrapper: 30px;
+$height-cascader_selection_wrapper_small: 22px;  //级联选择单选搜索时搜索框高度 - 小尺寸
+$height-cascader_selection_wrapper: 30px; // 级联选择单选搜索时搜索框高度 - 默认尺寸
+$height-cascader_selection_wrapper_large: 38px;  //级联选择单选搜索时搜索框高度 - 大尺寸
 
 $spacing-cascader_text-marginX: $spacing-base-tight; // 级联选择 prefix/suffix 文字水平内间距
 $spacing-cascader_icon-marginX: $spacing-tight; // 级联选择 prefix/suffix 图标水平内间距

packages/semi-ui/cascader/_story/cascader.stories.jsx

@@ -1880,3 +1880,32 @@ export const RefMethods = () => {
       </div>
   );
 };
+
+
+export const FixCursorPositionError = () => {
+  // https://github.com/DouyinFE/semi-design/issues/1468
+  const props = {
+    style: { width: 300 },
+    treeData: treeData5,
+    filterTreeNode: true,
+    leafOnly: true,
+  };
+
+  const multipleProps =  { ...props, multiple: true };
+
+  return (<>
+    <p>多选</p>
+    <Cascader {...multipleProps} size={'small'} />
+    <br/><br/>
+    <Cascader {...multipleProps} size={'default'} />
+    <br/><br/>
+    <Cascader {...multipleProps} size={'large'}/>
+
+    <p>单选</p>
+    <Cascader {...props} size={'small'} />
+    <br/><br/>
+    <Cascader {...props} size={'default'} />
+    <br/><br/>
+    <Cascader {...props} size={'large'}/>
+  </>);
+}

packages/semi-ui/cascader/index.tsx

@@ -580,6 +580,7 @@ class Cascader extends BaseComponent<CascaderProps, CascaderState> {
         };
         const wrappercls = cls({
             [`${prefixcls}-search-wrapper`]: true,
+            [`${prefixcls}-search-wrapper-${size}`]: size !== 'default',
         });
 
         const displayText = this.renderDisplayText();