Upgrade Card to Antd 5

This commit is contained in:
Diego Pucci 2024-06-27 14:16:48 +02:00
parent 466dda2b14
commit c931da8136
3 changed files with 34 additions and 5 deletions

View File

@ -16,6 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import { AntdThemeProvider } from 'src/components/AntdThemeProvider';
import Card, { CardProps } from '.';
export default {
@ -23,7 +24,11 @@ export default {
component: Card,
};
export const InteractiveCard = (args: CardProps) => <Card {...args} />;
export const InteractiveCard = (args: CardProps) => (
<AntdThemeProvider>
<Card {...args} />
</AntdThemeProvider>
);
InteractiveCard.args = {
padded: true,

View File

@ -0,0 +1,25 @@
/**
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements. See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership. The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import { render } from 'spec/helpers/testing-library';
import Card from '.';
test('should render', () => {
const { container } = render(<Card />);
expect(container).toBeInTheDocument();
});

View File

@ -17,7 +17,8 @@
* under the License.
*/
import { SupersetTheme } from '@superset-ui/core';
import AntdCard, { CardProps as AntdCardProps } from 'antd/lib/card';
import { Card as AntdCard } from 'antd-v5';
import { CardProps as AntdCardProps } from 'antd-v5/lib/card';
export interface CardProps extends AntdCardProps {
padded?: boolean;
@ -27,9 +28,7 @@ const Card = ({ padded, ...props }: CardProps) => (
<AntdCard
{...props}
css={(theme: SupersetTheme) => ({
backgroundColor: theme.colors.grayscale.light4,
borderRadius: theme.borderRadius,
'.ant-card-body': {
'.antd5-card-body': {
padding: padded ? theme.gridUnit * 4 : theme.gridUnit,
},
})}