Skip to content

Commit b8ee123

Browse files
committed
Partial copy paste of the MUI Theme type definition
1 parent a156dd6 commit b8ee123

File tree

5 files changed

+147
-0
lines changed

5 files changed

+147
-0
lines changed
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
2+
import type { CSSProperties } from "@mui/material/styles/createMixins";
3+
4+
export interface Mixins {
5+
toolbar: CSSProperties;
6+
// ... use interface declaration merging to add custom mixins
7+
}
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
2+
import type { PaletteMode, Color } from "@mui/material";
3+
import type { CommonColors, PaletteTonalOffset, PaletteColor, TypeText, TypeDivider, TypeAction, TypeBackground, PaletteAugmentColorOptions } from "@mui/material/styles/createPalette";
4+
5+
export interface Palette {
6+
common: CommonColors;
7+
mode: PaletteMode;
8+
contrastThreshold: number;
9+
tonalOffset: PaletteTonalOffset;
10+
primary: PaletteColor;
11+
secondary: PaletteColor;
12+
error: PaletteColor;
13+
warning: PaletteColor;
14+
info: PaletteColor;
15+
success: PaletteColor;
16+
grey: Color;
17+
text: TypeText;
18+
divider: TypeDivider;
19+
action: TypeAction;
20+
background: TypeBackground;
21+
getContrastText: (background: string) => string;
22+
augmentColor: (options: PaletteAugmentColorOptions) => PaletteColor;
23+
}
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
2+
import type { Theme as SystemTheme } from '@mui/system';
3+
import type { Transitions } from '@mui/material/styles/createTransitions';
4+
import type { ZIndex } from '@mui/material/styles/zIndex';
5+
import type { Components } from '@mui/material/styles/components';
6+
7+
import type { Mixins } from "./createMixins";
8+
import type { Palette } from "./createPalette";
9+
import type { Shadows } from './shadows';
10+
import type { Typography } from './createTypography';
11+
12+
export interface BaseTheme extends SystemTheme {
13+
mixins: Mixins;
14+
palette: Palette;
15+
shadows: Shadows;
16+
transitions: Transitions;
17+
typography: Typography;
18+
zIndex: ZIndex;
19+
unstable_strictMode?: boolean;
20+
}
21+
22+
export interface Theme extends BaseTheme {
23+
components?: Components<BaseTheme>;
24+
}
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
import type * as React from 'react';
2+
import type * as CSS from 'csstype';
3+
4+
export type Variant =
5+
| 'h1'
6+
| 'h2'
7+
| 'h3'
8+
| 'h4'
9+
| 'h5'
10+
| 'h6'
11+
| 'subtitle1'
12+
| 'subtitle2'
13+
| 'body1'
14+
| 'body2'
15+
| 'caption'
16+
| 'button'
17+
| 'overline';
18+
19+
export interface FontStyle
20+
extends Required<{
21+
fontFamily: React.CSSProperties['fontFamily'];
22+
fontSize: number;
23+
fontWeightLight: React.CSSProperties['fontWeight'];
24+
fontWeightRegular: React.CSSProperties['fontWeight'];
25+
fontWeightMedium: React.CSSProperties['fontWeight'];
26+
fontWeightBold: React.CSSProperties['fontWeight'];
27+
htmlFontSize: number;
28+
}> {}
29+
30+
export type NormalCssProperties = CSS.Properties<number | string>;
31+
export type Fontface = CSS.AtRule.FontFace & { fallbacks?: CSS.AtRule.FontFace[] };
32+
33+
/**
34+
* Allows the user to augment the properties available
35+
*/
36+
export interface BaseCSSProperties extends NormalCssProperties {
37+
'@font-face'?: Fontface | Fontface[];
38+
}
39+
40+
export interface CSSProperties extends BaseCSSProperties {
41+
// Allow pseudo selectors and media queries
42+
// `unknown` is used since TS does not allow assigning an interface without
43+
// an index signature to one with an index signature. This is to allow type safe
44+
// module augmentation.
45+
// Technically we want any key not typed in `BaseCSSProperties` to be of type
46+
// `CSSProperties` but this doesn't work. The index signature needs to cover
47+
// BaseCSSProperties as well. Usually you would use `BaseCSSProperties[keyof BaseCSSProperties]`
48+
// but this would not allow assigning React.CSSProperties to CSSProperties
49+
[k: string]: unknown | CSSProperties;
50+
}
51+
52+
53+
// TODO: which one should actually be allowed to be subject to module augmentation?
54+
// current type vs interface decision is kept for historical reasons until we
55+
// made a decision
56+
export type TypographyStyle = CSSProperties;
57+
58+
export interface TypographyUtils {
59+
pxToRem: (px: number) => string;
60+
}
61+
62+
export interface Typography extends Record<Variant, TypographyStyle>, FontStyle, TypographyUtils {}
63+
64+
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
export type Shadows = [
2+
'none',
3+
string,
4+
string,
5+
string,
6+
string,
7+
string,
8+
string,
9+
string,
10+
string,
11+
string,
12+
string,
13+
string,
14+
string,
15+
string,
16+
string,
17+
string,
18+
string,
19+
string,
20+
string,
21+
string,
22+
string,
23+
string,
24+
string,
25+
string,
26+
string,
27+
];
28+
declare const shadows: Shadows;
29+
export default shadows;

0 commit comments

Comments
 (0)