forked from mui/material-ui
-
Notifications
You must be signed in to change notification settings - Fork 0
/
colorSystem.ts
156 lines (140 loc) · 3.62 KB
/
colorSystem.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
import { OverridableStringUnion } from '@mui/types';
/**
* ====================================================
* Developer facing types, they can augment these types.
* ====================================================
*/
export interface PaletteVariant {
plainColor: string;
plainBg: string;
plainBorder: string;
// hover state
plainHoverColor: string;
plainHoverBorder: string;
plainHoverBg: string;
// active state
plainActiveColor: string;
plainActiveBorder: string;
plainActiveBg: string;
// disabled state
plainDisabledColor: string;
plainDisabledBorder: string;
plainDisabledBg: string;
outlinedColor: string;
outlinedBorder: string;
outlinedBg: string;
// hover state
outlinedHoverColor: string;
outlinedHoverBorder: string;
outlinedHoverBg: string;
// active state
outlinedActiveColor: string;
outlinedActiveBorder: string;
outlinedActiveBg: string;
// disabled state
outlinedDisabledColor: string;
outlinedDisabledBorder: string;
outlinedDisabledBg: string;
softColor: string;
softBorder: string;
softBg: string;
// hover state
softHoverColor: string;
softHoverBorder: string;
softHoverBg: string;
// active state
softActiveColor: string;
softActiveBorder: string;
softActiveBg: string;
// disabled state
softDisabledColor: string;
softDisabledBorder: string;
softDisabledBg: string;
solidColor: string;
solidBg: string;
solidBorder: string;
// hover state
solidHoverColor: string;
solidHoverBg: string;
solidHoverBorder: string;
// active state
solidActiveColor: string;
solidActiveBg: string;
solidActiveBorder: string;
// disabled state
solidDisabledColor: string;
solidDisabledBg: string;
solidDisabledBorder: string;
// override palette.text
overrideTextPrimary: string;
overrideTextSecondary: string;
overrideTextTertiary: string;
}
export interface PaletteRangeOverrides {}
export type ExtendedPaletteRange = OverridableStringUnion<
| '50'
| '100'
| '200'
| '300'
| '400'
| '500'
| '600'
| '700'
| '800'
| '900'
| 'mainChannel'
| 'lightChannel'
| 'darkChannel',
PaletteRangeOverrides
>;
export interface PaletteRange extends Record<ExtendedPaletteRange, string>, PaletteVariant {}
export interface PaletteCommon {
white: string;
black: string;
}
export interface PaletteText {
primary: string;
secondary: string;
tertiary: string;
}
export interface PaletteBackground {
body: string;
surface: string;
level1: string;
level2: string;
level3: string;
tooltip: string;
backdrop: string;
}
export interface ColorPalettePropOverrides {}
export type DefaultColorPalette = 'primary' | 'neutral' | 'danger' | 'info' | 'success' | 'warning';
export type ColorPaletteProp = OverridableStringUnion<
DefaultColorPalette,
ColorPalettePropOverrides
>;
// Split interfaces into multiple chunks so that they can be augmented independently
export interface PalettePrimary extends PaletteRange {}
export interface PaletteNeutral extends PaletteRange {}
export interface PaletteDanger extends PaletteRange {}
export interface PaletteInfo extends PaletteRange {}
export interface PaletteSuccess extends PaletteRange {}
export interface PaletteWarning extends PaletteRange {}
export interface Palette {
mode: 'light' | 'dark';
primary: PalettePrimary;
neutral: PaletteNeutral;
danger: PaletteDanger;
info: PaletteInfo;
success: PaletteSuccess;
warning: PaletteWarning;
common: PaletteCommon;
text: PaletteText;
background: PaletteBackground;
divider: string;
focusVisible: string;
}
export interface ColorSystem {
palette: Palette;
shadowRing: string;
shadowChannel: string;
}