docs(changelog): v2.77.0 update

.github/workflows/auto-reply-react19.yaml

@@ -0,0 +1,37 @@
+name: Automatically reply to React19 related issues
+
+on:
+  issues:
+    types: [opened, edited, labeled]
+
+jobs:
+  auto-reply:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/github-script@v6
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            const issue = context.payload.issue;
+            
+            const keywords = ['react19', 'react 19'];
+            const hasKeyword = keywords.some(keyword => 
+              issue.title.toLowerCase().includes(keyword.toLowerCase())
+            );
+
+            const isLabeledReact19 = issue.labels.some(label => label.name === 'react19');
+            
+            const mentionedIssueRegex = /#(\d+)/g;
+            const mentionedIssues = [...issue.body.matchAll(mentionedIssueRegex)].map(match => match[1]);
+            const importantIssues = ['2743']; // 要监听的issue编号
+            const hasMentionedImportantIssue = mentionedIssues.some(num => importantIssues.includes(num));
+            
+            if (hasKeyword || hasMentionedImportantIssue || isLabeledReact19) {
+              github.rest.issues.createComment({
+                issue_number: issue.number,
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                body: `感谢您反馈 Semi 在 React 19 下使用的异常问题！我们团队预计将在 2025 年 Q3 进行 React 19 的全面适配与优化工作，目前处于收集问题阶段，您的反馈将在 React 19 适配完成后得到处理，详细信息可参考 [issue](https://github.com/DouyinFE/semi-design/issues/2743)。
+                 Thank you for your feedback on the abnormal issues when using Semi under React 19! Our team plans to fully adapt and optimize React 19 in Q3 2025. We are currently in the stage of collecting issues. Your feedback will be processed after the adaptation of React 19 is completed. For more information, please refer to [issue](https://github.com/DouyinFE/semi-design/issues/2743).`
+              });
+            }

.github/workflows/publish.yml

@@ -12,9 +12,16 @@ jobs:
         name: 'publish a new version'
         runs-on: ubuntu-latest
         steps:
+            - name: gen token
+              run: |
+                  git config --global user.name 'semi-team'
+                  git config --global user.email '[email protected]'
+                  mkdir ~/.ssh
+                  echo $SEMI_TEAM_PRIVATE_KEY > ~/.ssh/ssh-ed25519
+                  echo $SEMI_TEAM_PRIVATE_KEY_PUB > ~/.ssh/ssh-ed25519.pub
+                  echo "Host\n  github.com\n  AddKeysToAgent yes\n  UseKeychain yes\n  IdentityFile ~/.ssh/id_ed25519" > ~/.ssh/config
+
             - uses: actions/checkout@v4
-              with:
-                  token: ${{ secrets.PAT }}
 
             - name: Use Node.js 20
               uses: actions/setup-node@v4
@@ -36,8 +43,8 @@ jobs:
 
             - name: publish
               run: |
-                  git config --global user.name 'semi-bot'
-                  git config --global user.email 'semi-[email protected].com'
+                  git config --global user.name 'semi-team'
+                  git config --global user.email 'semi-team@bytedance.com'
                   node scripts/sitemap_update.js
                   if [ -n "$(git status --porcelain)" ]; then
                     echo "there are changes";

content/input/cascader/index-en-US.md

