feat(theming): land Ant Design v5 overhaul — dynamic themes, real dark mode + massive styling refactor (#31590)

Co-authored-by: Enzo Martellucci <52219496+EnxDev@users.noreply.github.com>
Co-authored-by: Diego Pucci <diegopucci.me@gmail.com>
Co-authored-by: Mehmet Salih Yavuz <salih.yavuz@proton.me>
Co-authored-by: Geido <60598000+geido@users.noreply.github.com>
Co-authored-by: Alexandru Soare <37236580+alexandrusoare@users.noreply.github.com>
Co-authored-by: Damian Pendrak <dpendrak@gmail.com>
Co-authored-by: Pius Iniobong <67148161+payose@users.noreply.github.com>
Co-authored-by: Enzo Martellucci <enzomartellucci@gmail.com>
Co-authored-by: Kamil Gabryjelski <kamil.gabryjelski@gmail.com>
This commit is contained in:
Maxime Beauchemin
2025-06-20 13:38:58 -07:00
committed by GitHub
parent 2cc1ef88c8
commit dd129fa403
1267 changed files with 32958 additions and 23592 deletions

View File

@@ -22,7 +22,7 @@ import {
userEvent,
waitFor,
} from 'spec/helpers/testing-library';
import { Menu } from 'src/components/Menu';
import { Menu } from '@superset-ui/core/components/Menu';
import DashboardItems from './DashboardsSubMenu';
const asyncRender = (numberOfItems: number) => {

View File

@@ -18,9 +18,9 @@
*/
import { useState } from 'react';
import { css, t, useTheme } from '@superset-ui/core';
import { Input } from 'src/components/Input';
import { Icons } from 'src/components/Icons';
import { Menu } from 'src/components/Menu';
import { Input } from '@superset-ui/core/components';
import { Icons } from '@superset-ui/core/components/Icons';
import { Menu } from '@superset-ui/core/components/Menu';
import { Link } from 'react-router-dom';
export interface DashboardsSubMenuProps {
@@ -60,7 +60,7 @@ const DashboardsSubMenu = ({
prefix={<Icons.StarOutlined iconSize="l" />}
css={css`
width: ${WIDTH}px;
margin: ${theme.gridUnit * 2}px ${theme.gridUnit * 3}px;
margin: ${theme.sizeUnit * 2}px ${theme.sizeUnit * 3}px;
`}
value={dashboardSearch}
onChange={e => setDashboardSearch(e.currentTarget.value)}
@@ -106,7 +106,7 @@ const DashboardsSubMenu = ({
<Icons.Full
iconSize="l"
css={css`
margin-left: ${theme.gridUnit * 2}px;
margin-left: ${theme.sizeUnit * 2}px;
visibility: ${hoveredItem === dashboard.id
? 'visible'
: 'hidden'};
@@ -119,8 +119,8 @@ const DashboardsSubMenu = ({
{noResultsFound && (
<div
css={css`
margin-left: ${theme.gridUnit * 3}px;
margin-bottom: ${theme.gridUnit}px;
margin-left: ${theme.sizeUnit * 3}px;
margin-bottom: ${theme.sizeUnit}px;
`}
>
{t('No results found')}

View File

@@ -27,10 +27,8 @@ import {
useTheme,
VizType,
} from '@superset-ui/core';
import { Icons } from 'src/components/Icons';
import { Menu } from 'src/components/Menu';
import ModalTrigger from 'src/components/ModalTrigger';
import Button from 'src/components/Button';
import { Icons, ModalTrigger, Button } from '@superset-ui/core/components';
import { Menu } from '@superset-ui/core/components/Menu';
import { useToasts } from 'src/components/MessageToasts/withToasts';
import { exportChart, getChartKey } from 'src/explore/exploreUtils';
import downloadAsImage from 'src/utils/downloadAsImage';
@@ -79,25 +77,25 @@ export const MenuItemWithCheckboxContainer = styled.div`
align-items: center;
& svg {
width: ${theme.gridUnit * 3}px;
height: ${theme.gridUnit * 3}px;
width: ${theme.sizeUnit * 3}px;
height: ${theme.sizeUnit * 3}px;
}
& span[role='checkbox'] {
display: inline-flex;
margin-right: ${theme.gridUnit}px;
margin-right: ${theme.sizeUnit}px;
}
`}
`;
export const MenuTrigger = styled(Button)`
${({ theme }) => css`
width: ${theme.gridUnit * 8}px;
height: ${theme.gridUnit * 8}px;
width: ${theme.sizeUnit * 8}px;
height: ${theme.sizeUnit * 8}px;
padding: 0;
border: 1px solid ${theme.colors.primary.dark2};
&.antd5-btn > span.anticon {
&.ant-btn > span.anticon {
line-height: 0;
transition: inherit;
}
@@ -388,7 +386,7 @@ export const useExploreAdditionalActionsMenu = (
addDangerToast={addDangerToast}
/>
}
maxWidth={`${theme.gridUnit * 100}px`}
maxWidth={`${theme.sizeUnit * 100}px`}
destroyOnClose
responsive
/>
@@ -449,7 +447,7 @@ export const useExploreAdditionalActionsMenu = (
latestQueryFormData,
showReportSubMenu,
slice,
theme.gridUnit,
theme.sizeUnit,
],
);
return [menu, isDropdownVisible, setIsDropdownVisible];