Browse Source

chore: resolve merge conflict

pull/43168/head
afc163 1 year ago
parent
commit
a1b0775788
  1. 9
      components/alert/Alert.tsx
  2. 2
      components/alert/ErrorBoundary.tsx
  3. 15
      components/alert/index.ts
  4. 2
      components/checkbox/Checkbox.tsx
  5. 15
      components/checkbox/Group.tsx
  6. 15
      components/checkbox/GroupContext.ts
  7. 14
      components/config-provider/__tests__/style.test.tsx
  8. 4
      components/config-provider/context.ts
  9. 1
      components/config-provider/index.en-US.md
  10. 6
      components/config-provider/index.tsx
  11. 1
      components/config-provider/index.zh-CN.md
  12. 10
      components/descriptions/DescriptionsContext.ts
  13. 4
      components/descriptions/Row.tsx
  14. 11
      components/descriptions/index.tsx
  15. 4
      components/segmented/index.tsx
  16. 4
      components/spin/index.tsx
  17. 7
      components/steps/index.tsx
  18. 21
      components/table/hooks/useFilter/FilterDropdown.tsx
  19. 16
      components/table/hooks/useFilter/index.tsx
  20. 2
      package.json

9
components/alert/index.tsx → components/alert/Alert.tsx

@ -11,7 +11,6 @@ import * as React from 'react';
import { replaceElement } from '../_util/reactNode';
import warning from '../_util/warning';
import { ConfigContext } from '../config-provider';
import ErrorBoundary from './ErrorBoundary';
// CSSINJS
import useStyle from './style';
@ -97,11 +96,7 @@ const CloseIcon: React.FC<CloseIconProps> = (props) => {
) : null;
};
type CompoundedComponent = React.FC<AlertProps> & {
ErrorBoundary: typeof ErrorBoundary;
};
const Alert: CompoundedComponent = ({
const Alert: React.FC<AlertProps> = ({
description,
prefixCls: customizePrefixCls,
message,
@ -227,8 +222,6 @@ const Alert: CompoundedComponent = ({
);
};
Alert.ErrorBoundary = ErrorBoundary;
if (process.env.NODE_ENV !== 'production') {
Alert.displayName = 'Alert';
}

2
components/alert/ErrorBoundary.tsx

@ -1,5 +1,5 @@
import * as React from 'react';
import Alert from '.';
import Alert from './Alert';
interface ErrorBoundaryProps {
message?: React.ReactNode;

15
components/alert/index.ts

@ -0,0 +1,15 @@
import type { AlertProps } from './Alert';
import InternalAlert from './Alert';
import ErrorBoundary from './ErrorBoundary';
export type { AlertProps } from './Alert';
type CompoundedComponent = React.FC<AlertProps> & {
ErrorBoundary: typeof ErrorBoundary;
};
const Alert = InternalAlert as CompoundedComponent;
Alert.ErrorBoundary = ErrorBoundary;
export default Alert;

2
components/checkbox/Checkbox.tsx

@ -6,7 +6,7 @@ import warning from '../_util/warning';
import { ConfigContext } from '../config-provider';
import DisabledContext from '../config-provider/DisabledContext';
import { FormItemInputContext } from '../form/context';
import { GroupContext } from './Group';
import GroupContext from './GroupContext';
import useStyle from './style';

15
components/checkbox/Group.tsx

@ -4,6 +4,7 @@ import * as React from 'react';
import { ConfigContext } from '../config-provider';
import type { CheckboxChangeEvent } from './Checkbox';
import Checkbox from './Checkbox';
import GroupContext from './GroupContext';
import useStyle from './style';
@ -35,17 +36,6 @@ export interface CheckboxGroupProps extends AbstractCheckboxGroupProps {
children?: React.ReactNode;
}
export interface CheckboxGroupContext {
name?: string;
toggleOption?: (option: CheckboxOptionType) => void;
value?: any;
disabled?: boolean;
registerValue: (val: string) => void;
cancelValue: (val: string) => void;
}
export const GroupContext = React.createContext<CheckboxGroupContext | null>(null);
const InternalCheckboxGroup: React.ForwardRefRenderFunction<HTMLDivElement, CheckboxGroupProps> = (
{
defaultValue,
@ -166,6 +156,9 @@ const InternalCheckboxGroup: React.ForwardRefRenderFunction<HTMLDivElement, Chec
);
};
export type { CheckboxGroupContext } from './GroupContext';
export { GroupContext };
const CheckboxGroup = React.forwardRef<HTMLDivElement, CheckboxGroupProps>(InternalCheckboxGroup);
export default React.memo(CheckboxGroup);

15
components/checkbox/GroupContext.ts

@ -0,0 +1,15 @@
import React from 'react';
import type { CheckboxOptionType } from './Group';
export interface CheckboxGroupContext {
name?: string;
toggleOption?: (option: CheckboxOptionType) => void;
value?: any;
disabled?: boolean;
registerValue: (val: string) => void;
cancelValue: (val: string) => void;
}
const GroupContext = React.createContext<CheckboxGroupContext | null>(null);
export default GroupContext;

14
components/config-provider/__tests__/style.test.tsx

@ -5,6 +5,7 @@ import Divider from '../../divider';
import Segmented from '../../segmented';
import Space from '../../space';
import Spin from '../../spin';
import Steps from '../../steps';
import Typography from '../../typography';
describe('ConfigProvider support style and className props', () => {
@ -149,4 +150,17 @@ describe('ConfigProvider support style and className props', () => {
expect(element).toHaveClass('config-provider-segmented');
expect(element).toHaveStyle({ backgroundColor: 'red' });
});
it('Should Steps className & style works', () => {
const { container } = render(
<ConfigProvider
steps={{ className: 'config-provider-steps', style: { backgroundColor: 'red' } }}
>
<Steps items={[{ title: 'title', description: 'description' }]} />
</ConfigProvider>,
);
const element = container.querySelector<HTMLDivElement>('.ant-steps');
expect(element).toHaveClass('config-provider-steps');
expect(element).toHaveStyle({ backgroundColor: 'red' });
});
});

4
components/config-provider/context.ts

@ -101,6 +101,10 @@ export interface ConfigConsumerProps {
className?: string;
style?: React.CSSProperties;
};
steps?: {
className?: string;
style?: React.CSSProperties;
};
}
const defaultGetPrefixCls = (suffixCls?: string, customizePrefixCls?: string) => {

1
components/config-provider/index.en-US.md

@ -109,6 +109,7 @@ const {
| select | Set Select common props | { showSearch?: boolean } | - | |
| space | Set Space common props, ref [Space](/components/space) | { size: `small` \| `middle` \| `large` \| `number`, className?: string, style?: React.CSSProperties, classNames?: { item: string }, styles?: { item: React.CSSProperties } } | - | 5.6.0 |
| spin | Set Spin common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| steps | Set Steps common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| typography | Set Typography common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
## FAQ

6
components/config-provider/index.tsx

@ -150,6 +150,10 @@ export interface ConfigProviderProps {
className?: string;
style?: React.CSSProperties;
};
steps?: {
className?: string;
style?: React.CSSProperties;
};
}
interface ProviderChildrenProps extends ConfigProviderProps {
@ -241,6 +245,7 @@ const ProviderChildren: React.FC<ProviderChildrenProps> = (props) => {
spin,
typography,
divider,
steps,
} = props;
// =================================== Warning ===================================
@ -296,6 +301,7 @@ const ProviderChildren: React.FC<ProviderChildrenProps> = (props) => {
spin,
typography,
divider,
steps,
};
const config = {

1
components/config-provider/index.zh-CN.md

@ -111,6 +111,7 @@ const {
| select | 设置 Select 组件的通用属性 | { showSearch?: boolean } | - | |
| space | 设置 Space 的通用属性,参考 [Space](/components/space-cn) | { size: `small` \| `middle` \| `large` \| `number`, className?: string, style?: React.CSSProperties, classNames?: { item: string }, styles?: { item: React.CSSProperties } } | - | 5.6.0 |
| spin | 设置 Spin 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| steps | 设置 Steps 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| typography | 设置 Typography 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
## FAQ

10
components/descriptions/DescriptionsContext.ts

@ -0,0 +1,10 @@
import React from 'react';
export interface DescriptionsContextProps {
labelStyle?: React.CSSProperties;
contentStyle?: React.CSSProperties;
}
const DescriptionsContext = React.createContext<DescriptionsContextProps>({});
export default DescriptionsContext;

4
components/descriptions/Row.tsx

@ -1,7 +1,7 @@
import * as React from 'react';
import type { DescriptionsContextProps } from '.';
import { DescriptionsContext } from '.';
import Cell from './Cell';
import type { DescriptionsContextProps } from './DescriptionsContext';
import DescriptionsContext from './DescriptionsContext';
import type { DescriptionsItemProps } from './Item';
interface CellConfig {

11
components/descriptions/index.tsx

@ -8,17 +8,11 @@ import useResponsiveObserver, { responsiveArray } from '../_util/responsiveObser
import warning from '../_util/warning';
import { ConfigContext } from '../config-provider';
import useSize from '../config-provider/hooks/useSize';
import DescriptionsContext from './DescriptionsContext';
import DescriptionsItem from './Item';
import Row from './Row';
import useStyle from './style';
export interface DescriptionsContextProps {
labelStyle?: React.CSSProperties;
contentStyle?: React.CSSProperties;
}
export const DescriptionsContext = React.createContext<DescriptionsContextProps>({});
const DEFAULT_COLUMN_MAP: Record<Breakpoint, number> = {
xxl: 3,
xl: 3,
@ -213,6 +207,9 @@ if (process.env.NODE_ENV !== 'production') {
Descriptions.displayName = 'Descriptions';
}
export type { DescriptionsContextProps } from './DescriptionsContext';
export { DescriptionsContext };
Descriptions.Item = DescriptionsItem;
export default Descriptions;

4
components/segmented/index.tsx

@ -95,13 +95,13 @@ const Segmented = React.forwardRef<HTMLDivElement, SegmentedProps>((props, ref)
hashId,
);
const mergeStyle: React.CSSProperties = { ...segmented?.style, ...style };
const mergedStyle: React.CSSProperties = { ...segmented?.style, ...style };
return wrapSSR(
<RcSegmented
{...restProps}
className={cls}
style={mergeStyle}
style={mergedStyle}
options={extendedOptions}
ref={ref}
prefixCls={prefixCls}

4
components/spin/index.tsx

@ -137,12 +137,12 @@ const Spin: React.FC<SpinClassProps> = (props) => {
// fix https://fb.me/react-unknown-prop
const divProps = omit(restProps, ['indicator', 'prefixCls']);
const mergeStyle: React.CSSProperties = { ...spin?.style, ...style };
const mergedStyle: React.CSSProperties = { ...spin?.style, ...style };
const spinElement: React.ReactNode = (
<div
{...divProps}
style={mergeStyle}
style={mergedStyle}
className={spinClassName}
aria-live="polite"
aria-busy={spinning}

7
components/steps/index.tsx

@ -64,10 +64,11 @@ const Steps: CompoundedComponent = (props) => {
responsive = true,
current = 0,
children,
style,
...restProps
} = props;
const { xs } = useBreakpoint(responsive);
const { getPrefixCls, direction: rtlDirection } = React.useContext(ConfigContext);
const { getPrefixCls, direction: rtlDirection, steps } = React.useContext(ConfigContext);
const realDirectionValue = React.useMemo<RcStepsProps['direction']>(
() => (responsive && xs ? 'vertical' : direction),
@ -85,7 +86,10 @@ const Steps: CompoundedComponent = (props) => {
const mergedItems = useLegacyItems(items, children);
const mergedPercent = isInline ? undefined : percent;
const mergedStyle: React.CSSProperties = { ...steps?.style, ...style };
const stepsClassName = classNames(
steps?.className,
{
[`${prefixCls}-rtl`]: rtlDirection === 'rtl',
[`${prefixCls}-with-progress`]: mergedPercent !== undefined,
@ -127,6 +131,7 @@ const Steps: CompoundedComponent = (props) => {
<RcSteps
icons={icons}
{...restProps}
style={mergedStyle}
current={current}
size={size}
items={mergedItems}

21
components/table/hooks/useFilter/FilterDropdown.tsx

@ -1,34 +1,34 @@
import FilterFilled from '@ant-design/icons/FilterFilled';
import classNames from 'classnames';
import isEqual from 'rc-util/lib/isEqual';
import type { FieldDataNode } from 'rc-tree';
import isEqual from 'rc-util/lib/isEqual';
import * as React from 'react';
import type { MenuProps } from '../../../menu';
import type { FilterState } from '.';
import { flattenKeys } from '.';
import useSyncState from '../../../_util/hooks/useSyncState';
import warning from '../../../_util/warning';
import Button from '../../../button';
import type { CheckboxChangeEvent } from '../../../checkbox';
import Checkbox from '../../../checkbox';
import { ConfigContext } from '../../../config-provider/context';
import Dropdown from '../../../dropdown';
import Empty from '../../../empty';
import type { MenuProps } from '../../../menu';
import Menu from '../../../menu';
import { OverrideProvider } from '../../../menu/OverrideContext';
import Radio from '../../../radio';
import type { EventDataNode } from '../../../tree';
import Tree from '../../../tree';
import useSyncState from '../../../_util/hooks/useSyncState';
import type {
ColumnFilterItem,
ColumnType,
FilterSearchType,
FilterValue,
GetPopupContainer,
Key,
TableLocale,
} from '../../interface';
import FilterSearch from './FilterSearch';
import FilterDropdownMenuWrapper from './FilterWrapper';
import warning from '../../../_util/warning';
type FilterTreeDataNode = FieldDataNode<{ title: React.ReactNode; key: React.Key }>;
@ -37,6 +37,17 @@ interface FilterRestProps {
closeDropdown?: Boolean;
}
export function flattenKeys(filters?: ColumnFilterItem[]) {
let keys: FilterValue = [];
(filters || []).forEach(({ value, children }) => {
keys.push(value);
if (children) {
keys = [...keys, ...flattenKeys(children)];
}
});
return keys;
}
function hasSubMenu(filters: ColumnFilterItem[]) {
return filters.some(({ children }) => children);
}

16
components/table/hooks/useFilter/index.tsx

@ -1,7 +1,6 @@
import * as React from 'react';
import warning from '../../../_util/warning';
import type {
ColumnFilterItem,
ColumnsType,
ColumnTitleProps,
ColumnType,
@ -13,7 +12,7 @@ import type {
TransformColumns,
} from '../../interface';
import { getColumnKey, getColumnPos, renderColumnTitle } from '../../util';
import FilterDropdown from './FilterDropdown';
import FilterDropdown, { flattenKeys } from './FilterDropdown';
export interface FilterState<RecordType> {
column: ColumnType<RecordType>;
@ -129,17 +128,6 @@ function injectFilter<RecordType>(
});
}
export function flattenKeys(filters?: ColumnFilterItem[]) {
let keys: FilterValue = [];
(filters || []).forEach(({ value, children }) => {
keys.push(value);
if (children) {
keys = [...keys, ...flattenKeys(children)];
}
});
return keys;
}
function generateFilterInfo<RecordType>(filterStates: FilterState<RecordType>[]) {
const currentFilters: Record<string, FilterValue | null> = {};
@ -292,4 +280,6 @@ function useFilter<RecordType>({
return [transformColumns, mergedFilterStates, filters];
}
export { flattenKeys };
export default useFilter;

2
package.json

@ -148,7 +148,7 @@
"rc-switch": "~4.1.0",
"rc-table": "~7.32.1",
"rc-tabs": "~12.8.1",
"rc-textarea": "~1.3.0",
"rc-textarea": "~1.3.2",
"rc-tooltip": "~6.0.0",
"rc-tree": "~5.7.4",
"rc-tree-select": "~5.9.0",

Loading…
Cancel
Save