@@ -1970,7 +1970,6 @@ function Demo() {
 | filterSorter | Sort the filtered options                                                                                                                                                                                                                     | (first: CascaderData, second: CascaderData, inputValue: string) => number | - | 2.28.0 |
 | filterTreeNode | Set filter, the value of treeNodeFilterProp is used for searching, data parameter provided since v2.28.0                                                                                                                                      | ((inputValue: string, treeNodeString: string, data?: CascaderData) => boolean) \| boolean | false | - |
 | getPopupContainer | Specify the parent DOM, the drop-down box will be rendered into the DOM, the customization needs to set position: relative   This will change the DOM tree position, but not the view's rendering position.                                                                                                                   |() => HTMLElement|() => document.body|-|
-| insetLabel | Prefix alias, used mainly in Form                                                                                                                                                                                                             | ReactNode | - | 0.28.0 |
 | leafOnly | When multiple selections, the set value only includes leaf nodes, that is, the displayed Tag and onChange value parameters only include leaf nodes. Does not support dynamic switching                                                        | boolean | false | 2.2.0  |
 | loadData | Load data asynchronously and the return value should be a promise                                                                                                                                                                             | (selectOptions: CascaderData[]) => Promise< void > |-| 1.8.0|
 | max| In the case of multiple selections, the number of multiple selections is limited, and the onExceed callback will be triggered when max is exceeded                                                                                            | number |-|1.28.0|

content/input/cascader/index.md

@@ -1940,7 +1940,6 @@ function Demo() {
 | filterSorter         | 对筛选后的选项进行排序                                                                                                                                         | (first: CascaderData, second: CascaderData, inputValue: string) => number                 | -                              | 2.28.0 |
 | filterTreeNode       | 设置筛选，默认用 treeNodeFilterProp 的值作为要筛选的 TreeNode 的属性值， data 参数自 v2.28.0 开始提供                                                                           | ((inputValue: string, treeNodeString: string, data?: CascaderData) => boolean) \| boolean | false                          | -      |
 | getPopupContainer    | 指定父级 DOM，下拉框将会渲染至该 DOM 中，自定义需要设置 position: relative   这会改变浮层 DOM 树位置，但不会改变视图渲染位置。                                                                                               | () => HTMLElement                                                                         | () => document.body            | -      |
-| insetLabel           | 前缀标签别名，主要用于 Form                                                                                                                                    | ReactNode                                                                                 | -                              | 0.28.0 |
 | leafOnly             | 多选时设置 value 只包含叶子节点，即显示的 Tag 和 onChange 的 value 参数只包含叶子节点。不支持动态切换                                                                                   | boolean                                                                                   | false                          | 2.2.0  |
 | loadData             | 异步加载数据，需要返回一个Promise                                                                                                                                | (selectOptions: CascaderData[]) => Promise< void >                                        | -                              | 1.8.0  |
 | max                  | 多选时，限制多选选中的数量，超出 max 后将触发 onExceed 回调                                                                                                               | number                                                                                    | -                              | 1.28.0 |

content/input/datepicker/index-en-US.md

@@ -48,16 +48,7 @@ function Demo() {
 }
 ```
 
-### With an Embedded Label
 
-```jsx live=true
-import React from 'react';
-import { DatePicker } from '@douyinfe/semi-ui';
-
-function Demo() {
-    return <DatePicker insetLabel="End date" style={{ width: 240 }} />;
-}
-```
 
 ### Multiple Date Selection
 
@@ -907,7 +898,6 @@ function Demo() {
 | inputReadOnly      | Is the text box readonly                                                                                                                                                                                                                      | boolean                                                                                                                                                                                                   | false                                                                                 |                           |
 | insetInput        | Whether the input box is embedded in the panel. InsetInputProps type supported after v2.29                                                                                                                                                    | boolean  \| <ApiType detail='{ placeholder?: { dateStart?: string; dateEnd?: string; timeStart?: string; timeEnd?: string } }'>InsetInputProps</ApiType>                                                                                                                                                                                                | false                                                                                 | **2.7.0**                          |
 | inputStyle         | Input box style                                                                                                                                                                                                                               | object                                                                                                                                                                                                    |                                                                                       |                           |
-| insetLabel         | Prefix label, lower priority than `prefix`                                                                                                                                                                                                    | string\|ReactNode                                                                                                                                                                                         |                                                                                       |                           |
 | max                | When multiple is set to true, the number of selected, non-pass or value is null\|undefined, unlimited.                                                                                                                                        | number                                                                                                                                                                                                    | -                                                                                     |                           |
 | multiple           | Whether you can choose multiple, only type = "date" is supported                                                                                                                                                                              | boolean                                                                                                                                                                                                   | false                                                                                 |                           |
 | needConfirm        | Do you need to "confirm selection", only `type= "dateTime"\| "dateTimeRange"` works.                                                                                                                                                          | boolean                                                                                                                                                                                                   |                                                                                       | **0.18.0**                |

content/input/datepicker/index.md

@@ -45,17 +45,6 @@ function Demo() {
 }
 ```
 
-### 带内嵌标签
-
-```jsx live=true
-import React from 'react';
-import { DatePicker } from '@douyinfe/semi-ui';
-
-function Demo() {
-    return <DatePicker insetLabel="结束日期" style={{ width: 240 }} />;
-}
-```
-
 ### 多个日期选择
 
 将 `multiple` 设为 `true`，可以多选日期
@@ -858,7 +847,6 @@ function Demo() {
 | insetInput | 面板中是否嵌入输入框，InsetInputProps 类型 v2.29 支持                                                               | boolean \| <ApiType detail='{ placeholder?: { dateStart?: string; dateEnd?: string; timeStart?: string; timeEnd?: string } }'>InsetInputProps</ApiType>  | false | **2.7.0** |
 | inputReadOnly | 文本框是否 readonly                                                                                       | boolean | false |  |
 | inputStyle | 输入框样式                                                                                                | object |  |  |
-| insetLabel | 前缀标签，优先级低于 `prefix`                                                                                  | string\|ReactNode |  |  |
 | leftSlot   | 渲染左侧额外区域                                                                                             | ReactNode |         |  **2.65.0** |
 | max | multiple 为 true 时，多选的数目,不传或者值为 null\|undefined 的话无限制                                                 | number | - |  |
 | motion | 是否开启面板展开的动画                                                                                          | boolean | true |  |

content/input/form/index-en-US.md

@@ -2012,9 +2012,9 @@ const MyComponent = (props) => {
     };
     return (
         <div className='customField'>
-            <Input insetLabel='Name' value={name} onChange={v => handleChange(v, 'name')} style={{ width: 180, marginRight: 12 }} />
+            <Input prefix='Name' value={name} onChange={v => handleChange(v, 'name')} style={{ width: 180, marginRight: 12 }} />
             <Select
-                insetLabel='Role'
+                prefix='Role'
                 value={role}
                 onChange={v => handleChange(v, 'role')}
                 style={{ width: 200 }}

content/input/form/index.md

@@ -558,12 +558,12 @@ class BasicDemo extends React.Component {
             <>
                 <div style={{ borderBottom: '1px solid var(--semi-color-border)', paddingBottom: 12 }}>
                     <Form.Label style={{ marginLeft: 10 }}>切换Label位置:</Form.Label>
-                    <Select onChange={this.changeLabelPos} value={labelPosition} style={{ width: 200 }} insetLabel='labelPosition'>
+                    <Select onChange={this.changeLabelPos} value={labelPosition} style={{ width: 200 }} prefix='labelPosition'>
                         <Select.Option value='top'>top</Select.Option>
                         <Select.Option value='left'>left</Select.Option>
                     </Select>
                     <Form.Label style={{ marginLeft: 10 }}>切换Label文本对齐方向:</Form.Label>
-                    <Select onChange={this.changeLabelAlign} value={labelAlign} style={{ width: 200 }} insetLabel='labelAlign'>
+                    <Select onChange={this.changeLabelAlign} value={labelAlign} style={{ width: 200 }} prefix='labelAlign'>
                         <Select.Option value='left'>left</Select.Option>
                         <Select.Option value='right'>right</Select.Option>
                     </Select>
@@ -2019,9 +2019,9 @@ const MyComponent = (props) => {
     };
     return (
         <div className='customField'>
-            <Input insetLabel='名称' value={name} onChange={v => handleChange(v, 'name')} style={{ width: 180, marginRight: 12 }} />
+            <Input prefix='名称' value={name} onChange={v => handleChange(v, 'name')} style={{ width: 180, marginRight: 12 }} />
             <Select
-                insetLabel='角色'
+                prefix='角色'
                 value={role}
                 onChange={v => handleChange(v, 'role')}
                 style={{ width: 200 }}

content/input/inputnumber/index-en-US.md

@@ -375,7 +375,6 @@ import { InputNumber } from '@douyinfe/semi-ui';
 | formatter    | Specifies the format of the input box to display the value                                      | (value: number\|string) => string | -         |            |
 | hideButtons  | Hide the "up/down" button when passing `true`                                                   | boolean                           | false     | **1.0.0**  |
 | innerButtons  | Show the "up/down" button in input box when passing `true`                                 | boolean                           | false         | **1.5.0** |
-| insetLabel   | Prefix label, lower priority than `prefix`                                                      | string\|ReactNode                 |           |            |
 | keepFocus    | Keep the input box focused when you click the button                                        | boolean                 |     false               | **1.10.0** |
 | localeCode | Used to specify the country code in currency mode. Optional values ​​include `zh-CN`, `en-US`, `en-GB`, `ja-JP`, `ko-KR`, `ar`, `vi-VN`, `ru-RU`, `id-ID`, `ms-MY`, `th-TH`, `tr-TR`, `pt-BR`, `zh-TW`, `es`, `de`, `it`, `fr`, `ro`, `sv-SE`, `pl-PL`, `nl-NL`, etc. | string | - | **2.77.0** |
 | max          | Limit maximum value                                                                             | number                            | Infinity  |            |

content/input/inputnumber/index.md

@@ -348,7 +348,6 @@ import { InputNumber } from '@douyinfe/semi-ui';
 | formatter    | 指定输入框展示值的格式                                         | (value: number\|string) => string | -         |           |
 | hideButtons  | 为 `true` 时隐藏 “上/下” 按钮                                  | boolean                           | false     | **1.0.0** |
 | innerButtons | 为 `true` 时 “上/下” 按钮显示在输入框内部                                  | boolean                           | false     | **1.5.0** |
-| insetLabel   | 前缀标签，优先级低于 `prefix`                                  | string\|ReactNode                 |           |           |
 | keepFocus    | 点击按钮时保持输入框聚焦                                        | boolean                 |     false      |   **1.10.0**        |
 |  localeCode    | 货币模式下用于指定国家地区代码，可选值有 `zh-CN`, `en-US`, `en-GB`, `ja-JP`, `ko-KR`, `ar`, `vi-VN`, `ru-RU`, `id-ID`, `ms-MY`, `th-TH`, `tr-TR`, `pt-BR`, `zh-TW`, `es`, `de`, `it`, `fr`, `ro`, `sv-SE`, `pl-PL`, `nl-NL`等 | string                 |     -      |   **2.77.0**  |
 | max          | 限定最大值                                                     | number                            | Infinity  |           |

content/input/select/index-en-US.md

@@ -297,40 +297,6 @@ import { IconVigoLogo, IconGift } from '@douyinfe/semi-icons';
 );
 ```
 
-### Select with inset label
-
-By setting`insetLabel`, you can set a label for Select, you can pass in string or ReactNode  
-When the incoming type is ReactNode, you need to handle the padding between the label and the text.
-
-```jsx live=true
-import React from 'react';
-import { Select } from '@douyinfe/semi-ui';
-
-() => {
-    const list = [
-        { value: 'douyin', label: 'Douyin' },
-        { value: 'capcut', label: 'Capcut' },
-        { value: 'xigua', label: 'BuzzVideo' },
-    ];
-    return (
-        <>
-            <Select style={{ width: 320 }} optionList={list} insetLabel="Application" defaultValue="douyin"></Select>
-            <br />
-            <br />
-            <Select
-                style={{ width: 320 }}
-                optionList={list}
-                insetLabel={
-                    <span style={{ marginRight: 0, marginLeft: 12, color: 'var(--semi-color-text-2)' }}>
-                        Application
-                    </span>
-                }
-            ></Select>
-        </>
-    );
-};
-```
-
 ### Additional items
 
 We have reserved two slots at the bottom of the pop-up layer, which you can use when you need to add a custom node to the pop-up layer.  
@@ -1441,7 +1407,6 @@ import { Select, Checkbox } from '@douyinfe/semi-ui';
 | inputProps | When filter is true, the additional configuration parameters of the input, please refer to the Input component for specific configurable properties (note: please do not pass in `value`, `ref`, `onChange`, `onFocus`, otherwise it will override Select related callbacks and affect component behavior)                                                         | object | | 2.2.0|
 | innerTopSlot | Render at the top of the pop-up layer, custom slot inside the optionList                                                                                                                                                                                                                                                                                           | ReactNode |  |
 | innerBottomSlot | Render at the bottom of the pop-up layer, custom slot inside the optionList                                                                                                                                                                                                                                                                                        | ReactNode |  |
-| insetLabel | Same to `prefix`, just an alias                                                                                                                                                                                                                                                                                                                                    | ReactNode |  |
 | loading | Does the drop-down list show the loading animation                                                                                                                                                                                                                                                                                                                 | boolean | false |
 | max | Maximum number of choices, effective only in multi-selection mode                                                                                                                                                                                                                                                                                                  | number |  |
 | maxTagCount | In multi-selection mode, when the option is beyond maxTag Count, the subsequent option is rendered in the form of + N                                                                                                                                                                                                                                              | number |  |

content/input/select/index.md

@@ -321,72 +321,6 @@ import { IconVigoLogo, IconGift } from '@douyinfe/semi-icons';
 );
 ```
 
-### 内嵌标签
-
-通过设置`insetLabel`，你可以给 Select 设置 label，可以传入 string 或者 ReactNode  
-当传入类型为 ReactNode 时，注意要自行处理 label 与文本之间的间隔
-
-```jsx live=true
-import React, { useState } from 'react';
-import { Select } from '@douyinfe/semi-ui';
-
-() => {
-    const list = [
-        { value: 'douyin', label: '抖音' },
-        { value: 'ulikecam', label: '轻颜相机' },
-        { value: 'jianying', label: '剪映' },
-        { value: 'toutiao', label: '今日头条' },
-    ];
-    const colorList = ['red', 'light-blue', 'yellow', 'purple', 'pink', 'green'].map(color => {
-        return {
-            value: `rgba(var(--semi-${color}-4), 1)`,
-            label: (
-                <span
-                    style={{
-                        color: `rgba(var(--semi-${color}-4), 1)`,
-                    }}
-                >
-                    {`--semi-${color}-4`}
-                </span>
-            ),
-        };
-    });
-    const [colorVal, setColotVal] = useState('--semi-light-blue-3');
-    return (
-        <>
-            <Select style={{ width: 300 }} optionList={list} insetLabel="业务线" defaultValue="douyin"></Select>
-            <br />
-            <br />
-            <Select
-                style={{ width: 300 }}
-                optionList={colorList}
-                value={colorVal}
-                insetLabel={
-                    <div
-                        style={{
-                            marginLeft: 12,
-                            display: 'flex',
-                        }}
-                    >
-                        <div
-                            style={{
-                                display: 'block',
-                                width: 5,
-                                height: 5,
-                                border: 'solid 7px transparent',
-                                borderRadius: '50%',
-                                borderColor: 'rgba(var(--semi-light-blue-3), 1)',
-                            }}
-                        ></div>
-                        <span style={{ marginLeft: 4 }}>色值</span>
-                    </div>
-                }
-            ></Select>
-        </>
-    );
-};
-```
-
 ### 在顶部/底部渲染附加项
 
 我们在弹出层顶部、底部分别预留了插槽，当你需要在弹出层中添加自定义 node 时  
@@ -1501,7 +1435,6 @@ import { Select, Checkbox, Highlight } from '@douyinfe/semi-ui';
 | inputProps | filter 为 true 时, input 输入框的额外配置参数，具体可配置属性请参考 Input 组件（注意：请不要传入 value、ref、onChange、onFocus，否则会覆盖 Select 相关回调，影响组件行为）                   | object |  | 2.2.0 |
 | innerTopSlot | 渲染在弹出层顶部，在 optionList 内部的自定义 slot                                                                                                     | ReactNode |  |
 | innerBottomSlot | 渲染在弹出层底部，在 optionList 内部的自定义 slot                                                                                                     | ReactNode |  |
-| insetLabel | 同上，与 prefix 区别是 fontWeight 更大                                                                                                         | ReactNode |  |
 | loading | 下拉列表是否展示加载动画                                                                                                                          | boolean | false |
 | maxTagCount | 多选模式下，已选项超出 maxTagCount 时，后续选项会被渲染成+N 的形式                                                                                             | number |  |
 | max | 最多可选几项，仅在多选模式下生效                                                                                                                      | number |  |

content/input/timepicker/index-en-US.md

@@ -42,18 +42,6 @@ function Demo() {
 }
 ```
 
-
-### With an Embedded Label
-
-```jsx live=true
-import React from 'react';
-import { TimePicker } from '@douyinfe/semi-ui';
-
-function Demo() {
-    return <TimePicker insetLabel="Time" />;
-}
-```
-
 ### Controlled Component
 
 When using `value` And not. `defaultValue` When used as a controlled component.`value` and `onChange` It needs to be used in conjunction.
@@ -311,7 +299,6 @@ function Demo(props = {}) {
 | hideDisabledOptions | Hide the option of forbidden selection                                                                                                                                                                                                        | boolean | false |
 | hourStep | Hour option interval                                                                                                                                                                                                                          | number | 1 |
 | inputReadOnly | Set the input box to read-only (avoid opening a virtual keyboard on a mobile device)                                                                                                                                                          | boolean | false |
-| insetLabel | Prefix label, lower priority than `prefix`                                                                                                                                                                                                    | string\|ReactNode |  |  |
 | minuteStep | Minute option interval                                                                                                                                                                                                                        | number | 1 |
 | motion | Whether to display the pop-up layer animation                                                                                                                                                                                                 | boolean | true |  |
 | open | Controlled property of whether the panel is open                                                                                                                                                                                              | boolean |  |

content/input/timepicker/index.md

@@ -41,17 +41,6 @@ function Demo() {
 }
 ```
 
-### 带内嵌标签
-
-```jsx live=true
-import React from 'react';
-import { TimePicker } from '@douyinfe/semi-ui';
-
-function Demo() {
-    return <TimePicker insetLabel='时刻'/>;
-}
-```
-
 ### 受控组件
 
 当使用 `value` 而不是 `defaultValue` 时，作为受控组件使用。`value` 和 `onChange` 需要配合使用。
@@ -301,7 +290,6 @@ function Demo(props = {}) {
 | hideDisabledOptions   | 隐藏禁止选择的选项                                                                                                       | boolean                                                                           | false                                                             |            |
 | hourStep              | 小时选项间隔                                                                                                             | number                                                                            | 1                                                                 |            |
 | inputReadOnly         | 设置输入框为只读（避免在移动设备上打开虚拟键盘）                                                                         | boolean                                                                           | false                                                             |            |
-| insetLabel            | 前缀标签，优先级低于 `prefix`                                                                                            | string\|ReactNode                                                                 |                                                                   |            |
 | minuteStep            | 分钟选项间隔                                                                                                             | number                                                                            | 1                                                                 |            |
 | motion                | 是否展示弹出层动画                                                                                                       | boolean                                                                           | true                                                              |            |
 | open                  | 面板是否打开的受控属性                                                                                                   | boolean                                                                           |                                                                   |            |

content/input/treeselect/index-en-US.md

@@ -1433,7 +1433,6 @@ function Demo() {
 | keyMaps | Customize the key, label, and value fields in the node | object |  - | 2.47.0 |
 | filterTreeNode           | Toggle whether searchable or pass in a function to customize search behavior, data parameter provided since v2.28.0 | boolean\| <ApiType detail='(inputValue: string, treeNodeString: string, data?: TreeNodeData) => boolean'>Function</ApiType> | false       | -       |
 | getPopupContainer        | Container to render pop-up, you need to set 'position: relative`  This will change the DOM tree position, but not the view's rendering position.                                                    | function():HTMLElement                                            | -           | -       |
-| insetLabel               | Prefix alias，used mainly in Form                                                   | ReactNode                                                         | -           | - |
 | labelEllipsis | Toggle whether to ellipsis label when overflow | boolean | false\|true(virtualized) | - |  
 | leafOnly | Toggle whether to display tags for leaf nodes only and for onChange callback params in multiple mode | boolean | false | - |
 | loadData | Load data asynchronously and the return value should be a promise | (treeNode: TreeNodeData) => Promise |-| - |

content/input/treeselect/index.md

@@ -1416,7 +1416,6 @@ function Demo() {
 | keyMaps | 自定义节点中 key、label、value 的字段。v2.47.0后提供                                                                                                | object |  - |
 | filterTreeNode | 是否根据输入项进行筛选，默认用 `treeNodeFilterProp` 的值作为要筛选的 `TreeNodeData` 的属性值, data 参数自 v2.28.0 开始提供                         | boolean\| <ApiType detail='(inputValue: string, treeNodeString: string, data?: TreeNodeData) => boolean'>Function</ApiType> | false |
 | getPopupContainer  | 指定父级 DOM，弹层将会渲染至该 DOM 中，自定义需要设置 `position: relative` 这会改变浮层 DOM 树位置，但不会改变视图渲染位置。                                                                                       | function():HTMLElement | - |
-| insetLabel | 前缀标签别名，主要用于 Form                                                                                                                     | ReactNode | - |
 | labelEllipsis | 是否开启label的超出省略，默认虚拟化状态下开启                                                                                                   | boolean | false\|true(虚拟化) | 
 | leafOnly | 多选模式下是否开启 onChange 回调入参及展示标签只有叶子节点                                                                                            | boolean | false |
 | loadData | 异步加载数据，需要返回一个Promise                                                                                                                 | (treeNode: TreeNodeData) => Promise |- |

content/other/locale/index-en-US.md

@@ -342,7 +342,7 @@ class I18nDemo extends React.Component {
                             style={{ width: 300, margin: 10 }}
                             treeData={treeData}
                             filterTreeNode
-                            insetLabel='Cascader'
+                            prefix='Cascader'
                         />
                     </div>
                     <h5>DatePicker</h5>
@@ -418,7 +418,7 @@ class I18nDemo extends React.Component {
         return (
             <>
                 <div style={{ borderBottom: '1px solid var(--semi-color-border)', paddingBottom: 20 }}>
-                    <Select onChange={this.onLanguageChange} insetLabel='Switch Language' style={{ width: 250 }} defaultValue='en_GB'>
+                    <Select onChange={this.onLanguageChange} prefix='Switch Language' style={{ width: 250 }} defaultValue='en_GB'>
                         <Select.Option value='zh_CN'>Chinese</Select.Option>
                         <Select.Option value='en_GB'>English</Select.Option>
                         <Select.Option value='ja_JP'>Japanese</Select.Option>

content/other/locale/index.md

@@ -348,7 +348,7 @@ class I18nDemo extends React.Component {
                             style={{ width: 300, margin: 10 }}
                             treeData={treeData}
                             filterTreeNode
-                            insetLabel='Cascader'
+                            prefix='Cascader'
                         />
                     </div>
                     <h5>DatePicker</h5>
@@ -424,7 +424,7 @@ class I18nDemo extends React.Component {
         return (
             <>
                 <div style={{ borderBottom: '1px solid var(--semi-color-border)', paddingBottom: 20 }}>
-                    <Select onChange={this.onLanguageChange} insetLabel='切换语言' style={{ width: 250 }} defaultValue='zh_CN'>
+                    <Select onChange={this.onLanguageChange} prefix='切换语言' style={{ width: 250 }} defaultValue='zh_CN'>
                         <Select.Option value='zh_CN'>简体中文</Select.Option>
                         <Select.Option value='en_US'>英语（美）</Select.Option>
                         <Select.Option value='en_GB'>英语（英）</Select.Option>

content/plus/jsonviewer/index.md

@@ -227,8 +227,8 @@ render(CustomRenderJsonComponent);
 | 属性                | 说明                                             | 类型                              | 默认值    |
 |-------------------|------------------------------------------------|---------------------------------|--------------|
 | value             | 展示内容                                    | string                                  | -  |
-| height            | 高度                                     | number                                  | -  |
-| width             | 宽度                                     | number                                  | -  |
+| height            | 高度                                     | number \| string                                  | -  |
+| width             | 宽度                                     | number \| string                                 | -  |
 | className         | 类名                           | string                                  | -   |
 | style             | 内联样式                           | object                                  | -   |
 | showSearch        | 是否显示搜索Icon                           | boolean                                  | true   |

content/start/changelog/index-en-US.md

@@ -16,6 +16,23 @@ Version：Major.Minor.Patch (follow the **Semver** specification)
 
 ---
 
+#### 🎉 2.77.0-beta.0 (2025-03-18)
+- 【New component】
+    - support new component UserGuide
+- 【Feat】
+    - InputNumber supports currency mode
+- 【Fix】
+    - fix MarkdownRender table duplicate column elements when header containing more than two components or bold texts [@ByteLan](https://github.com/ByteLan)
+    - Correct locale codes for Netherlands, Poland and Sweden (nl_NL -> nl-NL, pl_PL -> pl-PL, sv_SE -> sv-SE)
+
+#### 🎉 2.76.1 (2025-03-17)
+- 【Style】
+    - Style: For input type components, the styles of insetLabel and prefix remain consistent. Removed unnecessary tokens related to insetLabel, Added $font-cascader_prefix_suffix_fontWeight, $spacing-input_prefix_suffix-marginX, $font-input_prefix_suffix-fontWeight, $font-select_prefix_suffix-fontWeight, $spacing-tagInput_prefix_suffix-marginX, $font-tagInput_prefix_suffix-fontWeight, $font-treeSelect_prefix_suffix_fontWeight to manage prefix and suffix weights and margins.[#2752](https://github.com/DouyinFE/semi-design/issues/2752)
+
+#### 🎉 2.76.0 (2025-03-07)
+- 【Fix】
+    - Fix JsonViewer type error issue [@anjiazhuyouxing](https://github.com/anjiazhuyouxing) [#2748](https://github.com/DouyinFE/semi-design/pull/2748)
+
 #### 🎉 2.76.0-beta.0 (2025-03-04)
 - 【Feat】
     - Chat supports enableUpload API to support users to set upload behavior  [#2735](https://github.com/DouyinFE/semi-design/issues/2735)

content/start/changelog/index.md

@@ -13,10 +13,26 @@ Semi 版本号遵循 **Semver** 规范（主版本号-次版本号-修订版本
 -   修订版本号（patch）：仅会进行 bugfix，发布时间不限
 -   不同版本间的详细关系，可查阅 [FAQ](/zh-CN/start/faq)
 
+#### 🎉 2.77.0-beta.0 (2025-03-18)
+- 【New component】
+    - 新增新手引导组件 UserGuide [#2733](https://github.com/DouyinFE/semi-design/pull/2733)
+- 【Feat】
+    - InputNumber 支持货币模式 [#2742](https://github.com/DouyinFE/semi-design/pull/2742)
+- 【Fix】
+    - 修复了当MarkdownRender中的默认表格table，使用JSX组件的标题 或 标题使用加粗，数量≥2，会出现后面列覆盖前面列的情况。 [@ByteLan](https://github.com/ByteLan) [#2746](https://github.com/DouyinFE/semi-design/pull/2746)
+    - 更正荷兰、波兰和瑞典国家的 locale code（nl_NL -> nl-NL，pl_PL -> pl-PL，sv_SE -> sv-SE ） [#2742](https://github.com/DouyinFE/semi-design/pull/2742)
+
+#### 🎉 2.76.1 (2025-03-17)
+- 【Style】
+    - Style: 对输入类型的组件，insetLabel 和 prefix 的样式保持一致。删除 insetLabel 相关不必要的 token, 增加 $font-cascader_prefix_suffix_fontWeight，$spacing-input_prefix_suffix-marginX，$font-input_prefix_suffix-fontWeight，$font-select_prefix_suffix-fontWeight，$spacing-tagInput_prefix_suffix-marginX，$font-tagInput_prefix_suffix-fontWeight， $font-treeSelect_prefix_suffix_fontWeight 用于管理前后缀字重，外边距。[BUG] 统一 prefix/suffix和insetLabel 的 token [#2752](https://github.com/DouyinFE/semi-design/issues/2752)
+
+#### 🎉 2.76.0 (2025-03-07)
+- 【Fix】
+    - 修复 JsonViewer 类型错误问题 [@anjiazhuyouxing](https://github.com/anjiazhuyouxing) [#2748](https://github.com/DouyinFE/semi-design/pull/2748)
 
 #### 🎉 2.76.0-beta.0 (2025-03-04)
 - 【Feat】
-    - Chat 支持 enableUpload API 用于支持用户设置上传行为  [#2735 ](https://github.com/DouyinFE/semi-design/issues/2735) [#2739](https://github.com/DouyinFE/semi-design/pull/2739)
+    - Chat 支持 enableUpload API 用于支持用户设置上传行为  [#2735](https://github.com/DouyinFE/semi-design/issues/2735) [#2739](https://github.com/DouyinFE/semi-design/pull/2739)
     - 允许 RadioGroup options 传入 addonStyles/addonClassName/addonId/extraId 选项至 Radio 组件 [@SaltyfishEd](https://github.com/SaltyfishEd) [#2706](https://github.com/DouyinFE/semi-design/pull/2706)
     - JsonViewe r新增自定义渲染功能 [@anjiazhuyouxing](https://github.com/anjiazhuyouxing) [#2676](https://github.com/DouyinFE/semi-design/pull/2676)
 - 【Fix】

content/start/tailwind/index-en-US.md

@@ -12,7 +12,7 @@ brief: Use TailwindCSS and Semi more elegantly
 
 <br/>
 
-This page will provide best practices for some issues encountered when using atomic style libraries such as TailwindCSS with Semi.
+This page will provide best practices for some issues encountered when using atomic style libraries such as TailwindCSS (only v3, Tailwind V4 is not supported yet) with Semi.
 
 These problems are often encountered when other component libraries are used with Tailwind, but Semi provides official solutions. It is recommended to follow the instructions in this article to configure the project correctly.
 

content/start/tailwind/index.md

@@ -12,7 +12,7 @@ brief: 更优雅地使用 TailwindCSS 与 Semi
 
 <br/>
 
-本页将提供 TailwindCSS 等原子类样式库与 Semi 共同使用时遇到的一些问题的最佳实践。
+本页将提供 TailwindCSS (只支持 v3，tailwind V4 暂未支持) 等原子类样式库与 Semi 共同使用时遇到的一些问题的最佳实践。
 
 这些问题在其他组件库与 Tailwind 共同使用时候也会经常遇到，但 Semi 提供了官方解决方案，建议按照本文说明，正确配置项目。
 

cypress/e2e/scrollList.spec.js

@@ -7,22 +7,22 @@ describe('scrollList', () => {
     });
 
     // todo: due to the https://github.com/DouyinFE/semi-design/pull/2723, temporarily skip this test case
-    it.skip('infinite scroll', () => {
-        cy.visit('http://127.0.0.1:6006/iframe.html?id=scrolllist--single-scroll-list&args=&viewMode=story');
-        cy.wait(500);
-        cy.get('li[aria-selected="true"]').contains(0);
-        cy.get('.semi-scrolllist-item-wheel .semi-scrolllist-list-outer').scrollTo('right', { duration: 2000 });
-        cy.wait(1000);
-        cy.get('.semi-scrolllist-item-wheel .semi-scrolllist-list-outer').scrollTo('top', { duration: 2000 });
-        cy.wait(500);
-        cy.get('.semi-scrolllist-item-wheel .semi-scrolllist-list-outer').scrollTo('bottom', { duration: 2000 });
-    });
+    // it.skip('infinite scroll', () => {
+    //     cy.visit('http://127.0.0.1:6006/iframe.html?id=scrolllist--single-scroll-list&args=&viewMode=story');
+    //     cy.wait(500);
+    //     cy.get('li[aria-selected="true"]').contains(0);
+    //     cy.get('.semi-scrolllist-item-wheel .semi-scrolllist-list-outer').scrollTo('right', { duration: 2000 });
+    //     cy.wait(1000);
+    //     cy.get('.semi-scrolllist-item-wheel .semi-scrolllist-list-outer').scrollTo('top', { duration: 2000 });
+    //     cy.wait(500);
+    //     cy.get('.semi-scrolllist-item-wheel .semi-scrolllist-list-outer').scrollTo('bottom', { duration: 2000 });
+    // });
 
     // todo: due to the https://github.com/DouyinFE/semi-design/pull/2723, temporarily skip this test case
-    it.skip('click option', () => {
-        cy.visit('http://127.0.0.1:6006/iframe.html?id=scrolllist--single-scroll-list&args=&viewMode=story');
-        cy.get('li[aria-selected="true"]').contains(0);
-        cy.get('.semi-scrolllist-list-outer').contains(59).click();
-        cy.get('li[aria-selected="true"]').contains(0);
-    });
+    // it.skip('click options', () => {
+    //     // cy.visit('http://127.0.0.1:6006/iframe.html?id=scrolllist--single-scroll-list&args=&viewMode=story');
+    //     // cy.get('li[aria-selected="true"]').contains(0);
+    //     // cy.get('.semi-scrolllist-list-outer').contains(59).click();
+    //     // cy.get('li[aria-selected="true"]').contains(0);
+    // });
 });

lerna.json

@@ -1,5 +1,5 @@
 {
     "useWorkspaces": true,
     "npmClient": "yarn",
-    "version": "2.74.0"
+    "version": "2.76.1"
 }

packages/semi-animation-react/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-animation-react",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "motion library for semi-ui-react",
     "keywords": [
         "motion",
@@ -25,8 +25,8 @@
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.74.0",
-        "@douyinfe/semi-animation-styled": "2.74.0",
+        "@douyinfe/semi-animation": "2.76.1",
+        "@douyinfe/semi-animation-styled": "2.76.1",
         "classnames": "^2.2.6"
     },
     "devDependencies": {

packages/semi-animation-styled/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-animation-styled",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "semi styled animation",
     "keywords": [
         "semi",

packages/semi-animation/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-animation",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "animation base library for semi-ui",
     "keywords": [
         "animation",

packages/semi-eslint-plugin/package.json

@@ -1,6 +1,6 @@
 {
     "name": "eslint-plugin-semi-design",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "semi ui eslint plugin",
     "keywords": [
         "semi",

packages/semi-foundation/cascader/cascader.scss

@@ -246,7 +246,7 @@ $module: #{$prefix}-cascader;
 
         &-text {
             margin: 0 $spacing-cascader_text-marginX;
-            font-weight: $font-weight-bold;
+            font-weight: $font-cascader_prefix_suffix_fontWeight;
             @include font-size-regular;
             color: $color-cascader_prefix_suffix_text-default;
         }
@@ -259,10 +259,10 @@ $module: #{$prefix}-cascader;
 
     &-inset-label {
         display: inline;
-        margin-right: $spacing-cascader_label-marginRight;
-        font-weight: $font-weight-bold;
+        margin: 0 $spacing-cascader_text-marginX;
+        font-weight: $font-cascader_prefix_suffix_fontWeight;
         @include font-size-regular;
-        color: $color-cascader_label-text-default;
+        color: $color-cascader_prefix_suffix_text-default;
         flex-shrink: 0;
         white-space: nowrap;
     }

packages/semi-foundation/cascader/rtl.scss

@@ -5,10 +5,6 @@ $module: #{$prefix}-cascader;
     .#{$module} {
         direction: rtl;
 
-        &-inset-label {
-            margin-right:  $spacing-cascader_label-marginRight;
-            margin-left:  $spacing-cascader_label-marginRight;
-        }
 
         &.#{$module}-with-prefix {
             .#{$module}-selection {

packages/semi-foundation/cascader/variables.scss

@@ -84,6 +84,7 @@ $font-cascader_select-fontWeight: $font-weight-bold; // 级联选择菜单项字
 $font-cascader-fontWeight: $font-weight-regular; // 级联选择菜单项字重 - 未选中
 $font-cascader_label-fontWeight: 600;
 $font-cascader_selection_n-fontSize: $font-size-small; // 超出 maxTagCount 后，+n 的文字尺寸
+$font-cascader_prefix_suffix_fontWeight: $font-weight-bold; // 级联选择 prefix/suffix 文字字重
 
 $width-cascader-border: 1px; // 级联选择触发器描边宽度
 $width-cascader_option_list-border: 1px; // 级联选择各级菜单分割线宽度
@@ -107,7 +108,6 @@ $height-cascader_selection_wrapper_large: 38px;  //级联选择单选搜索时
 
 $spacing-cascader_text-marginX: $spacing-base-tight; // 级联选择 prefix/suffix 文字水平内间距
 $spacing-cascader_icon-marginX: $spacing-tight; // 级联选择 prefix/suffix 图标水平内间距
-$spacing-cascader_label-marginRight: $spacing-base-tight; // 级联选择 prefix/suffix 图标水平内间距
 $spacing-cascader_label_checkbox-marginRight: $spacing-tight; // 级联选择 checkbox 的右间距
 $spacing-cascader_selection_n-paddingX: $spacing-tight; // 级联选择 +N 的水平间距
 

packages/semi-foundation/input/input.scss

@@ -502,9 +502,8 @@ $module: #{$prefix}-input;
     // }
 
     &-inset-label {
-        margin-right: $spacing-input_insetLabel-marginRight;
-        font-weight: $font-input_insetLabel-fontWeight;
-        @include font-size-regular;
+        margin: 0 $spacing-input_prefix_suffix-marginX;
+        font-weight: $font-input_prefix_suffix-fontWeight;
         color: $color-input_prefix-text-default;
         flex-shrink: 0;
         white-space: nowrap;
@@ -515,9 +514,9 @@ $module: #{$prefix}-input;
         @include all-center;
 
         &-text {
-            margin: 0 $spacing-base-tight;
+            margin: 0 $spacing-input_prefix_suffix-marginX;
             color: $color-input_prefix-text-default;
-            font-weight: $font-weight-bold;
+            font-weight: $font-input_prefix_suffix-fontWeight;
             white-space: nowrap;
         }
 

packages/semi-foundation/input/rtl.scss

@@ -27,10 +27,6 @@ $module: #{$prefix}-input;
         padding-left: $spacing-input-paddingRight;
         padding-right: $spacing-input-paddingLeft;
 
-        &-inset-label {
-            margin-right: auto;
-            margin-left: $spacing-input_insetLabel-marginRight;
-        }
 
         &-clearbtn + &-suffix {
             & + .#{$module}-suffix-text {

packages/semi-foundation/input/variables.scss

@@ -88,7 +88,7 @@ $radius-input_wrapper: var(--semi-border-radius-small); // 输入框圆角大小
 $spacing-input_icon-marginLeft: -$spacing-base-tight; // 输入框图标左侧内边距
 $spacing-input-paddingLeft: $spacing-base-tight; // 输入光标距离容器的左侧内边距
 $spacing-input-paddingRight: $spacing-base-tight; // 输入文字距离容器的右侧内边距
-$spacing-input_insetLabel-marginRight: $spacing-base-tight;
+$spacing-input_prefix_suffix-marginX: $spacing-base-tight; // prefix/suffix 水平外边距
 $spacing-input_prefix_icon-marginY: 0; // prefix 图标垂直内边距
 $spacing-input_prefix_icon-marginX: $spacing-tight; // prefix 图标水平内边距
 $spacing-input_clearBtn_withSuffix-marginLeft: -$spacing-base-tight; // 清空按钮左侧内边距
@@ -96,7 +96,7 @@ $spacing-input_prepend-paddingY: 0; // 前置标签垂直内边距
 $spacing-input_prepend-paddingX: $spacing-base-tight; // 前置标签水平内边距
 $spacing-input_group_withTopLabel-marginTop: $spacing-base;
 $spacing-input_group_withTopLabel-marginBottom: $spacing-base;
-$font-input_insetLabel-fontWeight: 600; // prefix 文字字重
+$font-input_prefix_suffix-fontWeight: $font-weight-bold; // prefix/suffix 文字字重
 
 $spacing-textarea-paddingY: 5px; // 多行文本垂直内边距
 $spacing-textarea-paddingX: $spacing-base-tight; // 多行文本水平内边距

packages/semi-foundation/package.json

@@ -1,14 +1,14 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
         "prepublishOnly": "npm run build:lib"
     },
     "dependencies": {
-        "@douyinfe/semi-animation": "2.74.0",
-        "@douyinfe/semi-json-viewer-core": "2.74.0",
+        "@douyinfe/semi-animation": "2.76.1",
+        "@douyinfe/semi-json-viewer-core": "2.76.1",
         "@mdx-js/mdx": "^3.0.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",

packages/semi-foundation/select/rtl.scss

@@ -40,10 +40,6 @@ $module: #{$prefix}-select;
             }
         }
 
-        &-inset-label {
-            margin-left: $spacing-select_insetLabel-marginRight;
-        }
-
         &-create-tips {
             margin-right: 0;
             margin-left: $spacing-select_create_tips-marginRight;

packages/semi-foundation/select/select.scss

@@ -311,7 +311,7 @@ $overflowList: #{$prefix}-overflow-list;
             margin: $spacing-select_prefix_suffix_text-marginY $spacing-select_prefix_suffix_text-marginX;
             color: $color-select_prefix_suffix_text-default;
             @include font-size-regular;
-            font-weight: $font-weight-bold;
+            font-weight: $font-select_prefix_suffix-fontWeight;
         }
 
         &-icon {
@@ -339,10 +339,10 @@ $overflowList: #{$prefix}-overflow-list;
     }
 
     &-inset-label {
-        margin-right: $spacing-base-tight;
-        font-weight: $font-select_inset_label-fontWeight;
+        margin: $spacing-select_prefix_suffix_text-marginY $spacing-select_prefix_suffix_text-marginX;
+        font-weight: $font-select_prefix_suffix-fontWeight;
         @include font-size-regular;
-        color: $color-select_inset_label-text;
+        color: $color-select_prefix_suffix_text-default;
         flex-shrink: 0;
         white-space: nowrap;
     }

packages/semi-foundation/select/variables.scss

@@ -55,7 +55,6 @@ $color-select_option_disabled-bg: transparent; // 禁用选择器菜单选项背
 $color-select_option-icon-active: var(--semi-color-text-2); // 禁用选择器菜单选项图标颜色 - 选中态
 $color-select_option-border-default: var(--semi-color-border); // 分组选择器菜单项描边颜色
 $color-select-option-bg-selected: transparent; // 选择器菜单选项背景颜色 - 选中态
-$color-select_inset_label-text: var(--semi-color-text-2); // 分组选择器菜单项辅助文本颜色
 $color-select_create_tips-text: var(--semi-color-text-2); // 分组选择器菜单项提示文本颜色
 $color-select_group-text: var(--semi-color-text-2); // 分组选择器菜单项分组标题文本颜色
 
@@ -109,7 +108,6 @@ $spacing-select_tag-marginTop: $spacing-super-tight - 1px; // 多项选择器标
 $spacing-select_tag-marginRight: $spacing-extra-tight; // 多项选择器标签右侧外边距
 $spacing-select_tag-marginBottom: $spacing-super-tight - 1px; // 多项选择器标签底部外边距
 $spacing-select_selection-marginLeft: $spacing-base-tight; // 选择器内容区左侧外边距
-$spacing-select_insetLabel-marginRight: $spacing-base-tight; // 选择器内嵌标签右侧外边距
 
 $spacing-select_option_list-paddingTop: $spacing-extra-tight; // 选择器内容区顶部内边距
 $spacing-select_option_list-paddingRight: 0px; // 选择器内容区右侧内边距
@@ -127,8 +125,8 @@ $radius-select_option: 0px; // 选择器待选项圆角
 
 // Font
 $font-select-fontWeight: $font-weight-regular; // 选择器文本字重
-$font-select_inset_label-fontWeight: 600; // 选择器内嵌标签文本字重
 $font-select_keyword-fontWeight: 600; // 选择器搜索结果命关键词中文本字重
+$font-select_prefix_suffix-fontWeight: $font-weight-bold; // 选择器输入框前后缀文本字重
 
 // Other
 $opacity-select_selection_text_inactive: 0.4;

packages/semi-foundation/tagInput/tagInput.scss

@@ -256,10 +256,10 @@ $module: #{$prefix}-tagInput;
     }
 
     &-inset-label {
-        margin-right: $spacing-tagInput_insetLabel-marginRight;
-        font-weight: $font-tagInput_insetLabel-fontWeight;
+        margin: 0 $spacing-tagInput_prefix_suffix-marginX;
+        font-weight: $font-tagInput_prefix_suffix-fontWeight;
         @include font-size-regular;
-        color: $color-tagInput_prefix-text-default;
+        color: $color-tagInput_prefix-default;
         flex-shrink: 0;
         white-space: nowrap;
     }
@@ -268,9 +268,10 @@ $module: #{$prefix}-tagInput;
     &-suffix {
         @include all-center;
         &-text {
-            margin: 0 $spacing-base-tight;
-            font-weight: 600;
+            margin: 0 $spacing-tagInput_prefix_suffix-marginX;
+            font-weight: $font-tagInput_prefix_suffix-fontWeight;
             white-space: nowrap;
+            @include font-size-regular;
         }
         &-icon {
             color: $color-tagInput-icon-default;

packages/semi-foundation/tagInput/variables.scss

@@ -37,7 +37,7 @@ $spacing-tagInput_large-Y: 3px; // 大尺寸标签输入框标签顶部外边距
 $spacing-tagInput_wrapper_n_paddingX: $spacing-tight; //标签输入框标签容器水平内边距
 $spacing-tagInput_drag_handler-marginRight: 4px; // 拖拽handler icon的右外边距 
 $spacing-tagInput_tag_icon_paddingLeft: 4px; // tag中有handler icon时tag的左内边距
-$spacing-tagInput_insetLabel-marginRight: $spacing-base-tight; // Form容器中标签输入框内嵌Label的右边距
+$spacing-tagInput_prefix_suffix-marginX: $spacing-base-tight; // 标签输入框 prefix/suffix 水平外边距
 
 $height-tagInput-large: $height-control-large; // 大尺寸标签输入框高度
 $height-tagInput-default: $height-control-default; // 默认尺寸标签输入框高度
@@ -56,4 +56,4 @@ $radius-tagInput: var(--semi-border-radius-small); // 标签输入框圆角
 
 $z-tagInput_drag_item_move: 2000 !default; // 标签输入框中正在拖拽元素的z-index
 
-$font-tagInput_insetLabel-fontWeight: 600; // prefix 文字字重
+$font-tagInput_prefix_suffix-fontWeight: $font-weight-bold; // 标签输入框 prefix/suffix 文字字重

packages/semi-foundation/treeSelect/rtl.scss

@@ -40,12 +40,6 @@ $module: #{$prefix}-tree-select;
                 }
             }
         }
-    
-        &-inset-label {
-            margin-right: 0;
-            margin-left: $spacing-treeSelect_insertLabel-marginRight;
-        }
-    
         &-prefix,
         &-suffix {
             &.#{$module}-with-suffix {

packages/semi-foundation/treeSelect/treeSelect.scss

@@ -297,10 +297,10 @@ $module: #{$prefix}-tree-select;
 
     &-inset-label {
         display: inline;
-        margin-right: $spacing-treeSelect_insertLabel-marginRight;
-        font-weight: $font-treeSelect_insertLabel-fontWeight;
+        margin: $spacing-treeSelect_prefix_text-marginY $spacing-treeSelect_prefix_text-marginX;
+        font-weight: $font-treeSelect_prefix_suffix_fontWeight;
         @include font-size-regular;
-        color: $color-treeSelect_insertLabel-text-default;
+        color: $color-treeSelect_prefix_suffix_text-default;
         flex-shrink: 0;
         white-space: nowrap;
     }
@@ -338,7 +338,7 @@ $module: #{$prefix}-tree-select;
 
         &-text {
             color: $color-treeSelect_prefix_suffix_text-default;
-            font-weight: $font-weight-bold;
+            font-weight: $font-treeSelect_prefix_suffix_fontWeight;
             @include font-size-regular;
             margin: $spacing-treeSelect_prefix_text-marginY $spacing-treeSelect_prefix_text-marginX;
         }

packages/semi-foundation/treeSelect/variables.scss

@@ -63,6 +63,8 @@ $font-treeSelect_small-lineHeight: $height-treeSelect_small; // 小尺寸树选
 $height-treeSelect_large: $height-control-large; // 大尺寸树选择器选择器文本行高
 $font-treeSelect_large-lineHeight: $height-treeSelect_large; // 大尺寸树选择器选择器文本行高
 
+$font-treeSelect_prefix_suffix_fontWeight: $font-weight-bold; // 树选择器前缀后缀文本字重
+
 $spacing-treeSelect_selection_tagInput_wrapper-paddingX: $spacing-extra-tight; // 树选择器多选标签容器水平内边距
 $spacing-treeSelect_selection_tagInput_empty-marginLeft: $spacing-extra-tight; // 树选择器多选标签容器为空时左侧外边距
 $spacing-treeSelect_selection_tagInput_notEmpty-marginLeft: - $spacing-extra-tight; // 树选择器多选标签容器不为空时左侧外边距
@@ -75,7 +77,6 @@ $spacing-treeSelect_prefix_text-marginY: 0px; // 树选择器前缀文本垂直
 $spacing-treeSelect_prefix_text-marginX: $spacing-base-tight; // 树选择器前缀文本水平外边距
 $spacing-treeSelect_prefix_icon-marginY: 0px; // 树选择器前缀图标垂直外边距
 $spacing-treeSelect_prefix_icon-marginX: $spacing-tight; // 树选择器前缀图标水平外边距
-$spacing-treeSelect_insertLabel-marginRight: $spacing-base-tight; // 树选择器前缀标签右侧外边距
 $spacing-treeSelect_selection_withSuffix-paddingRight: 0px; // 树选择器有后缀时内容右侧内边距
 $spacing-treeSelect_search_wrapper-paddingX: 12px; // 树选择器搜索框容器水平内边距
 $spacing-treeSelect_search_wrapper-paddingY: 8px; // 树选择器搜索框容器垂直内边距
@@ -83,8 +84,6 @@ $spacing-treeSelect_search_wrapper-paddingY: 8px; // 树选择器搜索框容器
 $color-treeSelect_selection_TriggerSearchItem_disabled-text-default: var(--semi-color-disabled-text); // 带搜索的树选择器触发器占位文本默认颜色
 $color-treeSelect_inputTrigger-border-default: none; // 带搜索的树选择器触发器描边颜色
 $color-treeSelect_inputTrigger-bg-default: transparent; // 带搜索的树选择器触发器背景颜色
-$color-treeSelect_insertLabel-text-default: var(--semi-color-text-2); // 带搜索的树前缀标签文本颜色
-$font-treeSelect_insertLabel-fontWeight: 600; // 带搜索的树前缀标签文本字重
 $color-treeSelect_prefix_suffix_text-default: var(--semi-color-text-2); // 带搜索的树选择器前后缀文本颜色
 
 $width-treeSelect_arrow: 32px; // 树选择器展开箭头宽度

packages/semi-icons-lab/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@douyinfe/semi-icons-lab",
-  "version": "2.74.0",
+  "version": "2.76.1",
   "description": "semi icons lab",
   "keywords": [
     "semi",

packages/semi-icons/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-icons",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "semi icons",
     "keywords": [
         "semi",

packages/semi-illustrations/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-illustrations",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "semi illustrations",
     "keywords": [
         "semi",

packages/semi-json-viewer-core/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-json-viewer-core",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "",
     "main": "lib/index.js",
     "module": "lib/index.js",

packages/semi-next/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-next",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "Plugin that support Semi Design in Next.js",
     "author": "伍浩威 <[email protected]>",
     "homepage": "",
@@ -22,7 +22,7 @@
         "typescript": "^4"
     },
     "dependencies": {
-        "@douyinfe/semi-webpack-plugin": "2.74.0"
+        "@douyinfe/semi-webpack-plugin": "2.76.1"
     },
     "gitHead": "eb34a4f25f002bb4cbcfa51f3df93bed868c831a"
 }

packages/semi-rspack/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-rspack-plugin",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "",
     "homepage": "",
     "license": "MIT",

packages/semi-scss-compile/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-scss-compile",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "compile semi scss to css",
     "author": "[email protected]",
     "license": "MIT",

packages/semi-theme-default/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-theme-default",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "semi-theme-default",
     "keywords": [
         "semi-theme",

packages/semi-ui/jsonViewer/index.tsx

@@ -21,14 +21,14 @@ import {
 } from '@douyinfe/semi-icons';
 import BaseComponent, { BaseProps } from '../_base/baseComponent';
 import { createPortal } from 'react-dom';
-import {isEqual} from "lodash";
+import { isEqual } from "lodash";
 const prefixCls = cssClasses.PREFIX;
 
 export type { JsonViewerOptions };
 export interface JsonViewerProps extends BaseProps {
     value: string;
-    width: number;
-    height: number;
+    width: number | string;
+    height: number | string;
     showSearch?: boolean;
     className?: string;
     style?: React.CSSProperties;

packages/semi-ui/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "A modern, comprehensive, flexible design system and UI library. Connect DesignOps & DevOps. Quickly build beautiful React apps. Maintained by Douyin-fe team.",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -20,12 +20,12 @@
         "@dnd-kit/core": "^6.0.8",
         "@dnd-kit/sortable": "^7.0.2",
         "@dnd-kit/utilities": "^3.2.1",
-        "@douyinfe/semi-animation": "2.74.0",
-        "@douyinfe/semi-animation-react": "2.74.0",
-        "@douyinfe/semi-foundation": "2.74.0",
-        "@douyinfe/semi-icons": "2.74.0",
-        "@douyinfe/semi-illustrations": "2.74.0",
-        "@douyinfe/semi-theme-default": "2.74.0",
+        "@douyinfe/semi-animation": "2.76.1",
+        "@douyinfe/semi-animation-react": "2.76.1",
+        "@douyinfe/semi-foundation": "2.76.1",
+        "@douyinfe/semi-icons": "2.76.1",
+        "@douyinfe/semi-illustrations": "2.76.1",
+        "@douyinfe/semi-theme-default": "2.76.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",

packages/semi-webpack/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-webpack-plugin",
-    "version": "2.74.0",
+    "version": "2.76.1",
     "description": "",
     "author": "伍浩威 <[email protected]>",
     "homepage": "",