diff --git a/packages/theme/api-report.md b/packages/theme/api-report.md index c61245e0e2..131fa185ed 100644 --- a/packages/theme/api-report.md +++ b/packages/theme/api-report.md @@ -6,8 +6,12 @@ import { Overrides } from '@material-ui/core/styles/overrides'; import { Palette } from '@material-ui/core/styles/createPalette'; import { PaletteOptions } from '@material-ui/core/styles/createPalette'; +import { PaletteOptions as PaletteOptions_2 } from '@mui/material/styles'; +import { default as React_2 } from 'react'; +import { ReactNode } from 'react'; import { Theme } from '@material-ui/core'; import { ThemeOptions } from '@material-ui/core'; +import { ThemeOptions as ThemeOptions_2 } from '@mui/material/styles'; // @public @deprecated export type BackstagePalette = Palette & BackstagePaletteAdditions; @@ -99,9 +103,66 @@ export interface BackstageThemeOptions extends ThemeOptions { palette: BackstagePaletteOptions; } +// @public +export interface BaseThemeOptionsInput { + // (undocumented) + defaultPageTheme?: string; + // (undocumented) + fontFamily?: string; + // (undocumented) + htmlFontSize?: number; + // (undocumented) + pageTheme?: Record; + // (undocumented) + palette: PaletteOptions; +} + // @public export const colorVariants: Record; +// @public +export function createBaseThemeOptions( + options: BaseThemeOptionsInput, +): { + palette: PaletteOptions; + typography: { + htmlFontSize: number; + fontFamily: string; + h1: { + fontSize: number; + fontWeight: number; + marginBottom: number; + }; + h2: { + fontSize: number; + fontWeight: number; + marginBottom: number; + }; + h3: { + fontSize: number; + fontWeight: number; + marginBottom: number; + }; + h4: { + fontWeight: number; + fontSize: number; + marginBottom: number; + }; + h5: { + fontWeight: number; + fontSize: number; + marginBottom: number; + }; + h6: { + fontWeight: number; + fontSize: number; + marginBottom: number; + }; + }; + page: PageTheme; + getPageTheme: ({ themeId }: PageThemeSelector) => PageTheme; +}; + // @public @deprecated (undocumented) export const createTheme: typeof createV4Theme; @@ -125,6 +186,9 @@ export function createV4ThemeOverrides(theme: Theme): Overrides; // @public export const darkTheme: Theme; +// @public +export const defaultComponentThemes: ThemeOptions_2['components']; + // @public export function genPageTheme(props: { colors: string[]; @@ -162,9 +226,39 @@ export type SimpleThemeOptions = SimpleV4ThemeOptions; // @public export type SimpleV4ThemeOptions = { palette: PaletteOptions; - defaultPageTheme: string; + defaultPageTheme?: string; pageTheme?: Record; fontFamily?: string; htmlFontSize?: number; }; + +// @public +export type SimpleV5ThemeOptions = { + palette: PaletteOptions_2; + defaultPageTheme?: string; + pageTheme?: Record; + fontFamily?: string; + htmlFontSize?: number; +}; + +// @public +export interface UnifiedTheme { + // (undocumented) + getTheme(version: string): unknown | undefined; +} + +// @public +export function UnifiedThemeProvider( + props: UnifiedThemeProviderProps, +): React_2.ReactNode; + +// @public +export interface UnifiedThemeProviderProps { + // (undocumented) + children: ReactNode; + // (undocumented) + noCssBaseline?: boolean; + // (undocumented) + theme: UnifiedTheme; +} ``` diff --git a/packages/theme/src/base/createBaseThemeOptions.ts b/packages/theme/src/base/createBaseThemeOptions.ts index 15903462e7..e54e920deb 100644 --- a/packages/theme/src/base/createBaseThemeOptions.ts +++ b/packages/theme/src/base/createBaseThemeOptions.ts @@ -22,6 +22,11 @@ const DEFAULT_FONT_FAMILY = '"Helvetica Neue", Helvetica, Roboto, Arial, sans-serif'; const DEFAULT_PAGE_THEME = 'home'; +/** + * Options for {@link createBaseThemeOptions}. + * + * @public + */ export interface BaseThemeOptionsInput { palette: PaletteOptions; defaultPageTheme?: string; diff --git a/packages/theme/src/base/index.ts b/packages/theme/src/base/index.ts index 9440bcfd59..891d0bd275 100644 --- a/packages/theme/src/base/index.ts +++ b/packages/theme/src/base/index.ts @@ -15,6 +15,7 @@ */ export { createBaseThemeOptions } from './createBaseThemeOptions'; +export type { BaseThemeOptionsInput } from './createBaseThemeOptions'; export { colorVariants, genPageTheme, pageTheme, shapes } from './pageTheme'; export type { BackstagePaletteAdditions, diff --git a/packages/theme/src/compat/UnifiedThemeProvider.tsx b/packages/theme/src/compat/UnifiedThemeProvider.tsx index 19fd13eb08..72fb708c23 100644 --- a/packages/theme/src/compat/UnifiedThemeProvider.tsx +++ b/packages/theme/src/compat/UnifiedThemeProvider.tsx @@ -26,13 +26,23 @@ import { import CssBaseline from '@mui/material/CssBaseline'; import { UnifiedTheme } from './types'; -interface ThemeProviderProps { +/** + * Props for {@link UnifiedThemeProvider}. + * + * @public + */ +export interface UnifiedThemeProviderProps { children: ReactNode; theme: UnifiedTheme; noCssBaseline?: boolean; } -export function UnifiedThemeProvider(props: ThemeProviderProps) { +/** + * Provides themes for all MUI versions supported by the provided unified theme. + * + * @public + */ +export function UnifiedThemeProvider(props: UnifiedThemeProviderProps) { const { children, theme, noCssBaseline } = props; let result = noCssBaseline ? ( diff --git a/packages/theme/src/compat/index.ts b/packages/theme/src/compat/index.ts index 836c8e6563..5dc9e1e3ea 100644 --- a/packages/theme/src/compat/index.ts +++ b/packages/theme/src/compat/index.ts @@ -15,4 +15,5 @@ */ export { UnifiedThemeProvider } from './UnifiedThemeProvider'; +export type { UnifiedThemeProviderProps } from './UnifiedThemeProvider'; export type { UnifiedTheme } from './types'; diff --git a/packages/theme/src/v5/types.ts b/packages/theme/src/v5/types.ts index 8fce16be05..4f8bfe6634 100644 --- a/packages/theme/src/v5/types.ts +++ b/packages/theme/src/v5/types.ts @@ -51,12 +51,24 @@ declare module '@mui/material/styles/createTheme' { // See https://github.com/mui/material-ui/issues/35287 declare global { namespace React { - type React = typeof import('react'); + interface DOMAttributes { + // onResize?: ReactEventHandler | undefined; + // onResizeCapture?: ReactEventHandler | undefined; - interface DOMAttributes { - onResize?: React.EventHandler | undefined; - onResizeCapture?: React.EventHandler | undefined; + onResize?: (event: Event) => void; + onResizeCapture?: (event: Event) => void; nonce?: string | undefined; } } } +// declare global { +// namespace React { +// type React = typeof import('react'); + +// interface DOMAttributes { +// onResize?: React.EventHandler | undefined; +// onResizeCapture?: React.EventHandler | undefined; +// nonce?: string | undefined; +// } +// } +// }