@douyinfe/semi-foundation 2.43.1 → 2.44.0-beta.0

package/cascader/cascader.scss

@@ -395,6 +395,7 @@ $module: #{$prefix}-cascader;
         padding-right: $spacing-cascader_option-paddingRight;
     }
 
+
     .#{$module}-option-list {
         box-sizing: border-box;
         display: inline-block;

package/cascader/foundation.ts

@@ -28,6 +28,12 @@ export interface BasicData {
     pathData?: BasicCascaderData[]
 }
 
+export interface Virtualize {
+    itemSize: number;
+    height?: number | string;
+    width?: number | string
+}
+
 export interface BasicEntities {
     [idx: string]: BasicEntity
 }
@@ -157,6 +163,7 @@ export interface BasicCascaderProps {
     leafOnly?: boolean;
     enableLeafClick?: boolean;
     preventScroll?: boolean;
+    virtualizeInSearch?: Virtualize;
     onClear?: () => void;
     triggerRender?: (props: BasicTriggerRenderProps) => any;
     onListScroll?: (e: any, panel: BasicScrollPanelProps) => void;

package/lib/cjs/cascader/cascader.scss

@@ -395,6 +395,7 @@ $module: #{$prefix}-cascader;
         padding-right: $spacing-cascader_option-paddingRight;
     }
 
+
     .#{$module}-option-list {
         box-sizing: border-box;
         display: inline-block;

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

@@ -6,6 +6,11 @@ export interface BasicData {
     searchText: any[];
     pathData?: BasicCascaderData[];
 }
+export interface Virtualize {
+    itemSize: number;
+    height?: number | string;
+    width?: number | string;
+}
 export interface BasicEntities {
     [idx: string]: BasicEntity;
 }
@@ -105,6 +110,7 @@ export interface BasicCascaderProps {
     leafOnly?: boolean;
     enableLeafClick?: boolean;
     preventScroll?: boolean;
+    virtualizeInSearch?: Virtualize;
     onClear?: () => void;
     triggerRender?: (props: BasicTriggerRenderProps) => any;
     onListScroll?: (e: any, panel: BasicScrollPanelProps) => void;

package/lib/cjs/popconfirm/popconfirm.css

@@ -37,9 +37,11 @@
   flex-direction: column;
 }
 .semi-popconfirm-body {
-  margin-left: 36px;
   color: var(--semi-color-text-2);
 }
+.semi-popconfirm-body-withIcon {
+  margin-left: 36px;
+}
 .semi-popconfirm-body > p {
   margin: 0;
   padding: 0;

package/lib/cjs/popconfirm/popconfirm.scss

@@ -46,8 +46,9 @@ $module: #{$prefix}-popconfirm;
     }
 
     &-body {
-        margin-left: $width-popconfirm-icon + $spacing-popconfirm_header_icon-marginRight;
-
+        &-withIcon {
+            margin-left: $width-popconfirm-icon + $spacing-popconfirm_header_icon-marginRight;
+        }
         color: $color-popconfirm_body-text;
 
         & > p {

package/lib/cjs/table/table.css

@@ -493,6 +493,11 @@
   transform: rotate(0deg);
 }
 
+.semi-table-column-filter-dropdown .semi-dropdown-menu {
+  max-height: 290px;
+  overflow-y: auto;
+}
+
 .semi-table-wrapper-rtl .semi-table {
   direction: rtl;
   text-align: right;

package/lib/cjs/table/table.scss

@@ -620,4 +620,11 @@ $module: #{$prefix}-table;
     }
 }
 
+.#{$module}-column-filter-dropdown {
+    .#{$prefix}-dropdown-menu {
+        max-height: $height-table_column_filter_dropdown;
+        overflow-y: auto;
+    }
+}
+
 @import './rtl.scss';

package/lib/cjs/table/variables.scss

@@ -42,6 +42,7 @@ $width-table_cell_fixed_left_last: 1px; // 表格左上角单元格底部描边
 $width-table_cell_fixed_right_first: 1px; // 表格左上角单元格右侧描边宽度
 $width-table_react_resizable_handle: 9px; // 表格伸缩列调节热区宽度
 $height-table_pagination_outer_min: 60px; // 表格分页器高度
+$height-table_column_filter_dropdown: 290px; // 表格过滤筛选列表最大高度
 
 
 // Color no need to change

package/lib/cjs/tag/tag.css

@@ -44,6 +44,14 @@
 .semi-tag-invisible {
   display: none;
 }
