Začetni commit projekta rezervacije

This commit is contained in:
Mark Poljanšek committed 2025-04-23 20:19:33 +02:00
commit 328731b32f
56062 files changed
+2485242

No files matched your search

+76
View File
@@ -0,0 +1,76 @@
import * as React from 'react';
import { DefaultTheme } from '@mui/system';
import { StorageManager } from '@mui/system/cssVars';
import { CssThemeVariables } from "./createThemeNoVars.js";
type ThemeProviderCssVariablesProps = CssThemeVariables extends {
enabled: true;
} ? {
/**
* The node for attaching the `theme.colorSchemeSelector`.
* @default document
*/
colorSchemeNode?: Element | null;
/**
* If `true`, the provider creates its own context and generate stylesheet as if it is a root `ThemeProvider`.
*/
disableNestedContext?: boolean;
/**
* If `true`, the style sheet for CSS theme variables won't be generated.
*
* This is useful for controlling nested ThemeProvider behavior.
* @default false
*/
disableStyleSheetGeneration?: boolean;
/**
* If `true`, theme values are recalculated when the mode changes.
* The `theme.colorSchemes.{mode}.*` nodes will be shallow merged to the top-level of the theme.
* @default false
*/
forceThemeRerender?: boolean;
} : {};
export interface ThemeProviderProps<Theme = DefaultTheme> extends ThemeProviderCssVariablesProps {
children?: React.ReactNode;
theme: Partial<Theme> | ((outerTheme: Theme) => Theme);
/**
* The document used to perform `disableTransitionOnChange` feature
* @default document
*/
documentNode?: Document | null;
/**
* The default mode when the local storage has no mode yet,
* requires the theme to have `colorSchemes` with light and dark.
* @default 'system'
*/
defaultMode?: 'light' | 'dark' | 'system';
/**
* The window that attaches the 'storage' event listener
* @default window
*/
storageWindow?: Window | null;
/**
* The storage manager to be used for storing the mode and color scheme
* @default using `window.localStorage`
*/
storageManager?: StorageManager | null;
/**
* localStorage key used to store application `mode`
* @default 'mui-mode'
*/
modeStorageKey?: string;
/**
* localStorage key used to store `colorScheme`
* @default 'mui-color-scheme'
*/
colorSchemeStorageKey?: string;
noSsr?: boolean;
/**
* Disable CSS transitions when switching between modes or color schemes
* @default false
*/
disableTransitionOnChange?: boolean;
}
export default function ThemeProvider<Theme = DefaultTheme>({
theme,
...props
}: ThemeProviderProps<Theme>): React.JSX.Element;
export {};
+10
View File
@@ -0,0 +1,10 @@
import * as React from 'react';
import { DefaultTheme } from '@mui/system';
export interface ThemeProviderNoVarsProps<Theme = DefaultTheme> {
children?: React.ReactNode;
theme: Partial<Theme> | ((outerTheme: Theme) => Theme);
}
export default function ThemeProviderNoVars<Theme = DefaultTheme>({
theme: themeInput,
...props
}: ThemeProviderNoVarsProps<Theme>): React.ReactElement<ThemeProviderNoVarsProps<Theme>>;
+51
View File
@@ -0,0 +1,51 @@
import * as React from 'react';
import { SupportedColorScheme } from "./createThemeWithVars.js";
declare const useColorScheme: () => import("@mui/system").ColorSchemeContextValue<SupportedColorScheme>, deprecatedGetInitColorSchemeScript: typeof import("@mui/system/InitColorSchemeScript").default;
declare function Experimental_CssVarsProvider(props: any): React.JSX.Element;
declare const getInitColorSchemeScript: typeof deprecatedGetInitColorSchemeScript;
/**
* TODO: remove this export in v7
* @deprecated
* The `CssVarsProvider` component has been deprecated and ported into `ThemeProvider`.
*
* You should use `ThemeProvider` and `createTheme()` instead:
*
* ```diff
* - import { CssVarsProvider, extendTheme } from '@mui/material/styles';
* + import { ThemeProvider, createTheme } from '@mui/material/styles';
*
* - const theme = extendTheme();
* + const theme = createTheme({
* + cssVariables: true,
* + colorSchemes: { light: true, dark: true },
* + });
*
* - <CssVarsProvider theme={theme}>
* + <ThemeProvider theme={theme}>
* ```
*
* To see the full documentation, check out https://mui.com/material-ui/customization/css-theme-variables/usage/.
*/
export declare const CssVarsProvider: (props: React.PropsWithChildren<Partial<import("@mui/system").CssVarsProviderConfig<SupportedColorScheme>> & {
theme?: {
cssVariables?: false;
cssVarPrefix?: string;
colorSchemes: Partial<Record<SupportedColorScheme, any>>;
colorSchemeSelector?: "media" | "class" | "data" | string;
} | {
$$material: {
cssVariables?: false;
cssVarPrefix?: string;
colorSchemes: Partial<Record<SupportedColorScheme, any>>;
colorSchemeSelector?: "media" | "class" | "data" | string;
};
} | undefined;
defaultMode?: "light" | "dark" | "system";
documentNode?: Document | null;
colorSchemeNode?: Element | null;
storageManager?: import("@mui/system").StorageManager | null;
storageWindow?: Window | null;
disableNestedContext?: boolean;
disableStyleSheetGeneration?: boolean;
}>) => React.JSX.Element;
export { useColorScheme, getInitColorSchemeScript, Experimental_CssVarsProvider };
+36
View File
@@ -0,0 +1,36 @@
import { BreakpointsOptions, ShapeOptions, SpacingOptions } from '@mui/system';
import { MixinsOptions } from "./createMixins.js";
import { Palette, PaletteOptions } from "./createPalette.js";
import { TypographyVariantsOptions } from "./createTypography.js";
import { Shadows } from "./shadows.js";
import { TransitionsOptions } from "./createTransitions.js";
import { ZIndexOptions } from "./zIndex.js";
import { ComponentsOverrides } from "./overrides.js";
import { ComponentsVariants } from "./variants.js";
import { ComponentsProps } from "./props.js";
import { Theme } from "./createTheme.js";
export type Direction = 'ltr' | 'rtl';
export interface DeprecatedThemeOptions {
shape?: ShapeOptions;
breakpoints?: BreakpointsOptions;
direction?: Direction;
mixins?: MixinsOptions;
overrides?: ComponentsOverrides;
palette?: PaletteOptions;
props?: ComponentsProps;
shadows?: Shadows;
spacing?: SpacingOptions;
transitions?: TransitionsOptions;
typography?: TypographyVariantsOptions | ((palette: Palette) => TypographyVariantsOptions);
variants?: ComponentsVariants;
zIndex?: ZIndexOptions;
unstable_strictMode?: boolean;
}
/**
* Generate a theme base on the V4 theme options received.
* @deprecated Follow the upgrade guide on https://mui.com/r/migration-v4#theme
* @param options Takes an incomplete theme object and adds the missing parts.
* @returns A complete, ready-to-use theme object.
*/
export default function adaptV4Theme(options?: DeprecatedThemeOptions): Theme;
+595
View File
@@ -0,0 +1,595 @@
import { ComponentsProps } from "./props.js";
import { ComponentsOverrides } from "./overrides.js";
import { ComponentsVariants } from "./variants.js";
export interface Components<Theme = unknown> {
MuiAlert?: {
defaultProps?: ComponentsProps['MuiAlert'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAlert'];
variants?: ComponentsVariants<Theme>['MuiAlert'];
};
MuiAlertTitle?: {
defaultProps?: ComponentsProps['MuiAlertTitle'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAlertTitle'];
variants?: ComponentsVariants<Theme>['MuiAlertTitle'];
};
MuiAppBar?: {
defaultProps?: ComponentsProps['MuiAppBar'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAppBar'];
variants?: ComponentsVariants<Theme>['MuiAppBar'];
};
MuiAutocomplete?: {
defaultProps?: ComponentsProps['MuiAutocomplete'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAutocomplete'];
variants?: ComponentsVariants<Theme>['MuiAutocomplete'];
};
MuiAvatar?: {
defaultProps?: ComponentsProps['MuiAvatar'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAvatar'];
variants?: ComponentsVariants<Theme>['MuiAvatar'];
};
MuiAvatarGroup?: {
defaultProps?: ComponentsProps['MuiAvatarGroup'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAvatarGroup'];
variants?: ComponentsVariants<Theme>['MuiAvatarGroup'];
};
MuiBackdrop?: {
defaultProps?: ComponentsProps['MuiBackdrop'];
styleOverrides?: ComponentsOverrides<Theme>['MuiBackdrop'];
variants?: ComponentsVariants<Theme>['MuiBackdrop'];
};
MuiBadge?: {
defaultProps?: ComponentsProps['MuiBadge'];
styleOverrides?: ComponentsOverrides<Theme>['MuiBadge'];
variants?: ComponentsVariants<Theme>['MuiBadge'];
};
MuiBottomNavigation?: {
defaultProps?: ComponentsProps['MuiBottomNavigation'];
styleOverrides?: ComponentsOverrides<Theme>['MuiBottomNavigation'];
variants?: ComponentsVariants<Theme>['MuiBottomNavigation'];
};
MuiBottomNavigationAction?: {
defaultProps?: ComponentsProps['MuiBottomNavigationAction'];
styleOverrides?: ComponentsOverrides<Theme>['MuiBottomNavigationAction'];
variants?: ComponentsVariants<Theme>['MuiBottomNavigationAction'];
};
MuiBreadcrumbs?: {
defaultProps?: ComponentsProps['MuiBreadcrumbs'];
styleOverrides?: ComponentsOverrides<Theme>['MuiBreadcrumbs'];
variants?: ComponentsVariants<Theme>['MuiBreadcrumbs'];
};
MuiButton?: {
defaultProps?: ComponentsProps['MuiButton'];
styleOverrides?: ComponentsOverrides<Theme>['MuiButton'];
variants?: ComponentsVariants<Theme>['MuiButton'];
};
MuiButtonBase?: {
defaultProps?: ComponentsProps['MuiButtonBase'];
styleOverrides?: ComponentsOverrides<Theme>['MuiButtonBase'];
variants?: ComponentsVariants<Theme>['MuiButtonBase'];
};
MuiButtonGroup?: {
defaultProps?: ComponentsProps['MuiButtonGroup'];
styleOverrides?: ComponentsOverrides<Theme>['MuiButtonGroup'];
variants?: ComponentsVariants<Theme>['MuiButtonGroup'];
};
MuiCard?: {
defaultProps?: ComponentsProps['MuiCard'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCard'];
variants?: ComponentsVariants<Theme>['MuiCard'];
};
MuiCardActionArea?: {
defaultProps?: ComponentsProps['MuiCardActionArea'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCardActionArea'];
variants?: ComponentsVariants<Theme>['MuiCardActionArea'];
};
MuiCardActions?: {
defaultProps?: ComponentsProps['MuiCardActions'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCardActions'];
variants?: ComponentsVariants<Theme>['MuiCardActions'];
};
MuiCardContent?: {
defaultProps?: ComponentsProps['MuiCardContent'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCardContent'];
variants?: ComponentsVariants<Theme>['MuiCardContent'];
};
MuiCardHeader?: {
defaultProps?: ComponentsProps['MuiCardHeader'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCardHeader'];
variants?: ComponentsVariants<Theme>['MuiCardHeader'];
};
MuiCardMedia?: {
defaultProps?: ComponentsProps['MuiCardMedia'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCardMedia'];
variants?: ComponentsVariants<Theme>['MuiCardMedia'];
};
MuiCheckbox?: {
defaultProps?: ComponentsProps['MuiCheckbox'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCheckbox'];
variants?: ComponentsVariants<Theme>['MuiCheckbox'];
};
MuiChip?: {
defaultProps?: ComponentsProps['MuiChip'];
styleOverrides?: ComponentsOverrides<Theme>['MuiChip'];
variants?: ComponentsVariants<Theme>['MuiChip'];
};
MuiCircularProgress?: {
defaultProps?: ComponentsProps['MuiCircularProgress'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCircularProgress'];
variants?: ComponentsVariants<Theme>['MuiCircularProgress'];
};
MuiCollapse?: {
defaultProps?: ComponentsProps['MuiCollapse'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCollapse'];
variants?: ComponentsVariants<Theme>['MuiCollapse'];
};
MuiContainer?: {
defaultProps?: ComponentsProps['MuiContainer'];
styleOverrides?: ComponentsOverrides<Theme>['MuiContainer'];
variants?: ComponentsVariants<Theme>['MuiContainer'];
};
MuiCssBaseline?: {
defaultProps?: ComponentsProps['MuiCssBaseline'];
styleOverrides?: ComponentsOverrides<Theme>['MuiCssBaseline'];
variants?: ComponentsVariants<Theme>['MuiCssBaseline'];
};
MuiDialog?: {
defaultProps?: ComponentsProps['MuiDialog'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDialog'];
variants?: ComponentsVariants<Theme>['MuiDialog'];
};
MuiDialogActions?: {
defaultProps?: ComponentsProps['MuiDialogActions'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDialogActions'];
variants?: ComponentsVariants<Theme>['MuiDialogActions'];
};
MuiDialogContent?: {
defaultProps?: ComponentsProps['MuiDialogContent'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDialogContent'];
variants?: ComponentsVariants<Theme>['MuiDialogContent'];
};
MuiDialogContentText?: {
defaultProps?: ComponentsProps['MuiDialogContentText'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDialogContentText'];
variants?: ComponentsVariants<Theme>['MuiDialogContentText'];
};
MuiDialogTitle?: {
defaultProps?: ComponentsProps['MuiDialogTitle'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDialogTitle'];
variants?: ComponentsVariants<Theme>['MuiDialogTitle'];
};
MuiDivider?: {
defaultProps?: ComponentsProps['MuiDivider'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDivider'];
variants?: ComponentsVariants<Theme>['MuiDivider'];
};
MuiDrawer?: {
defaultProps?: ComponentsProps['MuiDrawer'];
styleOverrides?: ComponentsOverrides<Theme>['MuiDrawer'];
variants?: ComponentsVariants<Theme>['MuiDrawer'];
};
MuiAccordion?: {
defaultProps?: ComponentsProps['MuiAccordion'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAccordion'];
variants?: ComponentsVariants<Theme>['MuiAccordion'];
};
MuiAccordionActions?: {
defaultProps?: ComponentsProps['MuiAccordionActions'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAccordionActions'];
variants?: ComponentsVariants<Theme>['MuiAccordionActions'];
};
MuiAccordionDetails?: {
defaultProps?: ComponentsProps['MuiAccordionDetails'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAccordionDetails'];
variants?: ComponentsVariants<Theme>['MuiAccordionDetails'];
};
MuiAccordionSummary?: {
defaultProps?: ComponentsProps['MuiAccordionSummary'];
styleOverrides?: ComponentsOverrides<Theme>['MuiAccordionSummary'];
variants?: ComponentsVariants<Theme>['MuiAccordionSummary'];
};
MuiFab?: {
defaultProps?: ComponentsProps['MuiFab'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFab'];
variants?: ComponentsVariants<Theme>['MuiFab'];
};
MuiFilledInput?: {
defaultProps?: ComponentsProps['MuiFilledInput'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFilledInput'];
variants?: ComponentsVariants<Theme>['MuiFilledInput'];
};
MuiFormControl?: {
defaultProps?: ComponentsProps['MuiFormControl'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFormControl'];
variants?: ComponentsVariants<Theme>['MuiFormControl'];
};
MuiFormControlLabel?: {
defaultProps?: ComponentsProps['MuiFormControlLabel'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFormControlLabel'];
variants?: ComponentsVariants<Theme>['MuiFormControlLabel'];
};
MuiFormGroup?: {
defaultProps?: ComponentsProps['MuiFormGroup'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFormGroup'];
variants?: ComponentsVariants<Theme>['MuiFormGroup'];
};
MuiFormHelperText?: {
defaultProps?: ComponentsProps['MuiFormHelperText'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFormHelperText'];
variants?: ComponentsVariants<Theme>['MuiFormHelperText'];
};
MuiFormLabel?: {
defaultProps?: ComponentsProps['MuiFormLabel'];
styleOverrides?: ComponentsOverrides<Theme>['MuiFormLabel'];
variants?: ComponentsVariants<Theme>['MuiFormLabel'];
};
MuiGridLegacy?: {
defaultProps?: ComponentsProps['MuiGridLegacy'];
styleOverrides?: ComponentsOverrides<Theme>['MuiGridLegacy'];
variants?: ComponentsVariants<Theme>['MuiGridLegacy'];
};
MuiGrid?: {
defaultProps?: ComponentsProps['MuiGrid'];
styleOverrides?: ComponentsOverrides<Theme>['MuiGrid'];
variants?: ComponentsVariants<Theme>['MuiGrid'];
};
MuiImageList?: {
defaultProps?: ComponentsProps['MuiImageList'];
styleOverrides?: ComponentsOverrides<Theme>['MuiImageList'];
variants?: ComponentsVariants<Theme>['MuiImageList'];
};
MuiImageListItem?: {
defaultProps?: ComponentsProps['MuiImageListItem'];
styleOverrides?: ComponentsOverrides<Theme>['MuiImageListItem'];
variants?: ComponentsVariants<Theme>['MuiImageListItem'];
};
MuiImageListItemBar?: {
defaultProps?: ComponentsProps['MuiImageListItemBar'];
styleOverrides?: ComponentsOverrides<Theme>['MuiImageListItemBar'];
variants?: ComponentsVariants<Theme>['MuiImageListItemBar'];
};
MuiIcon?: {
defaultProps?: ComponentsProps['MuiIcon'];
styleOverrides?: ComponentsOverrides<Theme>['MuiIcon'];
variants?: ComponentsVariants<Theme>['MuiIcon'];
};
MuiIconButton?: {
defaultProps?: ComponentsProps['MuiIconButton'];
styleOverrides?: ComponentsOverrides<Theme>['MuiIconButton'];
variants?: ComponentsVariants<Theme>['MuiIconButton'];
};
MuiInput?: {
defaultProps?: ComponentsProps['MuiInput'];
styleOverrides?: ComponentsOverrides<Theme>['MuiInput'];
variants?: ComponentsVariants<Theme>['MuiInput'];
};
MuiInputAdornment?: {
defaultProps?: ComponentsProps['MuiInputAdornment'];
styleOverrides?: ComponentsOverrides<Theme>['MuiInputAdornment'];
variants?: ComponentsVariants<Theme>['MuiInputAdornment'];
};
MuiInputBase?: {
defaultProps?: ComponentsProps['MuiInputBase'];
styleOverrides?: ComponentsOverrides<Theme>['MuiInputBase'];
variants?: ComponentsVariants<Theme>['MuiInputBase'];
};
MuiInputLabel?: {
defaultProps?: ComponentsProps['MuiInputLabel'];
styleOverrides?: ComponentsOverrides<Theme>['MuiInputLabel'];
variants?: ComponentsVariants<Theme>['MuiInputLabel'];
};
MuiLinearProgress?: {
defaultProps?: ComponentsProps['MuiLinearProgress'];
styleOverrides?: ComponentsOverrides<Theme>['MuiLinearProgress'];
variants?: ComponentsVariants<Theme>['MuiLinearProgress'];
};
MuiLink?: {
defaultProps?: ComponentsProps['MuiLink'];
styleOverrides?: ComponentsOverrides<Theme>['MuiLink'];
variants?: ComponentsVariants<Theme>['MuiLink'];
};
MuiList?: {
defaultProps?: ComponentsProps['MuiList'];
styleOverrides?: ComponentsOverrides<Theme>['MuiList'];
variants?: ComponentsVariants<Theme>['MuiList'];
};
MuiListItem?: {
defaultProps?: ComponentsProps['MuiListItem'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListItem'];
variants?: ComponentsVariants<Theme>['MuiListItem'];
};
MuiListItemButton?: {
defaultProps?: ComponentsProps['MuiListItemButton'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListItemButton'];
variants?: ComponentsVariants<Theme>['MuiListItemButton'];
};
MuiListItemAvatar?: {
defaultProps?: ComponentsProps['MuiListItemAvatar'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListItemAvatar'];
variants?: ComponentsVariants<Theme>['MuiListItemAvatar'];
};
MuiListItemIcon?: {
defaultProps?: ComponentsProps['MuiListItemIcon'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListItemIcon'];
variants?: ComponentsVariants<Theme>['MuiListItemIcon'];
};
MuiListItemSecondaryAction?: {
defaultProps?: ComponentsProps['MuiListItemSecondaryAction'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListItemSecondaryAction'];
variants?: ComponentsVariants<Theme>['MuiListItemSecondaryAction'];
};
MuiListItemText?: {
defaultProps?: ComponentsProps['MuiListItemText'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListItemText'];
variants?: ComponentsVariants<Theme>['MuiListItemText'];
};
MuiListSubheader?: {
defaultProps?: ComponentsProps['MuiListSubheader'];
styleOverrides?: ComponentsOverrides<Theme>['MuiListSubheader'];
variants?: ComponentsVariants<Theme>['MuiListSubheader'];
};
MuiMenu?: {
defaultProps?: ComponentsProps['MuiMenu'];
styleOverrides?: ComponentsOverrides<Theme>['MuiMenu'];
variants?: ComponentsVariants<Theme>['MuiMenu'];
};
MuiMenuItem?: {
defaultProps?: ComponentsProps['MuiMenuItem'];
styleOverrides?: ComponentsOverrides<Theme>['MuiMenuItem'];
variants?: ComponentsVariants<Theme>['MuiMenuItem'];
};
MuiMenuList?: {
defaultProps?: ComponentsProps['MuiMenuList'];
styleOverrides?: ComponentsOverrides<Theme>['MuiMenuList'];
variants?: ComponentsVariants<Theme>['MuiMenuList'];
};
MuiMobileStepper?: {
defaultProps?: ComponentsProps['MuiMobileStepper'];
styleOverrides?: ComponentsOverrides<Theme>['MuiMobileStepper'];
variants?: ComponentsVariants<Theme>['MuiMobileStepper'];
};
MuiModal?: {
defaultProps?: ComponentsProps['MuiModal'];
styleOverrides?: ComponentsOverrides<Theme>['MuiModal'];
variants?: ComponentsVariants<Theme>['MuiModal'];
};
MuiNativeSelect?: {
defaultProps?: ComponentsProps['MuiNativeSelect'];
styleOverrides?: ComponentsOverrides<Theme>['MuiNativeSelect'];
variants?: ComponentsVariants<Theme>['MuiNativeSelect'];
};
MuiOutlinedInput?: {
defaultProps?: ComponentsProps['MuiOutlinedInput'];
styleOverrides?: ComponentsOverrides<Theme>['MuiOutlinedInput'];
variants?: ComponentsVariants<Theme>['MuiOutlinedInput'];
};
MuiPagination?: {
defaultProps?: ComponentsProps['MuiPagination'];
styleOverrides?: ComponentsOverrides<Theme>['MuiPagination'];
variants?: ComponentsVariants<Theme>['MuiPagination'];
};
MuiPaginationItem?: {
defaultProps?: ComponentsProps['MuiPaginationItem'];
styleOverrides?: ComponentsOverrides<Theme>['MuiPaginationItem'];
variants?: ComponentsVariants<Theme>['MuiPaginationItem'];
};
MuiPaper?: {
defaultProps?: ComponentsProps['MuiPaper'];
styleOverrides?: ComponentsOverrides<Theme>['MuiPaper'];
variants?: ComponentsVariants<Theme>['MuiPaper'];
};
MuiPopper?: {
defaultProps?: ComponentsProps['MuiPopper'];
styleOverrides?: ComponentsOverrides<Theme>['MuiPopper'];
};
MuiPopover?: {
defaultProps?: ComponentsProps['MuiPopover'];
styleOverrides?: ComponentsOverrides<Theme>['MuiPopover'];
variants?: ComponentsVariants<Theme>['MuiPopover'];
};
MuiRadio?: {
defaultProps?: ComponentsProps['MuiRadio'];
styleOverrides?: ComponentsOverrides<Theme>['MuiRadio'];
variants?: ComponentsVariants<Theme>['MuiRadio'];
};
MuiRadioGroup?: {
defaultProps?: ComponentsProps['MuiRadioGroup'];
styleOverrides?: ComponentsOverrides<Theme>['MuiRadioGroup'];
variants?: ComponentsVariants<Theme>['MuiRadioGroup'];
};
MuiRating?: {
defaultProps?: ComponentsProps['MuiRating'];
styleOverrides?: ComponentsOverrides<Theme>['MuiRating'];
variants?: ComponentsVariants<Theme>['MuiRating'];
};
MuiScopedCssBaseline?: {
defaultProps?: ComponentsProps['MuiScopedCssBaseline'];
styleOverrides?: ComponentsOverrides<Theme>['MuiScopedCssBaseline'];
variants?: ComponentsVariants<Theme>['MuiScopedCssBaseline'];
};
MuiSelect?: {
defaultProps?: ComponentsProps['MuiSelect'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSelect'];
variants?: ComponentsVariants<Theme>['MuiSelect'];
};
MuiSkeleton?: {
defaultProps?: ComponentsProps['MuiSkeleton'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSkeleton'];
variants?: ComponentsVariants<Theme>['MuiSkeleton'];
};
MuiSlider?: {
defaultProps?: ComponentsProps['MuiSlider'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSlider'];
variants?: ComponentsVariants<Theme>['MuiSlider'];
};
MuiSnackbar?: {
defaultProps?: ComponentsProps['MuiSnackbar'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSnackbar'];
variants?: ComponentsVariants<Theme>['MuiSnackbar'];
};
MuiSnackbarContent?: {
defaultProps?: ComponentsProps['MuiSnackbarContent'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSnackbarContent'];
variants?: ComponentsVariants<Theme>['MuiSnackbarContent'];
};
MuiSpeedDial?: {
defaultProps?: ComponentsProps['MuiSpeedDial'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSpeedDial'];
variants?: ComponentsVariants<Theme>['MuiSpeedDial'];
};
MuiSpeedDialAction?: {
defaultProps?: ComponentsProps['MuiSpeedDialAction'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSpeedDialAction'];
variants?: ComponentsVariants<Theme>['MuiSpeedDialAction'];
};
MuiSpeedDialIcon?: {
defaultProps?: ComponentsProps['MuiSpeedDialIcon'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSpeedDialIcon'];
variants?: ComponentsVariants<Theme>['MuiSpeedDialIcon'];
};
MuiStack?: {
defaultProps?: ComponentsProps['MuiStack'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStack'];
variants?: ComponentsVariants<Theme>['MuiStack'];
};
MuiStep?: {
defaultProps?: ComponentsProps['MuiStep'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStep'];
variants?: ComponentsVariants<Theme>['MuiStep'];
};
MuiStepButton?: {
defaultProps?: ComponentsProps['MuiStepButton'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStepButton'];
variants?: ComponentsVariants<Theme>['MuiStepButton'];
};
MuiStepConnector?: {
defaultProps?: ComponentsProps['MuiStepConnector'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStepConnector'];
variants?: ComponentsVariants<Theme>['MuiStepConnector'];
};
MuiStepContent?: {
defaultProps?: ComponentsProps['MuiStepContent'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStepContent'];
variants?: ComponentsVariants<Theme>['MuiStepContent'];
};
MuiStepIcon?: {
defaultProps?: ComponentsProps['MuiStepIcon'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStepIcon'];
variants?: ComponentsVariants<Theme>['MuiStepIcon'];
};
MuiStepLabel?: {
defaultProps?: ComponentsProps['MuiStepLabel'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStepLabel'];
variants?: ComponentsVariants<Theme>['MuiStepLabel'];
};
MuiStepper?: {
defaultProps?: ComponentsProps['MuiStepper'];
styleOverrides?: ComponentsOverrides<Theme>['MuiStepper'];
variants?: ComponentsVariants<Theme>['MuiStepper'];
};
MuiSvgIcon?: {
defaultProps?: ComponentsProps['MuiSvgIcon'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSvgIcon'];
variants?: ComponentsVariants<Theme>['MuiSvgIcon'];
};
MuiSwipeableDrawer?: {
defaultProps?: ComponentsProps['MuiSwipeableDrawer'];
};
MuiSwitch?: {
defaultProps?: ComponentsProps['MuiSwitch'];
styleOverrides?: ComponentsOverrides<Theme>['MuiSwitch'];
variants?: ComponentsVariants<Theme>['MuiSwitch'];
};
MuiTab?: {
defaultProps?: ComponentsProps['MuiTab'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTab'];
variants?: ComponentsVariants<Theme>['MuiTab'];
};
MuiTable?: {
defaultProps?: ComponentsProps['MuiTable'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTable'];
variants?: ComponentsVariants<Theme>['MuiTable'];
};
MuiTableBody?: {
defaultProps?: ComponentsProps['MuiTableBody'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableBody'];
variants?: ComponentsVariants<Theme>['MuiTableBody'];
};
MuiTableCell?: {
defaultProps?: ComponentsProps['MuiTableCell'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableCell'];
variants?: ComponentsVariants<Theme>['MuiTableCell'];
};
MuiTableContainer?: {
defaultProps?: ComponentsProps['MuiTableContainer'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableContainer'];
variants?: ComponentsVariants<Theme>['MuiTableContainer'];
};
MuiTableFooter?: {
defaultProps?: ComponentsProps['MuiTableFooter'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableFooter'];
variants?: ComponentsVariants<Theme>['MuiTableFooter'];
};
MuiTableHead?: {
defaultProps?: ComponentsProps['MuiTableHead'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableHead'];
variants?: ComponentsVariants<Theme>['MuiTableHead'];
};
MuiTablePagination?: {
defaultProps?: ComponentsProps['MuiTablePagination'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTablePagination'];
variants?: ComponentsVariants<Theme>['MuiTablePagination'];
};
MuiTableRow?: {
defaultProps?: ComponentsProps['MuiTableRow'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableRow'];
variants?: ComponentsVariants<Theme>['MuiTableRow'];
};
MuiTableSortLabel?: {
defaultProps?: ComponentsProps['MuiTableSortLabel'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTableSortLabel'];
variants?: ComponentsVariants<Theme>['MuiTableSortLabel'];
};
MuiTabs?: {
defaultProps?: ComponentsProps['MuiTabs'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTabs'];
variants?: ComponentsVariants<Theme>['MuiTabs'];
};
MuiTextField?: {
defaultProps?: ComponentsProps['MuiTextField'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTextField'];
variants?: ComponentsVariants<Theme>['MuiTextField'];
};
MuiToggleButton?: {
defaultProps?: ComponentsProps['MuiToggleButton'];
styleOverrides?: ComponentsOverrides<Theme>['MuiToggleButton'];
variants?: ComponentsVariants<Theme>['MuiToggleButton'];
};
MuiToggleButtonGroup?: {
defaultProps?: ComponentsProps['MuiToggleButtonGroup'];
styleOverrides?: ComponentsOverrides<Theme>['MuiToggleButtonGroup'];
variants?: ComponentsVariants<Theme>['MuiToggleButtonGroup'];
};
MuiToolbar?: {
defaultProps?: ComponentsProps['MuiToolbar'];
styleOverrides?: ComponentsOverrides<Theme>['MuiToolbar'];
variants?: ComponentsVariants<Theme>['MuiToolbar'];
};
MuiTooltip?: {
defaultProps?: ComponentsProps['MuiTooltip'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTooltip'];
variants?: ComponentsVariants<Theme>['MuiTooltip'];
};
MuiTouchRipple?: {
defaultProps?: ComponentsProps['MuiTouchRipple'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTouchRipple'];
variants?: ComponentsVariants<Theme>['MuiTouchRipple'];
};
MuiTypography?: {
defaultProps?: ComponentsProps['MuiTypography'];
styleOverrides?: ComponentsOverrides<Theme>['MuiTypography'];
variants?: ComponentsVariants<Theme>['MuiTypography'];
};
MuiUseMediaQuery?: {
defaultProps?: ComponentsProps['MuiUseMediaQuery'];
};
}
+9
View File
@@ -0,0 +1,9 @@
import type { ColorSystemOptions } from "./createThemeWithVars.js";
export declare function getOpacity(mode: 'light' | 'dark'): {
inputPlaceholder: number;
inputUnderline: number;
switchTrackDisabled: number;
switchTrack: number;
};
export declare function getOverlays(mode: 'light' | 'dark'): string[];
export default function createColorScheme(options: ColorSystemOptions): ColorSystemOptions;
+16
View File
@@ -0,0 +1,16 @@
declare const _default: <T extends {
rootSelector?: string;
colorSchemeSelector?: "media" | "class" | "data" | string;
colorSchemes?: Record<string, any>;
defaultColorScheme?: string;
cssVarPrefix?: string;
}>(theme: T) => (colorScheme: keyof T["colorSchemes"] | undefined, css: Record<string, any>) => string | {
[x: string]: Record<string, any>;
"@media (prefers-color-scheme: dark)": {
[x: string]: Record<string, any>;
};
} | {
[x: string]: Record<string, any>;
"@media (prefers-color-scheme: dark)"?: undefined;
};
export default _default;
+32
View File
@@ -0,0 +1,32 @@
import * as CSS from 'csstype';
import { Breakpoints } from '@mui/system';
export type NormalCssProperties = CSS.Properties<number | string>;
export type Fontface = CSS.AtRule.FontFace & {
fallbacks?: CSS.AtRule.FontFace[];
};
/**
* Allows the user to augment the properties available
*/
export interface BaseCSSProperties extends NormalCssProperties {
'@font-face'?: Fontface | Fontface[];
}
export interface CSSProperties extends BaseCSSProperties {
// Allow pseudo selectors and media queries
// `unknown` is used since TS does not allow assigning an interface without
// an index signature to one with an index signature. This is to allow type safe
// module augmentation.
// Technically we want any key not typed in `BaseCSSProperties` to be of type
// `CSSProperties` but this doesn't work. The index signature needs to cover
// BaseCSSProperties as well. Usually you would use `BaseCSSProperties[keyof BaseCSSProperties]`
// but this would not allow assigning React.CSSProperties to CSSProperties
[k: string]: unknown | CSSProperties;
}
export interface Mixins {
toolbar: CSSProperties;
// ... use interface declaration merging to add custom mixins
}
export interface MixinsOptions extends Partial<Mixins> {
// ... use interface declaration merging to add custom mixin options
}
export default function createMixins(breakpoints: Breakpoints, mixins: MixinsOptions): Mixins;
+125
View File
@@ -0,0 +1,125 @@
export type PaletteMode = 'light' | 'dark';
export interface Color {
50: string;
100: string;
200: string;
300: string;
400: string;
500: string;
600: string;
700: string;
800: string;
900: string;
A100: string;
A200: string;
A400: string;
A700: string;
}
export {};
// use standalone interface over typeof colors/commons
// to enable module augmentation
export interface CommonColors {
black: string;
white: string;
}
export type ColorPartial = Partial<Color>;
export interface TypeText {
primary: string;
secondary: string;
disabled: string;
}
export interface TypeAction {
active: string;
hover: string;
hoverOpacity: number;
selected: string;
selectedOpacity: number;
disabled: string;
disabledOpacity: number;
disabledBackground: string;
focus: string;
focusOpacity: number;
activatedOpacity: number;
}
export interface TypeBackground {
default: string;
paper: string;
}
export type TypeDivider = string;
export type PaletteColorOptions = SimplePaletteColorOptions | ColorPartial;
export interface SimplePaletteColorOptions {
light?: string;
main: string;
dark?: string;
contrastText?: string;
}
export interface PaletteColor {
light: string;
main: string;
dark: string;
contrastText: string;
}
export interface TypeObject {
text: TypeText;
action: TypeAction;
divider: TypeDivider;
background: TypeBackground;
}
export type PaletteTonalOffset = number | {
light: number;
dark: number;
};
export const light: TypeObject;
export const dark: TypeObject;
export interface PaletteAugmentColorOptions {
color: PaletteColorOptions;
mainShade?: number | string;
lightShade?: number | string;
darkShade?: number | string;
name?: number | string;
}
export interface Palette {
common: CommonColors;
mode: PaletteMode;
contrastThreshold: number;
tonalOffset: PaletteTonalOffset;
primary: PaletteColor;
secondary: PaletteColor;
error: PaletteColor;
warning: PaletteColor;
info: PaletteColor;
success: PaletteColor;
grey: Color;
text: TypeText;
divider: TypeDivider;
action: TypeAction;
background: TypeBackground;
getContrastText: (background: string) => string;
augmentColor: (options: PaletteAugmentColorOptions) => PaletteColor;
}
export interface Channels {
mainChannel: string;
lightChannel: string;
darkChannel: string;
contrastTextChannel: string;
}
export type PartialTypeObject = { [P in keyof TypeObject]?: Partial<TypeObject[P]> };
export interface PaletteOptions {
primary?: PaletteColorOptions;
secondary?: PaletteColorOptions;
error?: PaletteColorOptions;
warning?: PaletteColorOptions;
info?: PaletteColorOptions;
success?: PaletteColorOptions;
mode?: PaletteMode;
tonalOffset?: PaletteTonalOffset;
contrastThreshold?: number;
common?: Partial<CommonColors>;
grey?: ColorPartial;
text?: Partial<TypeText>;
divider?: string;
action?: Partial<TypeAction>;
background?: Partial<TypeBackground>;
getContrastText?: (background: string) => string;
}
export default function createPalette(palette: PaletteOptions): Palette;
+1
View File
@@ -0,0 +1 @@
export default function createStyles(styles: any): never;
+14
View File
@@ -0,0 +1,14 @@
import { CssVarsThemeOptions } from "./createThemeWithVars.js";
import { Theme, ThemeOptions } from "./createThemeNoVars.js";
export type { ThemeOptions, Theme, CssThemeVariables } from "./createThemeNoVars.js";
/**
* Generate a theme base on the options received.
* @param options Takes an incomplete theme object and adds the missing parts.
* @param args Deep merge the arguments with the about to be returned theme.
* @returns A complete, ready-to-use theme object.
*/
export default function createTheme(options?: Omit<ThemeOptions, 'components'> & Pick<CssVarsThemeOptions, 'defaultColorScheme' | 'colorSchemes' | 'components'> & {
cssVariables?: boolean | Pick<CssVarsThemeOptions, 'colorSchemeSelector' | 'rootSelector' | 'disableCssColorScheme' | 'cssVarPrefix' | 'shouldSkipGeneratingVar'>;
},
// cast type to skip module augmentation test
...args: object[]): Theme;
+70
View File
@@ -0,0 +1,70 @@
import { ThemeOptions as SystemThemeOptions, Theme as SystemTheme, SxProps, CSSObject, SxConfig } from '@mui/system';
import { Mixins, MixinsOptions } from "./createMixins.js";
import { Palette, PaletteOptions } from "./createPalette.js";
import { TypographyVariants, TypographyVariantsOptions } from "./createTypography.js";
import { Shadows } from "./shadows.js";
import { Transitions, TransitionsOptions } from "./createTransitions.js";
import { ZIndex, ZIndexOptions } from "./zIndex.js";
import { Components } from "./components.js";
import { CssVarsTheme, CssVarsPalette, ColorSystemOptions } from "./createThemeWithVars.js";
/**
* To disable custom properties, use module augmentation
*
* @example
* declare module '@mui/material/styles' {
* interface CssThemeVariables {
* enabled: true;
* }
* }
*/
export interface CssThemeVariables {}
type CssVarsOptions = CssThemeVariables extends {
enabled: true;
} ? ColorSystemOptions : {};
export interface ThemeOptions extends Omit<SystemThemeOptions, 'zIndex'>, CssVarsOptions {
mixins?: MixinsOptions;
components?: Components<Omit<Theme, 'components'>>;
palette?: PaletteOptions;
shadows?: Shadows;
transitions?: TransitionsOptions;
typography?: TypographyVariantsOptions | ((palette: Palette) => TypographyVariantsOptions);
zIndex?: ZIndexOptions;
unstable_strictMode?: boolean;
unstable_sxConfig?: SxConfig;
}
export interface BaseTheme extends SystemTheme {
mixins: Mixins;
palette: Palette & (CssThemeVariables extends {
enabled: true;
} ? CssVarsPalette : {});
shadows: Shadows;
transitions: Transitions;
typography: TypographyVariants;
zIndex: ZIndex;
unstable_strictMode?: boolean;
}
// shut off automatic exporting for the `BaseTheme` above
export {};
type CssVarsProperties = CssThemeVariables extends {
enabled: true;
} ? Pick<CssVarsTheme, 'applyStyles' | 'colorSchemes' | 'colorSchemeSelector' | 'rootSelector' | 'cssVarPrefix' | 'defaultColorScheme' | 'getCssVar' | 'getColorSchemeSelector' | 'generateThemeVars' | 'generateStyleSheets' | 'generateSpacing' | 'shouldSkipGeneratingVar' | 'vars'> : {};
/**
* Our [TypeScript guide on theme customization](https://mui.com/material-ui/guides/typescript/#customization-of-theme) explains in detail how you would add custom properties.
*/
export interface Theme extends BaseTheme, CssVarsProperties {
cssVariables?: false;
components?: Components<BaseTheme>;
unstable_sx: (props: SxProps<Theme>) => CSSObject;
unstable_sxConfig: SxConfig;
}
/**
* Generate a theme base on the options received.
* @param options Takes an incomplete theme object and adds the missing parts.
* @param args Deep merge the arguments with the about to be returned theme.
* @returns A complete, ready-to-use theme object.
*/
export default function createThemeNoVars(options?: ThemeOptions, ...args: object[]): Theme;
+350
View File
@@ -0,0 +1,350 @@
import { OverridableStringUnion } from '@mui/types';
import { SxConfig, SxProps, CSSObject, ApplyStyles } from '@mui/system';
import { ExtractTypographyTokens } from '@mui/system/cssVars';
import { ThemeOptions, Theme } from "./createThemeNoVars.js";
import { Palette, PaletteOptions } from "./createPalette.js";
import { Shadows } from "./shadows.js";
import { ZIndex } from "./zIndex.js";
import { Components } from "./components.js";
/**
* default MD color-schemes
*/
export type DefaultColorScheme = 'light' | 'dark';
/**
* The application can add more color-scheme by extending this interface via module augmentation
*
* Ex.
* declare module @mui/material/styles {
* interface ColorSchemeOverrides {
* foo: true;
* }
* }
*
* // SupportedColorScheme = 'light' | 'dark' | 'foo';
*/
export interface ColorSchemeOverrides {}
export type ExtendedColorScheme = OverridableStringUnion<never, ColorSchemeOverrides>;
/**
* All color-schemes that the application has
*/
export type SupportedColorScheme = DefaultColorScheme | ExtendedColorScheme;
export interface Opacity {
inputPlaceholder: number;
inputUnderline: number;
switchTrackDisabled: number;
switchTrack: number;
}
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];
export interface PaletteBackgroundChannel {
defaultChannel: string;
paperChannel: string;
}
export interface PaletteCommonChannel {
background: string;
backgroundChannel: string;
onBackground: string;
onBackgroundChannel: string;
}
export interface PaletteColorChannel {
mainChannel: string;
lightChannel: string;
darkChannel: string;
contrastTextChannel: string;
}
export interface PaletteActionChannel {
activeChannel: string;
selectedChannel: string;
}
export interface PaletteTextChannel {
primaryChannel: string;
secondaryChannel: string;
}
export interface PaletteAlert {
errorColor: string;
infoColor: string;
successColor: string;
warningColor: string;
errorFilledBg: string;
infoFilledBg: string;
successFilledBg: string;
warningFilledBg: string;
errorFilledColor: string;
infoFilledColor: string;
successFilledColor: string;
warningFilledColor: string;
errorStandardBg: string;
infoStandardBg: string;
successStandardBg: string;
warningStandardBg: string;
errorIconColor: string;
infoIconColor: string;
successIconColor: string;
warningIconColor: string;
}
export interface PaletteAppBar {
defaultBg: string;
darkBg: string;
darkColor: string;
}
export interface PaletteAvatar {
defaultBg: string;
}
export interface PaletteButton {
inheritContainedBg: string;
inheritContainedHoverBg: string;
}
export interface PaletteChip {
defaultBorder: string;
defaultAvatarColor: string;
defaultIconColor: string;
}
export interface PaletteFilledInput {
bg: string;
hoverBg: string;
disabledBg: string;
}
export interface PaletteLinearProgress {
primaryBg: string;
secondaryBg: string;
errorBg: string;
infoBg: string;
successBg: string;
warningBg: string;
}
export interface PaletteSkeleton {
bg: string;
}
export interface PaletteSlider {
primaryTrack: string;
secondaryTrack: string;
errorTrack: string;
infoTrack: string;
successTrack: string;
warningTrack: string;
}
export interface PaletteSnackbarContent {
bg: string;
color: string;
}
export interface PaletteSpeedDialAction {
fabHoverBg: string;
}
export interface PaletteStepConnector {
border: string;
}
export interface PaletteStepContent {
border: string;
}
export interface PaletteSwitch {
defaultColor: string;
defaultDisabledColor: string;
primaryDisabledColor: string;
secondaryDisabledColor: string;
errorDisabledColor: string;
infoDisabledColor: string;
successDisabledColor: string;
warningDisabledColor: string;
}
export interface PaletteTableCell {
border: string;
}
export interface PaletteTooltip {
bg: string;
}
// The Palette should be sync with `../themeCssVarsAugmentation/index.d.ts`
export interface ColorSystemOptions {
palette?: PaletteOptions & {
background?: Partial<PaletteBackgroundChannel>;
common?: Partial<PaletteCommonChannel>;
primary?: Partial<PaletteColorChannel>;
secondary?: Partial<PaletteColorChannel>;
error?: Partial<PaletteColorChannel>;
info?: Partial<PaletteColorChannel>;
success?: Partial<PaletteColorChannel>;
text?: Partial<PaletteTextChannel>;
dividerChannel?: Partial<string>;
action?: Partial<PaletteActionChannel>;
Alert?: Partial<PaletteAlert>;
AppBar?: Partial<PaletteAppBar>;
Avatar?: Partial<PaletteAvatar>;
Button?: Partial<PaletteButton>;
Chip?: Partial<PaletteChip>;
FilledInput?: Partial<PaletteFilledInput>;
LinearProgress?: Partial<PaletteLinearProgress>;
Skeleton?: Partial<PaletteSkeleton>;
Slider?: Partial<PaletteSlider>;
SnackbarContent?: Partial<PaletteSnackbarContent>;
SpeedDialAction?: Partial<PaletteSpeedDialAction>;
StepConnector?: Partial<PaletteStepConnector>;
StepContent?: Partial<PaletteStepContent>;
Switch?: Partial<PaletteSwitch>;
TableCell?: Partial<PaletteTableCell>;
Tooltip?: Partial<PaletteTooltip>;
};
opacity?: Partial<Opacity>;
overlays?: Overlays;
}
export interface CssVarsPalette {
common: PaletteCommonChannel;
primary: PaletteColorChannel;
secondary: PaletteColorChannel;
error: PaletteColorChannel;
info: PaletteColorChannel;
success: PaletteColorChannel;
warning: PaletteColorChannel;
text: PaletteTextChannel;
background: PaletteBackgroundChannel;
dividerChannel: string;
action: PaletteActionChannel;
Alert: PaletteAlert;
AppBar: PaletteAppBar;
Avatar: PaletteAvatar;
Button: PaletteButton;
Chip: PaletteChip;
FilledInput: PaletteFilledInput;
LinearProgress: PaletteLinearProgress;
Skeleton: PaletteSkeleton;
Slider: PaletteSlider;
SnackbarContent: PaletteSnackbarContent;
SpeedDialAction: PaletteSpeedDialAction;
StepConnector: PaletteStepConnector;
StepContent: PaletteStepContent;
Switch: PaletteSwitch;
TableCell: PaletteTableCell;
Tooltip: PaletteTooltip;
}
export interface ColorSystem {
palette: Palette & CssVarsPalette;
opacity: Opacity;
overlays: Overlays;
}
export interface CssVarsThemeOptions extends Omit<ThemeOptions, 'palette' | 'components'> {
/**
* @default 'light'
*/
defaultColorScheme?: SupportedColorScheme;
/**
* Prefix of the generated CSS variables
* @default 'mui'
*/
cssVarPrefix?: string;
/**
* Theme components
*/
components?: Components<Omit<Theme, 'components' | 'palette'> & CssVarsTheme>;
/**
* Color schemes configuration
*/
colorSchemes?: Partial<Record<DefaultColorScheme, boolean | ColorSystemOptions>> & (ExtendedColorScheme extends string ? Record<ExtendedColorScheme, ColorSystemOptions> : {});
/**
* The strategy to generate CSS variables
*
* @example 'media'
* Generate CSS variables using [prefers-color-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme)
*
* @example '.mode-%s'
* Generate CSS variables within a class .mode-light, .mode-dark
*
* @example '[data-mode-%s]'
* Generate CSS variables within a data attribute [data-mode-light], [data-mode-dark]
*/
colorSchemeSelector?: 'media' | 'class' | 'data' | string;
/**
* The selector to generate the global CSS variables (non-color-scheme related)
* @default ':root'
* @example ':host' // (for shadow DOM)
* @see https://mui.com/material-ui/customization/shadow-dom/#3-css-theme-variables-optional
*/
rootSelector?: string;
/**
* If `true`, the CSS color-scheme will not be set.
* https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme
* @default false
*/
disableCssColorScheme?: boolean;
/**
* A function to determine if the key, value should be attached as CSS Variable
* `keys` is an array that represents the object path keys.
* Ex, if the theme is { foo: { bar: 'var(--test)' } }
* then, keys = ['foo', 'bar']
* value = 'var(--test)'
*/
shouldSkipGeneratingVar?: (keys: string[], value: string | number) => boolean;
}
// should not include keys defined in `shouldSkipGeneratingVar` and have value typeof function
export interface ThemeVars {
font: ExtractTypographyTokens<Theme['typography']>;
palette: Omit<ColorSystem['palette'], 'colorScheme' | 'mode' | 'contrastThreshold' | 'tonalOffset' | 'getContrastText' | 'augmentColor'>;
opacity: Opacity;
overlays: Overlays;
shadows: Shadows;
shape: Theme['shape'];
spacing: string;
zIndex: ZIndex;
}
type Split<T, K extends keyof T = keyof T> = K extends string | number ? { [k in K]: Exclude<T[K], undefined> } : never;
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;
/**
* Does not work for these cases:
* - { borderRadius: string | number } // the value can't be a union
* - { shadows: [string, string, ..., string] } // the value can't be an array
*/
type NormalizeVars<T> = ConcatDeep<Split<T>>;
// shut off automatic exporting for the Generics above
export {};
export interface ThemeCssVarOverrides {}
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>;
/**
* Theme properties generated by extendTheme and CssVarsProvider
*/
export interface CssVarsTheme extends ColorSystem {
colorSchemes: Partial<Record<SupportedColorScheme, ColorSystem>>;
rootSelector: string;
colorSchemeSelector: 'media' | 'class' | 'data' | string;
cssVarPrefix: string;
defaultColorScheme: SupportedColorScheme;
vars: ThemeVars;
getCssVar: (field: ThemeCssVar, ...vars: ThemeCssVar[]) => string;
getColorSchemeSelector: (colorScheme: SupportedColorScheme) => string;
generateThemeVars: () => ThemeVars;
generateStyleSheets: () => Array<Record<string, any>>;
generateSpacing: () => Theme['spacing'];
// Default theme tokens
spacing: Theme['spacing'];
breakpoints: Theme['breakpoints'];
shape: Theme['shape'];
typography: Theme['typography'];
transitions: Theme['transitions'];
shadows: Theme['shadows'];
mixins: Theme['mixins'];
zIndex: Theme['zIndex'];
direction: Theme['direction'];
/**
* A function to determine if the key, value should be attached as CSS Variable
* `keys` is an array that represents the object path keys.
* Ex, if the theme is { foo: { bar: 'var(--test)' } }
* then, keys = ['foo', 'bar']
* value = 'var(--test)'
*/
shouldSkipGeneratingVar: (keys: string[], value: string | number) => boolean;
unstable_sxConfig: SxConfig;
unstable_sx: (props: SxProps<CssVarsTheme>) => CSSObject;
applyStyles: ApplyStyles<SupportedColorScheme>;
}
/**
* Generate a theme base on the options received.
* @param options Takes an incomplete theme object and adds the missing parts.
* @param args Deep merge the arguments with the about to be returned theme.
* @returns A complete, ready-to-use theme object.
*/
export default function createThemeWithVars(options?: CssVarsThemeOptions, ...args: object[]): Omit<Theme, 'applyStyles'> & CssVarsTheme;
+51
View File
@@ -0,0 +1,51 @@
export interface Easing {
easeInOut: string;
easeOut: string;
easeIn: string;
sharp: string;
}
export const easing: Easing;
export interface Duration {
shortest: number;
shorter: number;
short: number;
standard: number;
complex: number;
enteringScreen: number;
leavingScreen: number;
}
export const duration: Duration;
export interface TransitionsOptions {
easing?: Partial<Easing>;
duration?: Partial<Duration>;
create?: (props: string | string[], options?: Partial<{
duration: number | string;
easing: string;
delay: number | string;
}>) => string;
getAutoHeightDuration?: (height: number) => number;
}
/**
* @internal
* @param props
* @param options
*/
export function create(props: string | string[], options?: Partial<{
duration: number | string;
easing: string;
delay: number | string;
}>): string;
/**
* @internal
* @param height
*/
export function getAutoHeightDuration(height: number): number;
export interface Transitions {
easing: Easing;
duration: Duration;
create: typeof create;
getAutoHeightDuration: typeof getAutoHeightDuration;
}
export default function createTransitions(inputTransitions: TransitionsOptions): Transitions;
+28
View File
@@ -0,0 +1,28 @@
import * as React from 'react';
import { CSSProperties } from "./createMixins.js";
import { Palette } from "./createPalette.js";
export type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'subtitle1' | 'subtitle2' | 'body1' | 'body2' | 'caption' | 'button' | 'overline';
export interface FontStyle {
fontFamily: React.CSSProperties['fontFamily'];
fontSize: number;
fontWeightLight: React.CSSProperties['fontWeight'];
fontWeightRegular: React.CSSProperties['fontWeight'];
fontWeightMedium: React.CSSProperties['fontWeight'];
fontWeightBold: React.CSSProperties['fontWeight'];
htmlFontSize: number;
}
export interface FontStyleOptions extends Partial<FontStyle> {
allVariants?: React.CSSProperties;
}
// TODO: which one should actually be allowed to be subject to module augmentation?
// current type vs interface decision is kept for historical reasons until we
// made a decision
export type TypographyStyle = CSSProperties;
export interface TypographyStyleOptions extends TypographyStyle {}
export interface TypographyUtils {
pxToRem: (px: number) => string;
}
export interface TypographyVariants extends Record<TypographyVariant, TypographyStyle>, FontStyle, TypographyUtils {}
export interface TypographyVariantsOptions extends Partial<Record<TypographyVariant, TypographyStyleOptions> & FontStyleOptions> {}
export default function createTypography(palette: Palette, typography: TypographyVariantsOptions | ((palette: Palette) => TypographyVariantsOptions)): TypographyVariants;
+25
View File
@@ -0,0 +1,25 @@
import { CSSProperties } from "./createMixins.js";
export function isUnitless(value: string): boolean;
export function getUnit(input: string): string;
export function toUnitless(value: string): number;
export function convertLength(baseFontSize: string): (length: string, toUnit: string) => string;
export interface AlignPropertyParams {
size: number;
grid: number;
}
export function alignProperty(params: AlignPropertyParams): number;
export interface FontGridParams {
lineHeight: number;
pixels: number;
htmlFontSize: number;
}
export function fontGrid(params: FontGridParams): number;
export interface ResponsivePropertyParams {
cssProperty: string;
min: number;
max: number;
unit?: string;
breakpoints?: number[];
transform?: (value: number) => number;
}
export function responsiveProperty(params: ResponsivePropertyParams): CSSProperties;
@@ -0,0 +1,5 @@
/**
* @internal These variables should not appear in the :root stylesheet when the `defaultColorScheme="dark"`
*/
declare const excludeVariablesFromRoot: (cssVarPrefix?: string) => string[];
export default excludeVariablesFromRoot;
+1
View File
@@ -0,0 +1 @@
export default function getOverlayAlpha(elevation: number): number;
+2
View File
@@ -0,0 +1,2 @@
declare const _default: "$$material";
export default _default;
+49
View File
@@ -0,0 +1,49 @@
export { default as THEME_ID } from "./identifier.js";
export { default as createTheme, default as unstable_createMuiStrictModeTheme, ThemeOptions, Theme, CssThemeVariables } from "./createTheme.js";
export { default as adaptV4Theme, DeprecatedThemeOptions } from "./adaptV4Theme.js";
export { Shadows } from "./shadows.js";
export { ZIndex } from "./zIndex.js";
export { CommonColors, Palette, PaletteColor, PaletteColorOptions, PaletteOptions, SimplePaletteColorOptions, TypeText, TypeAction, TypeBackground, PaletteMode, Color } from "./createPalette.js";
export { default as createColorScheme } from "./createColorScheme.js";
export { default as createStyles } from "./createStyles.js";
export { TypographyVariants, TypographyVariantsOptions, TypographyStyle, TypographyVariant } from "./createTypography.js";
export { default as responsiveFontSizes } from "./responsiveFontSizes.js";
export { Duration, Easing, Transitions, TransitionsOptions, duration, easing } from "./createTransitions.js";
export { Mixins, CSSProperties, MixinsOptions } from "./createMixins.js";
export { Direction, Breakpoint, BreakpointOverrides, Breakpoints, BreakpointsOptions, CreateMUIStyled, Interpolation, CSSInterpolation, CSSObject, css, keyframes,
// color manipulators
hexToRgb, rgbToHex, hslToRgb, decomposeColor, recomposeColor, getContrastRatio, getLuminance, emphasize, alpha, darken, lighten, ColorFormat, ColorObject, StyledEngineProvider, SxProps } from '@mui/system';
export { unstable_createBreakpoints } from '@mui/system/createBreakpoints';
// TODO: Remove this function in v6.
// eslint-disable-next-line @typescript-eslint/naming-convention
export function experimental_sx(): any;
export { default as useTheme } from "./useTheme.js";
export { default as useThemeProps } from "./useThemeProps.js";
export * from "./useThemeProps.js";
export { default as styled } from "./styled.js";
export { default as ThemeProvider, ThemeProviderProps } from "./ThemeProvider.js";
export { ComponentsProps, ComponentsPropsList } from "./props.js";
export { ComponentsVariants } from "./variants.js";
export { ComponentsOverrides, ComponentNameToClassKey } from "./overrides.js";
export { Components } from "./components.js";
export { getUnit as unstable_getUnit, toUnitless as unstable_toUnitless } from "./cssUtils.js";
export type ClassNameMap<ClassKey extends string = string> = Record<ClassKey, string>;
export interface StyledComponentProps<ClassKey extends string = string> {
/**
* Override or extend the styles applied to the component.
*/
classes?: Partial<ClassNameMap<ClassKey>>;
}
export { default as makeStyles } from "./makeStyles.js";
export { default as withStyles } from "./withStyles.js";
export { default as withTheme } from "./withTheme.js";
export * from "./ThemeProviderWithVars.js";
export type { StorageManager } from '@mui/system/cssVars';
export { default as extendTheme } from "./createThemeWithVars.js";
export type { ColorSchemeOverrides, SupportedColorScheme, ColorSystem, CssVarsPalette, Opacity, Overlays, PaletteAlert, PaletteActionChannel, PaletteAppBar, PaletteAvatar, PaletteChip, PaletteColorChannel, PaletteCommonChannel, PaletteFilledInput, PaletteLinearProgress, PaletteSkeleton, PaletteSlider, PaletteSnackbarContent, PaletteSpeedDialAction, PaletteStepConnector, PaletteStepContent, PaletteSwitch, PaletteTableCell, PaletteTextChannel, PaletteTooltip, CssVarsThemeOptions, CssVarsTheme, ThemeVars, ThemeCssVar, ThemeCssVarOverrides, ColorSystemOptions } from "./createThemeWithVars.js";
export { default as getOverlayAlpha } from "./getOverlayAlpha.js";
export { default as shouldSkipGeneratingVar } from "./shouldSkipGeneratingVar.js";
// Private methods for creating parts of the theme
export { default as private_createTypography } from "./createTypography.js";
export { default as private_excludeVariablesFromRoot } from "./excludeVariablesFromRoot.js";
+1
View File
@@ -0,0 +1 @@
export default function makeStyles(stylesCreator: any, options?: object): never;
+244
View File
@@ -0,0 +1,244 @@
import { CSSObject, CSSInterpolation, Interpolation } from '@mui/system';
import { PopperClassKey } from "../Popper/index.js";
import { ComponentsPropsList } from "./props.js";
import { AccordionActionsClassKey } from "../AccordionActions/index.js";
import { AccordionClassKey } from "../Accordion/index.js";
import { AccordionDetailsClassKey } from "../AccordionDetails/index.js";
import { AccordionSummaryClassKey } from "../AccordionSummary/index.js";
import { AlertClassKey } from "../Alert/index.js";
import { AlertTitleClassKey } from "../AlertTitle/index.js";
import { AppBarClassKey } from "../AppBar/index.js";
import { AutocompleteClassKey } from "../Autocomplete/index.js";
import { AvatarClassKey } from "../Avatar/index.js";
import { AvatarGroupClassKey } from "../AvatarGroup/index.js";
import { BackdropClassKey } from "../Backdrop/index.js";
import { BadgeClassKey } from "../Badge/index.js";
import { BottomNavigationActionClassKey } from "../BottomNavigationAction/index.js";
import { BottomNavigationClassKey } from "../BottomNavigation/index.js";
import { BreadcrumbsClassKey } from "../Breadcrumbs/index.js";
import { ButtonBaseClassKey } from "../ButtonBase/index.js";
import { ButtonClassKey } from "../Button/index.js";
import { ButtonGroupClassKey } from "../ButtonGroup/index.js";
import { CardActionAreaClassKey } from "../CardActionArea/index.js";
import { CardActionsClassKey } from "../CardActions/index.js";
import { CardClassKey } from "../Card/index.js";
import { CardContentClassKey } from "../CardContent/index.js";
import { CardHeaderClassKey } from "../CardHeader/index.js";
import { CardMediaClassKey } from "../CardMedia/index.js";
import { CheckboxClassKey } from "../Checkbox/index.js";
import { ChipClassKey } from "../Chip/index.js";
import { CircularProgressClassKey } from "../CircularProgress/index.js";
import { CollapseClassKey } from "../Collapse/index.js";
import { ContainerClassKey } from "../Container/index.js";
import { DialogActionsClassKey } from "../DialogActions/index.js";
import { DialogClassKey } from "../Dialog/index.js";
import { DialogContentClassKey } from "../DialogContent/index.js";
import { DialogContentTextClassKey } from "../DialogContentText/index.js";
import { DialogTitleClassKey } from "../DialogTitle/index.js";
import { DividerClassKey } from "../Divider/index.js";
import { DrawerClassKey } from "../Drawer/index.js";
import { FabClassKey } from "../Fab/index.js";
import { FilledInputClassKey } from "../FilledInput/index.js";
import { FormControlClassKey } from "../FormControl/index.js";
import { FormControlLabelClassKey } from "../FormControlLabel/index.js";
import { FormGroupClassKey } from "../FormGroup/index.js";
import { FormHelperTextClassKey } from "../FormHelperText/index.js";
import { FormLabelClassKey } from "../FormLabel/index.js";
import { GridLegacyClassKey } from "../GridLegacy/index.js";
import { GridClassKey } from "../Grid/index.js";
import { IconButtonClassKey } from "../IconButton/index.js";
import { IconClassKey } from "../Icon/index.js";
import { ImageListClassKey } from "../ImageList/index.js";
import { ImageListItemBarClassKey } from "../ImageListItemBar/index.js";
import { ImageListItemClassKey } from "../ImageListItem/index.js";
import { InputAdornmentClassKey } from "../InputAdornment/index.js";
import { InputBaseClassKey } from "../InputBase/index.js";
import { InputClassKey } from "../Input/index.js";
import { InputLabelClassKey } from "../InputLabel/index.js";
import { LinearProgressClassKey } from "../LinearProgress/index.js";
import { LinkClassKey } from "../Link/index.js";
import { ListClassKey } from "../List/index.js";
import { ListItemAvatarClassKey } from "../ListItemAvatar/index.js";
import { ListItemClassKey } from "../ListItem/index.js";
import { ListItemButtonClassKey } from "../ListItemButton/index.js";
import { ListItemIconClassKey } from "../ListItemIcon/index.js";
import { ListItemSecondaryActionClassKey } from "../ListItemSecondaryAction/index.js";
import { ListItemTextClassKey } from "../ListItemText/index.js";
import { ListSubheaderClassKey } from "../ListSubheader/index.js";
import { MenuClassKey } from "../Menu/index.js";
import { MenuItemClassKey } from "../MenuItem/index.js";
import { MenuListClassKey } from "../MenuList/index.js";
import { MobileStepperClassKey } from "../MobileStepper/index.js";
import { ModalClassKey } from "../Modal/index.js";
import { NativeSelectClassKey } from "../NativeSelect/index.js";
import { OutlinedInputClassKey } from "../OutlinedInput/index.js";
import { PaginationClassKey } from "../Pagination/index.js";
import { PaginationItemClassKey } from "../PaginationItem/index.js";
import { PaperClassKey } from "../Paper/index.js";
import { PopoverClassKey } from "../Popover/index.js";
import { RadioClassKey } from "../Radio/index.js";
import { RadioGroupClassKey } from "../RadioGroup/index.js";
import { RatingClassKey } from "../Rating/index.js";
import { ScopedCssBaselineClassKey } from "../ScopedCssBaseline/index.js";
import { SelectClassKey } from "../Select/index.js";
import { SkeletonClassKey } from "../Skeleton/index.js";
import { SliderClassKey } from "../Slider/index.js";
import { SnackbarClassKey } from "../Snackbar/index.js";
import { SnackbarContentClassKey } from "../SnackbarContent/index.js";
import { SpeedDialClassKey } from "../SpeedDial/index.js";
import { SpeedDialActionClassKey } from "../SpeedDialAction/index.js";
import { SpeedDialIconClassKey } from "../SpeedDialIcon/index.js";
import { StackClassKey } from "../Stack/index.js";
import { StepButtonClasskey } from "../StepButton/index.js";
import { StepClasskey } from "../Step/index.js";
import { StepConnectorClasskey } from "../StepConnector/index.js";
import { StepContentClasskey } from "../StepContent/index.js";
import { StepIconClasskey } from "../StepIcon/index.js";
import { StepLabelClasskey } from "../StepLabel/index.js";
import { StepperClasskey } from "../Stepper/index.js";
import { SvgIconClassKey } from "../SvgIcon/index.js";
import { SwitchClassKey } from "../Switch/index.js";
import { TabClassKey } from "../Tab/index.js";
import { TableBodyClassKey } from "../TableBody/index.js";
import { TableCellClassKey } from "../TableCell/index.js";
import { TableClassKey } from "../Table/index.js";
import { TableContainerClassKey } from "../TableContainer/index.js";
import { TableFooterClassKey } from "../TableFooter/index.js";
import { TableHeadClassKey } from "../TableHead/index.js";
import { TablePaginationClassKey } from "../TablePagination/index.js";
import { TableRowClassKey } from "../TableRow/index.js";
import { TableSortLabelClassKey } from "../TableSortLabel/index.js";
import { TabsClassKey } from "../Tabs/index.js";
import { TextFieldClassKey } from "../TextField/index.js";
import { ToggleButtonClassKey } from "../ToggleButton/index.js";
import { ToggleButtonGroupClassKey } from "../ToggleButtonGroup/index.js";
import { ToolbarClassKey } from "../Toolbar/index.js";
import { TooltipClassKey } from "../Tooltip/index.js";
import { TouchRippleClassKey } from "../ButtonBase/TouchRipple.js";
import { TypographyClassKey } from "../Typography/index.js";
export type OverridesStyleRules<ClassKey extends string = string, ComponentName = keyof ComponentsPropsList, Theme = unknown> = Record<ClassKey, Interpolation<(ComponentName extends keyof ComponentsPropsList ? ComponentsPropsList[ComponentName] & Record<string, unknown> & {
ownerState: ComponentsPropsList[ComponentName] & Record<string, unknown>;
} : {}) & {
theme: Theme;
} & Record<string, unknown>>>;
export type ComponentsOverrides<Theme = unknown> = { [Name in keyof ComponentNameToClassKey]?: Partial<OverridesStyleRules<ComponentNameToClassKey[Name], Name, Theme>> } & {
MuiCssBaseline?: CSSObject | string | ((theme: Theme) => CSSInterpolation);
};
export interface ComponentNameToClassKey {
MuiAlert: AlertClassKey;
MuiAlertTitle: AlertTitleClassKey;
MuiAppBar: AppBarClassKey;
MuiAutocomplete: AutocompleteClassKey;
MuiAvatar: AvatarClassKey;
MuiAvatarGroup: AvatarGroupClassKey;
MuiBackdrop: BackdropClassKey;
MuiBadge: BadgeClassKey;
MuiBottomNavigation: BottomNavigationClassKey;
MuiBottomNavigationAction: BottomNavigationActionClassKey;
MuiBreadcrumbs: BreadcrumbsClassKey;
MuiButton: ButtonClassKey;
MuiButtonBase: ButtonBaseClassKey;
MuiButtonGroup: ButtonGroupClassKey;
MuiCard: CardClassKey;
MuiCardActionArea: CardActionAreaClassKey;
MuiCardActions: CardActionsClassKey;
MuiCardContent: CardContentClassKey;
MuiCardHeader: CardHeaderClassKey;
MuiCardMedia: CardMediaClassKey;
MuiCheckbox: CheckboxClassKey;
MuiChip: ChipClassKey;
MuiCircularProgress: CircularProgressClassKey;
MuiCollapse: CollapseClassKey;
MuiContainer: ContainerClassKey;
MuiDialog: DialogClassKey;
MuiDialogActions: DialogActionsClassKey;
MuiDialogContent: DialogContentClassKey;
MuiDialogContentText: DialogContentTextClassKey;
MuiDialogTitle: DialogTitleClassKey;
MuiDivider: DividerClassKey;
MuiDrawer: DrawerClassKey;
MuiAccordion: AccordionClassKey;
MuiAccordionActions: AccordionActionsClassKey;
MuiAccordionDetails: AccordionDetailsClassKey;
MuiAccordionSummary: AccordionSummaryClassKey;
MuiFab: FabClassKey;
MuiFilledInput: FilledInputClassKey;
MuiFormControl: FormControlClassKey;
MuiFormControlLabel: FormControlLabelClassKey;
MuiFormGroup: FormGroupClassKey;
MuiFormHelperText: FormHelperTextClassKey;
MuiFormLabel: FormLabelClassKey;
MuiGridLegacy: GridLegacyClassKey;
MuiGrid: GridClassKey;
MuiIcon: IconClassKey;
MuiIconButton: IconButtonClassKey;
MuiImageList: ImageListClassKey;
MuiImageListItem: ImageListItemClassKey;
MuiImageListItemBar: ImageListItemBarClassKey;
MuiInput: InputClassKey;
MuiInputAdornment: InputAdornmentClassKey;
MuiInputBase: InputBaseClassKey;
MuiInputLabel: InputLabelClassKey;
MuiLinearProgress: LinearProgressClassKey;
MuiLink: LinkClassKey;
MuiList: ListClassKey;
MuiListItem: ListItemClassKey;
MuiListItemButton: ListItemButtonClassKey;
MuiListItemAvatar: ListItemAvatarClassKey;
MuiListItemIcon: ListItemIconClassKey;
MuiListItemSecondaryAction: ListItemSecondaryActionClassKey;
MuiListItemText: ListItemTextClassKey;
MuiListSubheader: ListSubheaderClassKey;
MuiMenu: MenuClassKey;
MuiMenuItem: MenuItemClassKey;
MuiMenuList: MenuListClassKey;
MuiMobileStepper: MobileStepperClassKey;
MuiModal: ModalClassKey;
MuiNativeSelect: NativeSelectClassKey;
MuiOutlinedInput: OutlinedInputClassKey;
MuiPagination: PaginationClassKey;
MuiPaginationItem: PaginationItemClassKey;
MuiPaper: PaperClassKey;
MuiPopover: PopoverClassKey;
MuiPopper: PopperClassKey;
MuiRadio: RadioClassKey;
MuiRadioGroup: RadioGroupClassKey;
MuiRating: RatingClassKey;
MuiScopedCssBaseline: ScopedCssBaselineClassKey;
MuiSelect: SelectClassKey;
MuiSkeleton: SkeletonClassKey;
MuiSlider: SliderClassKey;
MuiSnackbar: SnackbarClassKey;
MuiSnackbarContent: SnackbarContentClassKey;
MuiSpeedDial: SpeedDialClassKey;
MuiSpeedDialAction: SpeedDialActionClassKey;
MuiSpeedDialIcon: SpeedDialIconClassKey;
MuiStack: StackClassKey;
MuiStep: StepClasskey;
MuiStepButton: StepButtonClasskey;
MuiStepConnector: StepConnectorClasskey;
MuiStepContent: StepContentClasskey;
MuiStepIcon: StepIconClasskey;
MuiStepLabel: StepLabelClasskey;
MuiStepper: StepperClasskey;
MuiSvgIcon: SvgIconClassKey;
MuiSwitch: SwitchClassKey;
MuiTab: TabClassKey;
MuiTable: TableClassKey;
MuiTableBody: TableBodyClassKey;
MuiTableCell: TableCellClassKey;
MuiTableContainer: TableContainerClassKey;
MuiTableFooter: TableFooterClassKey;
MuiTableHead: TableHeadClassKey;
MuiTablePagination: TablePaginationClassKey;
MuiTableRow: TableRowClassKey;
MuiTableSortLabel: TableSortLabelClassKey;
MuiTabs: TabsClassKey;
MuiTextField: TextFieldClassKey;
MuiToggleButton: ToggleButtonClassKey;
MuiToggleButtonGroup: ToggleButtonGroupClassKey;
MuiToolbar: ToolbarClassKey;
MuiTooltip: TooltipClassKey;
MuiTouchRipple: TouchRippleClassKey;
MuiTypography: TypographyClassKey;
}
+241
View File
@@ -0,0 +1,241 @@
import { AlertProps } from "../Alert/index.js";
import { AlertTitleProps } from "../AlertTitle/index.js";
import { AppBarProps } from "../AppBar/index.js";
import { AutocompleteProps } from "../Autocomplete/index.js";
import { AvatarProps } from "../Avatar/index.js";
import { AvatarGroupProps } from "../AvatarGroup/index.js";
import { BackdropProps } from "../Backdrop/index.js";
import { BadgeProps } from "../Badge/index.js";
import { BottomNavigationActionProps } from "../BottomNavigationAction/index.js";
import { BottomNavigationProps } from "../BottomNavigation/index.js";
import { BreadcrumbsProps } from "../Breadcrumbs/index.js";
import { ButtonBaseProps } from "../ButtonBase/index.js";
import { ButtonGroupProps } from "../ButtonGroup/index.js";
import { ButtonProps } from "../Button/index.js";
import { CardActionAreaProps } from "../CardActionArea/index.js";
import { CardActionsProps } from "../CardActions/index.js";
import { CardContentProps } from "../CardContent/index.js";
import { CardHeaderProps } from "../CardHeader/index.js";
import { CardMediaProps } from "../CardMedia/index.js";
import { CardProps } from "../Card/index.js";
import { CheckboxProps } from "../Checkbox/index.js";
import { ChipProps } from "../Chip/index.js";
import { CircularProgressProps } from "../CircularProgress/index.js";
import { CollapseProps } from "../Collapse/index.js";
import { ContainerProps } from "../Container/index.js";
import { CssBaselineProps } from "../CssBaseline/index.js";
import { DialogActionsProps } from "../DialogActions/index.js";
import { DialogContentProps } from "../DialogContent/index.js";
import { DialogContentTextProps } from "../DialogContentText/index.js";
import { DialogProps } from "../Dialog/index.js";
import { DialogTitleProps } from "../DialogTitle/index.js";
import { DividerProps } from "../Divider/index.js";
import { DrawerProps } from "../Drawer/index.js";
import { AccordionActionsProps } from "../AccordionActions/index.js";
import { AccordionDetailsProps } from "../AccordionDetails/index.js";
import { AccordionProps } from "../Accordion/index.js";
import { AccordionSummaryProps } from "../AccordionSummary/index.js";
import { FabProps } from "../Fab/index.js";
import { FilledInputProps } from "../FilledInput/index.js";
import { FormControlLabelProps } from "../FormControlLabel/index.js";
import { FormControlProps } from "../FormControl/index.js";
import { FormGroupProps } from "../FormGroup/index.js";
import { FormHelperTextProps } from "../FormHelperText/index.js";
import { FormLabelProps } from "../FormLabel/index.js";
import { GridLegacyProps } from "../GridLegacy/index.js";
import { GridProps } from "../Grid/index.js";
import { IconButtonProps } from "../IconButton/index.js";
import { IconProps } from "../Icon/index.js";
import { ImageListProps } from "../ImageList/index.js";
import { ImageListItemBarProps } from "../ImageListItemBar/index.js";
import { ImageListItemProps } from "../ImageListItem/index.js";
import { InputAdornmentProps } from "../InputAdornment/index.js";
import { InputBaseProps } from "../InputBase/index.js";
import { InputLabelProps } from "../InputLabel/index.js";
import { InputProps } from "../Input/index.js";
import { LinearProgressProps } from "../LinearProgress/index.js";
import { LinkProps } from "../Link/index.js";
import { ListItemAvatarProps } from "../ListItemAvatar/index.js";
import { ListItemIconProps } from "../ListItemIcon/index.js";
import { ListItemProps } from "../ListItem/index.js";
import { ListItemButtonProps } from "../ListItemButton/index.js";
import { ListItemSecondaryActionProps } from "../ListItemSecondaryAction/index.js";
import { ListItemTextProps } from "../ListItemText/index.js";
import { ListProps } from "../List/index.js";
import { ListSubheaderProps } from "../ListSubheader/index.js";
import { MenuItemProps } from "../MenuItem/index.js";
import { MenuListProps } from "../MenuList/index.js";
import { MenuProps } from "../Menu/index.js";
import { MobileStepperProps } from "../MobileStepper/index.js";
import { ModalProps } from "../Modal/index.js";
import { NativeSelectProps } from "../NativeSelect/index.js";
import { UseMediaQueryOptions } from "../useMediaQuery/index.js";
import { OutlinedInputProps } from "../OutlinedInput/index.js";
import { PaginationProps } from "../Pagination/index.js";
import { PaginationItemProps } from "../PaginationItem/index.js";
import { PaperProps } from "../Paper/index.js";
import { PopoverProps } from "../Popover/index.js";
import { RadioGroupProps } from "../RadioGroup/index.js";
import { RadioProps } from "../Radio/index.js";
import { RatingProps } from "../Rating/index.js";
import { ScopedCssBaselineProps } from "../ScopedCssBaseline/index.js";
import { SelectProps } from "../Select/index.js";
import { SkeletonProps } from "../Skeleton/index.js";
import { SliderProps } from "../Slider/index.js";
import { SnackbarContentProps } from "../SnackbarContent/index.js";
import { SnackbarProps } from "../Snackbar/index.js";
import { SpeedDialProps } from "../SpeedDial/index.js";
import { SpeedDialActionProps } from "../SpeedDialAction/index.js";
import { SpeedDialIconProps } from "../SpeedDialIcon/index.js";
import { StackProps } from "../Stack/index.js";
import { StepButtonProps } from "../StepButton/index.js";
import { StepConnectorProps } from "../StepConnector/index.js";
import { StepContentProps } from "../StepContent/index.js";
import { StepIconProps } from "../StepIcon/index.js";
import { StepLabelProps } from "../StepLabel/index.js";
import { StepperProps } from "../Stepper/index.js";
import { StepProps } from "../Step/index.js";
import { SvgIconProps } from "../SvgIcon/index.js";
import { SwipeableDrawerProps } from "../SwipeableDrawer/index.js";
import { SwitchProps } from "../Switch/index.js";
import { TableBodyProps } from "../TableBody/index.js";
import { TableCellProps } from "../TableCell/index.js";
import { TableContainerProps } from "../TableContainer/index.js";
import { TableHeadProps } from "../TableHead/index.js";
import { TablePaginationProps } from "../TablePagination/index.js";
import { TableProps } from "../Table/index.js";
import { TableRowProps } from "../TableRow/index.js";
import { TableSortLabelProps } from "../TableSortLabel/index.js";
import { TableFooterProps } from "../TableFooter/index.js";
import { TabProps } from "../Tab/index.js";
import { TabsProps } from "../Tabs/index.js";
import { TextFieldProps } from "../TextField/index.js";
import { ToggleButtonProps } from "../ToggleButton/index.js";
import { ToggleButtonGroupProps } from "../ToggleButtonGroup/index.js";
import { ToolbarProps } from "../Toolbar/index.js";
import { TooltipProps } from "../Tooltip/index.js";
import { TouchRippleProps } from "../ButtonBase/TouchRipple.js";
import { TypographyProps } from "../Typography/index.js";
import { PopperProps } from "../Popper/index.js";
export type ComponentsProps = { [Name in keyof ComponentsPropsList]?: Partial<ComponentsPropsList[Name]> };
export interface ComponentsPropsList {
MuiAlert: AlertProps;
MuiAlertTitle: AlertTitleProps;
MuiAppBar: AppBarProps;
MuiAutocomplete: AutocompleteProps<any, any, any, any>;
MuiAvatar: AvatarProps;
MuiAvatarGroup: AvatarGroupProps;
MuiBackdrop: BackdropProps;
MuiBadge: BadgeProps;
MuiBottomNavigation: BottomNavigationProps;
MuiBottomNavigationAction: BottomNavigationActionProps;
MuiBreadcrumbs: BreadcrumbsProps;
MuiButton: ButtonProps;
MuiButtonBase: ButtonBaseProps;
MuiButtonGroup: ButtonGroupProps;
MuiCard: CardProps;
MuiCardActionArea: CardActionAreaProps;
MuiCardActions: CardActionsProps;
MuiCardContent: CardContentProps;
MuiCardHeader: CardHeaderProps;
MuiCardMedia: CardMediaProps;
MuiCheckbox: CheckboxProps;
MuiChip: ChipProps;
MuiCircularProgress: CircularProgressProps;
MuiCollapse: CollapseProps;
MuiContainer: ContainerProps;
MuiCssBaseline: CssBaselineProps;
MuiDialog: DialogProps;
MuiDialogActions: DialogActionsProps;
MuiDialogContent: DialogContentProps;
MuiDialogContentText: DialogContentTextProps;
MuiDialogTitle: DialogTitleProps;
MuiDivider: DividerProps;
MuiDrawer: DrawerProps;
MuiAccordion: AccordionProps;
MuiAccordionActions: AccordionActionsProps;
MuiAccordionDetails: AccordionDetailsProps;
MuiAccordionSummary: AccordionSummaryProps;
MuiFab: FabProps;
MuiFilledInput: FilledInputProps;
MuiFormControl: FormControlProps;
MuiFormControlLabel: FormControlLabelProps;
MuiFormGroup: FormGroupProps;
MuiFormHelperText: FormHelperTextProps;
MuiFormLabel: FormLabelProps;
MuiGridLegacy: GridLegacyProps;
MuiGrid: GridProps;
MuiImageList: ImageListProps;
MuiImageListItem: ImageListItemProps;
MuiImageListItemBar: ImageListItemBarProps;
MuiIcon: IconProps;
MuiIconButton: IconButtonProps;
MuiInput: InputProps;
MuiInputAdornment: InputAdornmentProps;
MuiInputBase: InputBaseProps;
MuiInputLabel: InputLabelProps;
MuiLinearProgress: LinearProgressProps;
MuiLink: LinkProps;
MuiList: ListProps;
MuiListItem: ListItemProps;
MuiListItemButton: ListItemButtonProps;
MuiListItemAvatar: ListItemAvatarProps;
MuiListItemIcon: ListItemIconProps;
MuiListItemSecondaryAction: ListItemSecondaryActionProps;
MuiListItemText: ListItemTextProps;
MuiListSubheader: ListSubheaderProps;
MuiMenu: MenuProps;
MuiMenuItem: MenuItemProps;
MuiMenuList: MenuListProps;
MuiMobileStepper: MobileStepperProps;
MuiModal: ModalProps;
MuiNativeSelect: NativeSelectProps;
MuiOutlinedInput: OutlinedInputProps;
MuiPagination: PaginationProps;
MuiPaginationItem: PaginationItemProps;
MuiPaper: PaperProps;
MuiPopper: PopperProps;
MuiPopover: PopoverProps;
MuiRadio: RadioProps;
MuiRadioGroup: RadioGroupProps;
MuiRating: RatingProps;
MuiScopedCssBaseline: ScopedCssBaselineProps;
MuiSelect: SelectProps;
MuiSkeleton: SkeletonProps;
MuiSlider: SliderProps;
MuiSnackbar: SnackbarProps;
MuiSnackbarContent: SnackbarContentProps;
MuiSpeedDial: SpeedDialProps;
MuiSpeedDialAction: SpeedDialActionProps;
MuiSpeedDialIcon: SpeedDialIconProps;
MuiStack: StackProps;
MuiStep: StepProps;
MuiStepButton: StepButtonProps;
MuiStepConnector: StepConnectorProps;
MuiStepContent: StepContentProps;
MuiStepIcon: StepIconProps;
MuiStepLabel: StepLabelProps;
MuiStepper: StepperProps;
MuiSvgIcon: SvgIconProps;
MuiSwipeableDrawer: SwipeableDrawerProps;
MuiSwitch: SwitchProps;
MuiTab: TabProps;
MuiTable: TableProps;
MuiTableBody: TableBodyProps;
MuiTableCell: TableCellProps;
MuiTableContainer: TableContainerProps;
MuiTableFooter: TableFooterProps;
MuiTableHead: TableHeadProps;
MuiTablePagination: TablePaginationProps;
MuiTableRow: TableRowProps;
MuiTableSortLabel: TableSortLabelProps;
MuiTabs: TabsProps;
MuiTextField: TextFieldProps;
MuiToggleButton: ToggleButtonProps;
MuiToggleButtonGroup: ToggleButtonGroupProps;
MuiToolbar: ToolbarProps;
MuiTooltip: TooltipProps;
MuiTouchRipple: TouchRippleProps;
MuiTypography: TypographyProps;
MuiUseMediaQuery: UseMediaQueryOptions;
}
+11
View File
@@ -0,0 +1,11 @@
import { Breakpoint } from '@mui/system';
import { TypographyVariants } from "./createTypography.js";
export interface ResponsiveFontSizesOptions {
breakpoints?: Breakpoint[];
disableAlign?: boolean;
factor?: number;
variants?: Array<keyof TypographyVariants>;
}
export default function responsiveFontSizes<T extends {
typography: TypographyVariants;
}>(theme: T, options?: ResponsiveFontSizesOptions): T;
+2
View File
@@ -0,0 +1,2 @@
declare const rootShouldForwardProp: (prop: string) => boolean;
export default rootShouldForwardProp;
+3
View File
@@ -0,0 +1,3 @@
export type Shadows = ['none', string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string, string];
declare const shadows: Shadows;
export default shadows;
@@ -0,0 +1 @@
export default function shouldSkipGeneratingVar(keys: string[]): boolean;
+2
View File
@@ -0,0 +1,2 @@
declare function slotShouldForwardProp(prop: string): boolean;
export default slotShouldForwardProp;
+20
View File
@@ -0,0 +1,20 @@
/**
* `baseTheme` usually comes from `createTheme()` or `extendTheme()`.
*
* This function is intended to be used with zero-runtime CSS-in-JS like Pigment CSS
* For example, in a Next.js project:
*
* ```js
* // next.config.js
* const { extendTheme } = require('@mui/material/styles');
*
* const theme = extendTheme();
* // `.toRuntimeSource` is Pigment CSS specific to create a theme that is available at runtime.
* theme.toRuntimeSource = stringifyTheme;
*
* module.exports = withPigment({
* theme,
* });
* ```
*/
export declare function stringifyTheme(baseTheme?: Record<string, any>): string;
+13
View File
@@ -0,0 +1,13 @@
import { CreateMUIStyled } from '@mui/system';
import { Theme } from "./createTheme.js";
export { default as slotShouldForwardProp } from "./slotShouldForwardProp.js";
export { default as rootShouldForwardProp } from "./rootShouldForwardProp.js";
/**
* Custom styled utility that has a default MUI theme.
* @param tag HTML tag or component that should serve as base.
* @param options Styled options for the created component.
* @returns React component that has styles attached to it.
*/
declare const styled: CreateMUIStyled<Theme>;
export default styled;
+2
View File
@@ -0,0 +1,2 @@
import { Theme } from "./createTheme.js";
export default function useTheme<T = Theme>(): T;
+42
View File
@@ -0,0 +1,42 @@
import { Theme } from "./createTheme.js";
import { Components } from "./components.js";
export interface ThemeWithProps {
components?: Components<Omit<Theme, 'components'>>;
}
export type ThemedProps<Theme, Name extends keyof any> = Theme extends {
components: Record<Name, {
defaultProps: infer Props;
}>;
} ? Props : {};
/**
* Merges input `props` with the `defaultProps` for a component that were defined in the theme.
*
* The `defaultProps` are defined in the theme under `theme.components[componentName].defaultProps`.
*
* @example
*
* ```tsx
* const createTheme = () => ({
* components: {
* MuiStat: {
* defaultProps: {
* variant: 'outlined',
* },
* },
* },
* });
*
* function Stat(props) {
* const themeProps = useThemeProps({ props, name: 'MuiStat' });
* return <div {...themeProps} />;
* }
* ```
*
* @param params.props The input props
* @param params.name The name of the component as defined in the theme
*/
export default function useThemeProps<Theme extends ThemeWithProps, Props, Name extends keyof any>(params: {
props: Props;
name: Name;
}): Props & ThemedProps<Theme, Name>;
+10
View File
@@ -0,0 +1,10 @@
import { Interpolation } from '@mui/system';
import { ComponentsPropsList } from "./props.js";
export type ComponentsVariants<Theme = unknown> = { [Name in keyof ComponentsPropsList]?: Array<{
props: Partial<ComponentsPropsList[Name]> | ((props: Partial<ComponentsPropsList[Name]> & {
ownerState: Partial<ComponentsPropsList[Name]>;
}) => boolean);
style: Interpolation<{
theme: Theme;
}>;
}> };
+1
View File
@@ -0,0 +1 @@
export default function withStyles(stylesCreator: any, options?: object): never;
+1
View File
@@ -0,0 +1 @@
export default function withTheme(Component: any): never;
+13
View File
@@ -0,0 +1,13 @@
export interface ZIndex {
mobileStepper: number;
speedDial: number;
appBar: number;
drawer: number;
modal: number;
snackbar: number;
tooltip: number;
fab: number;
}
export type ZIndexOptions = Partial<ZIndex>;
declare const zIndex: ZIndex;
export default zIndex;