Merge branch 'main' into release

content/basic/typography/index.md

@@ -254,7 +254,7 @@ function Demo() {
             <Text 
                 ellipsis={{ 
                     showTooltip:{
-                        opts: { content: '架构|Data-inf|bytegraph.cheetah.user_relation' }
+                        opts: { content: '架构|Semi-inf|graph.cheet.relation' }
                     }
                 }}
                 style={{ width: 150 }}
@@ -265,7 +265,7 @@ function Demo() {
             <Text 
                 ellipsis={{ 
                     showTooltip:{
-                        opts: { content: '架构|Data-inf|bytegraph.cheetah.user_relation', className: 'components-typography-demo' }
+                        opts: { content: '架构|Semi-inf|graph.cheet.relation', className: 'components-typography-demo' }
                     }
                 }}
                 style={{ width: 150 }}
@@ -276,7 +276,7 @@ function Demo() {
             <Text 
                 ellipsis={{
                     showTooltip:{
-                        opts: { content: '架构|Data-inf|bytegraph.cheetah.user_relation', style: { wordBreak: 'break-all' } }
+                        opts: { content: '架构|Semi-inf|graph.cheet.relation', style: { wordBreak: 'break-all' } }
                     }
                 }}
                 style={{ width: 150 }}

packages/semi-ui/form/hooks/useFormApi.tsx

@@ -1,6 +1,7 @@
+import { BaseFormApi } from '@douyinfe/semi-foundation/form/interface';
 import React, { useContext } from 'react';
 import { FormApiContext } from '../context';
  
-export default function useFormApi() {
-    return useContext(FormApiContext);
+export default function useFormApi<T extends Record<string, any> = any>() {
+    return useContext<BaseFormApi<T>>(FormApiContext);
 }

packages/semi-ui/radio/_story/radio.stories.js

@@ -865,4 +865,25 @@ export const FixWithFieldLossRef = () => {
     </Form>
   );
 }
-FixWithFieldLossRef.storyName = '修复 Form Field 丢失 ref 问题 #384';
+FixWithFieldLossRef.storyName = '修复 Form Field 丢失 ref 问题 #384';
+
+
+export const SwitchValueToNaN = () => {
+  const [val, setVal] = useState(1);
+
+  return (
+    <>
+      <RadioGroup direction="vertical" aria-label="单选组合示例" value={val}>
+          <Radio value={1}>A</Radio>
+          <Radio value={2}>B</Radio>
+          <Radio value={3}>C</Radio>
+          <Radio value={4}>D</Radio>
+      </RadioGroup>
+      <Space>
+        <Button onClick={() => setVal(NaN)}>NaN</Button>
+        <Button onClick={() => setVal(2)}>2</Button>
+      </Space>
+    </>
+  );
+}
+SwitchValueToNaN.storyName = 'SwitchValueToNaN';

packages/semi-ui/tree/nodeList.tsx

@@ -55,6 +55,7 @@ export default class NodeList extends PureComponent<NodeListProps, NodeListState
     }
 
     onMotionEnd = () => {
+        typeof this.props.onMotionEnd === 'function' && this.props.onMotionEnd();
         this.setState({ transitionNodes: [] });
     };
 

packages/semi-ui/treeSelect/index.tsx

@@ -331,6 +331,9 @@ class TreeSelect extends BaseComponent<TreeSelectProps, TreeSelectState> {
         this.clickOutsideHandler = null;
         this.foundation = new TreeSelectFoundation(this.adapter);
         this.treeSelectID = Math.random().toString(36).slice(2);
+        this.onMotionEnd = () => {
+            this.adapter.rePositionDropdown();
+        };
     }
 
     // eslint-disable-next-line max-lines-per-function

src/templates/postTemplate.js

@@ -37,7 +37,7 @@ import '../styles/docDemo.scss';
 import '../styles/index.scss';
 import '../styles/doc.scss';
 import cls from 'classnames';
-import { IconLink, IconFile } from '@douyinfe/semi-icons';
+import { IconLink, IconFile, IconHelpCircle } from '@douyinfe/semi-icons';
 import { Switch, TabPane, Tabs } from '../../packages/semi-ui';
 import DesignPageAnchor from 'components/DesignPageAnchor';
 import transContent, {getAnotherSideUrl, isHaveUedDocs, isJumpToDesignSite} from './toUEDUtils/toUED';
@@ -181,6 +181,27 @@ const components = {
         return (
             <h2 className="md markdown gatsby-h2" id={makeAnchorId(children)}>
                 {children}
+                {
+                    children === '设计变量'?
+                        <Tooltip content={
+                            <span>
+                                如何使用可查阅：
+                                <a href='https://bytedance.feishu.cn/docx/doxcnVROZf61ey1zFzlErtJfL2d' target="_blank">Semi DSM 手册</a>
+                            </span>}
+                        >
+                            <IconHelpCircle size='large' type="help_circle" style={{ color: ' --semi-color-tertiary-light-default', marginLeft: 4 }}/>
+                        </Tooltip>
+                    : null
+                }
+                {
+                    children === 'Design Tokens' ? <Tooltip content={
+                        <span>
+                            How to use: Refer to
+                            <a href='https://bytedance.feishu.cn/docx/doxcnVROZf61ey1zFzlErtJfL2d' target="_blank">DSM Playbook</a>
+                        </span>}>
+                        <IconHelpCircle size='large' type="help_circle" style={{ color: ' --semi-color-tertiary-light-default', marginLeft: 4 }} />
+                    </Tooltip> : null
+                }
                 <IconLink
                     className={'anchor-link-button-icon'}
                     onClick={() => {