+.semi-tag-prefix-icon {
+  display: flex;
+  padding-right: 4px;
+}
+.semi-tag-suffix-icon {
+  display: flex;
+  padding-left: 4px;
+}
 .semi-tag-content {
   flex: 1;
 }

package/lib/cjs/tag/tag.scss

@@ -51,6 +51,16 @@ $types: "ghost", "solid", "light";
         display: none;
     }
 
+    &-prefix-icon {
+        display: flex;
+        padding-right: $spacing-tag_prefix_icon_paddingRight;
+    }
+
+    &-suffix-icon {
+        display: flex;
+        padding-left: $spacing-tag_suffix_icon_paddingLeft;
+    }
+
     &-content {
         flex: 1;
 

package/lib/cjs/tag/variables.scss

@@ -25,6 +25,9 @@ $radius-tag_circle: var(--semi-border-radius-full); // 胶囊标签圆角大小
 $spacing-tag_small-paddingY: 2px; // 小尺寸标签垂直方向内边距
 $spacing-tag_small-paddingX: $spacing-tight; // 小尺寸标签水平方向内边距
 
+$spacing-tag_prefix_icon_paddingRight: $spacing-extra-tight; // 后缀图标右侧边距 
+$spacing-tag_suffix_icon_paddingLeft: $spacing-extra-tight; // 后缀图标左侧边距
+
 $spacing-tag_large-paddingY: 4px; // 大尺寸标签垂直方向内边距
 $spacing-tag_large-paddingX: $spacing-tight; // 大尺寸标签水平方向内边距
 

package/lib/cjs/tooltip/foundation.js

@@ -670,8 +670,7 @@ class Tooltip extends _foundation.default {
      * 基于视口和容器一起判断，以下几种情况允许从原方向转到反方向，以判断是否应该由top->bottom为例子
      *
      * 1. 视口上下空间不足 且 容器上空间❌下空间✅
-     * 2. 视口上空间❌下空间✅ 且 容器上下空间不足
-     * 3. 视口上空间❌下空间✅ 且 容器上空间❌下空间✅
+     * 2. 视口上空间❌下空间✅
      *
      * Based on the judgment of the viewport and the container, the following situations are allowed to turn from the original direction to the opposite direction
      * to judge whether it should be top->bottom as an example
@@ -679,7 +678,7 @@ class Tooltip extends _foundation.default {
      * 2. The space above the viewport ❌ the space below ✅ and the space above and below the container is insufficient
      * 3. Viewport upper space ❌ lower space✅ and container upper space ❌ lower space✅
      */
-    return viewOverFlow && shouldReverseContainer || shouldReverseView && containerOverFlow || shouldReverseView && shouldReverseContainer;
+    return viewOverFlow && shouldReverseContainer || shouldReverseView;
   }
   // place the dom correctly
   adjustPosIfNeed(position, style, triggerRect, wrapperRect, containerRect) {

package/lib/es/cascader/cascader.scss

@@ -395,6 +395,7 @@ $module: #{$prefix}-cascader;
         padding-right: $spacing-cascader_option-paddingRight;
     }
 
+
     .#{$module}-option-list {
         box-sizing: border-box;
         display: inline-block;

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

@@ -6,6 +6,11 @@ export interface BasicData {
     searchText: any[];
     pathData?: BasicCascaderData[];
 }
+export interface Virtualize {
+    itemSize: number;
+    height?: number | string;
+    width?: number | string;
+}
 export interface BasicEntities {
     [idx: string]: BasicEntity;
 }
@@ -105,6 +110,7 @@ export interface BasicCascaderProps {
     leafOnly?: boolean;
     enableLeafClick?: boolean;
     preventScroll?: boolean;
+    virtualizeInSearch?: Virtualize;
     onClear?: () => void;
     triggerRender?: (props: BasicTriggerRenderProps) => any;
     onListScroll?: (e: any, panel: BasicScrollPanelProps) => void;

package/lib/es/popconfirm/popconfirm.css

@@ -37,9 +37,11 @@
   flex-direction: column;
 }
 .semi-popconfirm-body {
-  margin-left: 36px;
   color: var(--semi-color-text-2);
 }
+.semi-popconfirm-body-withIcon {
+  margin-left: 36px;
+}
 .semi-popconfirm-body > p {
   margin: 0;
   padding: 0;

package/lib/es/popconfirm/popconfirm.scss

@@ -46,8 +46,9 @@ $module: #{$prefix}-popconfirm;
     }
 
     &-body {
-        margin-left: $width-popconfirm-icon + $spacing-popconfirm_header_icon-marginRight;
-
+        &-withIcon {
+            margin-left: $width-popconfirm-icon + $spacing-popconfirm_header_icon-marginRight;
+        }
         color: $color-popconfirm_body-text;
 
         & > p {

package/lib/es/table/table.css

@@ -493,6 +493,11 @@
   transform: rotate(0deg);
 }
 
+.semi-table-column-filter-dropdown .semi-dropdown-menu {
+  max-height: 290px;
+  overflow-y: auto;
+}
+
 .semi-table-wrapper-rtl .semi-table {
   direction: rtl;
   text-align: right;

package/lib/es/table/table.scss

@@ -620,4 +620,11 @@ $module: #{$prefix}-table;
     }
 }
 
+.#{$module}-column-filter-dropdown {
+    .#{$prefix}-dropdown-menu {
+        max-height: $height-table_column_filter_dropdown;
+        overflow-y: auto;
+    }
+}
+
 @import './rtl.scss';

