mirror of
https://github.com/ant-design/ant-design.git
synced 2025-08-06 16:06:28 +08:00
refactor: delete legacy function withConfigConsumer (#39798)
* chore: delete legacy function withConfigConsumer * fix * fix
This commit is contained in:
parent
7be364f3d9
commit
fa6c9c15f4
@ -81,42 +81,4 @@ export const ConfigContext = React.createContext<ConfigConsumerProps>({
|
|||||||
iconPrefixCls: defaultIconPrefixCls,
|
iconPrefixCls: defaultIconPrefixCls,
|
||||||
});
|
});
|
||||||
|
|
||||||
export const ConfigConsumer = ConfigContext.Consumer;
|
export const { Consumer: ConfigConsumer } = ConfigContext;
|
||||||
|
|
||||||
// =========================== withConfigConsumer ===========================
|
|
||||||
interface BasicExportProps {
|
|
||||||
prefixCls?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ConsumerConfig {
|
|
||||||
prefixCls: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ConstructorProps {
|
|
||||||
displayName?: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** @deprecated Use hooks instead. This is a legacy function */
|
|
||||||
export function withConfigConsumer<ExportProps extends BasicExportProps>(config: ConsumerConfig) {
|
|
||||||
return function withConfigConsumerFunc<ComponentDef>(
|
|
||||||
Component: React.ComponentType<ExportProps>,
|
|
||||||
): React.FC<ExportProps> & ComponentDef {
|
|
||||||
// Wrap with ConfigConsumer. Since we need compatible with react 15, be careful when using ref methods
|
|
||||||
const SFC: React.FC<ExportProps> & ComponentDef = ((props) => {
|
|
||||||
const configProps = React.useContext<ConfigConsumerProps>(ConfigContext);
|
|
||||||
const { getPrefixCls } = configProps;
|
|
||||||
const { prefixCls: basicPrefixCls } = config;
|
|
||||||
const { prefixCls: customizePrefixCls } = props;
|
|
||||||
const prefixCls = getPrefixCls(basicPrefixCls, customizePrefixCls);
|
|
||||||
return <Component {...configProps} {...props} prefixCls={prefixCls} />;
|
|
||||||
}) as React.FC<ExportProps> & ComponentDef;
|
|
||||||
|
|
||||||
const cons: ConstructorProps = Component.constructor as ConstructorProps;
|
|
||||||
const name = (cons && cons.displayName) || Component.name || 'Component';
|
|
||||||
|
|
||||||
if (process.env.NODE_ENV !== 'production') {
|
|
||||||
SFC.displayName = `withConfigConsumer(${name})`;
|
|
||||||
}
|
|
||||||
return SFC;
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
@ -1,18 +1,12 @@
|
|||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
|
|
||||||
import type { ConfigConsumerProps } from '../config-provider';
|
import type { ConfigConsumerProps } from '../config-provider';
|
||||||
import { withConfigConsumer } from '../config-provider/context';
|
import { ConfigContext } from '../config-provider';
|
||||||
import Skeleton from '../skeleton';
|
import Skeleton from '../skeleton';
|
||||||
import type Countdown from './Countdown';
|
|
||||||
import StatisticNumber from './Number';
|
import StatisticNumber from './Number';
|
||||||
import type { FormatConfig, valueType } from './utils';
|
import type { FormatConfig, valueType } from './utils';
|
||||||
|
|
||||||
import useStyle from './style';
|
import useStyle from './style';
|
||||||
|
import Countdown from './Countdown';
|
||||||
type CompoundedComponent = {
|
|
||||||
Countdown: typeof Countdown;
|
|
||||||
};
|
|
||||||
|
|
||||||
export interface StatisticProps extends FormatConfig {
|
export interface StatisticProps extends FormatConfig {
|
||||||
prefixCls?: string;
|
prefixCls?: string;
|
||||||
@ -29,9 +23,13 @@ export interface StatisticProps extends FormatConfig {
|
|||||||
onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
|
onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
|
||||||
}
|
}
|
||||||
|
|
||||||
const Statistic: React.FC<StatisticProps & ConfigConsumerProps> = (props) => {
|
type CompoundedComponent = {
|
||||||
|
Countdown: typeof Countdown;
|
||||||
|
};
|
||||||
|
|
||||||
|
const Statistic: React.FC<StatisticProps> & CompoundedComponent = (props) => {
|
||||||
const {
|
const {
|
||||||
prefixCls,
|
prefixCls: customizePrefixCls,
|
||||||
className,
|
className,
|
||||||
style,
|
style,
|
||||||
valueStyle,
|
valueStyle,
|
||||||
@ -41,22 +39,28 @@ const Statistic: React.FC<StatisticProps & ConfigConsumerProps> = (props) => {
|
|||||||
prefix,
|
prefix,
|
||||||
suffix,
|
suffix,
|
||||||
loading = false,
|
loading = false,
|
||||||
direction,
|
|
||||||
onMouseEnter,
|
onMouseEnter,
|
||||||
onMouseLeave,
|
onMouseLeave,
|
||||||
decimalSeparator = '.',
|
decimalSeparator = '.',
|
||||||
groupSeparator = ',',
|
groupSeparator = ',',
|
||||||
} = props;
|
} = props;
|
||||||
const valueNode = (
|
|
||||||
|
const { getPrefixCls, direction } = React.useContext<ConfigConsumerProps>(ConfigContext);
|
||||||
|
|
||||||
|
const prefixCls = getPrefixCls('statistic', customizePrefixCls);
|
||||||
|
|
||||||
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
||||||
|
|
||||||
|
const valueNode: React.ReactNode = (
|
||||||
<StatisticNumber
|
<StatisticNumber
|
||||||
decimalSeparator={decimalSeparator}
|
decimalSeparator={decimalSeparator}
|
||||||
groupSeparator={groupSeparator}
|
groupSeparator={groupSeparator}
|
||||||
|
prefixCls={prefixCls}
|
||||||
{...props}
|
{...props}
|
||||||
value={value}
|
value={value}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
// Style
|
|
||||||
const [wrapSSR, hashId] = useStyle(String(prefixCls));
|
|
||||||
const cls = classNames(
|
const cls = classNames(
|
||||||
prefixCls,
|
prefixCls,
|
||||||
{
|
{
|
||||||
@ -65,6 +69,7 @@ const Statistic: React.FC<StatisticProps & ConfigConsumerProps> = (props) => {
|
|||||||
className,
|
className,
|
||||||
hashId,
|
hashId,
|
||||||
);
|
);
|
||||||
|
|
||||||
return wrapSSR(
|
return wrapSSR(
|
||||||
<div className={cls} style={style} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>
|
<div className={cls} style={style} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>
|
||||||
{title && <div className={`${prefixCls}-title`}>{title}</div>}
|
{title && <div className={`${prefixCls}-title`}>{title}</div>}
|
||||||
@ -79,8 +84,6 @@ const Statistic: React.FC<StatisticProps & ConfigConsumerProps> = (props) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const WrapperStatistic = withConfigConsumer<StatisticProps>({
|
Statistic.Countdown = Countdown;
|
||||||
prefixCls: 'statistic',
|
|
||||||
})<CompoundedComponent>(Statistic);
|
|
||||||
|
|
||||||
export default WrapperStatistic;
|
export default Statistic;
|
||||||
|
@ -1,8 +1,5 @@
|
|||||||
import Countdown from './Countdown';
|
import Statistic from './Statistic';
|
||||||
import Statistic, { type StatisticProps } from './Statistic';
|
import type { StatisticProps } from './Statistic';
|
||||||
|
|
||||||
Statistic.Countdown = Countdown;
|
|
||||||
|
|
||||||
export type { StatisticProps };
|
export type { StatisticProps };
|
||||||
|
|
||||||
export default Statistic;
|
export default Statistic;
|
||||||
|
Loading…
Reference in New Issue
Block a user