mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 02:59:58 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

fix: Tree shaking should works on withContext

Browse Source
This commit is contained in:
zombiej 2019-10-21 12:01:33 +08:00 committed by 偏右
parent 9af3888395
commit 559e56c7f8
6 changed files with 84 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
components/config-provider/context.ts
View File

@ -1,33 +0,0 @@
import createReactContext from '@ant-design/create-react-context';
import defaultRenderEmpty, { RenderEmptyHandler } from './renderEmpty';
import { Locale } from '../locale-provider';
export interface CSPConfig {
nonce?: string;
}
export interface ConfigConsumerProps {
getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
rootPrefixCls?: string;
getPrefixCls: (suffixCls: string, customizePrefixCls?: string) => string;
renderEmpty: RenderEmptyHandler;
csp?: CSPConfig;
autoInsertSpaceInButton?: boolean;
locale?: Locale;
pageHeader?: {
ghost: boolean;
};
}
export const ConfigContext = createReactContext<ConfigConsumerProps>({
// We provide a default function for Context without provider
getPrefixCls: (suffixCls: string, customizePrefixCls?: string) => {
if (customizePrefixCls) return customizePrefixCls;
return `ant-${suffixCls}`;
},
renderEmpty: defaultRenderEmpty,
});
export const ConfigConsumer = ConfigContext.Consumer;

78
components/config-provider/context.tsx Normal file
View File

@ -0,0 +1,78 @@
import * as React from 'react';
import createReactContext from '@ant-design/create-react-context';
import defaultRenderEmpty, { RenderEmptyHandler } from './renderEmpty';
import { Locale } from '../locale-provider';
export interface CSPConfig {
nonce?: string;
}
export interface ConfigConsumerProps {
getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
rootPrefixCls?: string;
getPrefixCls: (suffixCls: string, customizePrefixCls?: string) => string;
renderEmpty: RenderEmptyHandler;
csp?: CSPConfig;
autoInsertSpaceInButton?: boolean;
locale?: Locale;
pageHeader?: {
ghost: boolean;
};
}
export const ConfigContext = createReactContext<ConfigConsumerProps>({
// We provide a default function for Context without provider
getPrefixCls: (suffixCls: string, customizePrefixCls?: string) => {
if (customizePrefixCls) return customizePrefixCls;
return `ant-${suffixCls}`;
},
renderEmpty: defaultRenderEmpty,
});
export const ConfigConsumer = ConfigContext.Consumer;
// =========================== withConfigConsumer ===========================
// We need define many types here. So let's put in the block region
type IReactComponent<P = any> =
| React.StatelessComponent<P>
| React.ComponentClass<P>
| React.ClassicComponentClass<P>;
interface BasicExportProps {
prefixCls?: string;
}
interface ConsumerConfig {
prefixCls: string;
}
interface ConstructorProps {
displayName?: string;
}
export function withConfigConsumer<ExportProps extends BasicExportProps>(config: ConsumerConfig) {
return function withConfigConsumerFunc<ComponentDef>(
Component: IReactComponent,
): React.SFC<ExportProps> & ComponentDef {
// Wrap with ConfigConsumer. Since we need compatible with react 15, be care when using ref methods
const SFC = ((props: ExportProps) => (
<ConfigConsumer>
{(configProps: ConfigConsumerProps) => {
const { prefixCls: basicPrefixCls } = config;
const { getPrefixCls } = configProps;
const { prefixCls: customizePrefixCls } = props;
const prefixCls = getPrefixCls(basicPrefixCls, customizePrefixCls);
return <Component {...configProps} {...props} prefixCls={prefixCls} />;
}}
</ConfigConsumer>
)) as React.SFC<ExportProps> & ComponentDef;
const cons: ConstructorProps = Component.constructor as ConstructorProps;
const name = (cons && cons.displayName) || Component.name || 'Component';
SFC.displayName = `withConfigConsumer(${name})`;
return SFC;
};
}

45
components/config-provider/index.tsx
View File

@ -95,49 +95,4 @@ class ConfigProvider extends React.Component<ConfigProviderProps> {
}
}
// =========================== withConfigConsumer ===========================
// We need define many types here. So let's put in the block region
type IReactComponent<P = any> =
| React.StatelessComponent<P>
| React.ComponentClass<P>
| React.ClassicComponentClass<P>;
interface BasicExportProps {
prefixCls?: string;
}
interface ConsumerConfig {
prefixCls: string;
}
interface ConstructorProps {
displayName?: string;
}
export function withConfigConsumer<ExportProps extends BasicExportProps>(config: ConsumerConfig) {
return function withConfigConsumerFunc<ComponentDef>(
Component: IReactComponent,
): React.SFC<ExportProps> & ComponentDef {
// Wrap with ConfigConsumer. Since we need compatible with react 15, be care when using ref methods
const SFC = ((props: ExportProps) => (
<ConfigConsumer>
{(configProps: ConfigConsumerProps) => {
const { prefixCls: basicPrefixCls } = config;
const { getPrefixCls } = configProps;
const { prefixCls: customizePrefixCls } = props;
const prefixCls = getPrefixCls(basicPrefixCls, customizePrefixCls);
return <Component {...configProps} {...props} prefixCls={prefixCls} />;
}}
</ConfigConsumer>
)) as React.SFC<ExportProps> & ComponentDef;
const cons: ConstructorProps = Component.constructor as ConstructorProps;
const name = (cons && cons.displayName) || Component.name || 'Component';
SFC.displayName = `withConfigConsumer(${name})`;
return SFC;
};
}
export default ConfigProvider;

3
components/drawer/index.tsx
View File

@ -5,7 +5,8 @@ import classNames from 'classnames';
import omit from 'omit.js';
import warning from '../_util/warning';
import Icon from '../icon';
import { withConfigConsumer, ConfigConsumerProps } from '../config-provider';
import { ConfigConsumerProps } from '../config-provider';
import { withConfigConsumer } from '../config-provider/context';
import { tuple } from '../_util/type';
const DrawerContext = createReactContext<Drawer | null>(null);

3
components/statistic/Statistic.tsx
View File

@ -1,7 +1,8 @@
import * as React from 'react';
import classNames from 'classnames';
import { withConfigConsumer, ConfigConsumerProps } from '../config-provider';
import { ConfigConsumerProps } from '../config-provider';
import { withConfigConsumer } from '../config-provider/context';
import StatisticNumber from './Number';
import Countdown from './Countdown';
import { valueType, FormatConfig } from './utils';

3
components/typography/Base.tsx
View File

@ -6,7 +6,8 @@ import findDOMNode from 'rc-util/lib/Dom/findDOMNode';
import copy from 'copy-to-clipboard';
import omit from 'omit.js';
import ResizeObserver from 'rc-resize-observer';
import { withConfigConsumer, ConfigConsumerProps, configConsumerProps } from '../config-provider';
import { ConfigConsumerProps, configConsumerProps } from '../config-provider';
import { withConfigConsumer } from '../config-provider/context';
import LocaleReceiver from '../locale-provider/LocaleReceiver';
import warning from '../_util/warning';
import TransButton from '../_util/transButton';