mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-06-07 17:44:35 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

feat: anchor ink ball style (#38616)

Browse Source 
* feat: anchor ink ball style

* chore: code clean

* chore: code clean

* chore: code clean

* chore: update snapshot

* chore: change cover
This commit is contained in:
MadCcc 2022-11-17 16:49:09 +08:00 committed by GitHub
parent 7ec5ee2a58
commit de555912c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 83 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
.dumi/theme/slots/Content/index.tsx
View File

@ -35,16 +35,6 @@ const useStyle = () => {
${antCls}-anchor-link-title { ${antCls}-anchor-link-title {
font-size: 12px; font-size: 12px;
} }
${antCls}-anchor-ink-ball {
left: 0;
width: ${token.lineWidthBold}px;
height: ${token.fontSizeSM * token.lineHeightSM}px;
margin-top: ${token.marginXXS}px;
background-color: ${token.colorPrimary};
border: none;
transform: translateY(-50%);
}
} }
`, `,
tocWrapper: css` tocWrapper: css`

4
components/affix/index.en-US.md
View File

@ -5,8 +5,8 @@ cover: https://gw.alipayobjects.com/zos/alicdn/tX6-md4H6/Affix.svg
demo: demo:
cols: 2 cols: 2
group: group:
title: Navigation title: Other
order: 3 order:
--- ---
Wrap Affix around another component to make it stick the viewport. Wrap Affix around another component to make it stick the viewport.

4
components/affix/index.zh-CN.md
View File

@ -6,8 +6,8 @@ cover: https://gw.alipayobjects.com/zos/alicdn/tX6-md4H6/Affix.svg
demo: demo:
cols: 2 cols: 2
group: group:
title: 导航 title: 其他
order: 3 order: 7
--- ---
将页面元素钉在可视范围。 将页面元素钉在可视范围。

19
components/anchor/Anchor.tsx
View File

