import * as React from 'react'; import * as CSS from 'csstype'; import * as hoistNonReactStatics from 'hoist-non-react-statics'; type WithOptionalTheme

= OmitU & { theme?: T | undefined; }; // Helper type operators // Pick that distributes over union types export type PickU = T extends any ? { [P in K]: T[P] } : never; export type OmitU = T extends any ? PickU> : never; // Any prop that has a default prop becomes optional, but its type is unchanged // Undeclared default props are augmented into the resulting allowable attributes // If declared props have indexed properties, ignore default props entirely as keyof gets widened // Wrap in an outer-level conditional type to allow distribution over props that are unions type Defaultize = P extends any ? string extends keyof P ? P : PickU> & Partial>> & Partial>> : never; export type IntrinsicElementsKeys = keyof React.JSX.IntrinsicElements; type ReactDefaultizedProps = C extends { defaultProps: infer D; } ? Defaultize : P; type MakeAttrsOptional, O extends object, A extends keyof P, P = React.ComponentPropsWithRef ? C : never>> = // Distribute unions early to avoid quadratic expansion P extends any ? OmitU & O, A> & Partial> : never; export type StyledComponentProps< // The Component from whose props are derived C extends string | React.ComponentType, // The Theme from the current context T extends object, // The other props added by the template O extends object, // The props that are made optional by .attrs A extends keyof any, // The Component passed with "forwardedAs" prop FAsC extends string | React.ComponentType = C> = // Distribute O if O is a union type O extends object ? WithOptionalTheme & MakeAttrsOptional, T> : never; export interface ThemeProps { theme: T; } export type ThemedStyledProps = P & ThemeProps; export interface Keyframes { getName(): string; } export * from 'styled-components'; export { default } from 'styled-components'; export { default as StyledEngineProvider } from "./StyledEngineProvider/index.js"; export { default as GlobalStyles } from "./GlobalStyles/index.js"; export * from "./GlobalStyles/index.js"; /** * For internal usage in `@mui/system` package */ // eslint-disable-next-line @typescript-eslint/naming-convention export function internal_mutateStyles(tag: React.ElementType, processor: (styles: any) => any): void; // Not needed anymore, but fixes https://github.com/mui/material-ui/issues/44112 // TODO: Remove it in v7 // eslint-disable-next-line @typescript-eslint/naming-convention export function internal_processStyles(tag: React.ElementType, processor: (styles: any) => any): void; // eslint-disable-next-line @typescript-eslint/naming-convention export function internal_serializeStyles

(styles: Interpolation

): object; // These are the same as the ones in @mui/styled-engine // CSS.PropertiesFallback are necessary so that we support spreading of the mixins. For example: // '@font-face'?: Fontface | Fontface[] export type CSSProperties = CSS.PropertiesFallback; export type CSSPropertiesWithMultiValues = { [K in keyof CSSProperties]: CSSProperties[K] | Array> }; export type CSSPseudos = { [K in CSS.Pseudos]?: unknown | CSSObject }; export interface CSSOthersObject { [propertiesName: string]: unknown | CSSInterpolation; } export type CSSPseudosForCSSObject = { [K in CSS.Pseudos]?: CSSObject }; export interface ArrayCSSInterpolation extends Array {} export interface CSSOthersObjectForCSSObject { [propertiesName: string]: CSSInterpolation; } // Omit variants as a key, because we have a special handling for it export interface CSSObject extends CSSPropertiesWithMultiValues, CSSPseudos, Omit {} interface CSSObjectWithVariants extends Omit { variants: Array<{ props: Props | ((props: Props) => boolean); style: CSSObject | ((args: Props extends { theme: any; } ? { theme: Props['theme']; } : any) => CSSObject); }>; } export type FalseyValue = undefined | null | false; export type Interpolation

= InterpolationValue | CSSObjectWithVariants

| InterpolationFunction

| FlattenInterpolation

; // cannot be made a self-referential interface, breaks WithPropNested // see https://github.com/microsoft/TypeScript/issues/34796 export type FlattenInterpolation

= ReadonlyArray>; export type InterpolationValue = string | number | FalseyValue | Keyframes | StyledComponentInterpolation | CSSObject; export type SimpleInterpolation = InterpolationValue | FlattenSimpleInterpolation; // adapter for compatibility with @mui/styled-engine export type CSSInterpolation = SimpleInterpolation; export type FlattenSimpleInterpolation = ReadonlyArray; export type InterpolationFunction

= (props: P) => Interpolation

; // abuse Pick to strip the call signature from ForwardRefExoticComponent type ForwardRefExoticBase

