Move exports to their own folders

packages/mui-system/src/borders.d.ts → packages/mui-system/src/borders/borders.d.ts

@@ -1,4 +1,4 @@
-import { PropsFor, SimpleStyleFunction, borders } from './Box';
+import { PropsFor, SimpleStyleFunction, borders } from '../Box';
 
 export const border: SimpleStyleFunction<'border'>;
 export const borderTop: SimpleStyleFunction<'borderTop'>;

packages/mui-system/src/borders.js → packages/mui-system/src/borders/borders.js

@@ -1,8 +1,8 @@
-import responsivePropType from './responsivePropType';
-import style from './style';
-import compose from './compose';
-import { createUnaryUnit, getValue } from './spacing';
-import { handleBreakpoints } from './breakpoints';
+import responsivePropType from '../responsivePropType';
+import style from '../style';
+import compose from '../compose';
+import { createUnaryUnit, getValue } from '../spacing';
+import { handleBreakpoints } from '../breakpoints';
 
 export function borderTransform(value) {
   if (typeof value !== 'number') {

packages/mui-system/src/borders/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './borders'
+export * from './borders'

packages/mui-system/src/breakpoints.d.ts → packages/mui-system/src/breakpoints/breakpoints.d.ts

@@ -1,8 +1,8 @@
 import { CSSObject } from '@mui/styled-engine';
-import { Breakpoints } from './createTheme/createBreakpoints';
-import type { Breakpoint } from './createTheme';
-import { ResponsiveStyleValue } from './styleFunctionSx';
-import { StyleFunction } from './Box';
+import { Breakpoints } from '../createTheme/createBreakpoints';
+import type { Breakpoint } from '../createTheme';
+import { ResponsiveStyleValue } from '../styleFunctionSx';
+import { StyleFunction } from '../Box';
 
 export interface ResolveBreakpointValuesOptions<T> {
   values: ResponsiveStyleValue<T>;

packages/mui-system/src/breakpoints.js → packages/mui-system/src/breakpoints/breakpoints.js

@@ -1,6 +1,6 @@
 import PropTypes from 'prop-types';
 import deepmerge from '@mui/utils/deepmerge';
-import merge from './merge';
+import merge from '../merge';
 
 // The breakpoint **start** at this value.
 // For instance with the first breakpoint xs: [xs, sm[.

packages/mui-system/src/breakpoints.test.js → packages/mui-system/src/breakpoints/breakpoints.test.js

@@ -4,7 +4,7 @@ import breakpoints, {
   resolveBreakpointValues,
   removeUnusedBreakpoints,
 } from './breakpoints';
-import style from './style';
+import style from '../style';
 
 const textColor = style({
   prop: 'color',

packages/mui-system/src/breakpoints/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './breakpoints'
+export * from './breakpoints'

packages/mui-system/src/colorManipulator/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export * from './colorManipulator'

packages/mui-system/src/compose.d.ts → packages/mui-system/src/compose/compose.d.ts

@@ -1,4 +1,4 @@
-import { ComposedStyleFunction, StyleFunction } from './Box';
+import { ComposedStyleFunction, StyleFunction } from '../Box';
 
 export default function compose<T extends Array<StyleFunction<any>>>(
   ...args: T

packages/mui-system/src/compose.js → packages/mui-system/src/compose/compose.js

@@ -1,4 +1,4 @@
-import merge from './merge';
+import merge from '../merge';
 
 function compose(...styles) {
   const handlers = styles.reduce((acc, style) => {

packages/mui-system/src/compose.test.js → packages/mui-system/src/compose/compose.test.js

@@ -1,6 +1,6 @@
 import { expect } from 'chai';
 import compose from './compose';
-import style from './style';
+import style from '../style';
 
 const textColor = style({
   prop: 'color',

packages/mui-system/src/compose/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './compose'

packages/mui-system/src/createBox.d.ts → packages/mui-system/src/createBox/createBox.d.ts

@@ -1,6 +1,6 @@
 import { OverridableComponent } from '@mui/types';
-import { BoxTypeMap } from './Box';
-import { Theme as SystemTheme } from './createTheme';
+import { BoxTypeMap } from '../Box';
+import { Theme as SystemTheme } from '../createTheme';
 
 export default function createBox<
   T extends object = SystemTheme,

packages/mui-system/src/createBox.js → packages/mui-system/src/createBox/createBox.js

@@ -2,8 +2,8 @@
 import * as React from 'react';
 import clsx from 'clsx';
 import styled from '@mui/styled-engine';
-import styleFunctionSx, { extendSxProp } from './styleFunctionSx';
-import useTheme from './useTheme';
+import styleFunctionSx, { extendSxProp } from '../styleFunctionSx';
+import useTheme from '../useTheme';
 
 export default function createBox(options = {}) {
   const { themeId, defaultTheme, defaultClassName = 'MuiBox-root', generateClassName } = options;

packages/mui-system/src/createBox/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './createBox'

packages/mui-system/src/createStyled.d.ts → packages/mui-system/src/createStyled/createStyled.d.ts

@@ -3,8 +3,8 @@ import {
   CreateMUIStyled as CreateMUIStyledStyledEngine,
   CSSInterpolation,
 } from '@mui/styled-engine';
-import styleFunctionSx, { SxProps } from './styleFunctionSx';
-import { Theme as DefaultTheme } from './createTheme';
+import styleFunctionSx, { SxProps } from '../styleFunctionSx';
+import { Theme as DefaultTheme } from '../createTheme';
 
 export function shouldForwardProp(propName: PropertyKey): boolean;
 

packages/mui-system/src/createStyled.js → packages/mui-system/src/createStyled/createStyled.js

@@ -3,8 +3,8 @@ import styledEngineStyled, { internal_processStyles as processStyles } from '@mu
 import { isPlainObject } from '@mui/utils/deepmerge';
 import capitalize from '@mui/utils/capitalize';
 import getDisplayName from '@mui/utils/getDisplayName';
-import createTheme from './createTheme';
-import styleFunctionSx from './styleFunctionSx';
+import createTheme from '../createTheme';
+import styleFunctionSx from '../styleFunctionSx';
 
 function isEmpty(obj) {
   return Object.keys(obj).length === 0;

packages/mui-system/src/createStyled/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './createStyled'
+export * from './createStyled'

packages/mui-system/src/cssGrid.d.ts → packages/mui-system/src/cssGrid/cssGrid.d.ts

@@ -1,3 +1,3 @@
-import { PropsFor, grid } from './Box';
+import { PropsFor, grid } from '../Box';
 
 export type CssGridProps = PropsFor<typeof grid>;

packages/mui-system/src/cssGrid.js → packages/mui-system/src/cssGrid/cssGrid.js

@@ -1,8 +1,8 @@
-import style from './style';
-import compose from './compose';
-import { createUnaryUnit, getValue } from './spacing';
-import { handleBreakpoints } from './breakpoints';
-import responsivePropType from './responsivePropType';
+import style from '../style';
+import compose from '../compose';
+import { createUnaryUnit, getValue } from '../spacing';
+import { handleBreakpoints } from '../breakpoints';
+import responsivePropType from '../responsivePropType';
 
 // false positive
 // eslint-disable-next-line react/function-component-definition

packages/mui-system/src/cssGrid/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './cssGrid'
+export * from './cssGrid'

packages/mui-system/src/display.d.ts → packages/mui-system/src/display/display.d.ts

@@ -1,3 +1,3 @@
-import { PropsFor, display } from './Box';
+import { PropsFor, display } from '../Box';
 
 export type DisplayProps = PropsFor<typeof display>;

packages/mui-system/src/display.js → packages/mui-system/src/display/display.js

@@ -1,5 +1,5 @@
-import style from './style';
-import compose from './compose';
+import style from '../style';
+import compose from '../compose';
 
 export const displayPrint = style({
   prop: 'displayPrint',

packages/mui-system/src/display/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './display'
+export * from './display'

packages/mui-system/src/flexbox.d.ts → packages/mui-system/src/flexbox/flexbox.d.ts

@@ -1,3 +1,3 @@
-import { PropsFor, flexbox } from './Box';
+import { PropsFor, flexbox } from '../Box';
 
 export type FlexboxProps = PropsFor<typeof flexbox>;

packages/mui-system/src/flexbox.js → packages/mui-system/src/flexbox/flexbox.js

@@ -1,5 +1,5 @@
-import style from './style';
-import compose from './compose';
+import style from '../style';
+import compose from '../compose';
 
 export const flexBasis = style({
   prop: 'flexBasis',

packages/mui-system/src/flexbox/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './flexbox'
+export * from './flexbox'

packages/mui-system/src/getThemeValue.js → packages/mui-system/src/getThemeValue/getThemeValue.js

@@ -1,13 +1,13 @@
-import borders from './borders';
-import display from './display';
-import flexbox from './flexbox';
-import grid from './cssGrid';
-import positions from './positions';
-import palette from './palette';
-import shadows from './shadows';
-import sizing from './sizing';
-import spacing from './spacing';
-import typography from './typography';
+import borders from '../borders';
+import display from '../display';
+import flexbox from '../flexbox';
+import grid from '../cssGrid';
+import positions from '../positions';
+import palette from '../palette';
+import shadows from '../shadows';
+import sizing from '../sizing';
+import spacing from '../spacing';
+import typography from '../typography';
 
 const filterPropsMapping = {
   borders: borders.filterProps,

packages/mui-system/src/getThemeValue/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './getThemeValue'
+export * from './getThemeValue'

packages/mui-system/src/memoize/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './memoize'

packages/mui-system/src/merge/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './merge'

packages/mui-system/src/palette/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './palette'
+export * from './palette'

packages/mui-system/src/palette.d.ts → packages/mui-system/src/palette/palette.d.ts

@@ -1,4 +1,4 @@
-import { PropsFor, SimpleStyleFunction, palette } from './Box';
+import { PropsFor, SimpleStyleFunction, palette } from '../Box';
 
 export const color: SimpleStyleFunction<'color'>;
 export const bgcolor: SimpleStyleFunction<'bgcolor'>;

packages/mui-system/src/palette.js → packages/mui-system/src/palette/palette.js

@@ -1,5 +1,5 @@
-import style from './style';
-import compose from './compose';
+import style from '../style';
+import compose from '../compose';
 
 export function paletteTransform(value, userValue) {
   if (userValue === 'grey') {

packages/mui-system/src/positions/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './positions'
+export * from './positions'

packages/mui-system/src/positions.d.ts → packages/mui-system/src/positions/positions.d.ts

@@ -1,3 +1,3 @@
-import { PropsFor, positions } from './Box';
+import { PropsFor, positions } from '../Box';
 
 export type PositionsProps = PropsFor<typeof positions>;

packages/mui-system/src/positions.js → packages/mui-system/src/positions/positions.js

@@ -1,5 +1,5 @@
-import style from './style';
-import compose from './compose';
+import style from '../style';
+import compose from '../compose';
 
 export const position = style({
   prop: 'position',

packages/mui-system/src/propsToClassKey/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './propsToClassKey'

packages/mui-system/src/responsivePropType/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './responsivePropType'

packages/mui-system/src/shadows/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './shadows'

packages/mui-system/src/shadows.d.ts → packages/mui-system/src/shadows/shadows.d.ts

@@ -1,3 +1,3 @@
-import { PropsFor, shadows } from './Box';
+import { PropsFor, shadows } from '../Box';
 
 export type ShadowsProps = PropsFor<typeof shadows>;

packages/mui-system/src/shadows.js → packages/mui-system/src/shadows/shadows.js

@@ -1,4 +1,4 @@
-import style from './style';
+import style from '../style';
 
 const boxShadow = style({
   prop: 'boxShadow',

packages/mui-system/src/sizing/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './sizing'
+export * from './sizing'

packages/mui-system/src/sizing.d.ts → packages/mui-system/src/sizing/sizing.d.ts

@@ -1,4 +1,4 @@
-import { PropsFor, SimpleStyleFunction, sizing } from './Box';
+import { PropsFor, SimpleStyleFunction, sizing } from '../Box';
 
 export const width: SimpleStyleFunction<'width'>;
 export const maxWidth: SimpleStyleFunction<'maxWidth'>;

packages/mui-system/src/sizing.js → packages/mui-system/src/sizing/sizing.js

@@ -1,6 +1,6 @@
-import style from './style';
-import compose from './compose';
-import { handleBreakpoints, values as breakpointsValues } from './breakpoints';
+import style from '../style';
+import compose from '../compose';
+import { handleBreakpoints, values as breakpointsValues } from '../breakpoints';
 
 export function sizingTransform(value) {
   return value <= 1 && value !== 0 ? `${value * 100}%` : value;

packages/mui-system/src/spacing/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './spacing'
+export * from './spacing'

packages/mui-system/src/spacing.d.ts → packages/mui-system/src/spacing/spacing.d.ts

@@ -1,4 +1,4 @@
-import { SimpleStyleFunction, spacing, PropsFor } from './Box';
+import { SimpleStyleFunction, spacing, PropsFor } from '../Box';
 
 export type SpacingValueType = string | number | null | undefined;
 export type SpacingProps = PropsFor<typeof spacing>;

packages/mui-system/src/spacing.js → packages/mui-system/src/spacing/spacing.js

@@ -1,8 +1,8 @@
-import responsivePropType from './responsivePropType';
-import { handleBreakpoints } from './breakpoints';
-import { getPath } from './style';
-import merge from './merge';
-import memoize from './memoize';
+import responsivePropType from '../responsivePropType';
+import { handleBreakpoints } from '../breakpoints';
+import { getPath } from '../style';
+import merge from '../merge';
+import memoize from '../memoize';
 
 const properties = {
   m: 'margin',

packages/mui-system/src/style/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './style'
+export * from './style'

packages/mui-system/src/style.d.ts → packages/mui-system/src/style/style.d.ts

@@ -1,5 +1,5 @@
 import { CSSObject } from '@mui/styled-engine';
-import { StyleFunction } from './Box';
+import { StyleFunction } from '../Box';
 
 export type TransformFunction = (
   cssValue: unknown,

packages/mui-system/src/style.js → packages/mui-system/src/style/style.js

@@ -1,6 +1,6 @@
 import capitalize from '@mui/utils/capitalize';
-import responsivePropType from './responsivePropType';
-import { handleBreakpoints } from './breakpoints';
+import responsivePropType from '../responsivePropType';
+import { handleBreakpoints } from '../breakpoints';
 
 export function getPath(obj, path, checkVars = true) {
   if (!path || typeof path !== 'string') {

packages/mui-system/src/styled/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './styled'

packages/mui-system/src/styled.d.ts → packages/mui-system/src/styled/styled.d.ts

@@ -1,4 +1,4 @@
-import { CreateMUIStyled } from './createStyled';
+import { CreateMUIStyled } from '../createStyled';
 
 declare const styled: CreateMUIStyled;
 

packages/mui-system/src/styled.js → packages/mui-system/src/styled/styled.js

@@ -1,4 +1,4 @@
-import createStyled from './createStyled';
+import createStyled from '../createStyled';
 
 const styled = createStyled();
 

packages/mui-system/src/typography/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './typography'
+export * from './typography'

packages/mui-system/src/typography.d.ts → packages/mui-system/src/typography/typography.d.ts

@@ -1,4 +1,4 @@
-import { PropsFor, SimpleStyleFunction, typography } from './Box';
+import { PropsFor, SimpleStyleFunction, typography } from '../Box';
 
 export const typographyVariant: SimpleStyleFunction<'typography'>;
 export const fontFamily: SimpleStyleFunction<'fontFamily'>;

packages/mui-system/src/typography.js → packages/mui-system/src/typography/typography.js

@@ -1,5 +1,5 @@
-import style from './style';
-import compose from './compose';
+import style from '../style';
+import compose from '../compose';
 
 export const fontFamily = style({
   prop: 'fontFamily',

packages/mui-system/src/useTheme/index.ts

@@ -0,0 +1,3 @@
+'use client'
+export { default } from './useTheme'
+export * from './useTheme'

packages/mui-system/src/useTheme.d.ts → packages/mui-system/src/useTheme/useTheme.d.ts

@@ -1,3 +1,3 @@
-import { Theme } from './createTheme';
+import { Theme } from '../createTheme';
 
 export default function useTheme<T = Theme>(defaultTheme?: T): T;

packages/mui-system/src/useTheme.js → packages/mui-system/src/useTheme/useTheme.js

@@ -1,6 +1,6 @@
 'use client';
-import createTheme from './createTheme';
-import useThemeWithoutDefault from './useThemeWithoutDefault';
+import createTheme from '../createTheme';
+import useThemeWithoutDefault from '../useThemeWithoutDefault';
 
 export const systemDefaultTheme = createTheme();
 

packages/mui-system/src/useThemeWithoutDefault/index.ts

@@ -0,0 +1,2 @@
+'use client'
+export { default } from './useThemeWithoutDefault'