package/lib/es/table/variables.scss

@@ -42,6 +42,7 @@ $width-table_cell_fixed_left_last: 1px; // 表格左上角单元格底部描边
 $width-table_cell_fixed_right_first: 1px; // 表格左上角单元格右侧描边宽度
 $width-table_react_resizable_handle: 9px; // 表格伸缩列调节热区宽度
 $height-table_pagination_outer_min: 60px; // 表格分页器高度
+$height-table_column_filter_dropdown: 290px; // 表格过滤筛选列表最大高度
 
 
 // Color no need to change

package/lib/es/tag/tag.css

@@ -44,6 +44,14 @@
 .semi-tag-invisible {
   display: none;
 }
+.semi-tag-prefix-icon {
+  display: flex;
+  padding-right: 4px;
+}
+.semi-tag-suffix-icon {
+  display: flex;
+  padding-left: 4px;
+}
 .semi-tag-content {
   flex: 1;
 }

package/lib/es/tag/tag.scss

@@ -51,6 +51,16 @@ $types: "ghost", "solid", "light";
         display: none;
     }
 
+    &-prefix-icon {
+        display: flex;
+        padding-right: $spacing-tag_prefix_icon_paddingRight;
+    }
+
+    &-suffix-icon {
+        display: flex;
+        padding-left: $spacing-tag_suffix_icon_paddingLeft;
+    }
+
     &-content {
         flex: 1;
 

package/lib/es/tag/variables.scss

@@ -25,6 +25,9 @@ $radius-tag_circle: var(--semi-border-radius-full); // 胶囊标签圆角大小
 $spacing-tag_small-paddingY: 2px; // 小尺寸标签垂直方向内边距
 $spacing-tag_small-paddingX: $spacing-tight; // 小尺寸标签水平方向内边距
 
+$spacing-tag_prefix_icon_paddingRight: $spacing-extra-tight; // 后缀图标右侧边距 
+$spacing-tag_suffix_icon_paddingLeft: $spacing-extra-tight; // 后缀图标左侧边距
+
 $spacing-tag_large-paddingY: 4px; // 大尺寸标签垂直方向内边距
 $spacing-tag_large-paddingX: $spacing-tight; // 大尺寸标签水平方向内边距
 

package/lib/es/tooltip/foundation.js

@@ -663,8 +663,7 @@ export default class Tooltip extends BaseFoundation {
      * 基于视口和容器一起判断，以下几种情况允许从原方向转到反方向，以判断是否应该由top->bottom为例子
      *
      * 1. 视口上下空间不足 且 容器上空间❌下空间✅
-     * 2. 视口上空间❌下空间✅ 且 容器上下空间不足
-     * 3. 视口上空间❌下空间✅ 且 容器上空间❌下空间✅
+     * 2. 视口上空间❌下空间✅
      *
      * Based on the judgment of the viewport and the container, the following situations are allowed to turn from the original direction to the opposite direction
      * to judge whether it should be top->bottom as an example
@@ -672,7 +671,7 @@ export default class Tooltip extends BaseFoundation {
      * 2. The space above the viewport ❌ the space below ✅ and the space above and below the container is insufficient
      * 3. Viewport upper space ❌ lower space✅ and container upper space ❌ lower space✅
      */
-    return viewOverFlow && shouldReverseContainer || shouldReverseView && containerOverFlow || shouldReverseView && shouldReverseContainer;
+    return viewOverFlow && shouldReverseContainer || shouldReverseView;
   }
   // place the dom correctly
   adjustPosIfNeed(position, style, triggerRect, wrapperRect, containerRect) {

package/package.json

@@ -1,13 +1,13 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.43.1",
+    "version": "2.44.0-beta.0",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.43.1",
+        "@douyinfe/semi-animation": "2.44.0-beta.0",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "date-fns": "^2.29.3",
@@ -23,7 +23,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "84abaef26e42768a44ba5db31b9891bf508a314e",
+    "gitHead": "f304407b2f9fb23f8464d59b685ff1f265f6869a",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",

package/popconfirm/popconfirm.scss

@@ -46,8 +46,9 @@ $module: #{$prefix}-popconfirm;
     }
 
     &-body {
-        margin-left: $width-popconfirm-icon + $spacing-popconfirm_header_icon-marginRight;
-
+        &-withIcon {
+            margin-left: $width-popconfirm-icon + $spacing-popconfirm_header_icon-marginRight;
+        }
         color: $color-popconfirm_body-text;
 
         & > p {

package/table/table.scss

@@ -620,4 +620,11 @@ $module: #{$prefix}-table;
     }
 }
 
+.#{$module}-column-filter-dropdown {
+    .#{$prefix}-dropdown-menu {
+        max-height: $height-table_column_filter_dropdown;
+        overflow-y: auto;
+    }
+}
+
 @import './rtl.scss';

