Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: CP support Table expandIcon #47225

Merged
merged 3 commits into from
Jan 30, 2024
Merged

feat: CP support Table expandIcon #47225

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
9cc2a24
feat: CP support Table expandIcon
li-jia-nan Jan 30, 2024
9334b7a
fix: fix
li-jia-nan Jan 30, 2024
c703069
type: fix type
li-jia-nan Jan 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 8 additions & 1 deletion components/config-provider/__tests__/style.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -961,7 +961,13 @@ describe('ConfigProvider support style and className props', () => {

it('Should Table className & style works', () => {
const { container } = render(
<ConfigProvider table={{ className: 'cp-table', style: { backgroundColor: 'blue' } }}>
<ConfigProvider
table={{
className: 'cp-table',
style: { backgroundColor: 'blue' },
expandable: { expandIcon: () => <span className="cp-test-icon">cp-test-icon</span> },
}}
>
<Table
columns={[{ title: 'Address', dataIndex: 'address', key: 'address 1', ellipsis: true }]}
dataSource={[{ key: '1', name: 'Jim Green', age: 40, address: 'test', tags: ['loser'] }]}
Expand All @@ -971,6 +977,7 @@ describe('ConfigProvider support style and className props', () => {
const element = container.querySelector<HTMLDivElement>('.ant-table-wrapper');
expect(element).toHaveClass('cp-table');
expect(element).toHaveStyle({ backgroundColor: 'blue' });
expect(container.querySelector<HTMLSpanElement>('.ant-table-tbody .cp-test-icon')).toBeTruthy();
});

it('Should Calendar className works', () => {
Expand Down
10 changes: 9 additions & 1 deletion components/config-provider/context.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import * as React from 'react';

import type { AnyObject } from '../_util/type';
import type { WarningContextProps } from '../_util/warning';
import type { ShowWaveEffect } from '../_util/wave/interface';
import type { BadgeProps } from '../badge';
Expand All @@ -13,6 +14,7 @@ import type { ModalProps } from '../modal';
import type { PaginationProps } from '../pagination';
import type { SelectProps } from '../select';
import type { SpaceProps } from '../space';
import type { ExpandableConfig } from '../table/interface';
import type { TabsProps } from '../tabs';
import type { AliasToken, MappingAlgorithm, OverrideToken } from '../theme/interface';
import type { TourProps } from '../tour/interface';
Expand Down Expand Up @@ -66,6 +68,12 @@ export interface ComponentStyleConfig {
style?: React.CSSProperties;
}

export interface TableConfig<T extends AnyObject = AnyObject> extends ComponentStyleConfig {
li-jia-nan marked this conversation as resolved.
Show resolved Hide resolved
expandable?: {
expandIcon?: ExpandableConfig<T>['expandIcon'];
};
}

export type TourConfig = Pick<TourProps, 'closeIcon'>;

export type ModalConfig = ComponentStyleConfig & Pick<ModalProps, 'classNames' | 'styles'>;
Expand Down Expand Up @@ -143,7 +151,7 @@ export interface ConfigConsumerProps {
avatar?: ComponentStyleConfig;
message?: ComponentStyleConfig;
tag?: ComponentStyleConfig;
table?: ComponentStyleConfig;
table?: TableConfig;
card?: ComponentStyleConfig;
tabs?: ComponentStyleConfig & Pick<TabsProps, 'indicator' | 'indicatorSize'>;
timeline?: ComponentStyleConfig;
Expand Down
2 changes: 1 addition & 1 deletion components/config-provider/index.en-US.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -146,7 +146,7 @@ const {
| spin | Set Spin common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| statistic | Set Statistic common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| steps | Set Steps common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| table | Set Table common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| table | Set Table common props | { className?: string, style?: React.CSSProperties, expandable?: { expandIcon?: props => React.ReactNode } } | - | 5.7.0, expandable: 5.14.0 |
| tabs | Set Tabs common props | { className?: string, style?: React.CSSProperties, indicator?: { size?: GetIndicatorSize, align?: `start` \| `center` \| `end` }} | - | 5.7.0 |
| tag | Set Tag common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| timeline | Set Timeline common props | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
Expand Down
3 changes: 2 additions & 1 deletion components/config-provider/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@ import type {
FlexConfig,
ModalConfig,
PopupOverflow,
TableConfig,
Theme,
ThemeConfig,
TourConfig,
Expand Down Expand Up @@ -165,7 +166,7 @@ export interface ConfigProviderProps {
avatar?: ComponentStyleConfig;
message?: ComponentStyleConfig;
tag?: ComponentStyleConfig;
table?: ComponentStyleConfig;
table?: TableConfig;
card?: ComponentStyleConfig;
tabs?: ComponentStyleConfig & Pick<TabsProps, 'indicator' | 'indicatorSize'>;
timeline?: ComponentStyleConfig;
Expand Down
2 changes: 1 addition & 1 deletion components/config-provider/index.zh-CN.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@ const {
| spin | 设置 Spin 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| statistic | 设置 Statistic 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| steps | 设置 Steps 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| table | 设置 Table 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| table | 设置 Table 组件的通用属性 | { className?: string, style?: React.CSSProperties, expandable?: { expandIcon?: props => React.ReactNode } } | - | 5.7.0, expandable: 5.14.0 |
| tabs | 设置 Tabs 组件的通用属性 | { className?: string, style?: React.CSSProperties, indicator?: { size?: GetIndicatorSize, align?: `start` \| `center` \| `end` }} | - | 5.7.0 |
| tag | 设置 Tag 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
| timeline | 设置 Timeline 组件的通用属性 | { className?: string, style?: React.CSSProperties } | - | 5.7.0 |
Expand Down
1 change: 1 addition & 0 deletions components/table/InternalTable.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -210,6 +210,7 @@ const InternalTable = <RecordType extends AnyObject = AnyObject>(
childrenColumnName: legacyChildrenColumnName,
expandIconColumnIndex,
...expandable,
expandIcon: expandable?.expandIcon ?? table?.expandable?.expandIcon,
};
const { childrenColumnName = 'children' } = mergedExpandable;

Expand Down