feat: Support affix props in Anchor (#49295)

* feat: Support affix props in Anchor

* Update components/anchor/index.zh-CN.md

Co-authored-by: afc163 <afc163@gmail.com>
Signed-off-by: gin-lsl <gin_lsl@outlook.com>

* docs: update doc

---------

Signed-off-by: gin-lsl <gin_lsl@outlook.com>
Co-authored-by: afc163 <afc163@gmail.com>
This commit is contained in:
gin-lsl 2024-06-12 15:00:56 +08:00 committed by GitHub
parent b29c314b4c
commit 5c42cfaa63
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 7 additions and 4 deletions

View File

@ -7,6 +7,7 @@ import getScroll from '../_util/getScroll';
import scrollTo from '../_util/scrollTo';
import { devUseWarning } from '../_util/warning';
import Affix from '../affix';
import type { AffixProps } from '../affix';
import type { ConfigConsumerProps } from '../config-provider';
import { ConfigContext } from '../config-provider';
import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
@ -62,7 +63,7 @@ export interface AnchorProps {
children?: React.ReactNode;
offsetTop?: number;
bounds?: number;
affix?: boolean;
affix?: boolean | Omit<AffixProps, 'offsetTop' | 'target' | 'children'>;
showInkInFixed?: boolean;
getContainer?: () => AnchorContainer;
/** Return customize highlight anchor */
@ -348,10 +349,12 @@ const Anchor: React.FC<AnchorProps> = (props) => {
[activeLink, onClick, handleScrollTo, anchorDirection],
);
const affixProps = affix && typeof affix === 'object' ? affix : undefined;
return wrapCSSVar(
<AnchorContext.Provider value={memoizedContextValue}>
{affix ? (
<Affix offsetTop={offsetTop} target={getCurrentContainer}>
<Affix offsetTop={offsetTop} target={getCurrentContainer} {...affixProps}>
{anchorContent}
</Affix>
) : (

View File

@ -40,7 +40,7 @@ Common props ref[Common props](/docs/react/common-props)
| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| affix | Fixed mode of Anchor | boolean | true | |
| affix | Fixed mode of Anchor | boolean \| Omit<AffixProps, 'offsetTop' \| 'target' \| 'children'> | true | object: 5.19.0 |
| bounds | Bounding distance of anchor area | number | 5 | |
| getContainer | Scrolling container | () => HTMLElement | () => window | |
| getCurrentAnchor | Customize the anchor highlight | (activeLink: string) => string | - | |

View File

@ -41,7 +41,7 @@ group:
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| affix | 固定模式 | boolean | true | |
| affix | 固定模式 | boolean \| Omit<AffixProps, 'offsetTop' \| 'target' \| 'children'> | true | object: 5.19.0 |
| bounds | 锚点区域边界 | number | 5 | |
| getContainer | 指定滚动的容器 | () => HTMLElement | () => window | |
| getCurrentAnchor | 自定义高亮的锚点 | (activeLink: string) => string | - | |