mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-12-18 19:28:05 +08:00
Code Issues Actions 15 Packages Projects Releases Wiki Activity

refactor: reduce empty cycling deps (#35570)

Browse Source 
* chore: rm in root

* chore: fix ts

* test: Update snapshot

* chore: ignore part
This commit is contained in:
二货机器人 2022-05-16 16:34:42 +08:00 committed by GitHub
parent f56e66a262
commit 3d21ec54e2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 35 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
components/cascader/index.tsx
View File

@ -16,6 +16,7 @@ import LeftOutlined from '@ant-design/icons/LeftOutlined';
import { useContext } from 'react';
import warning from '../_util/warning';
import { ConfigContext } from '../config-provider';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
import type { SizeType } from '../config-provider/SizeContext';
import SizeContext from '../config-provider/SizeContext';
import DisabledContext from '../config-provider/DisabledContext';
@ -175,7 +176,7 @@ const Cascader = React.forwardRef((props: CascaderProps<any>, ref: React.Ref<Cas
);
// =================== No Found ====================
const mergedNotFoundContent = notFoundContent || renderEmpty('Cascader');
const mergedNotFoundContent = notFoundContent || (renderEmpty || defaultRenderEmpty)('Cascader');
// ==================== Prefix =====================
const rootPrefixCls = getPrefixCls();

76
components/config-provider/__tests__/__snapshots__/index.test.js.snap
View File

@ -1,76 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`ConfigProvider render empty 1`] = `
<div
class="ant-empty"
>
<div
class="ant-empty-image"
>
<svg
class="ant-empty-img-default"
height="152"
viewBox="0 0 184 152"
width="184"
xmlns="http://www.w3.org/2000/svg"
>
<g
fill="none"
fill-rule="evenodd"
>
<g
transform="translate(24 31.67)"
>
<ellipse
class="ant-empty-img-default-ellipse"
cx="67.797"
cy="106.89"
rx="67.797"
ry="12.668"
/>
<path
class="ant-empty-img-default-path-1"
d="M122.034 69.674L98.109 40.229c-1.148-1.386-2.826-2.225-4.593-2.225h-51.44c-1.766 0-3.444.839-4.592 2.225L13.56 69.674v15.383h108.475V69.674z"
/>
<path
class="ant-empty-img-default-path-2"
d="M101.537 86.214L80.63 61.102c-1.001-1.207-2.507-1.867-4.048-1.867H31.724c-1.54 0-3.047.66-4.048 1.867L6.769 86.214v13.792h94.768V86.214z"
transform="translate(13.56)"
/>
<path
class="ant-empty-img-default-path-3"
d="M33.83 0h67.933a4 4 0 0 1 4 4v93.344a4 4 0 0 1-4 4H33.83a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4z"
/>
<path
class="ant-empty-img-default-path-4"
d="M42.678 9.953h50.237a2 2 0 0 1 2 2V36.91a2 2 0 0 1-2 2H42.678a2 2 0 0 1-2-2V11.953a2 2 0 0 1 2-2zM42.94 49.767h49.713a2.262 2.262 0 1 1 0 4.524H42.94a2.262 2.262 0 0 1 0-4.524zM42.94 61.53h49.713a2.262 2.262 0 1 1 0 4.525H42.94a2.262 2.262 0 0 1 0-4.525zM121.813 105.032c-.775 3.071-3.497 5.36-6.735 5.36H20.515c-3.238 0-5.96-2.29-6.734-5.36a7.309 7.309 0 0 1-.222-1.79V69.675h26.318c2.907 0 5.25 2.448 5.25 5.42v.04c0 2.971 2.37 5.37 5.277 5.37h34.785c2.907 0 5.277-2.421 5.277-5.393V75.1c0-2.972 2.343-5.426 5.25-5.426h26.318v33.569c0 .617-.077 1.216-.221 1.789z"
/>
</g>
<path
class="ant-empty-img-default-path-5"
d="M149.121 33.292l-6.83 2.65a1 1 0 0 1-1.317-1.23l1.937-6.207c-2.589-2.944-4.109-6.534-4.109-10.408C138.802 8.102 148.92 0 161.402 0 173.881 0 184 8.102 184 18.097c0 9.995-10.118 18.097-22.599 18.097-4.528 0-8.744-1.066-12.28-2.902z"
/>
<g
class="ant-empty-img-default-g"
transform="translate(149.65 15.383)"
>
<ellipse
cx="20.654"
cy="3.167"
rx="2.849"
ry="2.815"
/>
<path
d="M5.698 5.63H0L2.898.704zM9.259.704h4.985V5.63H9.259z"
/>
</g>
</g>
</svg>
</div>
<div
class="ant-empty-description"
>
No Data
</div>
</div>
`;

15
components/config-provider/__tests__/index.test.js
View File

@ -1,12 +1,12 @@
import React, { useState } from 'react';
import { mount } from 'enzyme';
import { SmileOutlined } from '@ant-design/icons';
import { fireEvent, render } from '@testing-library/react';
import ConfigProvider, { ConfigContext } from '..';
import Button from '../../button';
import Table from '../../table';
import Input from '../../input';
import mountTest from '../../../tests/shared/mountTest';
import { render, fireEvent } from '../../../tests/utils';
describe('ConfigProvider', () => {
mountTest(() => (
@ -104,16 +104,23 @@ describe('ConfigProvider', () => {
});
it('render empty', () => {
let rendered = false;
let cacheRenderEmpty;
const App = () => {
const { renderEmpty } = React.useContext(ConfigContext);
return renderEmpty();
rendered = true;
cacheRenderEmpty = renderEmpty;
return null;
};
const wrapper = mount(
render(
<ConfigProvider>
<App />
</ConfigProvider>,
);
expect(wrapper.render()).toMatchSnapshot();
expect(rendered).toBeTruthy();
expect(cacheRenderEmpty).toBeFalsy();
});
});

8
components/config-provider/context.tsx
View File

@ -1,6 +1,5 @@
import * as React from 'react';
import type { RenderEmptyHandler } from './renderEmpty';
import defaultRenderEmpty from './renderEmpty';
import type { RenderEmptyHandler } from './defaultRenderEmpty';
import type { Locale } from '../locale-provider';
import type { SizeType } from './SizeContext';
import type { RequiredMark } from '../form/Form';
@ -26,7 +25,7 @@ export interface ConfigConsumerProps {
rootPrefixCls?: string;
iconPrefixCls?: string;
getPrefixCls: (suffixCls?: string, customizePrefixCls?: string) => string;
renderEmpty: RenderEmptyHandler;
renderEmpty?: RenderEmptyHandler;
csp?: CSPConfig;
autoInsertSpaceInButton?: boolean;
input?: {
@ -54,11 +53,10 @@ const defaultGetPrefixCls = (suffixCls?: string, customizePrefixCls?: string) =>
return suffixCls ? `ant-${suffixCls}` : 'ant';
};
// zombieJ: 🚨 Do not pass `defaultRenderEmpty` here since it will case circular dependency.
export const ConfigContext = React.createContext<ConfigConsumerProps>({
// We provide a default function for Context without provider
getPrefixCls: defaultGetPrefixCls,
renderEmpty: defaultRenderEmpty,
});
export const ConfigConsumer = ConfigContext.Consumer;

9
components/config-provider/renderEmpty.tsx → components/config-provider/defaultRenderEmpty.tsx
View File

@ -3,7 +3,7 @@ import Empty from '../empty';
import type { ConfigConsumerProps } from '.';
import { ConfigConsumer } from '.';
const renderEmpty = (componentName?: string): React.ReactNode => (
const defaultRenderEmpty = (componentName?: string): React.ReactNode => (
<ConfigConsumer>
{({ getPrefixCls }: ConfigConsumerProps) => {
const prefix = getPrefixCls('empty');
@ -19,13 +19,16 @@ const renderEmpty = (componentName?: string): React.ReactNode => (
case 'Transfer':
case 'Mentions':
return <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} className={`${prefix}-small`} />;
/* istanbul ignore next */
default:
// Should never hit if we take all the component into consider.
return <Empty />;
}
}}
</ConfigConsumer>
);
export type RenderEmptyHandler = typeof renderEmpty;
export type RenderEmptyHandler = typeof defaultRenderEmpty;
export default renderEmpty;
export default defaultRenderEmpty;

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

@ -3,7 +3,7 @@ import IconContext from '@ant-design/icons/lib/components/Context';
import { FormProvider as RcFormProvider } from 'rc-field-form';
import type { ValidateMessages } from 'rc-field-form/lib/interface';
import useMemo from 'rc-util/lib/hooks/useMemo';
import { RenderEmptyHandler } from './renderEmpty';
import { RenderEmptyHandler } from './defaultRenderEmpty';
import type { Locale } from '../locale-provider';
import LocaleProvider, { ANT_MARK } from '../locale-provider';
import LocaleReceiver from '../locale-provider/LocaleReceiver';

3
components/list/index.tsx
View File

@ -11,6 +11,7 @@ import type { PaginationConfig } from '../pagination';
import Pagination from '../pagination';
import { Row } from '../grid';
import Item from './Item';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
export { ListItemProps, ListItemMetaProps } from './Item';
@ -259,7 +260,7 @@ function List<T>({
<ul className={`${prefixCls}-items`}>{items}</ul>
);
} else if (!children && !isLoading) {
childrenContent = renderEmptyFunc(prefixCls, renderEmpty);
childrenContent = renderEmptyFunc(prefixCls, renderEmpty || defaultRenderEmpty);
}
const paginationPosition = paginationProps.position || 'bottom';

3
components/mentions/index.tsx
View File

@ -8,6 +8,7 @@ import { ConfigContext } from '../config-provider';
import { FormItemInputContext } from '../form/context';
import type { InputStatus } from '../_util/statusUtils';
import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
export const { Option } = RcMentions;
@ -93,7 +94,7 @@ const InternalMentions: React.ForwardRefRenderFunction<unknown, MentionProps> =
return notFoundContent;
}
return renderEmpty('Select');
return (renderEmpty || defaultRenderEmpty)('Select');
};
const getOptions = () => {

3
components/select/index.tsx
View File

@ -18,6 +18,7 @@ import type { InputStatus } from '../_util/statusUtils';
import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
import type { SelectCommonPlacement } from '../_util/motion';
import { getTransitionName, getTransitionDirection } from '../_util/motion';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
type RawValue = string | number;
@ -122,7 +123,7 @@ const InternalSelect = <OptionType extends BaseOptionType | DefaultOptionType =
} else if (mode === 'combobox') {
mergedNotFound = null;
} else {
mergedNotFound = renderEmpty('Select');
mergedNotFound = (renderEmpty || defaultRenderEmpty)('Select');
}
// ===================== Icons =====================

3
components/table/Table.tsx
View File

@ -48,6 +48,7 @@ import Column from './Column';
import ColumnGroup from './ColumnGroup';
import warning from '../_util/warning';
import useBreakpoint from '../grid/hooks/useBreakpoint';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
export { ColumnsType, TablePaginationConfig };
@ -517,7 +518,7 @@ function InternalTable<RecordType extends object = any>(
data={pageData}
rowKey={getRowKey}
rowClassName={internalRowClassName}
emptyText={(locale && locale.emptyText) || renderEmpty('Table')}
emptyText={(locale && locale.emptyText) || (renderEmpty || defaultRenderEmpty)('Table')}
// Internal
internalHooks={INTERNAL_HOOKS}
internalRefs={internalRefs as any}

3
components/transfer/index.tsx
View File

@ -14,6 +14,7 @@ import warning from '../_util/warning';
import { FormItemInputContext } from '../form/context';
import type { InputStatus } from '../_util/statusUtils';
import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
export { TransferListProps } from './list';
export { TransferOperationProps } from './operation';
@ -375,7 +376,7 @@ class Transfer<RecordType extends TransferItem = TransferItem> extends React.Com
status: customStatus,
} = this.props;
const prefixCls = getPrefixCls('transfer', customizePrefixCls);
const locale = this.getLocale(transferLocale, renderEmpty);
const locale = this.getLocale(transferLocale, renderEmpty || defaultRenderEmpty);
const { sourceSelectedKeys, targetSelectedKeys } = this.state;
const mergedStatus = getMergedStatus(contextStatus, customStatus);

3
components/tree-select/index.tsx
View File

@ -20,6 +20,7 @@ import { getTransitionName, getTransitionDirection } from '../_util/motion';
import { FormItemInputContext } from '../form/context';
import type { InputStatus } from '../_util/statusUtils';
import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
import defaultRenderEmpty from '../config-provider/defaultRenderEmpty';
type RawValue = string | number;
@ -131,7 +132,7 @@ const InternalTreeSelect = <OptionType extends BaseOptionType | DefaultOptionTyp
if (notFoundContent !== undefined) {
mergedNotFound = notFoundContent;
} else {
mergedNotFound = renderEmpty('Select');
mergedNotFound = (renderEmpty || defaultRenderEmpty)('Select');
}
// ==================== Render =====================