@douyinfe/semi-foundation 2.36.0-alpha.0 → 2.36.0

package/timePicker/foundation.ts

@@ -84,10 +84,8 @@ class TimePickerFoundation<P = Record<string, any>, S = Record<string, any>> ext
         return hDis || mDis || sDis;
     }
 
-    isValidTimeZone(timeZone?: string | number) {
-        const _timeZone = timeZone === undefined ? this.getProp('timeZone') : timeZone;
-
-        return ['string', 'number'].includes(typeof _timeZone) && _timeZone !== '';
+    isValidTimeZone(timeZone: string | number) {
+        return ['string', 'number'].includes(typeof timeZone) && timeZone !== '';
     }
 
     getDefaultFormatIfNeed(): string {
@@ -121,7 +119,7 @@ class TimePickerFoundation<P = Record<string, any>, S = Record<string, any>> ext
         (value as any[]).forEach(v => {
             const pv = parseToDate(v, formatToken, dateFnsLocale);
             if (!isNaN(pv.getTime())) {
-                parsedValues.push(this.isValidTimeZone() ? utcToZonedTime(pv, timeZone) : pv);
+                parsedValues.push(this.isValidTimeZone(timeZone) ? utcToZonedTime(pv, timeZone) : pv);
             }
         });
 
@@ -422,7 +420,7 @@ class TimePickerFoundation<P = Record<string, any>, S = Record<string, any>> ext
             _value = Array.isArray(_value) ? _value[0] : _value;
         }
 
-        if (this.isValidTimeZone() && _value) {
+        if (this.isValidTimeZone(timeZone) && _value) {
             const formatToken = this.getValidFormat();
             if (Array.isArray(_value)) {
                 _value = _value.map(v => zonedTimeToUtc(v, timeZone));

package/timeline/timeline.scss

@@ -2,68 +2,6 @@
 
 $module: #{$prefix}-timeline;
 
-@mixin item-children {
-    &-tail,
-    &-head,
-    &-head-custom {
-        left: $spacing-timeline_item_head_custom-left;
-    }
-    &-head{
-        &.#{$module}-item-head-custom{
-            margin-left: 0;
-        }
-    }
-    &-head {
-        margin-left: $spacing-timeline_item_head-marginLeft;
-    }
-}
-
-@mixin item-direction {
-    &-left {
-        .#{$module}-item-content {
-            left: $spacing-timeline_item_left_item_content-left;
-            width: $width-timeline_item_left_item_content;
-            text-align: left;
-        }
-    }
-
-    &-right {
-        .#{$module}-item-content {
-            width: $width-timeline_item_right_item_content;
-            margin: $spacing-timeline_item_right_item_content;
-            text-align: right;
-        }
-    }
-}
-
-@mixin item-center {
-    &-center {
-        .#{$module}-item {
-            &-content-time {
-                position: absolute;
-                top: $spacing-timeline_time-top;
-                margin-left: $spacing-timeline_item_content_time-marginLeft;
-                width: $width-timeline_item_content_time;
-                text-align: right;
-            }
-        }
-    }
-}
-
-@mixin item-right {
-    .#{$module}-item {
-        &-tail,
-        &-head,
-        &-head-custom {
-            left: $spacing-timeline_item_right_item-left;
-        }
-
-        &-content {
-            width: $width-timeline_item_right_content;
-        }
-    }
-}
-
 .#{$module} {
     margin: $spacing-timeline-margin;
     padding: $spacing-timeline-padding;
@@ -177,53 +115,65 @@ $module: #{$prefix}-timeline;
     &-right,
     &-center {
         .#{$module}-item {
-            @include item-children;
-            @include item-direction;
-        }
-    }
+            &-tail,
+            &-head,
+            &-head-custom {
+                left: $spacing-timeline_item_head_custom-left;
+            }
+            &-head{
+                &.#{$module}-item-head-custom{
+                    margin-left: 0;
+                }
+            }
+            &-head {
+                margin-left: $spacing-timeline_item_head-marginLeft;
+            }
 
-   
-    @include item-center;
+            &-left {
+                .#{$module}-item-content {
+                    left: $spacing-timeline_item_left_item_content-left;
+                    width: $width-timeline_item_left_item_content;
+                    text-align: left;
+                }
+            }
 
