@douyinfe/semi-foundation 2.96.1 → 2.98.0

package/lib/cjs/form/utils.js

@@ -142,6 +142,7 @@ function mergeProps(props) {
       wrapperCol,
       initValue,
       validate,
+      validator,
       /**
        * error、warning、default、success
        */
@@ -173,7 +174,7 @@ function mergeProps(props) {
       pure,
       id
     } = _a,
-    rest = __rest(_a, ["field", "label", "labelPosition", "labelWidth", "labelAlign", "labelCol", "wrapperCol", "initValue", "validate", "validateStatus", "trigger", "allowEmptyString", "allowEmpty", "emptyValue", "rules", "onChange", "keepState", "transform", "name", "fieldClassName", "fieldStyle", "noLabel", "noErrorMessage", "isInInputGroup", "stopValidateWithError", "convert", "showValidateIcon", "helpText", "extraText", "extraTextPosition", "pure", "id"]);
+    rest = __rest(_a, ["field", "label", "labelPosition", "labelWidth", "labelAlign", "labelCol", "wrapperCol", "initValue", "validate", "validator", "validateStatus", "trigger", "allowEmptyString", "allowEmpty", "emptyValue", "rules", "onChange", "keepState", "transform", "name", "fieldClassName", "fieldStyle", "noLabel", "noErrorMessage", "isInInputGroup", "stopValidateWithError", "convert", "showValidateIcon", "helpText", "extraText", "extraTextPosition", "pure", "id"]);
   // Form中的任何类型组件，初始值都统一通过initValue字段来传入，同时将可能会导致组件行为错误的props抽取出来，防止透传到组件中
   // For any type of field component in Form, the initial value is uniformly passed in through the initValue field.
   // At the same time, the props that may cause component behavior errors are extracted to prevent transparent transmission to the component.
@@ -185,6 +186,8 @@ function mergeProps(props) {
   }
   const required = isRequired(rules);
   emptyValue = typeof emptyValue !== 'undefined' ? emptyValue : '';
+  // `validator` is the recommended name; `validate` is kept as a deprecated alias.
+  const finalValidate = validator || validate;
   return {
     field,
     label,
@@ -197,7 +200,7 @@ function mergeProps(props) {
     noErrorMessage,
     isInInputGroup,
     initValue,
-    validate,
+    validate: finalValidate,
     validateStatus,
     trigger,
     allowEmptyString,

package/lib/cjs/hotKeys/hotKeys.css

@@ -15,7 +15,7 @@
 .semi-hotKeys-content {
   font-size: 12px;
   line-height: 16px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   border-radius: 2px;
   height: 20px;
   padding: 2px 8px;
@@ -26,7 +26,7 @@
 .semi-hotKeys-split {
   font-size: 12px;
   line-height: 16px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   margin: 0 3px;
   color: var(--semi-color-text-0);
 }

package/lib/cjs/image/image.css

@@ -96,7 +96,7 @@
   font-weight: normal;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   color: var(--semi-color-white);
   height: 60px;
   display: flex;
@@ -143,7 +143,7 @@
   color: var(--semi-color-white);
   font-size: 16px;
   line-height: 22px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   margin: 0 12px;
 }
 .semi-image-preview-footer .semi-icon {

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

@@ -41,6 +41,10 @@ export default class PreviewImageFoundation<P = Record<string, any>, S = Record<
     originImageHeight: any;
     containerWidth: number;
     containerHeight: number;
+    private _initialZoomApplied;
+    private _initialZoomAppliedSrc;
+    private _syncInitialZoomFlagWithSrc;
+    private _clampZoom;
     init(): void;
     _isImageVertical: () => boolean;
     _getContainerBoundingRectSize: () => void;

package/lib/cjs/image/previewImageFoundation.js

@@ -19,6 +19,28 @@ class PreviewImageFoundation extends _foundation.default {
     this.originImageHeight = null;
     this.containerWidth = 0;
     this.containerHeight = 0;
+    // initialZoom should only be applied once per image src (first initialization)
+    this._initialZoomApplied = false;
+    this._initialZoomAppliedSrc = undefined;
+    this._syncInitialZoomFlagWithSrc = () => {
+      const src = this.getProp("src");
+      if (src !== this._initialZoomAppliedSrc) {
+        this._initialZoomAppliedSrc = src;
+        this._initialZoomApplied = false;
+      }
+    };
+    this._clampZoom = zoom => {
+      const {
+        maxZoom,
+        minZoom
+      } = this.getProps();
+      const max = typeof maxZoom === 'number' ? maxZoom : 5;
+      const min = typeof minZoom === 'number' ? minZoom : 0.1;
+      if (typeof zoom !== 'number' || !Number.isFinite(zoom)) {
+        return min;
+      }
+      return Math.min(max, Math.max(min, zoom));
+    };
     this._isImageVertical = () => this.getProp("rotation") % 180 !== 0;
     this._getContainerBoundingRectSize = () => {
       const containerDOM = this._adapter.getContainer();
@@ -46,13 +68,20 @@ class PreviewImageFoundation extends _foundation.default {
     };
     this._getInitialZoom = () => {
       const {
-        ratio
+        ratio,
+        initialZoom
       } = this.getProps();
       let _zoom = 1;
+      // initialZoom is only used for the first initialization of each src
+      this._syncInitialZoomFlagWithSrc();
+      if (!this._initialZoomApplied && typeof initialZoom === 'number' && Number.isFinite(initialZoom) && initialZoom > 0) {
+        this._initialZoomApplied = true;
+        return this._clampZoom(initialZoom);
+      }
       if (ratio === 'adaptation') {
         _zoom = this._getAdaptationZoom();
       }
-      return _zoom;
+      return this._clampZoom(_zoom);
     };
     this.setLoading = loading => {
       this._adapter.setLoading(loading);
@@ -69,6 +98,8 @@ class PreviewImageFoundation extends _foundation.default {
         } = e.target;
         this.originImageHeight = h;
         this.originImageWidth = w;
+        // New image is loaded; allow initialZoom to be applied once for this src
+        this._syncInitialZoomFlagWithSrc();
         this.setState({
           loading: false
         });

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

@@ -48,4 +48,5 @@ export default class PreviewInnerFoundation<P = Record<string, any>, S = Record<
     preloadSingleImage: () => void;
     setLoadSuccessStatus: (src: string) => void;
     onImageLoad: (src: string) => void;
+    private _clampZoom;
 }

package/lib/cjs/image/previewInnerFoundation.js

@@ -204,11 +204,12 @@ class PreviewInnerFoundation extends _foundation.default {
       const {
         zoom
       } = _this.getStates();
-      if (zoom !== newZoom) {
-        notify && _this._adapter.notifyZoom(newZoom, newZoom > zoom);
-        _this._adapter.changeImageZoom(newZoom, e);
+      const nextZoom = _this._clampZoom(newZoom);
+      if (zoom !== nextZoom) {
+        notify && _this._adapter.notifyZoom(nextZoom, nextZoom > zoom);
+        _this._adapter.changeImageZoom(nextZoom, e);
         _this.setState({
-          zoom: newZoom
+          zoom: nextZoom
         });
       }
     };
@@ -327,6 +328,18 @@ class PreviewInnerFoundation extends _foundation.default {
         this.preloadSingleImage();
       }
     };
+    this._clampZoom = zoom => {
+      const {
+        maxZoom,
+        minZoom
+      } = this.getProps();
+      const max = typeof maxZoom === 'number' ? maxZoom : 5;
+      const min = typeof minZoom === 'number' ? minZoom : 0.1;
+      if (typeof zoom !== 'number' || !Number.isFinite(zoom)) {
+        return min;
+      }
+      return Math.min(max, Math.max(min, zoom));
+    };
   }
   beforeShow() {
     this._adapter.registerKeyDownListener();

package/lib/cjs/input/input.css

@@ -29,7 +29,7 @@
   box-shadow: none;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   background-color: var(--semi-color-fill-0);
   border: 1px transparent solid;
   border-radius: var(--semi-border-radius-small);
@@ -45,21 +45,21 @@
   height: 32px;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 30px;
 }
 .semi-input-wrapper-small {
   height: 24px;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 22px;
 }
 .semi-input-wrapper-large {
   height: 40px;
   font-size: 16px;
   line-height: 22px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 38px;
 }
 .semi-input-wrapper:hover {
@@ -357,21 +357,21 @@
   height: 38px;
   font-size: 16px;
   line-height: 22px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 38px;
 }
 .semi-input-small {
   height: 22px;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 22px;
 }
 .semi-input-default {
   height: 30px;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   line-height: 30px;
 }
 .semi-input-disabled {
@@ -429,7 +429,7 @@
   color: var(--semi-color-text-2);
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   flex-shrink: 0;
 }
 .semi-input-prepend-icon, .semi-input-prepend-text, .semi-input-append-icon, .semi-input-append-text {

package/lib/cjs/input/textarea.css

@@ -12,6 +12,11 @@
   background-color: var(--semi-color-fill-0);
   transition: background-color var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none), border var(--semi-transition_duration-none) var(--semi-transition_function-easeIn) var(--semi-transition_delay-none);
 }
+.semi-input-textarea-wrapper-resizeX {
+  display: inline-block;
+  width: fit-content;
+  max-width: 100%;
+}
 .semi-input-textarea-wrapper:hover {
   background-color: var(--semi-color-fill-1);
 }
@@ -32,6 +37,9 @@
   color: var(--semi-color-text-2);
   right: 4px;
   height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 .semi-input-textarea-wrapper .semi-input-clearbtn > svg {
   pointer-events: none;
@@ -99,7 +107,7 @@
   box-shadow: none;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   background-color: transparent;
   border: 0 solid transparent;
   vertical-align: bottom;
@@ -134,11 +142,12 @@
 }
 .semi-input-textarea-autosize {
   overflow: hidden;
+  resize: none;
 }
 .semi-input-textarea-counter {
   font-size: 12px;
   line-height: 16px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -176,6 +185,14 @@
   padding: 0;
   align-items: flex-start;
 }
+.semi-input-textarea-wrapper-withLineNumber.semi-input-textarea-wrapper-resizeX {
+  display: inline-flex;
+  width: fit-content;
+  max-width: 100%;
+}
+.semi-input-textarea-wrapper-withLineNumber.semi-input-textarea-wrapper-resizeX .semi-input-textarea-content {
+  flex: 0 0 auto;
+}
 .semi-input-textarea-wrapper-withLineNumber .semi-input-textarea-lineNumber {
   flex-shrink: 0;
   padding: 5px 12px;

package/lib/cjs/input/textarea.scss

@@ -16,6 +16,21 @@ $module: #{$prefix}-input;
     transition: background-color $transition_duration-input-bg $transition_function-input-bg $transition_delay-input-bg,
     border $transition_duration-input-border $transition_function-input-border $transition_delay-input-border;
 
+    // When native resize changes textarea width, wrapper (border/clear/counter) should follow.
+    // Default wrapper is `width: 100%`, so it won't grow with textarea. Enable shrink-to-fit.
+    &-resizeX {
+        // Keep original textarea wrapper formatting (stacking counter, etc.),
+        // only shrink-to-fit width so border follows horizontal resize.
+        // Using inline-flex here may change internal layout and cause clear/counter misalignment.
+        display: inline-block;
+        width: fit-content;
+        max-width: 100%;
+    }
+
+    &-resizeY {
+        // Keep default width behavior; vertical resize doesn't require wrapper width change.
+    }
+
     &:hover {
         background-color: $color-input_default-bg-hover;
     }
@@ -40,6 +55,10 @@ $module: #{$prefix}-input;
         color: $color-textarea-icon-default;
         right: $spacing-textarea-icon-right;
         height: $height-textarea-default;
+        // Center the icon within the clearbtn area
+        display: flex;
+        align-items: center;
+        justify-content: center;
 
         & > svg {
             pointer-events: none;
@@ -130,6 +149,7 @@ $module: #{$prefix}-input;
 
 .#{$module}-textarea {
     position: relative;
+    // resize is now controlled by resize prop, default to none for backward compatibility
     resize: none;
     // min-height: $height-input_default;
     padding: $spacing-textarea-paddingY $spacing-textarea-paddingX;
@@ -177,6 +197,8 @@ $module: #{$prefix}-input;
 
     &-autosize {
         overflow: hidden;
+        // When autosize is enabled, force resize to none to avoid conflicts
+        resize: none;
     }
 
     &-counter {
@@ -235,6 +257,19 @@ $module: #{$prefix}-input;
     padding: 0;
     align-items: flex-start;
 
+    &.#{$module}-textarea-wrapper-resizeX {
+        // Keep line number + textarea layout, but let width shrink-to-fit
+        display: inline-flex;
+        width: fit-content;
+        max-width: 100%;
+
+        .#{$module}-textarea-content {
+            flex: 0 0 auto;
+        }
+
+        // Do not force a minimum width here; allow the control to fit narrow containers.
+    }
+
     .#{$module}-textarea-lineNumber {
         flex-shrink: 0;
         padding: $spacing-textarea-paddingY $spacing-textarea-paddingX;

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

@@ -80,6 +80,21 @@ declare class InputNumberFoundation extends BaseFoundation<InputNumberAdapter> {
     _getPrecLen(num: string | number): number;
     _adjustPrec(num: string | number): string;
     formatCurrency(value: number | string): string;
+    /**
+     * Check if scientific notation is enabled
+     */
+    _isScientificNotation(): boolean;
+    /**
+     * Get scientific notation threshold
+     * @returns {number} threshold for digit count
+     */
+    _getScientificNotationThreshold(): number;
+    /**
+     * Convert number to scientific notation if exceeds threshold
+     * @param {number} num
+     * @returns {string}
+     */
+    _toScientificNotation(num: number): string;
     /**
      * format number to string
      * @param {string|number} value

package/lib/cjs/inputNumber/foundation.js

@@ -132,8 +132,18 @@ class InputNumberFoundation extends _foundation.default {
   handleInputFocus(e) {
     const value = this.getState('value');
     if (value !== '') {
-      // let parsedStr = this.doParse(this.getState('value'));
-      // this._adapter.setValue(Number(parsedStr));
+      // When scientific notation is enabled, convert to full number on focus
+      if (this._isScientificNotation() && !this._isCurrency()) {
+        const strVal = (0, _toString2.default)(value);
+        const isScientificStr = /e/i.test(strVal) && /^[+-]?(?:\d+(?:\.\d*)?|\.\d+)[eE][+-]?\d+$/.test(strVal.trim());
+        if (isScientificStr) {
+          const parsedNum = this.doParse(strVal, false, false, false);
+          if (this.isValidNumber(parsedNum)) {
+            const fullNumberStr = this.doFormat(parsedNum, true, false);
+            this._adapter.setValue(fullNumberStr);
+          }
+        }
+      }
     }
     this._adapter.recordCursorPosition();
     this._adapter.setFocusing(true, null);
@@ -236,6 +246,35 @@ class InputNumberFoundation extends _foundation.default {
         }
         numHasChanged = true;
       }
+      // Fix issue #38: When input contains non-numeric characters (e.g., "1000CNY"),
+      // doParse returns NaN, but we should still apply max/min limit if a number
+      // can be extracted from the input or if currentNumber is out of range.
+      if (!this.isValidNumber(parsedNum)) {
+        // Try to extract a number from the input using parseFloat
+        // (parseFloat can extract numbers from strings like "1000CNY" -> 1000)
+        const extractedNum = parseFloat(currentValue);
+        if (!isNaN(extractedNum)) {
+          const limitedNum = this.fetchMinOrMax(extractedNum);
+          if (limitedNum !== currentNumber) {
+            willSetNum = limitedNum;
+            if (!this.isControlled()) {
+              currentNumber = willSetNum;
+            }
+            numHasChanged = true;
+          }
+        } else if (typeof currentNumber === 'number' && !isNaN(currentNumber)) {
+          // If we can't extract a number but currentNumber exists and is out of range,
+          // apply the max/min limit to currentNumber
+          const limitedNum = this.fetchMinOrMax(currentNumber);
+          if (limitedNum !== currentNumber) {
+            willSetNum = limitedNum;
+            if (!this.isControlled()) {
+              currentNumber = willSetNum;
+            }
+            numHasChanged = true;
+          }
+        }
+      }
       const currentFormattedNum = this.doFormat(currentNumber, true, true);
       if (currentFormattedNum !== currentValue) {
         willSetVal = currentFormattedNum;
@@ -407,7 +446,11 @@ class InputNumberFoundation extends _foundation.default {
       curNum = max;
     }
     // console.log('scale: ', scale, 'curNum: ', curNum);
-    return this.doFormat(curNum, true, true);
+    // NOTE:
+    // In non-currency mode, `needAdjustCurrency=true` is used by blur/init formatting paths.
+    // Step operations often happen while focused, and should keep full-number display.
+    // Currency mode still needs `needAdjustCurrency=true` to format currency strings.
+    return this.doFormat(curNum, true, this._isCurrency());
   }
   minus(step, event) {
     const pressShift = event && event.shiftKey;
@@ -457,6 +500,52 @@ class InputNumberFoundation extends _foundation.default {
     const formatted = formatter.format(Number(formattedValue));
     return showCurrencySymbol ? formatted : formatted.replace(this._currencySymbol, '').trim();
   }
+  /**
+   * Check if scientific notation is enabled
+   */
+  _isScientificNotation() {
+    const {
+      scientificNotation
+    } = this.getProps();
+    return scientificNotation === true || typeof scientificNotation === 'object' && scientificNotation !== null;
+  }
+  /**
+   * Get scientific notation threshold
+   * @returns {number} threshold for digit count
+   */
+  _getScientificNotationThreshold() {
+    const {
+      scientificNotation
+    } = this.getProps();
+    if (typeof scientificNotation === 'object' && scientificNotation !== null) {
+      const t = scientificNotation.threshold;
+      return typeof t === 'number' && Number.isFinite(t) && t >= 1 ? t : 15;
+    }
+    return 15; // Default threshold: 15 digits
+  }
+  /**
+   * Convert number to scientific notation if exceeds threshold
+   * @param {number} num
+   * @returns {string}
+   */
+  _toScientificNotation(num) {
+    const threshold = this._getScientificNotationThreshold();
+    const absNum = Math.abs(num);
+    const numStr = String(absNum);
+    // Count significant digits (excluding decimal point, sign, exponent symbol and leading zeros)
+    // If JS already stringifies it with exponent (contains e/E), it is eligible for scientific notation display.
+    const hasExp = /e/i.test(numStr);
+    const significantDigits = numStr.replace(/[.\-+eE]/g, '').replace(/^0+/, '');
+    // Check if number exceeds threshold
+    if ((hasExp || significantDigits.length >= threshold) && absNum !== 0) {
+      // Prefer preserving coefficient digits up to threshold (total significant digits = fractionDigits + 1)
+      const fractionDigits = Math.max(0, Math.min(100, Math.floor(threshold) - 1));
+      const exp = num.toExponential(fractionDigits);
+      // Remove trailing zeros in the coefficient
+      return exp.replace(/(\.\d*?)0+e/, '$1e').replace(/\.e/, 'e');
+    }
+    return String(num);
+  }
   /**
    * format number to string
    * @param {string|number} value
@@ -482,6 +571,14 @@ class InputNumberFoundation extends _foundation.default {
     } else {
       str = (0, _toString2.default)(value);
     }
+    // Apply scientific notation for long numbers in blur state
+    // needAdjustCurrency indicates blur state (when true, we're formatting for display after blur)
+    if (this._isScientificNotation() && needAdjustCurrency && !this._isCurrency()) {
+      const numValue = typeof value === 'number' ? value : parseFloat(str);
+      if (!isNaN(numValue) && isFinite(numValue)) {
+        str = this._toScientificNotation(numValue);
+      }
+    }
     if (typeof formatter === 'function') {
       str = formatter(str);
     }
@@ -545,6 +642,19 @@ class InputNumberFoundation extends _foundation.default {
       const parsedValue = parser(value);
       value = typeof parsedValue === 'number' ? (0, _toString2.default)(parsedValue) : parsedValue;
     }
+    // Support scientific notation parsing (e.g., "1.23e+15", "1.23E-10", ".5e3", "1.e3")
+    if (typeof value === 'string' && /^[+-]?(?:\d+(?:\.\d*)?|\.\d+)[eE][+-]?\d+$/.test(value.trim())) {
+      const scientificNum = parseFloat(value.trim());
+      if (!isNaN(scientificNum)) {
+        if (needAdjustMaxMin) {
+          return this.fetchMinOrMax(scientificNum);
+        }
+        if (needAdjustPrec) {
+          return (0, _toNumber2.default)(this._adjustPrec(scientificNum));
+        }
+        return scientificNum;
+      }
+    }
     if (needCheckPrec && typeof value === 'string') {
       const zeroIsValid = value.indexOf('.') === -1 || value.indexOf('.') > -1 && (value === '0' || value.lastIndexOf('0') < value.length - 1);
       const dotIsValid = value.lastIndexOf('.') < value.length - 1 && value.split('').filter(v => v === '.').length < 2;

package/lib/cjs/jsonViewer/jsonViewer.css

@@ -53,7 +53,7 @@
   color: rgba(var(--semi-blue-7), 1);
 }
 .semi-json-viewer-view-line {
-  font-family: Menlo, Firecode, Monaco, "Courier New", monospace;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, "Fira Code", Consolas, "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
   font-weight: normal;
   font-size: 12px;
   font-feature-settings: "liga" 0, "calt" 0;
@@ -64,7 +64,7 @@
   white-space: pre-wrap !important;
 }
 .semi-json-viewer-line-number {
-  font-family: Menlo, Firecode, Monaco, "Courier New", monospace;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, "Fira Code", Consolas, "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
   font-weight: normal;
   font-size: 12px;
   font-feature-settings: "liga" 0, "calt" 0;

package/lib/cjs/jsonViewer/jsonViewer.scss

@@ -64,7 +64,7 @@ $module: #{$prefix}-json-viewer;
     }
 
     &-view-line {
-        font-family: Menlo, Firecode, Monaco, 'Courier New', monospace;
+        font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, 'Fira Code', Consolas, 'Liberation Mono', 'DejaVu Sans Mono', 'Courier New', monospace;
         font-weight: normal;
         font-size: 12px;
         font-feature-settings: 'liga' 0, 'calt' 0;
@@ -76,7 +76,7 @@ $module: #{$prefix}-json-viewer;
     }
 
     &-line-number {
-        font-family: Menlo, Firecode, Monaco, 'Courier New', monospace;
+        font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Monaco, 'Fira Code', Consolas, 'Liberation Mono', 'DejaVu Sans Mono', 'Courier New', monospace;
         font-weight: normal;
         font-size: 12px;
         font-feature-settings: 'liga' 0, 'calt' 0;

package/lib/cjs/list/list.css

@@ -4,7 +4,7 @@
 .semi-list {
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 .semi-list-items {
   margin: 0;

package/lib/cjs/modal/modal.css

@@ -4,7 +4,7 @@
 .semi-modal {
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   position: relative;
   margin: 80px auto;
   color: var(--semi-color-text-0);

package/lib/cjs/navigation/navigation.css

@@ -64,7 +64,7 @@
   margin-bottom: 8px;
   font-size: 14px;
   line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 400;
   color: var(--semi-color-text-0);
   width: 100%;
@@ -358,7 +358,7 @@
 .semi-navigation-header-text {
   font-size: 18px;
   line-height: 24px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-family: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-weight: 600;
   display: inline-flex;
   color: var(--semi-color-text-0);
@@ -544,7 +544,7 @@
   transition: padding-left 100ms ease-out, width 200ms cubic-bezier(0.62, 0.05, 0.36, 0.95);
 }
 .semi-navigation-vertical .semi-navigation-footer {
-  color: var(--semi-color-text-2);
+  color: var(--semi-color-text-1);
   padding-left: 8px;
   padding-right: 8px;
 }
@@ -556,6 +556,7 @@
 .semi-navigation-vertical .semi-navigation-footer .semi-navigation-collapse-btn > .semi-button {
   padding-left: 8px;
   padding-right: 8px;
+  color: var(--semi-color-text-1);
 }
 .semi-navigation-vertical .semi-navigation-footer-collapsed {
   justify-content: center;