@mui/system 5.15.14 → 6.0.0-alpha.0

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.
Files changed (431) hide show
  1. package/Box/Box.js +11 -17
  2. package/Box/boxClasses.js +3 -10
  3. package/Box/index.js +3 -35
  4. package/Box/package.json +2 -2
  5. package/CHANGELOG.md +80 -1
  6. package/Container/Container.d.ts +1 -1
  7. package/Container/Container.js +12 -17
  8. package/Container/ContainerProps.js +1 -5
  9. package/Container/containerClasses.js +6 -14
  10. package/Container/createContainer.js +34 -43
  11. package/Container/index.js +3 -35
  12. package/Container/package.json +2 -2
  13. package/GlobalStyles/GlobalStyles.js +11 -19
  14. package/GlobalStyles/index.js +2 -25
  15. package/GlobalStyles/package.json +2 -2
  16. package/README.md +2 -2
  17. package/RtlProvider/index.js +13 -23
  18. package/RtlProvider/package.json +2 -2
  19. package/Stack/Stack.d.ts +1 -1
  20. package/Stack/Stack.js +11 -17
  21. package/Stack/StackProps.js +1 -5
  22. package/Stack/createStack.d.ts +2 -2
  23. package/Stack/createStack.js +40 -51
  24. package/Stack/index.js +5 -55
  25. package/Stack/package.json +2 -2
  26. package/Stack/stackClasses.js +6 -14
  27. package/ThemeProvider/ThemeProvider.js +22 -30
  28. package/ThemeProvider/index.js +1 -12
  29. package/ThemeProvider/package.json +2 -2
  30. package/Unstable_Grid/Grid.d.ts +1 -1
  31. package/Unstable_Grid/Grid.js +25 -31
  32. package/Unstable_Grid/GridProps.js +1 -5
  33. package/Unstable_Grid/createGrid.d.ts +2 -2
  34. package/Unstable_Grid/createGrid.js +59 -70
  35. package/Unstable_Grid/gridClasses.js +6 -14
  36. package/Unstable_Grid/gridGenerator.js +24 -43
  37. package/Unstable_Grid/index.js +6 -63
  38. package/Unstable_Grid/package.json +2 -2
  39. package/Unstable_Grid/traverseBreakpoints.d.ts +1 -1
  40. package/Unstable_Grid/traverseBreakpoints.js +3 -11
  41. package/borders/borders.d.ts +14 -0
  42. package/{esm → borders}/borders.js +5 -5
  43. package/borders/index.d.ts +2 -0
  44. package/borders/index.js +4 -0
  45. package/borders/package.json +6 -0
  46. package/{breakpoints.d.ts → breakpoints/breakpoints.d.ts} +13 -3
  47. package/{modern → breakpoints}/breakpoints.js +1 -1
  48. package/breakpoints/index.d.ts +2 -0
  49. package/breakpoints/index.js +4 -0
  50. package/breakpoints/package.json +6 -0
  51. package/{esm → colorManipulator}/colorManipulator.js +1 -1
  52. package/colorManipulator/index.d.ts +1 -0
  53. package/colorManipulator/index.js +3 -0
  54. package/colorManipulator/package.json +6 -0
  55. package/compose/compose.d.ts +5 -0
  56. package/{modern → compose}/compose.js +1 -1
  57. package/compose/index.d.ts +1 -0
  58. package/compose/index.js +3 -0
  59. package/compose/package.json +6 -0
  60. package/{createBox.d.ts → createBox/createBox.d.ts} +2 -2
  61. package/{modern → createBox}/createBox.js +2 -2
  62. package/createBox/index.d.ts +1 -0
  63. package/createBox/index.js +3 -0
  64. package/createBox/package.json +6 -0
  65. package/{createStyled.d.ts → createStyled/createStyled.d.ts} +2 -2
  66. package/{modern → createStyled}/createStyled.js +2 -2
  67. package/createStyled/index.d.ts +2 -0
  68. package/createStyled/index.js +4 -0
  69. package/createStyled/package.json +6 -0
  70. package/createTheme/applyStyles.js +1 -7
  71. package/createTheme/createBreakpoints.d.ts +4 -4
  72. package/createTheme/createBreakpoints.js +7 -15
  73. package/createTheme/createSpacing.js +3 -8
  74. package/createTheme/createTheme.js +20 -27
  75. package/createTheme/index.js +3 -27
  76. package/createTheme/package.json +2 -2
  77. package/createTheme/shape.js +1 -7
  78. package/cssGrid/cssGrid.d.ts +3 -0
  79. package/{esm → cssGrid}/cssGrid.js +5 -5
  80. package/cssGrid/index.d.ts +2 -0
  81. package/cssGrid/index.js +4 -0
  82. package/cssGrid/package.json +6 -0
  83. package/cssVars/createCssVarsProvider.d.ts +0 -8
  84. package/cssVars/createCssVarsProvider.js +67 -110
  85. package/cssVars/createCssVarsTheme.d.ts +2 -7
  86. package/cssVars/createCssVarsTheme.js +10 -20
  87. package/cssVars/createGetCssVar.js +1 -7
  88. package/cssVars/cssVarsParser.js +3 -13
  89. package/cssVars/getInitColorSchemeScript.js +7 -16
  90. package/cssVars/index.js +4 -33
  91. package/cssVars/package.json +2 -2
  92. package/cssVars/prepareCssVars.d.ts +5 -9
  93. package/cssVars/prepareCssVars.js +60 -41
  94. package/cssVars/useCurrentColorScheme.js +16 -26
  95. package/display/display.d.ts +3 -0
  96. package/{esm → display}/display.js +2 -2
  97. package/display/index.d.ts +2 -0
  98. package/display/index.js +4 -0
  99. package/display/package.json +6 -0
  100. package/flexbox/flexbox.d.ts +3 -0
  101. package/{modern → flexbox}/flexbox.js +2 -2
  102. package/flexbox/index.d.ts +2 -0
  103. package/flexbox/index.js +4 -0
  104. package/flexbox/package.json +6 -0
  105. package/getThemeValue/getThemeValue.d.ts +1 -0
  106. package/{esm → getThemeValue}/getThemeValue.js +10 -10
  107. package/getThemeValue/index.d.ts +2 -0
  108. package/getThemeValue/index.js +4 -0
  109. package/getThemeValue/package.json +6 -0
  110. package/index.d.ts +22 -83
  111. package/index.js +61 -579
  112. package/legacy/{borders.js → borders/borders.js} +5 -5
  113. package/legacy/borders/index.js +4 -0
  114. package/legacy/{breakpoints.js → breakpoints/breakpoints.js} +1 -1
  115. package/legacy/breakpoints/index.js +4 -0
  116. package/legacy/{colorManipulator.js → colorManipulator/colorManipulator.js} +1 -1
  117. package/legacy/colorManipulator/index.js +3 -0
  118. package/legacy/{compose.js → compose/compose.js} +1 -1
  119. package/legacy/compose/index.js +3 -0
  120. package/legacy/{createBox.js → createBox/createBox.js} +2 -2
  121. package/legacy/createBox/index.js +3 -0
  122. package/legacy/{createStyled.js → createStyled/createStyled.js} +2 -2
  123. package/legacy/createStyled/index.js +4 -0
  124. package/legacy/{cssGrid.js → cssGrid/cssGrid.js} +5 -5
  125. package/legacy/cssGrid/index.js +4 -0
  126. package/legacy/cssVars/createCssVarsProvider.js +33 -62
  127. package/legacy/cssVars/createCssVarsTheme.js +7 -7
  128. package/legacy/cssVars/prepareCssVars.js +45 -25
  129. package/legacy/{display.js → display/display.js} +2 -2
  130. package/legacy/display/index.js +4 -0
  131. package/legacy/{flexbox.js → flexbox/flexbox.js} +2 -2
  132. package/legacy/flexbox/index.js +4 -0
  133. package/legacy/{getThemeValue.js → getThemeValue/getThemeValue.js} +10 -10
  134. package/legacy/getThemeValue/index.js +4 -0
  135. package/legacy/index.js +1 -1
  136. package/legacy/memoize/index.js +3 -0
  137. package/legacy/merge/index.js +3 -0
  138. package/legacy/palette/index.js +4 -0
  139. package/legacy/{palette.js → palette/palette.js} +2 -2
  140. package/legacy/positions/index.js +4 -0
  141. package/legacy/{positions.js → positions/positions.js} +2 -2
  142. package/legacy/propsToClassKey/index.js +3 -0
  143. package/legacy/responsivePropType/index.js +3 -0
  144. package/legacy/shadows/index.js +3 -0
  145. package/legacy/{shadows.js → shadows/shadows.js} +1 -1
  146. package/legacy/sizing/index.js +4 -0
  147. package/legacy/{sizing.js → sizing/sizing.js} +3 -3
  148. package/legacy/spacing/index.js +4 -0
  149. package/legacy/{spacing.js → spacing/spacing.js} +5 -5
  150. package/legacy/style/index.js +4 -0
  151. package/legacy/{style.js → style/style.js} +2 -2
  152. package/legacy/styled/index.js +3 -0
  153. package/legacy/styled/styled.js +3 -0
  154. package/legacy/typography/index.js +4 -0
  155. package/legacy/{typography.js → typography/typography.js} +2 -2
  156. package/legacy/useTheme/index.js +4 -0
  157. package/legacy/{useTheme.js → useTheme/useTheme.js} +2 -2
  158. package/legacy/useThemeWithoutDefault/index.js +3 -0
  159. package/memoize/index.d.ts +1 -0
  160. package/memoize/index.js +3 -0
  161. package/memoize/memoize.d.ts +3 -0
  162. package/memoize/package.json +6 -0
  163. package/merge/index.d.ts +1 -0
  164. package/merge/index.js +3 -0
  165. package/merge/package.json +6 -0
  166. package/modern/{borders.js → borders/borders.js} +5 -5
  167. package/modern/borders/index.js +4 -0
  168. package/{esm → modern/breakpoints}/breakpoints.js +2 -3
  169. package/modern/breakpoints/index.js +4 -0
  170. package/modern/{colorManipulator.js → colorManipulator/colorManipulator.js} +1 -1
  171. package/modern/colorManipulator/index.js +3 -0
  172. package/{esm → modern/compose}/compose.js +1 -1
  173. package/modern/compose/index.js +3 -0
  174. package/{esm → modern/createBox}/createBox.js +2 -2
  175. package/modern/createBox/index.js +3 -0
  176. package/{esm → modern/createStyled}/createStyled.js +5 -6
  177. package/modern/createStyled/index.js +4 -0
  178. package/modern/{cssGrid.js → cssGrid/cssGrid.js} +5 -5
  179. package/modern/cssGrid/index.js +4 -0
  180. package/modern/cssVars/createCssVarsProvider.js +26 -60
  181. package/modern/cssVars/createCssVarsTheme.js +7 -10
  182. package/modern/cssVars/prepareCssVars.js +49 -21
  183. package/modern/{display.js → display/display.js} +2 -2
  184. package/modern/display/index.js +4 -0
  185. package/{esm → modern/flexbox}/flexbox.js +2 -2
  186. package/modern/flexbox/index.js +4 -0
  187. package/modern/{getThemeValue.js → getThemeValue/getThemeValue.js} +10 -10
  188. package/modern/getThemeValue/index.js +4 -0
  189. package/modern/index.js +1 -1
  190. package/modern/memoize/index.js +3 -0
  191. package/modern/merge/index.js +3 -0
  192. package/modern/palette/index.js +4 -0
  193. package/{esm → modern/palette}/palette.js +2 -2
  194. package/modern/positions/index.js +4 -0
  195. package/modern/{positions.js → positions/positions.js} +2 -2
  196. package/modern/propsToClassKey/index.js +3 -0
  197. package/modern/responsivePropType/index.js +3 -0
  198. package/modern/shadows/index.js +3 -0
  199. package/{esm → modern/shadows}/shadows.js +1 -1
  200. package/modern/sizing/index.js +4 -0
  201. package/modern/{sizing.js → sizing/sizing.js} +3 -3
  202. package/modern/spacing/index.js +4 -0
  203. package/modern/{spacing.js → spacing/spacing.js} +5 -5
  204. package/modern/style/index.js +4 -0
  205. package/modern/{style.js → style/style.js} +2 -2
  206. package/modern/styled/index.js +3 -0
  207. package/modern/styled/styled.js +3 -0
  208. package/modern/typography/index.js +4 -0
  209. package/modern/{typography.js → typography/typography.js} +2 -2
  210. package/modern/useTheme/index.js +4 -0
  211. package/{esm → modern/useTheme}/useTheme.js +2 -2
  212. package/modern/useThemeWithoutDefault/index.js +3 -0
  213. package/node/Box/Box.js +36 -0
  214. package/node/Box/boxClasses.js +10 -0
  215. package/node/Box/index.js +37 -0
  216. package/{esm → node}/Container/Container.js +17 -12
  217. package/node/Container/ContainerProps.js +5 -0
  218. package/node/Container/containerClasses.js +15 -0
  219. package/node/Container/createContainer.js +152 -0
  220. package/node/Container/index.js +37 -0
  221. package/node/GlobalStyles/GlobalStyles.js +45 -0
  222. package/node/GlobalStyles/index.js +27 -0
  223. package/node/RtlProvider/index.js +35 -0
  224. package/{esm → node}/Stack/Stack.js +17 -11
  225. package/node/Stack/StackProps.js +5 -0
  226. package/node/Stack/createStack.js +184 -0
  227. package/node/Stack/index.js +57 -0
  228. package/node/Stack/stackClasses.js +15 -0
  229. package/{esm → node}/ThemeProvider/ThemeProvider.js +30 -22
  230. package/node/ThemeProvider/index.js +14 -0
  231. package/{esm → node}/Unstable_Grid/Grid.js +31 -25
  232. package/node/Unstable_Grid/GridProps.js +5 -0
  233. package/node/Unstable_Grid/createGrid.js +180 -0
  234. package/{esm → node}/Unstable_Grid/gridClasses.js +14 -6
  235. package/{esm → node}/Unstable_Grid/gridGenerator.js +39 -22
  236. package/node/Unstable_Grid/index.js +65 -0
  237. package/{esm → node}/Unstable_Grid/traverseBreakpoints.js +11 -3
  238. package/{borders.js → node/borders/borders.js} +5 -5
  239. package/node/borders/index.js +27 -0
  240. package/{breakpoints.js → node/breakpoints/breakpoints.js} +1 -1
  241. package/node/breakpoints/index.js +27 -0
  242. package/{colorManipulator.js → node/colorManipulator/colorManipulator.js} +1 -1
  243. package/node/colorManipulator/index.js +17 -0
  244. package/{compose.js → node/compose/compose.js} +1 -1
  245. package/node/compose/index.js +14 -0
  246. package/{createBox.js → node/createBox/createBox.js} +3 -3
  247. package/node/createBox/index.js +14 -0
  248. package/{createStyled.js → node/createStyled/createStyled.js} +3 -3
  249. package/node/createStyled/index.js +27 -0
  250. package/{esm → node}/createTheme/applyStyles.js +7 -1
  251. package/{esm → node}/createTheme/createBreakpoints.js +15 -7
  252. package/{esm → node}/createTheme/createSpacing.js +8 -3
  253. package/node/createTheme/createTheme.js +50 -0
  254. package/node/createTheme/index.js +27 -0
  255. package/node/createTheme/shape.js +10 -0
  256. package/{cssGrid.js → node/cssGrid/cssGrid.js} +5 -5
  257. package/node/cssGrid/index.js +27 -0
  258. package/{esm → node}/cssVars/createCssVarsProvider.js +76 -99
  259. package/node/cssVars/createCssVarsTheme.js +20 -0
  260. package/{esm → node}/cssVars/createGetCssVar.js +7 -1
  261. package/{esm → node}/cssVars/cssVarsParser.js +13 -3
  262. package/node/cssVars/getInitColorSchemeScript.js +53 -0
  263. package/node/cssVars/index.js +35 -0
  264. package/node/cssVars/prepareCssVars.js +106 -0
  265. package/{esm → node}/cssVars/useCurrentColorScheme.js +24 -14
  266. package/{display.js → node/display/display.js} +2 -2
  267. package/node/display/index.js +27 -0
  268. package/{flexbox.js → node/flexbox/flexbox.js} +2 -2
  269. package/node/flexbox/index.js +27 -0
  270. package/{getThemeValue.js → node/getThemeValue/getThemeValue.js} +10 -10
  271. package/node/getThemeValue/index.js +27 -0
  272. package/node/index.js +590 -0
  273. package/node/memoize/index.js +14 -0
  274. package/node/merge/index.js +14 -0
  275. package/node/palette/index.js +27 -0
  276. package/{palette.js → node/palette/palette.js} +2 -2
  277. package/node/positions/index.js +27 -0
  278. package/{positions.js → node/positions/positions.js} +2 -2
  279. package/node/propsToClassKey/index.js +14 -0
  280. package/node/responsivePropType/index.js +14 -0
  281. package/node/shadows/index.js +14 -0
  282. package/{shadows.js → node/shadows/shadows.js} +1 -1
  283. package/node/sizing/index.js +27 -0
  284. package/{sizing.js → node/sizing/sizing.js} +3 -3
  285. package/node/spacing/index.js +27 -0
  286. package/{spacing.js → node/spacing/spacing.js} +5 -5
  287. package/node/style/index.js +27 -0
  288. package/{style.js → node/style/style.js} +2 -2
  289. package/{esm → node}/styleFunctionSx/defaultSxConfig.js +71 -65
  290. package/node/styleFunctionSx/extendSxProp.js +55 -0
  291. package/node/styleFunctionSx/index.js +35 -0
  292. package/{esm → node}/styleFunctionSx/styleFunctionSx.js +26 -18
  293. package/node/styled/index.js +14 -0
  294. package/{styled.js → node/styled/styled.js} +1 -1
  295. package/node/typography/index.js +27 -0
  296. package/{typography.js → node/typography/typography.js} +2 -2
  297. package/node/useMediaQuery/index.js +26 -0
  298. package/{esm → node}/useMediaQuery/useMediaQuery.js +16 -9
  299. package/node/useTheme/index.js +27 -0
  300. package/{useTheme.js → node/useTheme/useTheme.js} +2 -2
  301. package/node/useThemeProps/getThemeProps.js +19 -0
  302. package/node/useThemeProps/index.js +21 -0
  303. package/node/useThemeProps/useThemeProps.js +27 -0
  304. package/node/useThemeWithoutDefault/index.js +14 -0
  305. package/{useThemeWithoutDefault.js → node/useThemeWithoutDefault/useThemeWithoutDefault.js} +1 -1
  306. package/package.json +5 -5
  307. package/palette/index.d.ts +2 -0
  308. package/palette/index.js +4 -0
  309. package/palette/package.json +6 -0
  310. package/palette/palette.d.ts +5 -0
  311. package/{modern → palette}/palette.js +2 -2
  312. package/positions/index.d.ts +2 -0
  313. package/positions/index.js +4 -0
  314. package/positions/package.json +6 -0
  315. package/positions/positions.d.ts +3 -0
  316. package/{esm → positions}/positions.js +2 -2
  317. package/propsToClassKey/index.d.ts +1 -0
  318. package/propsToClassKey/index.js +3 -0
  319. package/propsToClassKey/package.json +6 -0
  320. package/responsivePropType/index.d.ts +1 -0
  321. package/responsivePropType/index.js +3 -0
  322. package/responsivePropType/package.json +6 -0
  323. package/shadows/index.d.ts +1 -0
  324. package/shadows/index.js +3 -0
  325. package/shadows/package.json +6 -0
  326. package/shadows/shadows.d.ts +3 -0
  327. package/{modern → shadows}/shadows.js +1 -1
  328. package/sizing/index.d.ts +2 -0
  329. package/sizing/index.js +4 -0
  330. package/sizing/package.json +6 -0
  331. package/sizing/sizing.d.ts +12 -0
  332. package/{esm → sizing}/sizing.js +5 -6
  333. package/spacing/index.d.ts +2 -0
  334. package/spacing/index.js +4 -0
  335. package/spacing/package.json +6 -0
  336. package/{spacing.d.ts → spacing/spacing.d.ts} +1 -1
  337. package/{esm → spacing}/spacing.js +6 -7
  338. package/style/index.d.ts +2 -0
  339. package/style/index.js +4 -0
  340. package/style/package.json +6 -0
  341. package/{style.d.ts → style/style.d.ts} +1 -1
  342. package/{esm → style}/style.js +2 -2
  343. package/styleFunctionSx/defaultSxConfig.js +65 -71
  344. package/styleFunctionSx/extendSxProp.js +11 -19
  345. package/styleFunctionSx/index.js +4 -35
  346. package/styleFunctionSx/package.json +2 -2
  347. package/styleFunctionSx/styleFunctionSx.js +18 -27
  348. package/styled/index.d.ts +1 -0
  349. package/styled/index.js +3 -0
  350. package/styled/package.json +6 -0
  351. package/{styled.d.ts → styled/styled.d.ts} +1 -1
  352. package/styled/styled.js +3 -0
  353. package/typography/index.d.ts +2 -0
  354. package/typography/index.js +4 -0
  355. package/typography/package.json +6 -0
  356. package/typography/typography.d.ts +12 -0
  357. package/{esm → typography}/typography.js +2 -2
  358. package/useMediaQuery/index.js +2 -26
  359. package/useMediaQuery/package.json +2 -2
  360. package/useMediaQuery/useMediaQuery.js +9 -16
  361. package/useTheme/index.d.ts +2 -0
  362. package/useTheme/index.js +4 -0
  363. package/useTheme/package.json +6 -0
  364. package/{useTheme.d.ts → useTheme/useTheme.d.ts} +1 -1
  365. package/{modern → useTheme}/useTheme.js +2 -2
  366. package/useThemeProps/getThemeProps.js +3 -10
  367. package/useThemeProps/index.js +2 -19
  368. package/useThemeProps/package.json +2 -2
  369. package/useThemeProps/useThemeProps.js +5 -11
  370. package/useThemeWithoutDefault/index.d.ts +1 -0
  371. package/useThemeWithoutDefault/index.js +3 -0
  372. package/useThemeWithoutDefault/package.json +6 -0
  373. package/esm/Box/Box.js +0 -30
  374. package/esm/Box/boxClasses.js +0 -3
  375. package/esm/Box/index.js +0 -5
  376. package/esm/Container/ContainerProps.js +0 -1
  377. package/esm/Container/containerClasses.js +0 -7
  378. package/esm/Container/createContainer.js +0 -143
  379. package/esm/Container/index.js +0 -5
  380. package/esm/GlobalStyles/GlobalStyles.js +0 -37
  381. package/esm/GlobalStyles/index.js +0 -4
  382. package/esm/RtlProvider/index.js +0 -25
  383. package/esm/Stack/StackProps.js +0 -1
  384. package/esm/Stack/createStack.js +0 -173
  385. package/esm/Stack/index.js +0 -7
  386. package/esm/Stack/stackClasses.js +0 -7
  387. package/esm/ThemeProvider/index.js +0 -3
  388. package/esm/Unstable_Grid/GridProps.js +0 -1
  389. package/esm/Unstable_Grid/createGrid.js +0 -171
  390. package/esm/Unstable_Grid/index.js +0 -8
  391. package/esm/createTheme/createTheme.js +0 -43
  392. package/esm/createTheme/index.js +0 -3
  393. package/esm/createTheme/shape.js +0 -4
  394. package/esm/cssVars/createCssVarsTheme.js +0 -16
  395. package/esm/cssVars/getInitColorSchemeScript.js +0 -44
  396. package/esm/cssVars/index.js +0 -6
  397. package/esm/cssVars/prepareCssVars.js +0 -73
  398. package/esm/index.js +0 -65
  399. package/esm/styleFunctionSx/extendSxProp.js +0 -48
  400. package/esm/styleFunctionSx/index.js +0 -4
  401. package/esm/styled.js +0 -3
  402. package/esm/useMediaQuery/index.js +0 -2
  403. package/esm/useThemeProps/getThemeProps.js +0 -12
  404. package/esm/useThemeProps/index.js +0 -4
  405. package/esm/useThemeProps/useThemeProps.js +0 -21
  406. package/legacy/styled.js +0 -3
  407. package/modern/styled.js +0 -3
  408. /package/{colorManipulator.d.ts → colorManipulator/colorManipulator.d.ts} +0 -0
  409. /package/legacy/{memoize.js → memoize/memoize.js} +0 -0
  410. /package/{esm → legacy/merge}/merge.js +0 -0
  411. /package/legacy/{propsToClassKey.js → propsToClassKey/propsToClassKey.js} +0 -0
  412. /package/legacy/{responsivePropType.js → responsivePropType/responsivePropType.js} +0 -0
  413. /package/legacy/{useThemeWithoutDefault.js → useThemeWithoutDefault/useThemeWithoutDefault.js} +0 -0
  414. /package/{esm → memoize}/memoize.js +0 -0
  415. /package/{merge.d.ts → merge/merge.d.ts} +0 -0
  416. /package/{legacy → merge}/merge.js +0 -0
  417. /package/modern/{memoize.js → memoize/memoize.js} +0 -0
  418. /package/modern/{merge.js → merge/merge.js} +0 -0
  419. /package/{esm → modern/propsToClassKey}/propsToClassKey.js +0 -0
  420. /package/{esm → modern/responsivePropType}/responsivePropType.js +0 -0
  421. /package/{esm → modern/useThemeWithoutDefault}/useThemeWithoutDefault.js +0 -0
  422. /package/{memoize.js → node/memoize/memoize.js} +0 -0
  423. /package/{merge.js → node/merge/merge.js} +0 -0
  424. /package/{propsToClassKey.js → node/propsToClassKey/propsToClassKey.js} +0 -0
  425. /package/{responsivePropType.js → node/responsivePropType/responsivePropType.js} +0 -0
  426. /package/{propsToClassKey.d.ts → propsToClassKey/propsToClassKey.d.ts} +0 -0
  427. /package/{modern → propsToClassKey}/propsToClassKey.js +0 -0
  428. /package/{responsivePropType.d.ts → responsivePropType/responsivePropType.d.ts} +0 -0
  429. /package/{modern → responsivePropType}/responsivePropType.js +0 -0
  430. /package/{useThemeWithoutDefault.d.ts → useThemeWithoutDefault/useThemeWithoutDefault.d.ts} +0 -0
  431. /package/{modern → useThemeWithoutDefault}/useThemeWithoutDefault.js +0 -0
