ant-design/components/theme/useToken.ts

36 lines
1.0 KiB
TypeScript
Raw Normal View History

import type { Theme } from '@ant-design/cssinjs';
import { useCacheToken } from '@ant-design/cssinjs';
import React from 'react';
import version from '../version';
import type { GlobalToken, MapToken, SeedToken } from './interface';
import { DesignTokenContext, defaultTheme } from './context';
import defaultSeedToken from './themes/seed';
import formatToken from './util/alias';
// ================================== Hook ==================================
export default function useToken(): [Theme<SeedToken, MapToken>, GlobalToken, string] {
const {
token: rootDesignToken,
hashed,
theme,
components,
} = React.useContext(DesignTokenContext);
const salt = `${version}-${hashed || ''}`;
const mergedTheme = theme || defaultTheme;
const [token, hashId] = useCacheToken<GlobalToken, SeedToken>(
mergedTheme,
[defaultSeedToken, rootDesignToken],
{
salt,
override: { override: rootDesignToken, ...components },
formatToken,
},
);
return [mergedTheme, token, hashed ? hashId : ''];
}