= PickU, keyof React.ForwardRefExoticComponent>; type StyledComponentPropsWithAs, T extends object, O extends object, A extends keyof any, AsC extends string | React.ComponentType = C, FAsC extends string | React.ComponentType = C> = StyledComponentProps & { as?: AsC | undefined; forwardedAs?: FAsC | undefined; }; export type StyledComponent, T extends object = {}, O extends object = {}, A extends keyof any = never> = // the "string" allows this to be used as an object key // I really want to avoid this if possible but it's the only way to use nesting with object styles... string & StyledComponentBase & hoistNonReactStatics.NonReactStatics ? C : never>; // any doesn't count as assignable to never in the extends clause, and we default A to never export type AnyStyledComponent = StyledComponent | StyledComponent | React.FunctionComponent | React.ComponentType; export type StyledComponentInnerComponent = C extends StyledComponent ? I : C extends StyledComponent ? I : C; export type StyledComponentInnerOtherProps = C extends StyledComponent ? O : C extends StyledComponent ? O : never; export type StyledComponentInnerAttrs = C extends StyledComponent ? A : never; export interface StyledComponentBase, T extends object, O extends object = {}, A extends keyof any = never> extends ForwardRefExoticBase> { // add our own fake call signature to implement the polymorphic 'as' prop (props: StyledComponentProps & { as?: never | undefined; forwardedAs?: never | undefined; }): React.ReactElement>; = C, FAsC extends string | React.ComponentType = AsC>(props: StyledComponentPropsWithAs): React.ReactElement>; withComponent(component: WithC): StyledComponent, T, O & StyledComponentInnerOtherProps, A | StyledComponentInnerAttrs>; withComponent>(component: WithC): StyledComponent; } // remove the call signature from StyledComponent so Interpolation can still infer InterpolationFunction type StyledComponentInterpolation = Pick, keyof StyledComponentBase> | Pick, keyof StyledComponentBase>; // These are typings coming from styled-components // They are adjusted to accept the extended options coming from mui type AnyIfEmpty = keyof T extends never ? any : T; type ThemedStyledComponentFactories = { [TTag in keyof React.JSX.IntrinsicElements]: ThemedStyledFunctionBase }; export type StyledComponentPropsWithRef> = C extends AnyStyledComponent ? React.ComponentPropsWithRef> : React.ComponentPropsWithRef; // Same as in styled-components, but copied here so that it would use the Interpolation & CSS typings from above export interface ThemedStyledFunctionBase, T extends object, O extends object = {}, A extends keyof any = never> { (first: TemplateStringsArray): StyledComponent; (first: TemplateStringsArray | CSSObject | InterpolationFunction & O, T>>, ...other: Array & O, T>>>): StyledComponent; (first: TemplateStringsArray | CSSObject | InterpolationFunction & O & U, T>>, ...other: Array & O & U, T>>>): StyledComponent; } // same as ThemedStyledFunction in styled-components, but without attrs, and withConfig export interface ThemedStyledFunction, T extends object, O extends object = {}, A extends keyof any = never> extends ThemedStyledFunctionBase {} export type CreateStyledComponent = ThemedStyledFunction, T, SpecificComponentProps & JSXProps>; // Config to be used with withConfig export interface StyledConfig { // TODO: Add all types from the original StyledComponentWrapperProperties componentId?: string; displayName?: string; label?: string; target?: string; shouldForwardProp?: ((prop: keyof O, defaultValidatorFn: (prop: keyof O) => boolean) => boolean) | undefined; } /** Same as StyledConfig but shouldForwardProp must be a type guard */ export interface FilteringStyledOptions { componentId?: string; displayName?: string; label?: string; shouldForwardProp?(propName: PropertyKey): propName is ForwardedProps; target?: string; } // same as ThemedBaseStyledInterface in styled-components, but with added options & common props for MUI components export interface ThemedBaseStyledInterface extends ThemedStyledComponentFactories { >, ForwardedProps extends keyof React.ComponentProps = keyof React.ComponentProps>(component: C, options: FilteringStyledOptions, ForwardedProps> & MuiStyledOptions): CreateStyledComponent, ForwardedProps> & MUIStyledCommonProps, {}, { ref?: React.Ref>; }, Theme>; >>(component: C, options?: StyledConfig & MUIStyledCommonProps> & MuiStyledOptions): CreateStyledComponent & MUIStyledCommonProps, {}, { ref?: React.Ref>; }, Theme>; >, ForwardedProps extends keyof React.ComponentProps = keyof React.ComponentProps>(component: C, options: FilteringStyledOptions, ForwardedProps> & MuiStyledOptions): CreateStyledComponent, ForwardedProps> & MUIStyledCommonProps, {}, {}, Theme>; >>(component: C, options?: StyledConfig & MUIStyledCommonProps> & MuiStyledOptions): CreateStyledComponent & MUIStyledCommonProps, {}, {}, Theme>; (tag: Tag, options: FilteringStyledOptions & MuiStyledOptions): CreateStyledComponent, {}, Theme>; (tag: Tag, options?: StyledConfig & MuiStyledOptions): CreateStyledComponent; } export type CreateMUIStyled = ThemedBaseStyledInterface>; export type PropsOf> = React.JSX.LibraryManagedAttributes>; export interface MUIStyledComponent extends React.FC { withComponent>>(component: C): MUIStyledComponent, {}, { ref?: React.Ref>; }>; withComponent>>(component: C): MUIStyledComponent>; withComponent(tag: Tag): MUIStyledComponent; }