package/table/variables.scss

@@ -42,6 +42,7 @@ $width-table_cell_fixed_left_last: 1px; // 表格左上角单元格底部描边
 $width-table_cell_fixed_right_first: 1px; // 表格左上角单元格右侧描边宽度
 $width-table_react_resizable_handle: 9px; // 表格伸缩列调节热区宽度
 $height-table_pagination_outer_min: 60px; // 表格分页器高度
+$height-table_column_filter_dropdown: 290px; // 表格过滤筛选列表最大高度
 
 
 // Color no need to change

package/tag/tag.scss

@@ -51,6 +51,16 @@ $types: "ghost", "solid", "light";
         display: none;
     }
 
+    &-prefix-icon {
+        display: flex;
+        padding-right: $spacing-tag_prefix_icon_paddingRight;
+    }
+
+    &-suffix-icon {
+        display: flex;
+        padding-left: $spacing-tag_suffix_icon_paddingLeft;
+    }
+
     &-content {
         flex: 1;
 

package/tag/variables.scss

@@ -25,6 +25,9 @@ $radius-tag_circle: var(--semi-border-radius-full); // 胶囊标签圆角大小
 $spacing-tag_small-paddingY: 2px; // 小尺寸标签垂直方向内边距
 $spacing-tag_small-paddingX: $spacing-tight; // 小尺寸标签水平方向内边距
 
+$spacing-tag_prefix_icon_paddingRight: $spacing-extra-tight; // 后缀图标右侧边距 
+$spacing-tag_suffix_icon_paddingLeft: $spacing-extra-tight; // 后缀图标左侧边距
+
 $spacing-tag_large-paddingY: 4px; // 大尺寸标签垂直方向内边距
 $spacing-tag_large-paddingX: $spacing-tight; // 大尺寸标签水平方向内边距
 

package/tooltip/foundation.ts

@@ -709,8 +709,7 @@ export default class Tooltip<P = Record<string, any>, S = Record<string, any>> e
          * 基于视口和容器一起判断，以下几种情况允许从原方向转到反方向，以判断是否应该由top->bottom为例子
          *
          * 1. 视口上下空间不足 且 容器上空间❌下空间✅
-         * 2. 视口上空间❌下空间✅ 且 容器上下空间不足
-         * 3. 视口上空间❌下空间✅ 且 容器上空间❌下空间✅
+         * 2. 视口上空间❌下空间✅
          * 
          * Based on the judgment of the viewport and the container, the following situations are allowed to turn from the original direction to the opposite direction
          * to judge whether it should be top->bottom as an example
@@ -718,7 +717,7 @@ export default class Tooltip<P = Record<string, any>, S = Record<string, any>> e
          * 2. The space above the viewport ❌ the space below ✅ and the space above and below the container is insufficient
          * 3. Viewport upper space ❌ lower space✅ and container upper space ❌ lower space✅
          */
-        return (viewOverFlow && shouldReverseContainer) || (shouldReverseView && containerOverFlow) || (shouldReverseView && shouldReverseContainer);
+        return (viewOverFlow && shouldReverseContainer) || shouldReverseView ;
     }
 
     // place the dom correctly