@ -90,7 +90,7 @@ export interface AntAnchor {
) => void; ) => void;
} }
const AnchorContent: React.FC<InternalAnchorProps> = props => { const AnchorContent: React.FC<InternalAnchorProps> = (props) => {
const { const {
rootClassName, rootClassName,
anchorPrefixCls: prefixCls, anchorPrefixCls: prefixCls,
@ -123,18 +123,18 @@ const AnchorContent: React.FC<InternalAnchorProps> = props => {
const dependencyListItem: React.DependencyList[number] = JSON.stringify(links); const dependencyListItem: React.DependencyList[number] = JSON.stringify(links);
const registerLink = React.useCallback<AntAnchor['registerLink']>( const registerLink = React.useCallback<AntAnchor['registerLink']>(
link => { (link) => {
if (!links.includes(link)) { if (!links.includes(link)) {
setLinks(prev => [...prev, link]); setLinks((prev) => [...prev, link]);
} }
}, },
[dependencyListItem], [dependencyListItem],
); );
const unregisterLink = React.useCallback<AntAnchor['unregisterLink']>( const unregisterLink = React.useCallback<AntAnchor['unregisterLink']>(
link => { (link) => {
if (links.includes(link)) { if (links.includes(link)) {
setLinks(prev => prev.filter(i => i !== link)); setLinks((prev) => prev.filter((i) => i !== link));
} }
}, },
[dependencyListItem], [dependencyListItem],
@ -145,14 +145,15 @@ const AnchorContent: React.FC<InternalAnchorProps> = props => {
`.${prefixCls}-link-title-active`, `.${prefixCls}-link-title-active`,
); );
if (linkNode && spanLinkNode.current) { if (linkNode && spanLinkNode.current) {
spanLinkNode.current.style.top = `${linkNode.offsetTop + linkNode.clientHeight / 2 - 4.5}px`; spanLinkNode.current.style.top = `${linkNode.offsetTop + linkNode.clientHeight / 2}px`;
spanLinkNode.current.style.height = `${linkNode.clientHeight}px`;
} }
}; };
const getInternalCurrentAnchor = (_links: string[], _offsetTop = 0, _bounds = 5): string => { const getInternalCurrentAnchor = (_links: string[], _offsetTop = 0, _bounds = 5): string => {
const linkSections: Section[] = []; const linkSections: Section[] = [];
const container = getCurrentContainer(); const container = getCurrentContainer();
_links.forEach(link => { _links.forEach((link) => {
const sharpLinkMatch = sharpMatcherRegx.exec(link?.toString()); const sharpLinkMatch = sharpMatcherRegx.exec(link?.toString());
if (!sharpLinkMatch) { if (!sharpLinkMatch) {
return; return;
@ -204,7 +205,7 @@ const AnchorContent: React.FC<InternalAnchorProps> = props => {
}, [dependencyListItem, targetOffset, offsetTop]); }, [dependencyListItem, targetOffset, offsetTop]);
const handleScrollTo = React.useCallback<(link: string) => void>( const handleScrollTo = React.useCallback<(link: string) => void>(
link => { (link) => {
setCurrentActiveLink(link); setCurrentActiveLink(link);
const container = getCurrentContainer(); const container = getCurrentContainer();
const scrollTop = getScroll(container, true); const scrollTop = getScroll(container, true);
@ -310,7 +311,7 @@ const AnchorContent: React.FC<InternalAnchorProps> = props => {
); );
}; };
const Anchor: React.FC<AnchorProps> = props => { const Anchor: React.FC<AnchorProps> = (props) => {
const { prefixCls: customizePrefixCls } = props; const { prefixCls: customizePrefixCls } = props;
const { getPrefixCls } = React.useContext<ConfigConsumerProps>(ConfigContext); const { getPrefixCls } = React.useContext<ConfigConsumerProps>(ConfigContext);
const anchorPrefixCls = getPrefixCls('anchor', customizePrefixCls); const anchorPrefixCls = getPrefixCls('anchor', customizePrefixCls);

36
components/anchor/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -46,7 +46,7 @@ exports[`renders ./components/anchor/demo/basic.tsx extend context correctly 1`]
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -56,7 +56,7 @@ exports[`renders ./components/anchor/demo/basic.tsx extend context correctly 1`]
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -67,7 +67,7 @@ exports[`renders ./components/anchor/demo/basic.tsx extend context correctly 1`]
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -122,7 +122,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.tsx extend context
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -132,7 +132,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.tsx extend context
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -143,7 +143,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.tsx extend context
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -196,7 +196,7 @@ exports[`renders ./components/anchor/demo/onChange.tsx extend context correctly
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -206,7 +206,7 @@ exports[`renders ./components/anchor/demo/onChange.tsx extend context correctly
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -217,7 +217,7 @@ exports[`renders ./components/anchor/demo/onChange.tsx extend context correctly
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -270,7 +270,7 @@ exports[`renders ./components/anchor/demo/onClick.tsx extend context correctly 1
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -280,7 +280,7 @@ exports[`renders ./components/anchor/demo/onClick.tsx extend context correctly 1
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -291,7 +291,7 @@ exports[`renders ./components/anchor/demo/onClick.tsx extend context correctly 1
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -344,7 +344,7 @@ exports[`renders ./components/anchor/demo/static.tsx extend context correctly 1`
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -354,7 +354,7 @@ exports[`renders ./components/anchor/demo/static.tsx extend context correctly 1`
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -365,7 +365,7 @@ exports[`renders ./components/anchor/demo/static.tsx extend context correctly 1`
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -422,7 +422,7 @@ exports[`renders ./components/anchor/demo/targetOffset.tsx extend context correc
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -432,7 +432,7 @@ exports[`renders ./components/anchor/demo/targetOffset.tsx extend context correc
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -443,7 +443,7 @@ exports[`renders ./components/anchor/demo/targetOffset.tsx extend context correc
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props

36
components/anchor/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -46,7 +46,7 @@ exports[`renders ./components/anchor/demo/basic.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -56,7 +56,7 @@ exports[`renders ./components/anchor/demo/basic.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -67,7 +67,7 @@ exports[`renders ./components/anchor/demo/basic.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -122,7 +122,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.tsx correctly 1`] =
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -132,7 +132,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.tsx correctly 1`] =
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -143,7 +143,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.tsx correctly 1`] =
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -196,7 +196,7 @@ exports[`renders ./components/anchor/demo/onChange.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -206,7 +206,7 @@ exports[`renders ./components/anchor/demo/onChange.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -217,7 +217,7 @@ exports[`renders ./components/anchor/demo/onChange.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -270,7 +270,7 @@ exports[`renders ./components/anchor/demo/onClick.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -280,7 +280,7 @@ exports[`renders ./components/anchor/demo/onClick.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -291,7 +291,7 @@ exports[`renders ./components/anchor/demo/onClick.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -344,7 +344,7 @@ exports[`renders ./components/anchor/demo/static.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -354,7 +354,7 @@ exports[`renders ./components/anchor/demo/static.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -365,7 +365,7 @@ exports[`renders ./components/anchor/demo/static.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props
@ -422,7 +422,7 @@ exports[`renders ./components/anchor/demo/targetOffset.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#API" href="#api"
title="API" title="API"
> >
API API
@ -432,7 +432,7 @@ exports[`renders ./components/anchor/demo/targetOffset.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Anchor-Props" href="#anchor-props"
title="Anchor Props" title="Anchor Props"
> >
Anchor Props Anchor Props
@ -443,7 +443,7 @@ exports[`renders ./components/anchor/demo/targetOffset.tsx correctly 1`] = `
> >
<a <a
class="ant-anchor-link-title" class="ant-anchor-link-title"
href="#Link-Props" href="#link-props"
title="Link Props" title="Link Props"
> >
Link Props Link Props

6
components/anchor/demo/basic.tsx
View File

@ -7,9 +7,9 @@ const App: React.FC = () => (
<Anchor> <Anchor>
<Link href="#components-anchor-demo-basic" title="Basic demo" /> <Link href="#components-anchor-demo-basic" title="Basic demo" />
<Link href="#components-anchor-demo-static" title="Static demo" /> <Link href="#components-anchor-demo-static" title="Static demo" />
<Link href="#API" title="API"> <Link href="#api" title="API">
<Link href="#Anchor-Props" title="Anchor Props" /> <Link href="#anchor-props" title="Anchor Props" />
<Link href="#Link-Props" title="Link Props" /> <Link href="#link-props" title="Link Props" />
</Link> </Link>
</Anchor> </Anchor>
); );

6
components/anchor/demo/customizeHighlight.tsx
View File

@ -9,9 +9,9 @@ const App: React.FC = () => (
<Anchor affix={false} getCurrentAnchor={getCurrentAnchor}> <Anchor affix={false} getCurrentAnchor={getCurrentAnchor}>
<Link href="#components-anchor-demo-basic" title="Basic demo" /> <Link href="#components-anchor-demo-basic" title="Basic demo" />
<Link href="#components-anchor-demo-static" title="Static demo" /> <Link href="#components-anchor-demo-static" title="Static demo" />
<Link href="#API" title="API"> <Link href="#api" title="API">
<Link href="#Anchor-Props" title="Anchor Props" /> <Link href="#anchor-props" title="Anchor Props" />
<Link href="#Link-Props" title="Link Props" /> <Link href="#link-props" title="Link Props" />
</Link> </Link>
</Anchor> </Anchor>
); );

6
components/anchor/demo/onChange.tsx
View File

@ -11,9 +11,9 @@ const App: React.FC = () => (
<Anchor affix={false} onChange={onChange}> <Anchor affix={false} onChange={onChange}>
<Link href="#components-anchor-demo-basic" title="Basic demo" /> <Link href="#components-anchor-demo-basic" title="Basic demo" />
<Link href="#components-anchor-demo-static" title="Static demo" /> <Link href="#components-anchor-demo-static" title="Static demo" />
<Link href="#API" title="API"> <Link href="#api" title="API">
<Link href="#Anchor-Props" title="Anchor Props" /> <Link href="#anchor-props" title="Anchor Props" />
<Link href="#Link-Props" title="Link Props" /> <Link href="#link-props" title="Link Props" />
</Link> </Link>
</Anchor> </Anchor>
); );

6
components/anchor/demo/onClick.tsx
View File

@ -18,9 +18,9 @@ const App: React.FC = () => (
<Anchor affix={false} onClick={handleClick}> <Anchor affix={false} onClick={handleClick}>
<Link href="#components-anchor-demo-basic" title="Basic demo" /> <Link href="#components-anchor-demo-basic" title="Basic demo" />
<Link href="#components-anchor-demo-static" title="Static demo" /> <Link href="#components-anchor-demo-static" title="Static demo" />
<Link href="#API" title="API"> <Link href="#api" title="API">
<Link href="#Anchor-Props" title="Anchor Props" /> <Link href="#anchor-props" title="Anchor Props" />
<Link href="#Link-Props" title="Link Props" /> <Link href="#link-props" title="Link Props" />
</Link> </Link>
</Anchor> </Anchor>
); );

6
components/anchor/demo/static.tsx
View File

@ -7,9 +7,9 @@ const App: React.FC = () => (
<Anchor affix={false}> <Anchor affix={false}>
<Link href="#components-anchor-demo-basic" title="Basic demo" /> <Link href="#components-anchor-demo-basic" title="Basic demo" />
<Link href="#components-anchor-demo-static" title="Static demo" /> <Link href="#components-anchor-demo-static" title="Static demo" />
<Link href="#API" title="API"> <Link href="#api" title="API">
<Link href="#Anchor-Props" title="Anchor Props" /> <Link href="#anchor-props" title="Anchor Props" />
<Link href="#Link-Props" title="Link Props" /> <Link href="#link-props" title="Link Props" />
</Link> </Link>
</Anchor> </Anchor>
); );

6
components/anchor/demo/targetOffset.tsx
View File

@ -14,9 +14,9 @@ const App: React.FC = () => {
<Anchor targetOffset={targetOffset}> <Anchor targetOffset={targetOffset}>
<Link href="#components-anchor-demo-basic" title="Basic demo" /> <Link href="#components-anchor-demo-basic" title="Basic demo" />
<Link href="#components-anchor-demo-static" title="Static demo" /> <Link href="#components-anchor-demo-static" title="Static demo" />
<Link href="#API" title="API"> <Link href="#api" title="API">
<Link href="#Anchor-Props" title="Anchor Props" /> <Link href="#anchor-props" title="Anchor Props" />
<Link href="#Link-Props" title="Link Props" /> <Link href="#link-props" title="Link Props" />
</Link> </Link>
</Anchor> </Anchor>
); );

6
components/anchor/index.en-US.md
View File

@ -1,10 +1,10 @@
--- ---
category: Components category: Components
title: Anchor title: Anchor
cover: https://gw.alipayobjects.com/zos/alicdn/_1-C1JwsC/Anchor.svg cover: https://gw.alipayobjects.com/zos/bmw-prod/669b87c5-7b44-4c99-a5ea-4c38f8004788.svg
group: group:
title: Other title: Navigation
order: 7 order: 3
demo: demo:
cols: 2 cols: 2
--- ---

9
components/anchor/index.zh-CN.md
View File

@ -1,14 +1,13 @@
--- ---
category: Components category: Components
subtitle: 锚点 subtitle: 锚点
cols: 2
title: Anchor title: Anchor
cover: https://gw.alipayobjects.com/zos/alicdn/_1-C1JwsC/Anchor.svg cover: https://gw.alipayobjects.com/zos/bmw-prod/669b87c5-7b44-4c99-a5ea-4c38f8004788.svg
group:
title: 其他
order: 7
demo: demo:
cols: 2 cols: 2
group:
title: 导航
order: 3
--- ---
用于跳转到页面指定位置。 用于跳转到页面指定位置。

18
components/anchor/style/index.tsx
View File

@ -16,7 +16,8 @@ interface AnchorToken extends FullToken<'Anchor'> {
// ============================== Shared ============================== // ============================== Shared ==============================
const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token): CSSObject => { const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token): CSSObject => {
const { componentCls, holderOffsetBlock, anchorBallSize, lineWidthBold } = token; const { componentCls, holderOffsetBlock, motionDurationSlow, lineWidthBold, colorPrimary } =
token;
return { return {
[`${componentCls}-wrapper`]: { [`${componentCls}-wrapper`]: {
@ -54,16 +55,13 @@ const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token): CSSObject => {
position: 'absolute', position: 'absolute',
left: { left: {
_skip_check_: true, _skip_check_: true,
value: '50%', value: 0,
}, },
display: 'none', display: 'none',
width: anchorBallSize, transform: 'translateY(-50%)',
height: anchorBallSize, transition: `top ${motionDurationSlow} ease-in-out`,
backgroundColor: token.colorBgContainer, width: lineWidthBold,
border: `${lineWidthBold}px solid ${token.colorPrimary}`, backgroundColor: colorPrimary,
borderRadius: anchorBallSize,
transform: 'translateX(-50%)',
transition: `top ${token.motionDurationSlow} ease-in-out`,
[`&${componentCls}-ink-ball-visible`]: { [`&${componentCls}-ink-ball-visible`]: {
display: 'inline-block', display: 'inline-block',
@ -106,7 +104,7 @@ const genSharedAnchorStyle: GenerateStyle<AnchorToken> = (token): CSSObject => {
}; };
// ============================== Export ============================== // ============================== Export ==============================
export default genComponentStyleHook('Anchor', token => { export default genComponentStyleHook('Anchor', (token) => {
const { fontSize, fontSizeLG, padding, paddingXXS } = token; const { fontSize, fontSizeLG, padding, paddingXXS } = token;
const anchorToken = mergeToken<AnchorToken>(token, { const anchorToken = mergeToken<AnchorToken>(token, {