-    &-right {
-        .#{$module}-item-right {
-            @include item-right;
+            &-right {
+                .#{$module}-item-content {
+                    width: $width-timeline_item_right_item_content;
+                    margin: $spacing-timeline_item_right_item_content;
+                    text-align: right;
+                }
+            }
         }
     }
-}
 
-// for c2d
-.#{$module}-item {
-    &-alternate,
-    &-mode-right,
     &-center {
         .#{$module}-item {
-            @include item-children;
-        }
-        &.#{$module}-item {
-            @include item-direction;
-        }
-    }
-
-    &-alternate,
-    &-mode-right,
-    &-center,
-    &-left {
-        &.#{$module}-item {
-            &.#{$module}-item-not-last-child {
-                & > .#{$module}-item-tail {
-                    border-left: $width-timeline_tail-border solid $color-timeline_tail-border;
-                }
+            &-content-time {
+                position: absolute;
+                top: $spacing-timeline_time-top;
+                margin-left: $spacing-timeline_item_content_time-marginLeft;
+                width: $width-timeline_item_content_time;
+                text-align: right;
             }
         }
     }
 
-    @include item-center;
+    &-right {
+        .#{$module}-item-right {
+            .#{$module}-item {
+                &-tail,
+                &-head,
+                &-head-custom {
+                    left: $spacing-timeline_item_right_item-left;
+                }
 
-    &-mode-right {
-        &.#{$module}-item-right {
-            @include item-right;
+                &-content {
+                    width: $width-timeline_item_right_content;
+                }
+            }
         }
     }
 }
+
 @import './rtl.scss';

package/typography/constants.ts

@@ -5,6 +5,7 @@ const cssClasses = {
 };
 
 const strings = {
+    WEIGHT: ['light', 'regular', 'medium', 'semibold', 'bold', "default"],
     TYPE: ['primary', 'secondary', 'danger', 'warning', 'success', 'tertiary', 'quaternary'],
     SIZE: ['normal', 'small'],
     SPACING: ['normal', 'extended'],

package/typography/typography.scss

@@ -177,49 +177,174 @@ $module: #{$prefix}-typography;
     &-paragraph {
         margin: $spacing-typography_title_paragraph-margin;
     }
+
 }
 
 // ============ Title ============
 h1.#{$module},
 .#{$module}-h1.#{$module} {
     @include font-size-header-1;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title1-fontWeight;
     margin: $spacing-typography_title_h1-margin;