@@ -1,173 +0,0 @@
1
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2
- import _extends from "@babel/runtime/helpers/esm/extends";
3
- const _excluded = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
4
- import * as React from 'react';
5
- import PropTypes from 'prop-types';
6
- import clsx from 'clsx';
7
- import deepmerge from '@mui/utils/deepmerge';
8
- import generateUtilityClass from '@mui/utils/generateUtilityClass';
9
- import composeClasses from '@mui/utils/composeClasses';
10
- import systemStyled from '../styled';
11
- import useThemePropsSystem from '../useThemeProps';
12
- import { extendSxProp } from '../styleFunctionSx';
13
- import createTheme from '../createTheme';
14
- import { handleBreakpoints, mergeBreakpointsInOrder, resolveBreakpointValues } from '../breakpoints';
15
- import { createUnarySpacing, getValue } from '../spacing';
16
- import { jsx as _jsx } from "react/jsx-runtime";
17
- const defaultTheme = createTheme();
18
- // widening Theme to any so that the consumer can own the theme structure.
19
- const defaultCreateStyledComponent = systemStyled('div', {
20
- name: 'MuiStack',
21
- slot: 'Root',
22
- overridesResolver: (props, styles) => styles.root
23
- });
24
- function useThemePropsDefault(props) {
25
- return useThemePropsSystem({
26
- props,
27
- name: 'MuiStack',
28
- defaultTheme
29
- });
30
- }
31
-
32
- /**
33
- * Return an array with the separator React element interspersed between
34
- * each React node of the input children.
35
- *
36
- * > joinChildren([1,2,3], 0)
37
- * [1,0,2,0,3]
38
- */
39
- function joinChildren(children, separator) {
40
- const childrenArray = React.Children.toArray(children).filter(Boolean);
41
- return childrenArray.reduce((output, child, index) => {
42
- output.push(child);
43
- if (index < childrenArray.length - 1) {
44
- output.push( /*#__PURE__*/React.cloneElement(separator, {
45
- key: `separator-${index}`
46
- }));
47
- }
48
- return output;
49
- }, []);
50
- }
51
- const getSideFromDirection = direction => {
52
- return {
53
- row: 'Left',
54
- 'row-reverse': 'Right',
55
- column: 'Top',
56
- 'column-reverse': 'Bottom'
57
- }[direction];
58
- };
59
- export const style = ({
60
- ownerState,
61
- theme
62
- }) => {
63
- let styles = _extends({
64
- display: 'flex',
65
- flexDirection: 'column'
66
- }, handleBreakpoints({
67
- theme
68
- }, resolveBreakpointValues({
69
- values: ownerState.direction,
70
- breakpoints: theme.breakpoints.values
71
- }), propValue => ({
72
- flexDirection: propValue
73
- })));
74
- if (ownerState.spacing) {
75
- const transformer = createUnarySpacing(theme);
76
- const base = Object.keys(theme.breakpoints.values).reduce((acc, breakpoint) => {
77
- if (typeof ownerState.spacing === 'object' && ownerState.spacing[breakpoint] != null || typeof ownerState.direction === 'object' && ownerState.direction[breakpoint] != null) {
78
- acc[breakpoint] = true;
79
- }
80
- return acc;
81
- }, {});
82
- const directionValues = resolveBreakpointValues({
83
- values: ownerState.direction,
84
- base
85
- });
86
- const spacingValues = resolveBreakpointValues({
87
- values: ownerState.spacing,
88
- base
89
- });
90
- if (typeof directionValues === 'object') {
91
- Object.keys(directionValues).forEach((breakpoint, index, breakpoints) => {
92
- const directionValue = directionValues[breakpoint];
93
- if (!directionValue) {
94
- const previousDirectionValue = index > 0 ? directionValues[breakpoints[index - 1]] : 'column';
95
- directionValues[breakpoint] = previousDirectionValue;
96
- }
97
- });
98
- }
99
- const styleFromPropValue = (propValue, breakpoint) => {
100
- if (ownerState.useFlexGap) {
101
- return {
102
- gap: getValue(transformer, propValue)
103
- };
104
- }
105
- return {
106
- // The useFlexGap={false} implement relies on each child to give up control of the margin.
107
- // We need to reset the margin to avoid double spacing.
108
- '& > :not(style):not(style)': {
109
- margin: 0
110
- },
111
- '& > :not(style) ~ :not(style)': {
112
- [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)
113
- }
114
- };
115
- };
116
- styles = deepmerge(styles, handleBreakpoints({
117
- theme
118
- }, spacingValues, styleFromPropValue));
119
- }
120
- styles = mergeBreakpointsInOrder(theme.breakpoints, styles);
121
- return styles;
122
- };
123
- export default function createStack(options = {}) {
124
- const {
125
- // This will allow adding custom styled fn (for example for custom sx style function)
126
- createStyledComponent = defaultCreateStyledComponent,
127
- useThemeProps = useThemePropsDefault,
128
- componentName = 'MuiStack'
129
- } = options;
130
- const useUtilityClasses = () => {
131
- const slots = {
132
- root: ['root']
133
- };
134
- return composeClasses(slots, slot => generateUtilityClass(componentName, slot), {});
135
- };
136
- const StackRoot = createStyledComponent(style);
137
- const Stack = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
138
- const themeProps = useThemeProps(inProps);
139
- const props = extendSxProp(themeProps); // `color` type conflicts with html color attribute.
140
- const {
141
- component = 'div',
142
- direction = 'column',
143
- spacing = 0,
144
- divider,
145
- children,
146
- className,
147
- useFlexGap = false
148
- } = props,
149
- other = _objectWithoutPropertiesLoose(props, _excluded);
150
- const ownerState = {
151
- direction,
152
- spacing,
153
- useFlexGap
154
- };
155
- const classes = useUtilityClasses();
156
- return /*#__PURE__*/_jsx(StackRoot, _extends({
157
- as: component,
158
- ownerState: ownerState,
159
- ref: ref,
160
- className: clsx(classes.root, className)
161
- }, other, {
162
- children: divider ? joinChildren(children, divider) : children
163
- }));
164
- });
165
- process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ = {
166
- children: PropTypes.node,
167
- direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
168
- divider: PropTypes.node,
169
- spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
170
- sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
171
- } : void 0;
172
- return Stack;
173
- }
@@ -1,7 +0,0 @@
1
- 'use client';
2
-
3
- export { default } from './Stack';
4
- export { default as createStack } from './createStack';
5
- export * from './StackProps';
6
- export { default as stackClasses } from './stackClasses';
7
- export * from './stackClasses';
@@ -1,7 +0,0 @@
1
- import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
2
- import generateUtilityClass from '@mui/utils/generateUtilityClass';
3
- export function getStackUtilityClass(slot) {
4
- return generateUtilityClass('MuiStack', slot);
5
- }
6
- const stackClasses = generateUtilityClasses('MuiStack', ['root']);
7
- export default stackClasses;
@@ -1,3 +0,0 @@
1
- 'use client';
2
-
3
- export { default } from './ThemeProvider';
@@ -1 +0,0 @@
1
- export {};
@@ -1,171 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
- const _excluded = ["className", "children", "columns", "container", "component", "direction", "wrap", "spacing", "rowSpacing", "columnSpacing", "disableEqualOverflow", "unstable_level"];
4
- import * as React from 'react';
5
- import PropTypes from 'prop-types';
6
- import clsx from 'clsx';
7
- import isMuiElement from '@mui/utils/isMuiElement';
8
- import generateUtilityClass from '@mui/utils/generateUtilityClass';
9
- import composeClasses from '@mui/utils/composeClasses';
10
- import systemStyled from '../styled';
11
- import useThemePropsSystem from '../useThemeProps';
12
- import useTheme from '../useTheme';
13
- import { extendSxProp } from '../styleFunctionSx';
14
- import createTheme from '../createTheme';
15
- import { generateGridStyles, generateGridSizeStyles, generateGridColumnsStyles, generateGridColumnSpacingStyles, generateGridRowSpacingStyles, generateGridDirectionStyles, generateGridOffsetStyles, generateSizeClassNames, generateSpacingClassNames, generateDirectionClasses } from './gridGenerator';
16
- import { jsx as _jsx } from "react/jsx-runtime";
17
- const defaultTheme = createTheme();
18
-
19
- // widening Theme to any so that the consumer can own the theme structure.
20
- const defaultCreateStyledComponent = systemStyled('div', {
21
- name: 'MuiGrid',
22
- slot: 'Root',
23
- overridesResolver: (props, styles) => styles.root
24
- });
25
- function useThemePropsDefault(props) {
26
- return useThemePropsSystem({
27
- props,
28
- name: 'MuiGrid',
29
- defaultTheme
30
- });
31
- }
32
- export default function createGrid(options = {}) {
33
- const {
34
- // This will allow adding custom styled fn (for example for custom sx style function)
35
- createStyledComponent = defaultCreateStyledComponent,
36
- useThemeProps = useThemePropsDefault,
37
- componentName = 'MuiGrid'
38
- } = options;
39
- const GridOverflowContext = /*#__PURE__*/React.createContext(undefined);
40
- if (process.env.NODE_ENV !== 'production') {
41
- GridOverflowContext.displayName = 'GridOverflowContext';
42
- }
43
- const useUtilityClasses = (ownerState, theme) => {
44
- const {
45
- container,
46
- direction,
47
- spacing,
48
- wrap,
49
- gridSize
50
- } = ownerState;
51
- const slots = {
52
- root: ['root', container && 'container', wrap !== 'wrap' && `wrap-xs-${String(wrap)}`, ...generateDirectionClasses(direction), ...generateSizeClassNames(gridSize), ...(container ? generateSpacingClassNames(spacing, theme.breakpoints.keys[0]) : [])]
53
- };
54
- return composeClasses(slots, slot => generateUtilityClass(componentName, slot), {});
55
- };
56
- const GridRoot = createStyledComponent(generateGridColumnsStyles, generateGridColumnSpacingStyles, generateGridRowSpacingStyles, generateGridSizeStyles, generateGridDirectionStyles, generateGridStyles, generateGridOffsetStyles);
57
- const Grid = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
58
- var _inProps$columns, _inProps$spacing, _ref, _inProps$rowSpacing, _ref2, _inProps$columnSpacin, _ref3, _disableEqualOverflow;
59
- const theme = useTheme();
60
- const themeProps = useThemeProps(inProps);
61
- const props = extendSxProp(themeProps); // `color` type conflicts with html color attribute.
62
- const overflow = React.useContext(GridOverflowContext);
63
- const {
64
- className,
65
- children,
66
- columns: columnsProp = 12,
67
- container = false,
68
- component = 'div',
69
- direction = 'row',
70
- wrap = 'wrap',
71
- spacing: spacingProp = 0,
72
- rowSpacing: rowSpacingProp = spacingProp,
73
- columnSpacing: columnSpacingProp = spacingProp,
74
- disableEqualOverflow: themeDisableEqualOverflow,
75
- unstable_level: level = 0
76
- } = props,
77
- rest = _objectWithoutPropertiesLoose(props, _excluded);
78
- // Because `disableEqualOverflow` can be set from the theme's defaultProps, the **nested** grid should look at the instance props instead.
79
- let disableEqualOverflow = themeDisableEqualOverflow;
80
- if (level && themeDisableEqualOverflow !== undefined) {
81
- disableEqualOverflow = inProps.disableEqualOverflow;
82
- }
83
- // collect breakpoints related props because they can be customized from the theme.
84
- const gridSize = {};
85
- const gridOffset = {};
86
- const other = {};
87
- Object.entries(rest).forEach(([key, val]) => {
88
- if (theme.breakpoints.values[key] !== undefined) {
89
- gridSize[key] = val;
90
- } else if (theme.breakpoints.values[key.replace('Offset', '')] !== undefined) {
91
- gridOffset[key.replace('Offset', '')] = val;
92
- } else {
93
- other[key] = val;
94
- }
95
- });
96
- const columns = (_inProps$columns = inProps.columns) != null ? _inProps$columns : level ? undefined : columnsProp;
97
- const spacing = (_inProps$spacing = inProps.spacing) != null ? _inProps$spacing : level ? undefined : spacingProp;
98
- const rowSpacing = (_ref = (_inProps$rowSpacing = inProps.rowSpacing) != null ? _inProps$rowSpacing : inProps.spacing) != null ? _ref : level ? undefined : rowSpacingProp;
99
- const columnSpacing = (_ref2 = (_inProps$columnSpacin = inProps.columnSpacing) != null ? _inProps$columnSpacin : inProps.spacing) != null ? _ref2 : level ? undefined : columnSpacingProp;
100
- const ownerState = _extends({}, props, {
101
- level,
102
- columns,
103
- container,
104
- direction,
105
- wrap,
106
- spacing,
107
- rowSpacing,
108
- columnSpacing,
109
- gridSize,
110
- gridOffset,
111
- disableEqualOverflow: (_ref3 = (_disableEqualOverflow = disableEqualOverflow) != null ? _disableEqualOverflow : overflow) != null ? _ref3 : false,
112
- // use context value if exists.
113
- parentDisableEqualOverflow: overflow // for nested grid
114
- });
115
- const classes = useUtilityClasses(ownerState, theme);
116
- let result = /*#__PURE__*/_jsx(GridRoot, _extends({
117
- ref: ref,
118
- as: component,
119
- ownerState: ownerState,
120
- className: clsx(classes.root, className)
121
- }, other, {
122
- children: React.Children.map(children, child => {
123
- if ( /*#__PURE__*/React.isValidElement(child) && isMuiElement(child, ['Grid'])) {
124
- var _child$props$unstable;
125
- return /*#__PURE__*/React.cloneElement(child, {
126
- unstable_level: (_child$props$unstable = child.props.unstable_level) != null ? _child$props$unstable : level + 1
127
- });
128
- }
129
- return child;
130
- })
131
- }));
132
- if (disableEqualOverflow !== undefined && disableEqualOverflow !== (overflow != null ? overflow : false)) {
133
- // There are 2 possibilities that should wrap with the GridOverflowContext to communicate with the nested grids:
134
- // 1. It is the root grid with `disableEqualOverflow`.
135
- // 2. It is a nested grid with different `disableEqualOverflow` from the context.
136
- result = /*#__PURE__*/_jsx(GridOverflowContext.Provider, {
137
- value: disableEqualOverflow,
138
- children: result
139
- });
140
- }
141
- return result;
142
- });
143
- process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ = {
144
- children: PropTypes.node,
145
- className: PropTypes.string,
146
- columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
147
- columnSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
148
- component: PropTypes.elementType,
149
- container: PropTypes.bool,
150
- direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
151
- disableEqualOverflow: PropTypes.bool,
152
- lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
153
- lgOffset: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
154
- md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
155
- mdOffset: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
156
- rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
157
- sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
158
- smOffset: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
159
- spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
160
- sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
161
- wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
162
- xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
163
- xlOffset: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
164
- xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
165
- xsOffset: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
166
- } : void 0;
167
-
168
- // @ts-ignore internal logic for nested grid
169
- Grid.muiName = 'Grid';
170
- return Grid;
171
- }
@@ -1,8 +0,0 @@
1
- 'use client';
2
-
3
- export { default } from './Grid';
4
- export { default as createGrid } from './createGrid';
5
- export * from './GridProps';
6
- export { default as gridClasses } from './gridClasses';
7
- export * from './gridClasses';
8
- export { traverseBreakpoints as unstable_traverseBreakpoints } from './traverseBreakpoints';
@@ -1,43 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
- const _excluded = ["breakpoints", "palette", "spacing", "shape"];
4
- import deepmerge from '@mui/utils/deepmerge';
5
- import createBreakpoints from './createBreakpoints';
6
- import shape from './shape';
7
- import createSpacing from './createSpacing';
8
- import styleFunctionSx from '../styleFunctionSx/styleFunctionSx';
9
- import defaultSxConfig from '../styleFunctionSx/defaultSxConfig';
10
- import applyStyles from './applyStyles';
11
- function createTheme(options = {}, ...args) {
12
- const {
13
- breakpoints: breakpointsInput = {},
14
- palette: paletteInput = {},
15
- spacing: spacingInput,
16
- shape: shapeInput = {}
17
- } = options,
18
- other = _objectWithoutPropertiesLoose(options, _excluded);
19
- const breakpoints = createBreakpoints(breakpointsInput);
20
- const spacing = createSpacing(spacingInput);
21
- let muiTheme = deepmerge({
22
- breakpoints,
23
- direction: 'ltr',
24
- components: {},
25
- // Inject component definitions.
26
- palette: _extends({
27
- mode: 'light'
28
- }, paletteInput),
29
- spacing,
30
- shape: _extends({}, shape, shapeInput)
31
- }, other);
32
- muiTheme.applyStyles = applyStyles;
33
- muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);
34
- muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);
35
- muiTheme.unstable_sx = function sx(props) {
36
- return styleFunctionSx({
37
- sx: props,
38
- theme: this
39
- });
40
- };
41
- return muiTheme;
42
- }
43
- export default createTheme;
@@ -1,3 +0,0 @@
1
- export { default } from './createTheme';
2
- export { default as private_createBreakpoints } from './createBreakpoints';
3
- export { default as unstable_applyStyles } from './applyStyles';
@@ -1,4 +0,0 @@
1
- const shape = {
2
- borderRadius: 4
3
- };
4
- export default shape;
@@ -1,16 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
- const _excluded = ["cssVarPrefix", "shouldSkipGeneratingVar"];
4
- import prepareCssVars from './prepareCssVars';
5
- function createCssVarsTheme(theme) {
6
- const {
7
- cssVarPrefix,
8
- shouldSkipGeneratingVar
9
- } = theme,
10
- otherTheme = _objectWithoutPropertiesLoose(theme, _excluded);
11
- return _extends({}, theme, prepareCssVars(otherTheme, {
12
- prefix: cssVarPrefix,
13
- shouldSkipGeneratingVar
14
- }));
15
- }
16
- export default createCssVarsTheme;
@@ -1,44 +0,0 @@
1
- import * as React from 'react';
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- export const DEFAULT_MODE_STORAGE_KEY = 'mode';
4
- export const DEFAULT_COLOR_SCHEME_STORAGE_KEY = 'color-scheme';
5
- export const DEFAULT_ATTRIBUTE = 'data-color-scheme';
6
- export default function getInitColorSchemeScript(options) {
7
- const {
8
- defaultMode = 'light',
9
- defaultLightColorScheme = 'light',
10
- defaultDarkColorScheme = 'dark',
11
- modeStorageKey = DEFAULT_MODE_STORAGE_KEY,
12
- colorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
13
- attribute = DEFAULT_ATTRIBUTE,
14
- colorSchemeNode = 'document.documentElement'
15
- } = options || {};
16
- return /*#__PURE__*/_jsx("script", {
17
- // eslint-disable-next-line react/no-danger
18
- dangerouslySetInnerHTML: {
19
- __html: `(function() {
20
- try {
21
- var mode = localStorage.getItem('${modeStorageKey}') || '${defaultMode}';
22
- var colorScheme = '';
23
- if (mode === 'system') {
24
- // handle system mode
25
- var mql = window.matchMedia('(prefers-color-scheme: dark)');
26
- if (mql.matches) {
27
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
28
- } else {
29
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
30
- }
31
- }
32
- if (mode === 'light') {
33
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-light') || '${defaultLightColorScheme}';
34
- }
35
- if (mode === 'dark') {
36
- colorScheme = localStorage.getItem('${colorSchemeStorageKey}-dark') || '${defaultDarkColorScheme}';
37
- }
38
- if (colorScheme) {
39
- ${colorSchemeNode}.setAttribute('${attribute}', colorScheme);
40
- }
41
- } catch(e){}})();`
42
- }
43
- }, "mui-color-scheme-init");
44
- }
@@ -1,6 +0,0 @@
1
- 'use client';
2
-
3
- export { default } from './createCssVarsProvider';
4
- export { default as getInitColorSchemeScript } from './getInitColorSchemeScript';
5
- export { default as prepareCssVars } from './prepareCssVars';
6
- export { default as createCssVarsTheme } from './createCssVarsTheme';
@@ -1,73 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import _toPropertyKey from "@babel/runtime/helpers/esm/toPropertyKey";
3
- import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
4
- const _excluded = ["colorSchemes", "components", "defaultColorScheme"];
5
- import deepmerge from '@mui/utils/deepmerge';
6
- import cssVarsParser from './cssVarsParser';
7
- function prepareCssVars(theme, parserConfig) {
8
- // @ts-ignore - ignore components do not exist
9
- const {
10
- colorSchemes = {},
11
- defaultColorScheme = 'light'
12
- } = theme,
13
- otherTheme = _objectWithoutPropertiesLoose(theme, _excluded);
14
- const {
15
- vars: rootVars,
16
- css: rootCss,
17
- varsWithDefaults: rootVarsWithDefaults
18
- } = cssVarsParser(otherTheme, parserConfig);
19
- let themeVars = rootVarsWithDefaults;
20
- const colorSchemesMap = {};
21
- const {
22
- [defaultColorScheme]: light
23
- } = colorSchemes,
24
- otherColorSchemes = _objectWithoutPropertiesLoose(colorSchemes, [defaultColorScheme].map(_toPropertyKey));
25
- Object.entries(otherColorSchemes || {}).forEach(([key, scheme]) => {
26
- const {
27
- vars,
28
- css,
29
- varsWithDefaults
30
- } = cssVarsParser(scheme, parserConfig);
31
- themeVars = deepmerge(themeVars, varsWithDefaults);
32
- colorSchemesMap[key] = {
33
- css,
34
- vars
35
- };
36
- });
37
- if (light) {
38
- // default color scheme vars should be merged last to set as default
39
- const {
40
- css,
41
- vars,
42
- varsWithDefaults
43
- } = cssVarsParser(light, parserConfig);
44
- themeVars = deepmerge(themeVars, varsWithDefaults);
45
- colorSchemesMap[defaultColorScheme] = {
46
- css,
47
- vars
48
- };
49
- }
50
- const generateCssVars = colorScheme => {
51
- var _parserConfig$getSele2;
52
- if (!colorScheme) {
53
- var _parserConfig$getSele;
54
- const css = _extends({}, rootCss);
55
- return {
56
- css,
57
- vars: rootVars,
58
- selector: (parserConfig == null || (_parserConfig$getSele = parserConfig.getSelector) == null ? void 0 : _parserConfig$getSele.call(parserConfig, colorScheme, css)) || ':root'
59
- };
60
- }
61
- const css = _extends({}, colorSchemesMap[colorScheme].css);
62
- return {
63
- css,
64
- vars: colorSchemesMap[colorScheme].vars,
65
- selector: (parserConfig == null || (_parserConfig$getSele2 = parserConfig.getSelector) == null ? void 0 : _parserConfig$getSele2.call(parserConfig, colorScheme, css)) || ':root'
66
- };
67
- };
68
- return {
69
- vars: themeVars,
70
- generateCssVars
71
- };
72
- }
73
- export default prepareCssVars;
package/esm/index.js DELETED
@@ -1,65 +0,0 @@
1
- import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
2
- export { css, keyframes, StyledEngineProvider } from '@mui/styled-engine';
3
- export { default as GlobalStyles } from './GlobalStyles';
4
- export { default as borders } from './borders';
5
- export * from './borders';
6
- export { default as breakpoints } from './breakpoints';
7
- export { handleBreakpoints, mergeBreakpointsInOrder, resolveBreakpointValues as unstable_resolveBreakpointValues } from './breakpoints';
8
- export { default as compose } from './compose';
9
- export { default as display } from './display';
10
- export { default as flexbox } from './flexbox';
11
- export * from './flexbox';
12
- export { default as grid } from './cssGrid';
13
- export * from './cssGrid';
14
- export { default as palette } from './palette';
15
- export * from './palette';
16
- export { default as positions } from './positions';
17
- export * from './positions';
18
- export { default as shadows } from './shadows';
19
- export { default as sizing } from './sizing';
20
- export * from './sizing';
21
- export { default as spacing } from './spacing';
22
- export * from './spacing';
23
- export { default as style, getPath, getStyleValue } from './style';
24
- export { default as typography } from './typography';
25
- export * from './typography';
26
- export { default as unstable_styleFunctionSx, unstable_createStyleFunctionSx, extendSxProp as unstable_extendSxProp, unstable_defaultSxConfig } from './styleFunctionSx';
27
- // TODO: Remove this function in v6
28
- // eslint-disable-next-line @typescript-eslint/naming-convention
29
- export function experimental_sx() {
30
- throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`experimental_sx\` has been moved to \`theme.unstable_sx\`.For more details, see https://github.com/mui/material-ui/pull/35150.` : _formatMuiErrorMessage(20));
31
- }
32
- export { default as unstable_getThemeValue } from './getThemeValue';
33
- export { default as Box } from './Box';
34
- export { default as createBox } from './createBox';
35
- export { default as createStyled } from './createStyled';
36
- export * from './createStyled';
37
- export { default as styled } from './styled';
38
- export { default as createTheme } from './createTheme';
39
- export { default as createBreakpoints } from './createTheme/createBreakpoints';
40
- export { default as createSpacing } from './createTheme/createSpacing';
41
- export { default as shape } from './createTheme/shape';
42
- export { default as useThemeProps, getThemeProps } from './useThemeProps';
43
- export { default as useTheme } from './useTheme';
44
- export { default as useThemeWithoutDefault } from './useThemeWithoutDefault';
45
- export { default as useMediaQuery } from './useMediaQuery';
46
- export * from './colorManipulator';
47
- export { default as ThemeProvider } from './ThemeProvider';
48
- export { default as unstable_createCssVarsProvider } from './cssVars/createCssVarsProvider';
49
- export { default as unstable_createGetCssVar } from './cssVars/createGetCssVar';
50
- export { default as unstable_cssVarsParser } from './cssVars/cssVarsParser';
51
- export { default as unstable_prepareCssVars } from './cssVars/prepareCssVars';
52
- export { default as unstable_createCssVarsTheme } from './cssVars/createCssVarsTheme';
53
- export { default as responsivePropType } from './responsivePropType';
54
- export { default as RtlProvider } from './RtlProvider';
55
- export * from './RtlProvider';
56
-
57
- /** ----------------- */
58
- /** Layout components */
59
- export { default as createContainer } from './Container/createContainer';
60
- export { default as Container } from './Container';
61
- export * from './Container';
62
- export { default as Unstable_Grid } from './Unstable_Grid/Grid';
63
- export * from './Unstable_Grid';
64
- export { default as Stack } from './Stack/Stack';
65
- export * from './Stack';