@mui/material 7.3.2 → 7.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +86 -0
- package/CircularProgress/CircularProgress.d.ts +6 -0
- package/CircularProgress/CircularProgress.js +31 -4
- package/CircularProgress/circularProgressClasses.d.ts +2 -0
- package/CircularProgress/circularProgressClasses.js +1 -1
- package/Divider/Divider.js +1 -1
- package/MenuItem/MenuItem.js +1 -1
- package/SnackbarContent/SnackbarContent.js +1 -1
- package/TextField/TextField.js +1 -1
- package/esm/CircularProgress/CircularProgress.d.ts +6 -0
- package/esm/CircularProgress/CircularProgress.js +32 -5
- package/esm/CircularProgress/circularProgressClasses.d.ts +2 -0
- package/esm/CircularProgress/circularProgressClasses.js +1 -1
- package/esm/Divider/Divider.js +1 -1
- package/esm/MenuItem/MenuItem.js +1 -1
- package/esm/SnackbarContent/SnackbarContent.js +1 -1
- package/esm/TextField/TextField.js +1 -1
- package/esm/index.js +1 -1
- package/esm/locale/amET.d.ts +2 -0
- package/esm/locale/amET.js +73 -0
- package/esm/locale/arEG.d.ts +2 -0
- package/esm/locale/arEG.js +73 -0
- package/esm/locale/arSA.d.ts +2 -0
- package/esm/locale/arSA.js +73 -0
- package/esm/locale/arSD.d.ts +2 -0
- package/esm/locale/arSD.js +73 -0
- package/esm/locale/azAZ.d.ts +2 -0
- package/esm/locale/azAZ.js +77 -0
- package/esm/locale/beBY.d.ts +2 -0
- package/esm/locale/beBY.js +85 -0
- package/esm/locale/bgBG.d.ts +2 -0
- package/esm/locale/bgBG.js +70 -0
- package/esm/locale/bnBD.d.ts +2 -0
- package/esm/locale/bnBD.js +73 -0
- package/esm/locale/caES.d.ts +2 -0
- package/esm/locale/caES.js +70 -0
- package/esm/locale/csCZ.d.ts +2 -0
- package/esm/locale/csCZ.js +81 -0
- package/esm/locale/daDK.d.ts +2 -0
- package/esm/locale/daDK.js +73 -0
- package/esm/locale/deDE.d.ts +2 -0
- package/esm/locale/deDE.js +73 -0
- package/esm/locale/elGR.d.ts +2 -0
- package/esm/locale/elGR.js +75 -0
- package/esm/locale/enUS.d.ts +2 -0
- package/esm/locale/enUS.js +61 -0
- package/esm/locale/esES.d.ts +2 -0
- package/esm/locale/esES.js +73 -0
- package/esm/locale/etEE.d.ts +2 -0
- package/esm/locale/etEE.js +73 -0
- package/esm/locale/faIR.d.ts +2 -0
- package/esm/locale/faIR.js +78 -0
- package/esm/locale/fiFI.d.ts +2 -0
- package/esm/locale/fiFI.js +73 -0
- package/esm/locale/frFR.d.ts +2 -0
- package/esm/locale/frFR.js +73 -0
- package/esm/locale/heIL.d.ts +2 -0
- package/esm/locale/heIL.js +73 -0
- package/esm/locale/hiIN.d.ts +2 -0
- package/esm/locale/hiIN.js +73 -0
- package/esm/locale/hrHR.d.ts +2 -0
- package/esm/locale/hrHR.js +81 -0
- package/esm/locale/huHU.d.ts +2 -0
- package/esm/locale/huHU.js +70 -0
- package/esm/locale/hyAM.d.ts +2 -0
- package/esm/locale/hyAM.js +70 -0
- package/esm/locale/idID.d.ts +2 -0
- package/esm/locale/idID.js +70 -0
- package/esm/locale/index.d.ts +60 -82
- package/esm/locale/index.js +60 -4327
- package/esm/locale/isIS.d.ts +2 -0
- package/esm/locale/isIS.js +73 -0
- package/esm/locale/itIT.d.ts +2 -0
- package/esm/locale/itIT.js +73 -0
- package/esm/locale/jaJP.d.ts +2 -0
- package/esm/locale/jaJP.js +73 -0
- package/esm/locale/khKH.d.ts +2 -0
- package/esm/locale/khKH.js +73 -0
- package/esm/locale/kkKZ.d.ts +2 -0
- package/esm/locale/kkKZ.js +76 -0
- package/esm/locale/koKR.d.ts +2 -0
- package/esm/locale/koKR.js +73 -0
- package/esm/locale/kuCKB.d.ts +2 -0
- package/esm/locale/kuCKB.js +73 -0
- package/esm/locale/kuLatn.d.ts +2 -0
- package/esm/locale/kuLatn.js +73 -0
- package/esm/locale/mkMK.d.ts +2 -0
- package/esm/locale/mkMK.js +77 -0
- package/esm/locale/msMS.d.ts +2 -0
- package/esm/locale/msMS.js +77 -0
- package/esm/locale/myMY.d.ts +2 -0
- package/esm/locale/myMY.js +77 -0
- package/esm/locale/nbNO.d.ts +2 -0
- package/esm/locale/nbNO.js +73 -0
- package/esm/locale/neNP.d.ts +2 -0
- package/esm/locale/neNP.js +77 -0
- package/esm/locale/nlNL.d.ts +2 -0
- package/esm/locale/nlNL.js +73 -0
- package/esm/locale/nnNO.d.ts +2 -0
- package/esm/locale/nnNO.js +73 -0
- package/esm/locale/plPL.d.ts +2 -0
- package/esm/locale/plPL.js +82 -0
- package/esm/locale/psAF.d.ts +2 -0
- package/esm/locale/psAF.js +73 -0
- package/esm/locale/ptBR.d.ts +2 -0
- package/esm/locale/ptBR.js +73 -0
- package/esm/locale/ptPT.d.ts +2 -0
- package/esm/locale/ptPT.js +73 -0
- package/esm/locale/roRO.d.ts +2 -0
- package/esm/locale/roRO.js +73 -0
- package/esm/locale/ruRU.d.ts +2 -0
- package/esm/locale/ruRU.js +85 -0
- package/esm/locale/siLK.d.ts +2 -0
- package/esm/locale/siLK.js +73 -0
- package/esm/locale/skSK.d.ts +2 -0
- package/esm/locale/skSK.js +81 -0
- package/esm/locale/srRS.d.ts +2 -0
- package/esm/locale/srRS.js +81 -0
- package/esm/locale/svSE.d.ts +2 -0
- package/esm/locale/svSE.js +73 -0
- package/esm/locale/thTH.d.ts +2 -0
- package/esm/locale/thTH.js +73 -0
- package/esm/locale/tlTL.d.ts +2 -0
- package/esm/locale/tlTL.js +74 -0
- package/esm/locale/trTR.d.ts +2 -0
- package/esm/locale/trTR.js +73 -0
- package/esm/locale/ukUA.d.ts +2 -0
- package/esm/locale/ukUA.js +82 -0
- package/esm/locale/urPK.d.ts +2 -0
- package/esm/locale/urPK.js +73 -0
- package/esm/locale/utils/LocaleTextApi.d.ts +23 -0
- package/esm/locale/utils/LocaleTextApi.js +1 -0
- package/esm/locale/viVN.d.ts +2 -0
- package/esm/locale/viVN.js +73 -0
- package/esm/locale/zhCN.d.ts +2 -0
- package/esm/locale/zhCN.js +51 -0
- package/esm/locale/zhHK.d.ts +2 -0
- package/esm/locale/zhHK.js +51 -0
- package/esm/locale/zhTW.d.ts +2 -0
- package/esm/locale/zhTW.js +51 -0
- package/esm/styles/createColorScheme.js +2 -2
- package/esm/styles/createTheme.d.ts +13 -5
- package/esm/styles/createTheme.js +2 -2
- package/esm/styles/createThemeFoundation.d.ts +277 -0
- package/esm/styles/createThemeFoundation.js +37 -0
- package/esm/styles/createThemeNoVars.d.ts +1 -1
- package/esm/styles/createThemeWithVars.d.ts +23 -306
- package/esm/useAutocomplete/useAutocomplete.js +2 -2
- package/esm/version/index.js +2 -2
- package/index.js +1 -1
- package/locale/amET.d.ts +2 -0
- package/locale/amET.js +79 -0
- package/locale/arEG.d.ts +2 -0
- package/locale/arEG.js +79 -0
- package/locale/arSA.d.ts +2 -0
- package/locale/arSA.js +79 -0
- package/locale/arSD.d.ts +2 -0
- package/locale/arSD.js +79 -0
- package/locale/azAZ.d.ts +2 -0
- package/locale/azAZ.js +83 -0
- package/locale/beBY.d.ts +2 -0
- package/locale/beBY.js +91 -0
- package/locale/bgBG.d.ts +2 -0
- package/locale/bgBG.js +76 -0
- package/locale/bnBD.d.ts +2 -0
- package/locale/bnBD.js +79 -0
- package/locale/caES.d.ts +2 -0
- package/locale/caES.js +76 -0
- package/locale/csCZ.d.ts +2 -0
- package/locale/csCZ.js +87 -0
- package/locale/daDK.d.ts +2 -0
- package/locale/daDK.js +79 -0
- package/locale/deDE.d.ts +2 -0
- package/locale/deDE.js +79 -0
- package/locale/elGR.d.ts +2 -0
- package/locale/elGR.js +81 -0
- package/locale/enUS.d.ts +2 -0
- package/locale/enUS.js +67 -0
- package/locale/esES.d.ts +2 -0
- package/locale/esES.js +79 -0
- package/locale/etEE.d.ts +2 -0
- package/locale/etEE.js +79 -0
- package/locale/faIR.d.ts +2 -0
- package/locale/faIR.js +84 -0
- package/locale/fiFI.d.ts +2 -0
- package/locale/fiFI.js +79 -0
- package/locale/frFR.d.ts +2 -0
- package/locale/frFR.js +79 -0
- package/locale/heIL.d.ts +2 -0
- package/locale/heIL.js +79 -0
- package/locale/hiIN.d.ts +2 -0
- package/locale/hiIN.js +79 -0
- package/locale/hrHR.d.ts +2 -0
- package/locale/hrHR.js +87 -0
- package/locale/huHU.d.ts +2 -0
- package/locale/huHU.js +76 -0
- package/locale/hyAM.d.ts +2 -0
- package/locale/hyAM.js +76 -0
- package/locale/idID.d.ts +2 -0
- package/locale/idID.js +76 -0
- package/locale/index.d.ts +60 -82
- package/locale/index.js +660 -4328
- package/locale/isIS.d.ts +2 -0
- package/locale/isIS.js +79 -0
- package/locale/itIT.d.ts +2 -0
- package/locale/itIT.js +79 -0
- package/locale/jaJP.d.ts +2 -0
- package/locale/jaJP.js +79 -0
- package/locale/khKH.d.ts +2 -0
- package/locale/khKH.js +79 -0
- package/locale/kkKZ.d.ts +2 -0
- package/locale/kkKZ.js +82 -0
- package/locale/koKR.d.ts +2 -0
- package/locale/koKR.js +79 -0
- package/locale/kuCKB.d.ts +2 -0
- package/locale/kuCKB.js +79 -0
- package/locale/kuLatn.d.ts +2 -0
- package/locale/kuLatn.js +79 -0
- package/locale/mkMK.d.ts +2 -0
- package/locale/mkMK.js +83 -0
- package/locale/msMS.d.ts +2 -0
- package/locale/msMS.js +83 -0
- package/locale/myMY.d.ts +2 -0
- package/locale/myMY.js +83 -0
- package/locale/nbNO.d.ts +2 -0
- package/locale/nbNO.js +79 -0
- package/locale/neNP.d.ts +2 -0
- package/locale/neNP.js +83 -0
- package/locale/nlNL.d.ts +2 -0
- package/locale/nlNL.js +79 -0
- package/locale/nnNO.d.ts +2 -0
- package/locale/nnNO.js +79 -0
- package/locale/plPL.d.ts +2 -0
- package/locale/plPL.js +88 -0
- package/locale/psAF.d.ts +2 -0
- package/locale/psAF.js +79 -0
- package/locale/ptBR.d.ts +2 -0
- package/locale/ptBR.js +79 -0
- package/locale/ptPT.d.ts +2 -0
- package/locale/ptPT.js +79 -0
- package/locale/roRO.d.ts +2 -0
- package/locale/roRO.js +79 -0
- package/locale/ruRU.d.ts +2 -0
- package/locale/ruRU.js +91 -0
- package/locale/siLK.d.ts +2 -0
- package/locale/siLK.js +79 -0
- package/locale/skSK.d.ts +2 -0
- package/locale/skSK.js +87 -0
- package/locale/srRS.d.ts +2 -0
- package/locale/srRS.js +87 -0
- package/locale/svSE.d.ts +2 -0
- package/locale/svSE.js +79 -0
- package/locale/thTH.d.ts +2 -0
- package/locale/thTH.js +79 -0
- package/locale/tlTL.d.ts +2 -0
- package/locale/tlTL.js +80 -0
- package/locale/trTR.d.ts +2 -0
- package/locale/trTR.js +79 -0
- package/locale/ukUA.d.ts +2 -0
- package/locale/ukUA.js +88 -0
- package/locale/urPK.d.ts +2 -0
- package/locale/urPK.js +79 -0
- package/locale/utils/LocaleTextApi.d.ts +23 -0
- package/locale/utils/LocaleTextApi.js +5 -0
- package/locale/viVN.d.ts +2 -0
- package/locale/viVN.js +79 -0
- package/locale/zhCN.d.ts +2 -0
- package/locale/zhCN.js +57 -0
- package/locale/zhHK.d.ts +2 -0
- package/locale/zhHK.js +57 -0
- package/locale/zhTW.d.ts +2 -0
- package/locale/zhTW.js +57 -0
- package/package.json +8 -8
- package/styles/createColorScheme.js +2 -2
- package/styles/createTheme.d.ts +13 -5
- package/styles/createTheme.js +2 -2
- package/styles/createThemeFoundation.d.ts +277 -0
- package/styles/createThemeFoundation.js +5 -0
- package/styles/createThemeNoVars.d.ts +1 -1
- package/styles/createThemeWithVars.d.ts +23 -306
- package/useAutocomplete/useAutocomplete.js +2 -2
- package/version/index.js +2 -2
package/locale/zhHK.js
ADDED
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.zhHK = void 0;
|
|
7
|
+
const zhHK = exports.zhHK = {
|
|
8
|
+
components: {
|
|
9
|
+
MuiBreadcrumbs: {
|
|
10
|
+
defaultProps: {
|
|
11
|
+
expandText: '展開'
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
MuiTablePagination: {
|
|
15
|
+
defaultProps: {
|
|
16
|
+
getItemAriaLabel: type => {
|
|
17
|
+
if (type === 'first') {
|
|
18
|
+
return '第一頁';
|
|
19
|
+
}
|
|
20
|
+
if (type === 'last') {
|
|
21
|
+
return '最後一頁';
|
|
22
|
+
}
|
|
23
|
+
if (type === 'next') {
|
|
24
|
+
return '下一頁';
|
|
25
|
+
}
|
|
26
|
+
return '上一頁';
|
|
27
|
+
},
|
|
28
|
+
labelRowsPerPage: '每頁行數:',
|
|
29
|
+
labelDisplayedRows: ({
|
|
30
|
+
from,
|
|
31
|
+
to,
|
|
32
|
+
count
|
|
33
|
+
}) => `第 ${from} 項至第 ${to} 項,${count !== -1 ? `共 ${count} 項` : `超過 ${to} 項`}`
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
MuiRating: {
|
|
37
|
+
defaultProps: {
|
|
38
|
+
getLabelText: value => `${value} 粒星`,
|
|
39
|
+
emptyLabelText: '無標籤'
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
MuiAutocomplete: {
|
|
43
|
+
defaultProps: {
|
|
44
|
+
clearText: '清除',
|
|
45
|
+
closeText: '關閉',
|
|
46
|
+
loadingText: '載入中……',
|
|
47
|
+
noOptionsText: '沒有可用選項',
|
|
48
|
+
openText: '開啟'
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
MuiAlert: {
|
|
52
|
+
defaultProps: {
|
|
53
|
+
closeText: '關閉'
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
};
|
package/locale/zhTW.d.ts
ADDED
package/locale/zhTW.js
ADDED
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.zhTW = void 0;
|
|
7
|
+
const zhTW = exports.zhTW = {
|
|
8
|
+
components: {
|
|
9
|
+
MuiBreadcrumbs: {
|
|
10
|
+
defaultProps: {
|
|
11
|
+
expandText: '展開'
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
MuiTablePagination: {
|
|
15
|
+
defaultProps: {
|
|
16
|
+
getItemAriaLabel: type => {
|
|
17
|
+
if (type === 'first') {
|
|
18
|
+
return '第一頁';
|
|
19
|
+
}
|
|
20
|
+
if (type === 'last') {
|
|
21
|
+
return '最後一頁';
|
|
22
|
+
}
|
|
23
|
+
if (type === 'next') {
|
|
24
|
+
return '下一頁';
|
|
25
|
+
}
|
|
26
|
+
return '上一頁';
|
|
27
|
+
},
|
|
28
|
+
labelRowsPerPage: '每頁數量:',
|
|
29
|
+
labelDisplayedRows: ({
|
|
30
|
+
from,
|
|
31
|
+
to,
|
|
32
|
+
count
|
|
33
|
+
}) => `${from} ~ ${to} / ${count !== -1 ? count : `${to} 以上`}`
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
MuiRating: {
|
|
37
|
+
defaultProps: {
|
|
38
|
+
getLabelText: value => `${value} 顆星`,
|
|
39
|
+
emptyLabelText: '無標籤'
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
MuiAutocomplete: {
|
|
43
|
+
defaultProps: {
|
|
44
|
+
clearText: '清空',
|
|
45
|
+
closeText: '關閉',
|
|
46
|
+
loadingText: '載入中…',
|
|
47
|
+
noOptionsText: '沒有可用選項',
|
|
48
|
+
openText: '打開'
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
MuiAlert: {
|
|
52
|
+
defaultProps: {
|
|
53
|
+
closeText: '關閉'
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
};
|
package/package.json
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/material",
|
|
3
|
-
"version": "7.3.
|
|
3
|
+
"version": "7.3.4",
|
|
4
4
|
"author": "MUI Team",
|
|
5
5
|
"description": "Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.",
|
|
6
|
-
"main": "./index.js",
|
|
7
6
|
"keywords": [
|
|
8
7
|
"react",
|
|
9
8
|
"react-component",
|
|
@@ -26,7 +25,7 @@
|
|
|
26
25
|
"url": "https://opencollective.com/mui-org"
|
|
27
26
|
},
|
|
28
27
|
"dependencies": {
|
|
29
|
-
"@babel/runtime": "^7.28.
|
|
28
|
+
"@babel/runtime": "^7.28.4",
|
|
30
29
|
"@popperjs/core": "^2.11.8",
|
|
31
30
|
"@types/react-transition-group": "^4.4.12",
|
|
32
31
|
"clsx": "^2.1.1",
|
|
@@ -34,10 +33,10 @@
|
|
|
34
33
|
"prop-types": "^15.8.1",
|
|
35
34
|
"react-is": "^19.1.1",
|
|
36
35
|
"react-transition-group": "^4.4.5",
|
|
37
|
-
"@mui/
|
|
38
|
-
"@mui/
|
|
39
|
-
"@mui/
|
|
40
|
-
"@mui/
|
|
36
|
+
"@mui/core-downloads-tracker": "^7.3.4",
|
|
37
|
+
"@mui/types": "^7.4.7",
|
|
38
|
+
"@mui/system": "^7.3.3",
|
|
39
|
+
"@mui/utils": "^7.3.3"
|
|
41
40
|
},
|
|
42
41
|
"peerDependencies": {
|
|
43
42
|
"@emotion/react": "^11.5.0",
|
|
@@ -45,7 +44,7 @@
|
|
|
45
44
|
"@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
46
45
|
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
47
46
|
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
48
|
-
"@mui/material-pigment-css": "^7.3.
|
|
47
|
+
"@mui/material-pigment-css": "^7.3.3"
|
|
49
48
|
},
|
|
50
49
|
"peerDependenciesMeta": {
|
|
51
50
|
"@types/react": {
|
|
@@ -81,6 +80,7 @@
|
|
|
81
80
|
}
|
|
82
81
|
},
|
|
83
82
|
"type": "commonjs",
|
|
83
|
+
"main": "./index.js",
|
|
84
84
|
"types": "./index.d.ts",
|
|
85
85
|
"exports": {
|
|
86
86
|
"./package.json": "./package.json",
|
|
@@ -36,7 +36,7 @@ function createColorScheme(options) {
|
|
|
36
36
|
opacity,
|
|
37
37
|
overlays,
|
|
38
38
|
colorSpace,
|
|
39
|
-
...
|
|
39
|
+
...other
|
|
40
40
|
} = options;
|
|
41
41
|
// need to cast because `colorSpace` is considered internal at the moment.
|
|
42
42
|
const palette = (0, _createPalette.default)({
|
|
@@ -50,6 +50,6 @@ function createColorScheme(options) {
|
|
|
50
50
|
...opacity
|
|
51
51
|
},
|
|
52
52
|
overlays: overlays || getOverlays(palette.mode),
|
|
53
|
-
...
|
|
53
|
+
...other
|
|
54
54
|
};
|
|
55
55
|
}
|
package/styles/createTheme.d.ts
CHANGED
|
@@ -1,14 +1,22 @@
|
|
|
1
|
+
import { PaletteOptions } from "./createPalette.js";
|
|
2
|
+
import { ColorSystemOptions } from "./createThemeFoundation.js";
|
|
1
3
|
import { CssVarsThemeOptions } from "./createThemeWithVars.js";
|
|
2
|
-
import { Theme,
|
|
3
|
-
export type {
|
|
4
|
+
import { Theme, CssThemeVariables } from "./createThemeNoVars.js";
|
|
5
|
+
export type { Theme, CssThemeVariables } from "./createThemeNoVars.js";
|
|
6
|
+
type CssVarsOptions = CssThemeVariables extends {
|
|
7
|
+
enabled: true;
|
|
8
|
+
} ? ColorSystemOptions : {};
|
|
9
|
+
type CssVarsConfigList = 'colorSchemeSelector' | 'rootSelector' | 'disableCssColorScheme' | 'cssVarPrefix' | 'shouldSkipGeneratingVar' | 'nativeColor';
|
|
10
|
+
export interface ThemeOptions extends CssVarsOptions, Omit<CssVarsThemeOptions, CssVarsConfigList> {
|
|
11
|
+
cssVariables?: boolean | Pick<CssVarsThemeOptions, CssVarsConfigList>;
|
|
12
|
+
palette?: PaletteOptions;
|
|
13
|
+
}
|
|
4
14
|
/**
|
|
5
15
|
* Generate a theme base on the options received.
|
|
6
16
|
* @param options Takes an incomplete theme object and adds the missing parts.
|
|
7
17
|
* @param args Deep merge the arguments with the about to be returned theme.
|
|
8
18
|
* @returns A complete, ready-to-use theme object.
|
|
9
19
|
*/
|
|
10
|
-
export default function createTheme(options?:
|
|
11
|
-
cssVariables?: boolean | Pick<CssVarsThemeOptions, 'colorSchemeSelector' | 'rootSelector' | 'disableCssColorScheme' | 'cssVarPrefix' | 'shouldSkipGeneratingVar' | 'nativeColor'>;
|
|
12
|
-
},
|
|
20
|
+
export default function createTheme(options?: ThemeOptions,
|
|
13
21
|
// cast type to skip module augmentation test
|
|
14
22
|
...args: object[]): Theme;
|
package/styles/createTheme.js
CHANGED
|
@@ -40,7 +40,7 @@ function createTheme(options = {},
|
|
|
40
40
|
light: true
|
|
41
41
|
} : undefined,
|
|
42
42
|
defaultColorScheme: initialDefaultColorScheme = palette?.mode,
|
|
43
|
-
...
|
|
43
|
+
...other
|
|
44
44
|
} = options;
|
|
45
45
|
const defaultColorSchemeInput = initialDefaultColorScheme || 'light';
|
|
46
46
|
const defaultScheme = initialColorSchemes?.[defaultColorSchemeInput];
|
|
@@ -97,7 +97,7 @@ function createTheme(options = {},
|
|
|
97
97
|
colorSchemesInput.light = true;
|
|
98
98
|
}
|
|
99
99
|
return (0, _createThemeWithVars.default)({
|
|
100
|
-
...
|
|
100
|
+
...other,
|
|
101
101
|
colorSchemes: colorSchemesInput,
|
|
102
102
|
defaultColorScheme: defaultColorSchemeInput,
|
|
103
103
|
...(typeof cssVariables !== 'boolean' && cssVariables)
|
|
@@ -0,0 +1,277 @@
|
|
|
1
|
+
import { OverridableStringUnion } from '@mui/types';
|
|
2
|
+
import { SxConfig, SxProps, CSSObject, ApplyStyles, Theme as SystemTheme } from '@mui/system';
|
|
3
|
+
import { ExtractTypographyTokens } from '@mui/system/cssVars';
|
|
4
|
+
import { Palette, PaletteOptions } from "./createPalette.js";
|
|
5
|
+
import { Shadows } from "./shadows.js";
|
|
6
|
+
import { Transitions } from "./createTransitions.js";
|
|
7
|
+
import { Mixins } from "./createMixins.js";
|
|
8
|
+
import { TypographyVariants } from "./createTypography.js";
|
|
9
|
+
import { ZIndex } from "./zIndex.js";
|
|
10
|
+
/**
|
|
11
|
+
* default MD color-schemes
|
|
12
|
+
*/
|
|
13
|
+
export type DefaultColorScheme = 'light' | 'dark';
|
|
14
|
+
/**
|
|
15
|
+
* The application can add more color-scheme by extending this interface via module augmentation
|
|
16
|
+
*
|
|
17
|
+
* Ex.
|
|
18
|
+
* declare module @mui/material/styles {
|
|
19
|
+
* interface ColorSchemeOverrides {
|
|
20
|
+
* foo: true;
|
|
21
|
+
* }
|
|
22
|
+
* }
|
|
23
|
+
*
|
|
24
|
+
* // SupportedColorScheme = 'light' | 'dark' | 'foo';
|
|
25
|
+
*/
|
|
26
|
+
export interface ColorSchemeOverrides {}
|
|
27
|
+
export type ExtendedColorScheme = OverridableStringUnion<never, ColorSchemeOverrides>;
|
|
28
|
+
/**
|
|
29
|
+
* All color-schemes that the application has
|
|
30
|
+
*/
|
|
31
|
+
export type SupportedColorScheme = DefaultColorScheme | ExtendedColorScheme;
|
|
32
|
+
export interface Opacity {
|
|
33
|
+
inputPlaceholder: number;
|
|
34
|
+
inputUnderline: number;
|
|
35
|
+
switchTrackDisabled: number;
|
|
36
|
+
switchTrack: number;
|
|
37
|
+
}
|
|
38
|
+
export type Overlays = [string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined, string | undefined];
|
|
39
|
+
export interface PaletteBackgroundChannel {
|
|
40
|
+
defaultChannel: string;
|
|
41
|
+
paperChannel: string;
|
|
42
|
+
}
|
|
43
|
+
export interface PaletteCommonChannel {
|
|
44
|
+
background: string;
|
|
45
|
+
backgroundChannel: string;
|
|
46
|
+
onBackground: string;
|
|
47
|
+
onBackgroundChannel: string;
|
|
48
|
+
}
|
|
49
|
+
export interface PaletteColorChannel {
|
|
50
|
+
mainChannel: string;
|
|
51
|
+
lightChannel: string;
|
|
52
|
+
darkChannel: string;
|
|
53
|
+
contrastTextChannel: string;
|
|
54
|
+
}
|
|
55
|
+
export interface PaletteActionChannel {
|
|
56
|
+
activeChannel: string;
|
|
57
|
+
selectedChannel: string;
|
|
58
|
+
}
|
|
59
|
+
export interface PaletteTextChannel {
|
|
60
|
+
primaryChannel: string;
|
|
61
|
+
secondaryChannel: string;
|
|
62
|
+
}
|
|
63
|
+
export interface PaletteAlert {
|
|
64
|
+
errorColor: string;
|
|
65
|
+
infoColor: string;
|
|
66
|
+
successColor: string;
|
|
67
|
+
warningColor: string;
|
|
68
|
+
errorFilledBg: string;
|
|
69
|
+
infoFilledBg: string;
|
|
70
|
+
successFilledBg: string;
|
|
71
|
+
warningFilledBg: string;
|
|
72
|
+
errorFilledColor: string;
|
|
73
|
+
infoFilledColor: string;
|
|
74
|
+
successFilledColor: string;
|
|
75
|
+
warningFilledColor: string;
|
|
76
|
+
errorStandardBg: string;
|
|
77
|
+
infoStandardBg: string;
|
|
78
|
+
successStandardBg: string;
|
|
79
|
+
warningStandardBg: string;
|
|
80
|
+
errorIconColor: string;
|
|
81
|
+
infoIconColor: string;
|
|
82
|
+
successIconColor: string;
|
|
83
|
+
warningIconColor: string;
|
|
84
|
+
}
|
|
85
|
+
export interface PaletteAppBar {
|
|
86
|
+
defaultBg: string;
|
|
87
|
+
darkBg: string;
|
|
88
|
+
darkColor: string;
|
|
89
|
+
}
|
|
90
|
+
export interface PaletteAvatar {
|
|
91
|
+
defaultBg: string;
|
|
92
|
+
}
|
|
93
|
+
export interface PaletteButton {
|
|
94
|
+
inheritContainedBg: string;
|
|
95
|
+
inheritContainedHoverBg: string;
|
|
96
|
+
}
|
|
97
|
+
export interface PaletteChip {
|
|
98
|
+
defaultBorder: string;
|
|
99
|
+
defaultAvatarColor: string;
|
|
100
|
+
defaultIconColor: string;
|
|
101
|
+
}
|
|
102
|
+
export interface PaletteFilledInput {
|
|
103
|
+
bg: string;
|
|
104
|
+
hoverBg: string;
|
|
105
|
+
disabledBg: string;
|
|
106
|
+
}
|
|
107
|
+
export interface PaletteLinearProgress {
|
|
108
|
+
primaryBg: string;
|
|
109
|
+
secondaryBg: string;
|
|
110
|
+
errorBg: string;
|
|
111
|
+
infoBg: string;
|
|
112
|
+
successBg: string;
|
|
113
|
+
warningBg: string;
|
|
114
|
+
}
|
|
115
|
+
export interface PaletteSkeleton {
|
|
116
|
+
bg: string;
|
|
117
|
+
}
|
|
118
|
+
export interface PaletteSlider {
|
|
119
|
+
primaryTrack: string;
|
|
120
|
+
secondaryTrack: string;
|
|
121
|
+
errorTrack: string;
|
|
122
|
+
infoTrack: string;
|
|
123
|
+
successTrack: string;
|
|
124
|
+
warningTrack: string;
|
|
125
|
+
}
|
|
126
|
+
export interface PaletteSnackbarContent {
|
|
127
|
+
bg: string;
|
|
128
|
+
color: string;
|
|
129
|
+
}
|
|
130
|
+
export interface PaletteSpeedDialAction {
|
|
131
|
+
fabHoverBg: string;
|
|
132
|
+
}
|
|
133
|
+
export interface PaletteStepConnector {
|
|
134
|
+
border: string;
|
|
135
|
+
}
|
|
136
|
+
export interface PaletteStepContent {
|
|
137
|
+
border: string;
|
|
138
|
+
}
|
|
139
|
+
export interface PaletteSwitch {
|
|
140
|
+
defaultColor: string;
|
|
141
|
+
defaultDisabledColor: string;
|
|
142
|
+
primaryDisabledColor: string;
|
|
143
|
+
secondaryDisabledColor: string;
|
|
144
|
+
errorDisabledColor: string;
|
|
145
|
+
infoDisabledColor: string;
|
|
146
|
+
successDisabledColor: string;
|
|
147
|
+
warningDisabledColor: string;
|
|
148
|
+
}
|
|
149
|
+
export interface PaletteTableCell {
|
|
150
|
+
border: string;
|
|
151
|
+
}
|
|
152
|
+
export interface PaletteTooltip {
|
|
153
|
+
bg: string;
|
|
154
|
+
}
|
|
155
|
+
export interface ColorSystemOptions {
|
|
156
|
+
palette?: PaletteOptions & {
|
|
157
|
+
background?: Partial<PaletteBackgroundChannel>;
|
|
158
|
+
common?: Partial<PaletteCommonChannel>;
|
|
159
|
+
primary?: Partial<PaletteColorChannel>;
|
|
160
|
+
secondary?: Partial<PaletteColorChannel>;
|
|
161
|
+
error?: Partial<PaletteColorChannel>;
|
|
162
|
+
info?: Partial<PaletteColorChannel>;
|
|
163
|
+
success?: Partial<PaletteColorChannel>;
|
|
164
|
+
text?: Partial<PaletteTextChannel>;
|
|
165
|
+
dividerChannel?: Partial<string>;
|
|
166
|
+
action?: Partial<PaletteActionChannel>;
|
|
167
|
+
Alert?: Partial<PaletteAlert>;
|
|
168
|
+
AppBar?: Partial<PaletteAppBar>;
|
|
169
|
+
Avatar?: Partial<PaletteAvatar>;
|
|
170
|
+
Button?: Partial<PaletteButton>;
|
|
171
|
+
Chip?: Partial<PaletteChip>;
|
|
172
|
+
FilledInput?: Partial<PaletteFilledInput>;
|
|
173
|
+
LinearProgress?: Partial<PaletteLinearProgress>;
|
|
174
|
+
Skeleton?: Partial<PaletteSkeleton>;
|
|
175
|
+
Slider?: Partial<PaletteSlider>;
|
|
176
|
+
SnackbarContent?: Partial<PaletteSnackbarContent>;
|
|
177
|
+
SpeedDialAction?: Partial<PaletteSpeedDialAction>;
|
|
178
|
+
StepConnector?: Partial<PaletteStepConnector>;
|
|
179
|
+
StepContent?: Partial<PaletteStepContent>;
|
|
180
|
+
Switch?: Partial<PaletteSwitch>;
|
|
181
|
+
TableCell?: Partial<PaletteTableCell>;
|
|
182
|
+
Tooltip?: Partial<PaletteTooltip>;
|
|
183
|
+
};
|
|
184
|
+
opacity?: Partial<Opacity>;
|
|
185
|
+
overlays?: Overlays;
|
|
186
|
+
}
|
|
187
|
+
export interface CssVarsPalette {
|
|
188
|
+
common: PaletteCommonChannel;
|
|
189
|
+
primary: PaletteColorChannel;
|
|
190
|
+
secondary: PaletteColorChannel;
|
|
191
|
+
error: PaletteColorChannel;
|
|
192
|
+
info: PaletteColorChannel;
|
|
193
|
+
success: PaletteColorChannel;
|
|
194
|
+
warning: PaletteColorChannel;
|
|
195
|
+
text: PaletteTextChannel;
|
|
196
|
+
background: PaletteBackgroundChannel;
|
|
197
|
+
dividerChannel: string;
|
|
198
|
+
action: PaletteActionChannel;
|
|
199
|
+
Alert: PaletteAlert;
|
|
200
|
+
AppBar: PaletteAppBar;
|
|
201
|
+
Avatar: PaletteAvatar;
|
|
202
|
+
Button: PaletteButton;
|
|
203
|
+
Chip: PaletteChip;
|
|
204
|
+
FilledInput: PaletteFilledInput;
|
|
205
|
+
LinearProgress: PaletteLinearProgress;
|
|
206
|
+
Skeleton: PaletteSkeleton;
|
|
207
|
+
Slider: PaletteSlider;
|
|
208
|
+
SnackbarContent: PaletteSnackbarContent;
|
|
209
|
+
SpeedDialAction: PaletteSpeedDialAction;
|
|
210
|
+
StepConnector: PaletteStepConnector;
|
|
211
|
+
StepContent: PaletteStepContent;
|
|
212
|
+
Switch: PaletteSwitch;
|
|
213
|
+
TableCell: PaletteTableCell;
|
|
214
|
+
Tooltip: PaletteTooltip;
|
|
215
|
+
}
|
|
216
|
+
export interface ColorSystem {
|
|
217
|
+
palette: Palette & CssVarsPalette;
|
|
218
|
+
opacity: Opacity;
|
|
219
|
+
overlays: Overlays;
|
|
220
|
+
}
|
|
221
|
+
export interface ThemeVars {
|
|
222
|
+
font: ExtractTypographyTokens<TypographyVariants>;
|
|
223
|
+
palette: Omit<ColorSystem['palette'], 'colorScheme' | 'mode' | 'contrastThreshold' | 'tonalOffset' | 'getContrastText' | 'augmentColor'>;
|
|
224
|
+
opacity: Opacity;
|
|
225
|
+
overlays: Overlays;
|
|
226
|
+
shadows: Shadows;
|
|
227
|
+
shape: SystemTheme['shape'];
|
|
228
|
+
spacing: string;
|
|
229
|
+
zIndex: ZIndex;
|
|
230
|
+
}
|
|
231
|
+
type Split<T, K extends keyof T = keyof T> = K extends string | number ? { [k in K]: Exclude<T[K], undefined> } : never;
|
|
232
|
+
type ConcatDeep<T> = T extends Record<string | number, infer V> ? keyof T extends string | number ? V extends string | number ? keyof T : keyof V extends string | number ? `${keyof T}-${ConcatDeep<Split<V>>}` : never : never : never;
|
|
233
|
+
/**
|
|
234
|
+
* Does not work for these cases:
|
|
235
|
+
* - { borderRadius: string | number } // the value can't be a union
|
|
236
|
+
* - { shadows: [string, string, ..., string] } // the value can't be an array
|
|
237
|
+
*/
|
|
238
|
+
type NormalizeVars<T> = ConcatDeep<Split<T>>;
|
|
239
|
+
export {};
|
|
240
|
+
export interface ThemeCssVarOverrides {}
|
|
241
|
+
export type ThemeCssVar = OverridableStringUnion<NormalizeVars<Omit<ThemeVars, 'overlays' | 'shadows' | 'shape'>> | 'shape-borderRadius' | 'shadows-0' | 'shadows-1' | 'shadows-2' | 'shadows-3' | 'shadows-4' | 'shadows-5' | 'shadows-6' | 'shadows-7' | 'shadows-8' | 'shadows-9' | 'shadows-10' | 'shadows-11' | 'shadows-12' | 'shadows-13' | 'shadows-14' | 'shadows-15' | 'shadows-16' | 'shadows-17' | 'shadows-18' | 'shadows-19' | 'shadows-20' | 'shadows-21' | 'shadows-22' | 'shadows-23' | 'shadows-24' | 'overlays-0' | 'overlays-1' | 'overlays-2' | 'overlays-3' | 'overlays-4' | 'overlays-5' | 'overlays-6' | 'overlays-7' | 'overlays-8' | 'overlays-9' | 'overlays-10' | 'overlays-11' | 'overlays-12' | 'overlays-13' | 'overlays-14' | 'overlays-15' | 'overlays-16' | 'overlays-17' | 'overlays-18' | 'overlays-19' | 'overlays-20' | 'overlays-21' | 'overlays-22' | 'overlays-23' | 'overlays-24', ThemeCssVarOverrides>;
|
|
242
|
+
/**
|
|
243
|
+
* Theme properties generated by extendTheme and CssVarsProvider
|
|
244
|
+
*/
|
|
245
|
+
export interface CssVarsTheme extends ColorSystem {
|
|
246
|
+
colorSchemes: Partial<Record<SupportedColorScheme, ColorSystem>>;
|
|
247
|
+
rootSelector: string;
|
|
248
|
+
colorSchemeSelector: 'media' | 'class' | 'data' | string;
|
|
249
|
+
cssVarPrefix: string;
|
|
250
|
+
defaultColorScheme: SupportedColorScheme;
|
|
251
|
+
vars: ThemeVars;
|
|
252
|
+
getCssVar: (field: ThemeCssVar, ...vars: ThemeCssVar[]) => string;
|
|
253
|
+
getColorSchemeSelector: (colorScheme: SupportedColorScheme) => string;
|
|
254
|
+
generateThemeVars: () => ThemeVars;
|
|
255
|
+
generateStyleSheets: () => Array<Record<string, any>>;
|
|
256
|
+
generateSpacing: () => SystemTheme['spacing'];
|
|
257
|
+
spacing: SystemTheme['spacing'];
|
|
258
|
+
breakpoints: SystemTheme['breakpoints'];
|
|
259
|
+
shape: SystemTheme['shape'];
|
|
260
|
+
typography: TypographyVariants;
|
|
261
|
+
transitions: Transitions;
|
|
262
|
+
shadows: Shadows;
|
|
263
|
+
mixins: Mixins;
|
|
264
|
+
zIndex: ZIndex;
|
|
265
|
+
direction: SystemTheme['direction'];
|
|
266
|
+
/**
|
|
267
|
+
* A function to determine if the key, value should be attached as CSS Variable
|
|
268
|
+
* `keys` is an array that represents the object path keys.
|
|
269
|
+
* Ex, if the theme is { foo: { bar: 'var(--test)' } }
|
|
270
|
+
* then, keys = ['foo', 'bar']
|
|
271
|
+
* value = 'var(--test)'
|
|
272
|
+
*/
|
|
273
|
+
shouldSkipGeneratingVar: (keys: string[], value: string | number) => boolean;
|
|
274
|
+
unstable_sxConfig: SxConfig;
|
|
275
|
+
unstable_sx: (props: SxProps<CssVarsTheme>) => CSSObject;
|
|
276
|
+
applyStyles: ApplyStyles<SupportedColorScheme>;
|
|
277
|
+
}
|
|
@@ -6,7 +6,7 @@ import { Shadows } from "./shadows.js";
|
|
|
6
6
|
import { Transitions, TransitionsOptions } from "./createTransitions.js";
|
|
7
7
|
import { ZIndex, ZIndexOptions } from "./zIndex.js";
|
|
8
8
|
import { Components } from "./components.js";
|
|
9
|
-
import { CssVarsTheme, CssVarsPalette, ColorSystemOptions } from "./
|
|
9
|
+
import { CssVarsTheme, CssVarsPalette, ColorSystemOptions } from "./createThemeFoundation.js";
|
|
10
10
|
|
|
11
11
|
/**
|
|
12
12
|
* To disable custom properties, use module augmentation
|