+
+    &.#{$module}-h1-weight-light {
+        font-weight: $font-typography_title1-light-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-regular {
+        font-weight: $font-typography_title1-regular-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-medium {
+        font-weight: $font-typography_title1-medium-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-semibold {
+        font-weight: $font-typography_title1-semibold-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-bold {
+        font-weight: $font-typography_title1-bold-fontWeight;
+    }
+
 }
 
 h2.#{$module},
 .#{$module}-h2.#{$module} {
     @include font-size-header-2;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title2-fontWeight;
     margin: $spacing-typography_title_h2-margin;
+
+    &.#{$module}-h2-weight-light {
+        font-weight: $font-typography_title2-light-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-regular {
+        font-weight: $font-typography_title2-regular-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-medium {
+        font-weight: $font-typography_title2-medium-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-semibold {
+        font-weight: $font-typography_title2-semibold-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-bold {
+        font-weight: $font-typography_title2-bold-fontWeight;
+    }
+
 }
 
 h3.#{$module},
 .#{$module}-h3.#{$module} {
     @include font-size-header-3;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title3-fontWeight;
     margin: $spacing-typography_title_h3-margin;
+
+    &.#{$module}-h3-weight-light {
+        font-weight: $font-typography_title3-light-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-regular {
+        font-weight: $font-typography_title3-regular-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-medium {
+        font-weight: $font-typography_title3-medium-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-semibold {
+        font-weight: $font-typography_title3-semibold-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-bold {
+        font-weight: $font-typography_title3-bold-fontWeight;
+    }
+
 }
 
 h4.#{$module},
 .#{$module}-h4.#{$module} {
     @include font-size-header-4;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title4-fontWeight;
     margin: $spacing-typography_title_h4-margin;
+
+    &.#{$module}-h4-weight-light {
+        font-weight: $font-typography_title4-light-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-regular {
+        font-weight: $font-typography_title4-regular-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-medium {
+        font-weight: $font-typography_title4-medium-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-semibold {
+        font-weight: $font-typography_title4-semibold-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-bold {
+        font-weight: $font-typography_title4-bold-fontWeight;
+    }
 }
 
 h5.#{$module},
 .#{$module}-h5.#{$module} {
     @include font-size-header-5;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title5-fontWeight;
     margin: $spacing-typography_title_h5-margin;
+
+    &.#{$module}-h5-weight-light {
+        font-weight: $font-typography_title5-light-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-regular {
+        font-weight: $font-typography_title5-regular-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-medium {
+        font-weight: $font-typography_title5-medium-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-semibold {
+        font-weight: $font-typography_title5-semibold-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-bold {
+        font-weight: $font-typography_title5-bold-fontWeight;
+    }
 }
 
 h6.#{$module},
 .#{$module}-h6.#{$module} {
     @include font-size-header-6;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title6-fontWeight;
     margin: $spacing-typography_title_h6-margin;
+
+    &.#{$module}-h6-weight-light {
+        font-weight: $font-typography_title6-light-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-regular {
+        font-weight: $font-typography_title6-regular-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-medium {
+        font-weight: $font-typography_title6-medium-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-semibold {
+        font-weight: $font-typography_title6-semibold-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-bold {
+        font-weight: $font-typography_title6-bold-fontWeight;
+    }
+
 }
 
 // ============ Paragraph ============

package/typography/variables.scss

@@ -27,6 +27,54 @@ $font-typography_link-fontWeight: $font-weight-bold; // 链接文本字重
 $font-typography_strong-fontWeight: $font-weight-bold; // 强调文本字重
 $font-typography_paragraph_extended-lineHeight: 24px; // 宽松行距段落文本行高
 
+$font-typography_title1-fontWeight: $font-typography_title-fontWeight; // 一级标题文本字重
+$font-typography_title2-fontWeight: $font-typography_title-fontWeight; // 二级标题文本字重
+$font-typography_title3-fontWeight: $font-typography_title-fontWeight; // 三级标题文本字重
+$font-typography_title4-fontWeight: $font-typography_title-fontWeight; // 四级标题文本字重
+$font-typography_title5-fontWeight: $font-typography_title-fontWeight; // 五级标题文本字重
+$font-typography_title6-fontWeight: $font-typography_title-fontWeight; // 六级标题文本字重
+
+
+
+
+$font-typography_title1-light-fontWeight: 200; // 一级标题文本字重 - 细
+$font-typography_title2-light-fontWeight: 200; // 二级标题文本字重 - 细
+$font-typography_title3-light-fontWeight: 200; // 三级标题文本字重 - 细
+$font-typography_title4-light-fontWeight: 200; // 四级标题文本字重 - 细
+$font-typography_title5-light-fontWeight: 200; // 五级标题文本字重 - 细
+$font-typography_title6-light-fontWeight: 200; // 六级标题文本字重 - 细
+
+$font-typography_title1-regular-fontWeight: 400; // 一级标题文本字重 - 正常
+$font-typography_title2-regular-fontWeight: 400; // 二级标题文本字重 - 正常
+$font-typography_title3-regular-fontWeight: 400; // 三级标题文本字重 - 正常
+$font-typography_title4-regular-fontWeight: 400; // 四级标题文本字重 - 正常
+$font-typography_title5-regular-fontWeight: 400; // 五级标题文本字重 - 正常
+$font-typography_title6-regular-fontWeight: 400; // 六级标题文本字重 - 正常
+
+$font-typography_title1-medium-fontWeight: 500; // 一级标题文本字重 - 中等
+$font-typography_title2-medium-fontWeight: 500; // 二级标题文本字重 - 中等
+$font-typography_title3-medium-fontWeight: 500; // 三级标题文本字重 - 中等
+$font-typography_title4-medium-fontWeight: 500; // 四级标题文本字重 - 中等
+$font-typography_title5-medium-fontWeight: 500; // 五级标题文本字重 - 中等
+$font-typography_title6-medium-fontWeight: 500; // 六级标题文本字重 - 中等
+
+$font-typography_title1-semibold-fontWeight: 600; // 一级标题文本字重 - 半粗
+$font-typography_title2-semibold-fontWeight: 600; // 二级标题文本字重 - 半粗
+$font-typography_title3-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+$font-typography_title4-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+$font-typography_title5-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+$font-typography_title6-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+
+$font-typography_title1-bold-fontWeight: 700; // 一级标题文本字重 - 粗
+$font-typography_title2-bold-fontWeight: 700; // 二级标题文本字重 - 粗
+$font-typography_title3-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+$font-typography_title4-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+$font-typography_title5-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+$font-typography_title6-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+
+
+
+
 $spacing-typography_iconPrefix-marginRight: 4px; // 带前缀文本图标右侧外边距
 $spacing-typography_expandText-marginLeft: 8px; // 支持展开文本展开按钮左侧外边距
 $spacing-typography_copyIcon-marginLeft: 4px; // 可复制文本复制图标左侧外边距

package/upload/foundation.ts

@@ -322,7 +322,7 @@ class UploadFoundation<P = Record<string, any>, S = Record<string, any>> extends
 
     // 插入多个文件到指定位置
     // Insert files to the specified location
-    insertFileToList(files: Array<CustomFile>, index:number): void {
+    insertFileToList(files: Array<CustomFile>, index: number): void {
         const { limit, transformFile, accept, uploadTrigger } = this.getProps();
         const { fileList } = this.getStates();
 
@@ -533,9 +533,9 @@ class UploadFoundation<P = Record<string, any>, S = Record<string, any>> extends
                 data,
                 file,
                 fileInstance,
-                onProgress: (e: ProgressEvent) => this.handleProgress({ e, fileInstance }),
-                onError: (userXhr: XMLHttpRequest, e: ProgressEvent) => this.handleError({ e, xhr: userXhr, fileInstance }),
-                onSuccess: (response: any, e: ProgressEvent) => this.handleSuccess({ response, fileInstance, e, isCustomRequest: true }),
+                onProgress: (e?: ProgressEvent) => this.handleProgress({ e, fileInstance }),
+                onError: (userXhr: XMLHttpRequest, e?: ProgressEvent) => this.handleError({ e, xhr: userXhr, fileInstance }),
+                onSuccess: (response: any, e?: ProgressEvent) => this.handleSuccess({ response, fileInstance, e, isCustomRequest: true }),
                 withCredentials: option.withCredentials,
                 action: option.action,
             });
@@ -572,7 +572,7 @@ class UploadFoundation<P = Record<string, any>, S = Record<string, any>> extends
         xhr.send(formData);
     }
 
-    handleProgress({ e, fileInstance }: { e: ProgressEvent; fileInstance: File }): void {
+    handleProgress({ e, fileInstance }: { e?: ProgressEvent; fileInstance: File }): void {
         const { fileList } = this.getStates();
         const newFileList = fileList.slice();
         let percent = 0;
@@ -591,7 +591,7 @@ class UploadFoundation<P = Record<string, any>, S = Record<string, any>> extends
         this._adapter.notifyChange({ fileList: newFileList, currentFile: newFileList[index] });
     }
 
-    handleOnLoad({ e, xhr, fileInstance }: { e: ProgressEvent; xhr: XMLHttpRequest; fileInstance: File }): void {
+    handleOnLoad({ e, xhr, fileInstance }: { e?: ProgressEvent; xhr: XMLHttpRequest; fileInstance: File }): void {
         const { fileList } = this.getStates();
         const index = this._getFileIndex(fileInstance, fileList);
         if (index < 0) {
@@ -604,7 +604,7 @@ class UploadFoundation<P = Record<string, any>, S = Record<string, any>> extends
         }
     }
 
-    handleSuccess({ e, fileInstance, isCustomRequest = false, xhr, response }: { e: ProgressEvent; fileInstance: CustomFile; isCustomRequest?: boolean; xhr?: XMLHttpRequest; response?: any }): void {
+    handleSuccess({ e, fileInstance, isCustomRequest = false, xhr, response }: { e?: ProgressEvent; fileInstance: CustomFile; isCustomRequest?: boolean; xhr?: XMLHttpRequest; response?: any }): void {
         const { fileList } = this.getStates();
         let body: any = null;
         const index = this._getFileIndex(fileInstance, fileList);
@@ -673,7 +673,7 @@ class UploadFoundation<P = Record<string, any>, S = Record<string, any>> extends
         });
     }
 
-    handleError({ e, xhr, fileInstance }: { e: ProgressEvent;xhr: XMLHttpRequest;fileInstance: CustomFile }): void {
+    handleError({ e, xhr, fileInstance }: { e?: ProgressEvent;xhr: XMLHttpRequest;fileInstance: CustomFile }): void {
         const { fileList } = this.getStates();
         const index = this._getFileIndex(fileInstance, fileList);
         if (index < 0) {