@douyinfe/semi-foundation 2.39.3 → 2.40.0-beta.0

package/form/foundation.ts

@@ -248,19 +248,19 @@ export default class FormFoundation extends BaseFoundation<BaseFormAdapter> {
         });
     }
 
-    submit(): void {
+    submit(e?: any): void {
         const { values } = this.data;
         // validate form
         this.validate()
             .then((resolveValues: any) => {
                 // if valid do submit
                 const _values = this._adapter.cloneDeep(resolveValues);
-                this._adapter.notifySubmit(_values);
+                this._adapter.notifySubmit(_values, e);
             })
             .catch(errors => {
                 const _errors = this._adapter.cloneDeep(errors);
                 const _values = this._adapter.cloneDeep(values);
-                this._adapter.notifySubmitFail(_errors, _values);
+                this._adapter.notifySubmitFail(_errors, _values, e);
             });
     }
 

package/form/interface.ts

@@ -12,8 +12,8 @@ export type BasicFieldError = Array<any>;
 
 export interface BaseFormAdapter<P = Record<string, any>, S = Record<string, any>, Values extends object = any> extends DefaultAdapter<P, S> {
     cloneDeep: (val: any, ...rest: any[]) => any;
-    notifySubmit: (values: any) => void;
-    notifySubmitFail: (errors: Record<keyof Values, BasicFieldError>, values: Partial<Values>) => void;
+    notifySubmit: (values: any, e?: any) => void;
+    notifySubmitFail: (errors: Record<keyof Values, BasicFieldError>, values: Partial<Values>, e?: any) => void;
     forceUpdate: (callback?: () => void) => void;
     notifyChange: (formState: FormState) => void;
     notifyValueChange: (values: any, changedValues: any) => void;

package/image/image.scss

@@ -123,10 +123,14 @@ $module: #{$prefix}-image;
     &-footer {
         display: flex;
         align-items: center;
-        padding: $spacing-image_preview_footer-paddingY $spacing-image_preview_footer-paddingX;
-        background: $color-image_preview_footer-bg;
-        border-radius: $radius-image_preview_footer;
-        height: $height-image_preview_footer;
+
+        &-content {
+            padding: $spacing-image_preview_footer-paddingY $spacing-image_preview_footer-paddingX;
+            background: $color-image_preview_footer-bg;
+            border-radius: $radius-image_preview_footer;
+            height: $height-image_preview_footer;
+        }
+        
 
         &-wrapper {
             position: absolute;

package/image/previewInnerFoundation.ts

@@ -21,7 +21,8 @@ export interface PreviewInnerAdapter<P = Record<string, any>, S = Record<string,
     setStartMouseDown: (x: number, y: number) => void;
     setMouseActiveTime: (time: number) => void;
     disabledBodyScroll: () => void;
-    enabledBodyScroll: () => void
+    enabledBodyScroll: () => void;
+    getSetDownloadFunc: () => (src: string) => string
 }
 
 
@@ -129,8 +130,9 @@ export default class PreviewInnerFoundation<P = Record<string, any>, S = Record<
 
     handleDownload = () => {
         const { currentIndex, imgSrc } = this.getStates();
+        const setDownloadName = this._adapter.getSetDownloadFunc();
         const downloadSrc = imgSrc[currentIndex];
-        const downloadName = downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
+        const downloadName = setDownloadName ? setDownloadName(downloadSrc) : downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
         downloadImage(downloadSrc, downloadName);
         this._adapter.notifyDownload(downloadSrc, currentIndex);
     }

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

@@ -19,7 +19,7 @@ export default class FormFoundation extends BaseFoundation<BaseFormAdapter> {
     validate(fieldPaths?: Array<string>): Promise<unknown>;
     _formValidate(): Promise<unknown>;
     _fieldsValidate(fieldPaths: Array<string>): Promise<unknown>;
-    submit(): void;
+    submit(e?: any): void;
     /**
      * Case A：
      *      All fields: a[0]、a[1]、b.type、b.name[2]、b.name[0]

package/lib/cjs/form/foundation.js

@@ -232,7 +232,7 @@ class FormFoundation extends _foundation.default {
       });
     });
   }
-  submit() {
+  submit(e) {
     const {
       values
     } = this.data;
@@ -240,11 +240,11 @@ class FormFoundation extends _foundation.default {
     this.validate().then(resolveValues => {
       // if valid do submit
       const _values = this._adapter.cloneDeep(resolveValues);
-      this._adapter.notifySubmit(_values);
+      this._adapter.notifySubmit(_values, e);
     }).catch(errors => {
       const _errors = this._adapter.cloneDeep(errors);
       const _values = this._adapter.cloneDeep(values);
-      this._adapter.notifySubmitFail(_errors, _values);
+      this._adapter.notifySubmitFail(_errors, _values, e);
     });
   }
   /**

package/lib/cjs/form/interface.d.ts

@@ -6,8 +6,8 @@ export type CommonFieldError = boolean | string | Array<any> | undefined | unkno
 export type BasicFieldError = Array<any>;
 export interface BaseFormAdapter<P = Record<string, any>, S = Record<string, any>, Values extends object = any> extends DefaultAdapter<P, S> {
     cloneDeep: (val: any, ...rest: any[]) => any;
-    notifySubmit: (values: any) => void;
-    notifySubmitFail: (errors: Record<keyof Values, BasicFieldError>, values: Partial<Values>) => void;
+    notifySubmit: (values: any, e?: any) => void;
+    notifySubmitFail: (errors: Record<keyof Values, BasicFieldError>, values: Partial<Values>, e?: any) => void;
     forceUpdate: (callback?: () => void) => void;
     notifyChange: (formState: FormState) => void;
     notifyValueChange: (values: any, changedValues: any) => void;

package/lib/cjs/image/image.css

@@ -109,6 +109,8 @@
 .semi-image-preview-footer {
   display: flex;
   align-items: center;
+}
+.semi-image-preview-footer-content {
   padding: 0 16px;
   background: rgba(0, 0, 0, 0.75);
   border-radius: 6px;

package/lib/cjs/image/image.scss

@@ -123,10 +123,14 @@ $module: #{$prefix}-image;
     &-footer {
         display: flex;
         align-items: center;
-        padding: $spacing-image_preview_footer-paddingY $spacing-image_preview_footer-paddingX;
-        background: $color-image_preview_footer-bg;
-        border-radius: $radius-image_preview_footer;
-        height: $height-image_preview_footer;
+
+        &-content {
+            padding: $spacing-image_preview_footer-paddingY $spacing-image_preview_footer-paddingX;
+            background: $color-image_preview_footer-bg;
+            border-radius: $radius-image_preview_footer;
+            height: $height-image_preview_footer;
+        }
+        
 
         &-wrapper {
             position: absolute;

package/lib/cjs/image/previewInnerFoundation.d.ts

@@ -22,6 +22,7 @@ export interface PreviewInnerAdapter<P = Record<string, any>, S = Record<string,
     setMouseActiveTime: (time: number) => void;
     disabledBodyScroll: () => void;
     enabledBodyScroll: () => void;
+    getSetDownloadFunc: () => (src: string) => string;
 }
 export default class PreviewInnerFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<PreviewInnerAdapter<P, S>, P, S> {
     constructor(adapter: PreviewInnerAdapter<P, S>);

package/lib/cjs/image/previewInnerFoundation.js

@@ -115,8 +115,9 @@ class PreviewInnerFoundation extends _foundation.default {
         currentIndex,
         imgSrc
       } = this.getStates();
+      const setDownloadName = this._adapter.getSetDownloadFunc();
       const downloadSrc = imgSrc[currentIndex];
-      const downloadName = downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
+      const downloadName = setDownloadName ? setDownloadName(downloadSrc) : downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
       (0, _utils.downloadImage)(downloadSrc, downloadName);
       this._adapter.notifyDownload(downloadSrc, currentIndex);
     };

package/lib/cjs/radio/radio.css

@@ -175,6 +175,7 @@
 .semi-radio-content {
   display: flex;
   flex-direction: column;
+  row-gap: 4px;
 }
 .semi-radio:hover .semi-radio-inner-display {
   background: var(--semi-color-fill-0);

package/lib/cjs/radio/radio.scss

@@ -241,6 +241,7 @@ $inner-width: $width-icon-medium;
     &-content {
         display: flex;
         flex-direction: column;
+        row-gap: $spacing-radio_content-rowGap;
     }
 
     &:hover {

package/lib/cjs/radio/variables.scss

@@ -77,6 +77,7 @@ $spacing-radio_addon_buttonRadio_middle-paddingX: $spacing-base; // 中尺寸按
 $spacing-radio_addon_buttonRadio_middle-paddingY: $spacing-extra-tight; // 中尺寸按钮式单选按钮垂直内边距
 $spacing-radio_addon_buttonRadio_marginLeft: $spacing-none; // 按钮式单选按钮左侧外边距
 $spacing-radio_extra-paddingLeft: $width-radio_inner + $spacing-tight; // 单选副标题左侧内边距
+$spacing-radio_content-rowGap: 4px; // 内容行间距
 
 $spacing-radio_group_vertical-marginBottom: $spacing-base-tight; // 垂直布局单选框组底部外边距
 $spacing-radio_card_group_vertical-marginBottom: $spacing-base; // 垂直布局卡片式单选框组底部外边距

package/lib/cjs/timePicker/foundation.js

@@ -165,13 +165,13 @@ class TimePickerFoundation extends _foundation.default {
       if (this.isValidTimeZone(timeZone)) {
         dates = dates.map(date => (0, _dateFnsExtra.utcToZonedTime)(this.isValidTimeZone(__prevTimeZone) ? (0, _dateFnsExtra.zonedTimeToUtc)(date, __prevTimeZone) : date, timeZone));
       }
-      const inputValue = this.formatValue(dates);
-      this.setState({
-        value: dates,
-        invalid,
-        inputValue
-      });
     }
+    const inputValue = this.formatValue(dates);
+    this.setState({
+      value: dates,
+      invalid,
+      inputValue
+    });
   }
   handleFocus(e) {
     if (!this.getState('open')) {

package/lib/cjs/timePicker/utils/index.js

@@ -32,6 +32,8 @@ const parseToDate = function (input) {
     });
     // console.log(curDate, formatToken);
     return curDate;
+  } else if (typeof input === 'undefined') {
+    return undefined;
   }
   return new Date();
 };

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

@@ -19,7 +19,7 @@ export default class FormFoundation extends BaseFoundation<BaseFormAdapter> {
     validate(fieldPaths?: Array<string>): Promise<unknown>;
     _formValidate(): Promise<unknown>;
     _fieldsValidate(fieldPaths: Array<string>): Promise<unknown>;
-    submit(): void;
+    submit(e?: any): void;
     /**
      * Case A：
      *      All fields: a[0]、a[1]、b.type、b.name[2]、b.name[0]

package/lib/es/form/foundation.js

@@ -223,7 +223,7 @@ export default class FormFoundation extends BaseFoundation {
       });
     });
   }
-  submit() {
+  submit(e) {
     const {
       values
     } = this.data;
@@ -231,11 +231,11 @@ export default class FormFoundation extends BaseFoundation {
     this.validate().then(resolveValues => {
       // if valid do submit
       const _values = this._adapter.cloneDeep(resolveValues);
-      this._adapter.notifySubmit(_values);
+      this._adapter.notifySubmit(_values, e);
     }).catch(errors => {
       const _errors = this._adapter.cloneDeep(errors);
       const _values = this._adapter.cloneDeep(values);
-      this._adapter.notifySubmitFail(_errors, _values);
+      this._adapter.notifySubmitFail(_errors, _values, e);
     });
   }
   /**

package/lib/es/form/interface.d.ts

@@ -6,8 +6,8 @@ export type CommonFieldError = boolean | string | Array<any> | undefined | unkno
 export type BasicFieldError = Array<any>;
 export interface BaseFormAdapter<P = Record<string, any>, S = Record<string, any>, Values extends object = any> extends DefaultAdapter<P, S> {
     cloneDeep: (val: any, ...rest: any[]) => any;
-    notifySubmit: (values: any) => void;
-    notifySubmitFail: (errors: Record<keyof Values, BasicFieldError>, values: Partial<Values>) => void;
+    notifySubmit: (values: any, e?: any) => void;
+    notifySubmitFail: (errors: Record<keyof Values, BasicFieldError>, values: Partial<Values>, e?: any) => void;
     forceUpdate: (callback?: () => void) => void;
     notifyChange: (formState: FormState) => void;
     notifyValueChange: (values: any, changedValues: any) => void;

package/lib/es/image/image.css

@@ -109,6 +109,8 @@
 .semi-image-preview-footer {
   display: flex;
   align-items: center;
+}
+.semi-image-preview-footer-content {
   padding: 0 16px;
   background: rgba(0, 0, 0, 0.75);
   border-radius: 6px;

package/lib/es/image/image.scss

@@ -123,10 +123,14 @@ $module: #{$prefix}-image;
     &-footer {
         display: flex;
         align-items: center;
-        padding: $spacing-image_preview_footer-paddingY $spacing-image_preview_footer-paddingX;
-        background: $color-image_preview_footer-bg;
-        border-radius: $radius-image_preview_footer;
-        height: $height-image_preview_footer;
+
+        &-content {
+            padding: $spacing-image_preview_footer-paddingY $spacing-image_preview_footer-paddingX;
+            background: $color-image_preview_footer-bg;
+            border-radius: $radius-image_preview_footer;
+            height: $height-image_preview_footer;
+        }
+        
 
         &-wrapper {
             position: absolute;

package/lib/es/image/previewInnerFoundation.d.ts

@@ -22,6 +22,7 @@ export interface PreviewInnerAdapter<P = Record<string, any>, S = Record<string,
     setMouseActiveTime: (time: number) => void;
     disabledBodyScroll: () => void;
     enabledBodyScroll: () => void;
+    getSetDownloadFunc: () => (src: string) => string;
 }
 export default class PreviewInnerFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<PreviewInnerAdapter<P, S>, P, S> {
     constructor(adapter: PreviewInnerAdapter<P, S>);

package/lib/es/image/previewInnerFoundation.js

@@ -108,8 +108,9 @@ export default class PreviewInnerFoundation extends BaseFoundation {
         currentIndex,
         imgSrc
       } = this.getStates();
+      const setDownloadName = this._adapter.getSetDownloadFunc();
       const downloadSrc = imgSrc[currentIndex];
-      const downloadName = downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
+      const downloadName = setDownloadName ? setDownloadName(downloadSrc) : downloadSrc.slice(downloadSrc.lastIndexOf("/") + 1);
       downloadImage(downloadSrc, downloadName);
       this._adapter.notifyDownload(downloadSrc, currentIndex);
     };

package/lib/es/radio/radio.css

@@ -175,6 +175,7 @@
 .semi-radio-content {
   display: flex;
   flex-direction: column;
+  row-gap: 4px;
 }
 .semi-radio:hover .semi-radio-inner-display {
   background: var(--semi-color-fill-0);

package/lib/es/radio/radio.scss

@@ -241,6 +241,7 @@ $inner-width: $width-icon-medium;
     &-content {
         display: flex;
         flex-direction: column;
+        row-gap: $spacing-radio_content-rowGap;
     }
 
     &:hover {

package/lib/es/radio/variables.scss

@@ -77,6 +77,7 @@ $spacing-radio_addon_buttonRadio_middle-paddingX: $spacing-base; // 中尺寸按
 $spacing-radio_addon_buttonRadio_middle-paddingY: $spacing-extra-tight; // 中尺寸按钮式单选按钮垂直内边距
 $spacing-radio_addon_buttonRadio_marginLeft: $spacing-none; // 按钮式单选按钮左侧外边距
 $spacing-radio_extra-paddingLeft: $width-radio_inner + $spacing-tight; // 单选副标题左侧内边距
+$spacing-radio_content-rowGap: 4px; // 内容行间距
 
 $spacing-radio_group_vertical-marginBottom: $spacing-base-tight; // 垂直布局单选框组底部外边距
 $spacing-radio_card_group_vertical-marginBottom: $spacing-base; // 垂直布局卡片式单选框组底部外边距

package/lib/es/timePicker/foundation.js

@@ -158,13 +158,13 @@ class TimePickerFoundation extends BaseFoundation {
       if (this.isValidTimeZone(timeZone)) {
         dates = dates.map(date => utcToZonedTime(this.isValidTimeZone(__prevTimeZone) ? zonedTimeToUtc(date, __prevTimeZone) : date, timeZone));
       }
-      const inputValue = this.formatValue(dates);
-      this.setState({
-        value: dates,
-        invalid,
-        inputValue
-      });
     }
+    const inputValue = this.formatValue(dates);
+    this.setState({
+      value: dates,
+      invalid,
+      inputValue
+    });
   }
   handleFocus(e) {
     if (!this.getState('open')) {

package/lib/es/timePicker/utils/index.js

@@ -25,6 +25,8 @@ export const parseToDate = function (input) {
     });
     // console.log(curDate, formatToken);
     return curDate;
+  } else if (typeof input === 'undefined') {
+    return undefined;
   }
   return new Date();
 };

package/package.json

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

package/radio/radio.scss

@@ -241,6 +241,7 @@ $inner-width: $width-icon-medium;
     &-content {
         display: flex;
         flex-direction: column;
+        row-gap: $spacing-radio_content-rowGap;
     }
 
     &:hover {

package/radio/variables.scss

@@ -77,6 +77,7 @@ $spacing-radio_addon_buttonRadio_middle-paddingX: $spacing-base; // 中尺寸按
 $spacing-radio_addon_buttonRadio_middle-paddingY: $spacing-extra-tight; // 中尺寸按钮式单选按钮垂直内边距
 $spacing-radio_addon_buttonRadio_marginLeft: $spacing-none; // 按钮式单选按钮左侧外边距
 $spacing-radio_extra-paddingLeft: $width-radio_inner + $spacing-tight; // 单选副标题左侧内边距
+$spacing-radio_content-rowGap: 4px; // 内容行间距
 
 $spacing-radio_group_vertical-marginBottom: $spacing-base-tight; // 垂直布局单选框组底部外边距
 $spacing-radio_card_group_vertical-marginBottom: $spacing-base; // 垂直布局卡片式单选框组底部外边距

package/timePicker/foundation.ts

@@ -213,14 +213,14 @@ class TimePickerFoundation<P = Record<string, any>, S = Record<string, any>> ext
                     )
                 );
             }
-            const inputValue = this.formatValue(dates);
-
-            this.setState({
-                value: dates,
-                invalid,
-                inputValue,
-            } as any);
         }
+        const inputValue = this.formatValue(dates);
+
+        this.setState({
+            value: dates,
+            invalid,
+            inputValue,
+        } as any);
     }
 
     handleFocus(e: any) {

package/timePicker/utils/index.ts

@@ -25,6 +25,8 @@ export const parseToDate = (input: string | Date | number, formatToken = strings
         // console.log(curDate, formatToken);
 
         return curDate;
+    } else if (typeof input === 'undefined') {
+        return undefined;
     }
 
     return new Date();