From 592f0b5e0a6137ddc0da7e231bc923cb4f6d69f1 Mon Sep 17 00:00:00 2001 From: Abbas Yadollahi Date: Mon, 16 Mar 2020 16:52:27 -0400 Subject: [PATCH] [core] Update type defs to use OverridableComponent (#20110) --- packages/material-ui/src/Badge/Badge.d.ts | 96 ++++++++++--------- .../BottomNavigation/BottomNavigation.d.ts | 59 ++++++------ .../src/CardContent/CardContent.d.ts | 16 +++- .../src/CardHeader/CardHeader.d.ts | 31 +++--- .../material-ui/src/Container/Container.d.ts | 23 +++-- .../src/FormHelperText/FormHelperText.d.ts | 31 +++--- .../material-ui/src/GridList/GridList.d.ts | 23 +++-- .../src/GridListTile/GridListTile.d.ts | 21 ++-- packages/material-ui/src/Icon/Icon.d.ts | 22 +++-- .../src/InputAdornment/InputAdornment.d.ts | 25 +++-- packages/material-ui/src/Slider/Slider.d.ts | 67 ++++++------- packages/material-ui/src/SvgIcon/SvgIcon.d.ts | 96 ++++++++++--------- packages/material-ui/src/Table/Table.d.ts | 28 +++--- .../material-ui/src/TableBody/TableBody.d.ts | 17 ++-- .../src/TableContainer/TableContainer.d.ts | 16 ++-- .../src/TableFooter/TableFooter.d.ts | 17 ++-- .../material-ui/src/TableHead/TableHead.d.ts | 17 ++-- .../material-ui/src/TableRow/TableRow.d.ts | 20 ++-- packages/material-ui/src/Toolbar/Toolbar.d.ts | 21 ++-- 19 files changed, 377 insertions(+), 269 deletions(-) diff --git a/packages/material-ui/src/Badge/Badge.d.ts b/packages/material-ui/src/Badge/Badge.d.ts index 16f2d010059244..32aa564b281e6d 100644 --- a/packages/material-ui/src/Badge/Badge.d.ts +++ b/packages/material-ui/src/Badge/Badge.d.ts @@ -1,54 +1,53 @@ import * as React from 'react'; -import { StandardProps, PropTypes } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; export interface BadgeOrigin { vertical: 'top' | 'bottom'; horizontal: 'left' | 'right'; } -export interface BadgeProps - extends StandardProps, BadgeClassKey> { - /** - * The anchor of the badge. - */ - anchorOrigin?: BadgeOrigin; - /** - * Wrapped shape the badge should overlap. - */ - overlap?: 'rectangle' | 'circle'; - /** - * The content rendered within the badge. - */ - badgeContent?: React.ReactNode; - /** - * The badge will be added relative to this node. - */ - children: React.ReactNode; - /** - * The color of the component. It supports those theme colors that make sense for this component. - */ - color?: 'primary' | 'secondary' | 'default' | 'error'; - /** - * The component used for the root node. - * Either a string to use a DOM element or a component. - */ - component?: React.ElementType>; - /** - * If `true`, the badge will be invisible. - */ - invisible?: boolean; - /** - * Max count to show. - */ - max?: number; - /** - * Controls whether the badge is hidden when `badgeContent` is zero. - */ - showZero?: boolean; - /** - * The variant to use. - */ - variant?: 'standard' | 'dot'; +export interface BadgeTypeMap

{ + props: P & { + /** + * The anchor of the badge. + */ + anchorOrigin?: BadgeOrigin; + /** + * Wrapped shape the badge should overlap. + */ + overlap?: 'rectangle' | 'circle'; + /** + * The content rendered within the badge. + */ + badgeContent?: React.ReactNode; + /** + * The badge will be added relative to this node. + */ + children: React.ReactNode; + /** + * The color of the component. + * It supports those theme colors that make sense for this component. + */ + color?: 'primary' | 'secondary' | 'default' | 'error'; + /** + * If `true`, the badge will be invisible. + */ + invisible?: boolean; + /** + * Max count to show. + */ + max?: number; + /** + * Controls whether the badge is hidden when `badgeContent` is zero. + */ + showZero?: boolean; + /** + * The variant to use. + */ + variant?: 'standard' | 'dot'; + }; + defaultComponent: D; + classKey: BadgeClassKey; } export type BadgeClassKey = @@ -67,4 +66,11 @@ export type BadgeClassKey = | 'anchorOriginTopLeftCircle' | 'invisible'; -export default function Badge(props: BadgeProps): JSX.Element | null; +declare const Badge: OverridableComponent; + +export type BadgeProps< + D extends React.ElementType = BadgeTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; + +export default Badge; diff --git a/packages/material-ui/src/BottomNavigation/BottomNavigation.d.ts b/packages/material-ui/src/BottomNavigation/BottomNavigation.d.ts index cd1a6dc921b40d..132defc6f21476 100644 --- a/packages/material-ui/src/BottomNavigation/BottomNavigation.d.ts +++ b/packages/material-ui/src/BottomNavigation/BottomNavigation.d.ts @@ -1,35 +1,36 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface BottomNavigationProps - extends StandardProps< - React.HTMLAttributes, - BottomNavigationClassKey, - 'onChange' - > { - /** - * The component used for the root node. - * Either a string to use a DOM element or a component. - */ - component?: React.ElementType>; - /** - * Callback fired when the value changes. - * - * @param {object} event The event source of the callback. - * @param {any} value We default to the index of the child. - */ - onChange?(event: React.ChangeEvent<{}>, value: any): void; - /** - * If `true`, all `BottomNavigationAction`s will show their labels. - * By default, only the selected `BottomNavigationAction` will show its label. - */ - showLabels?: boolean; - /** - * The value of the currently selected `BottomNavigationAction`. - */ - value?: any; +export interface BottomNavigationTypeMap

{ + props: P & { + /** + * Callback fired when the value changes. + * + * @param {object} event The event source of the callback. + * @param {any} value We default to the index of the child. + */ + onChange?: (event: React.ChangeEvent<{}>, value: any) => void; + /** + * If `true`, all `BottomNavigationAction`s will show their labels. + * By default, only the selected `BottomNavigationAction` will show its label. + */ + showLabels?: boolean; + /** + * The value of the currently selected `BottomNavigationAction`. + */ + value?: any; + }; + defaultComponent: D; + classKey: BottomNavigationClassKey; } +declare const BottomNavigation: OverridableComponent; + export type BottomNavigationClassKey = 'root'; -export default function BottomNavigation(props: BottomNavigationProps): JSX.Element; +export type BottomNavigationProps< + D extends React.ElementType = BottomNavigationTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; + +export default BottomNavigation; diff --git a/packages/material-ui/src/CardContent/CardContent.d.ts b/packages/material-ui/src/CardContent/CardContent.d.ts index e8c28175d86b48..f79d8b16b65bfb 100644 --- a/packages/material-ui/src/CardContent/CardContent.d.ts +++ b/packages/material-ui/src/CardContent/CardContent.d.ts @@ -1,13 +1,19 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface CardContentProps - extends StandardProps, CardContentClassKey> { - component?: React.ElementType>; +export interface CardContentTypeMap

{ + props: P; + defaultComponent: D; + classKey: CardContentClassKey; } +declare const CardContent: OverridableComponent; + export type CardContentClassKey = 'root'; -declare const CardContent: React.ComponentType; +export type CardContentProps< + D extends React.ElementType = CardContentTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default CardContent; diff --git a/packages/material-ui/src/CardHeader/CardHeader.d.ts b/packages/material-ui/src/CardHeader/CardHeader.d.ts index d7396370175090..3bb5a422b24bb5 100644 --- a/packages/material-ui/src/CardHeader/CardHeader.d.ts +++ b/packages/material-ui/src/CardHeader/CardHeader.d.ts @@ -1,21 +1,28 @@ import * as React from 'react'; -import { StandardProps } from '..'; import { TypographyProps } from '../Typography'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface CardHeaderProps - extends StandardProps, CardHeaderClassKey, 'title'> { - action?: React.ReactNode; - avatar?: React.ReactNode; - component?: React.ElementType>; - disableTypography?: boolean; - subheader?: React.ReactNode; - subheaderTypographyProps?: Partial; - title?: React.ReactNode; - titleTypographyProps?: Partial; +export interface CardHeaderTypeMap

{ + props: P & { + action?: React.ReactNode; + avatar?: React.ReactNode; + disableTypography?: boolean; + subheader?: React.ReactNode; + subheaderTypographyProps?: Partial; + title?: React.ReactNode; + titleTypographyProps?: Partial; + }; + defaultComponent: D; + classKey: CardHeaderClassKey; } +declare const CardHeader: OverridableComponent; + export type CardHeaderClassKey = 'root' | 'avatar' | 'action' | 'content' | 'title' | 'subheader'; -declare const CardHeader: React.ComponentType; +export type CardHeaderProps< + D extends React.ElementType = CardHeaderTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default CardHeader; diff --git a/packages/material-ui/src/Container/Container.d.ts b/packages/material-ui/src/Container/Container.d.ts index 4b1a9ad52033ac..64a4ee00c8e26d 100644 --- a/packages/material-ui/src/Container/Container.d.ts +++ b/packages/material-ui/src/Container/Container.d.ts @@ -1,14 +1,18 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface ContainerProps - extends StandardProps, ContainerClassKey> { - component?: React.ElementType>; - disableGutters?: boolean; - fixed?: boolean; - maxWidth?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false; +export interface ContainerTypeMap

{ + props: P & { + disableGutters?: boolean; + fixed?: boolean; + maxWidth?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false; + }; + defaultComponent: D; + classKey: ContainerClassKey; } +declare const Container: OverridableComponent; + export type ContainerClassKey = | 'root' | 'disableGutters' @@ -19,6 +23,9 @@ export type ContainerClassKey = | 'maxWidthLg' | 'maxWidthXl'; -declare const Container: React.ComponentType; +export type ContainerProps< + D extends React.ElementType = ContainerTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default Container; diff --git a/packages/material-ui/src/FormHelperText/FormHelperText.d.ts b/packages/material-ui/src/FormHelperText/FormHelperText.d.ts index 82b4beac86da34..bad06a1cd7a99f 100644 --- a/packages/material-ui/src/FormHelperText/FormHelperText.d.ts +++ b/packages/material-ui/src/FormHelperText/FormHelperText.d.ts @@ -1,18 +1,22 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface FormHelperTextProps - extends StandardProps, FormHelperTextClassKey> { - disabled?: boolean; - error?: boolean; - filled?: boolean; - focused?: boolean; - component?: React.ElementType>; - margin?: 'dense'; - required?: boolean; - variant?: 'standard' | 'outlined' | 'filled'; +export interface FormHelperTextTypeMap

{ + props: P & { + disabled?: boolean; + error?: boolean; + filled?: boolean; + focused?: boolean; + margin?: 'dense'; + required?: boolean; + variant?: 'standard' | 'outlined' | 'filled'; + }; + defaultComponent: D; + classKey: FormHelperTextClassKey; } +declare const FormHelperText: OverridableComponent; + export type FormHelperTextClassKey = | 'root' | 'error' @@ -23,6 +27,9 @@ export type FormHelperTextClassKey = | 'contained' | 'required'; -declare const FormHelperText: React.ComponentType; +export type FormHelperTextProps< + D extends React.ElementType = FormHelperTextTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default FormHelperText; diff --git a/packages/material-ui/src/GridList/GridList.d.ts b/packages/material-ui/src/GridList/GridList.d.ts index 6882669dcdd079..2598cf93851d3b 100644 --- a/packages/material-ui/src/GridList/GridList.d.ts +++ b/packages/material-ui/src/GridList/GridList.d.ts @@ -1,16 +1,23 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface GridListProps - extends StandardProps, GridListClassKey> { - cellHeight?: number | 'auto'; - cols?: number; - component?: React.ElementType>; - spacing?: number; +export interface GridListTypeMap

{ + props: P & { + cellHeight?: number | 'auto'; + cols?: number; + spacing?: number; + }; + defaultComponent: D; + classKey: GridListClassKey; } +declare const GridList: OverridableComponent; + export type GridListClassKey = 'root'; -declare const GridList: React.ComponentType; +export type GridListProps< + D extends React.ElementType = GridListTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default GridList; diff --git a/packages/material-ui/src/GridListTile/GridListTile.d.ts b/packages/material-ui/src/GridListTile/GridListTile.d.ts index 0c08377cb68ea5..958cb324e3ab17 100644 --- a/packages/material-ui/src/GridListTile/GridListTile.d.ts +++ b/packages/material-ui/src/GridListTile/GridListTile.d.ts @@ -1,15 +1,22 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface GridListTileProps - extends StandardProps, GridListTileClassKey> { - cols?: number; - component?: React.ElementType>; - rows?: number; +export interface GridListTileTypeMap

{ + props: P & { + cols?: number; + rows?: number; + }; + defaultComponent: D; + classKey: GridListTileClassKey; } +declare const GridListTile: OverridableComponent; + export type GridListTileClassKey = 'root' | 'tile' | 'imgFullHeight' | 'imgFullWidth'; -declare const GridListTile: React.ComponentType; +export type GridListTileProps< + D extends React.ElementType = GridListTileTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default GridListTile; diff --git a/packages/material-ui/src/Icon/Icon.d.ts b/packages/material-ui/src/Icon/Icon.d.ts index 8c3a3a43d9fa22..98d08d787e7d21 100644 --- a/packages/material-ui/src/Icon/Icon.d.ts +++ b/packages/material-ui/src/Icon/Icon.d.ts @@ -1,13 +1,18 @@ import * as React from 'react'; -import { StandardProps, PropTypes } from '..'; +import { PropTypes } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface IconProps - extends StandardProps, IconClassKey> { - color?: PropTypes.Color | 'action' | 'disabled' | 'error'; - component?: React.ElementType>; - fontSize?: 'inherit' | 'default' | 'small' | 'large'; +export interface IconTypeMap

{ + props: P & { + color?: PropTypes.Color | 'action' | 'disabled' | 'error'; + fontSize?: 'inherit' | 'default' | 'small' | 'large'; + }; + defaultComponent: D; + classKey: IconClassKey; } +declare const Icon: OverridableComponent; + export type IconClassKey = | 'root' | 'colorSecondary' @@ -19,6 +24,9 @@ export type IconClassKey = | 'fontSizeSmall' | 'fontSizeLarge'; -declare const Icon: React.ComponentType; +export type IconProps< + D extends React.ElementType = IconTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default Icon; diff --git a/packages/material-ui/src/InputAdornment/InputAdornment.d.ts b/packages/material-ui/src/InputAdornment/InputAdornment.d.ts index c782e88fae4deb..d1c94e09c25f00 100644 --- a/packages/material-ui/src/InputAdornment/InputAdornment.d.ts +++ b/packages/material-ui/src/InputAdornment/InputAdornment.d.ts @@ -1,15 +1,19 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface InputAdornmentProps - extends StandardProps, InputAdornmentClassKey> { - component?: React.ElementType>; - disablePointerEvents?: boolean; - disableTypography?: boolean; - position: 'start' | 'end'; - variant?: 'standard' | 'outlined' | 'filled'; +export interface InputAdornmentTypeMap

{ + props: P & { + disablePointerEvents?: boolean; + disableTypography?: boolean; + position: 'start' | 'end'; + variant?: 'standard' | 'outlined' | 'filled'; + }; + defaultComponent: D; + classKey: InputAdornmentClassKey; } +declare const InputAdornment: OverridableComponent; + export type InputAdornmentClassKey = | 'root' | 'filled' @@ -19,6 +23,9 @@ export type InputAdornmentClassKey = | 'hiddenLabel' | 'marginDense'; -declare const InputAdornment: React.ComponentType; +export type InputAdornmentProps< + D extends React.ElementType = InputAdornmentTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default InputAdornment; diff --git a/packages/material-ui/src/Slider/Slider.d.ts b/packages/material-ui/src/Slider/Slider.d.ts index dc59eebbb25256..22e982ec2b9fcf 100644 --- a/packages/material-ui/src/Slider/Slider.d.ts +++ b/packages/material-ui/src/Slider/Slider.d.ts @@ -1,5 +1,5 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; export interface Mark { value: number; @@ -12,38 +12,38 @@ export interface ValueLabelProps extends React.HTMLAttributes { children: React.ReactElement; } -export interface SliderProps - extends StandardProps< - React.HTMLAttributes, - SliderClassKey, - 'defaultValue' | 'onChange' - > { - 'aria-label'?: string; - 'aria-labelledby'?: string; - 'aria-valuetext'?: string; - color?: 'primary' | 'secondary'; - component?: React.ElementType>; - defaultValue?: number | number[]; - disabled?: boolean; - getAriaLabel?: (index: number) => string; - getAriaValueText?: (value: number, index: number) => string; - marks?: boolean | Mark[]; - max?: number; - min?: number; - name?: string; - onChange?: (event: React.ChangeEvent<{}>, value: number | number[]) => void; - onChangeCommitted?: (event: React.ChangeEvent<{}>, value: number | number[]) => void; - orientation?: 'horizontal' | 'vertical'; - step?: number | null; - scale?: (value: number) => number; - ThumbComponent?: React.ElementType>; - track?: 'normal' | false | 'inverted'; - value?: number | number[]; - ValueLabelComponent?: React.ElementType; - valueLabelDisplay?: 'on' | 'auto' | 'off'; - valueLabelFormat?: string | ((value: number, index: number) => React.ReactNode); +export interface SliderTypeMap

{ + props: P & { + 'aria-label'?: string; + 'aria-labelledby'?: string; + 'aria-valuetext'?: string; + color?: 'primary' | 'secondary'; + defaultValue?: number | number[]; + disabled?: boolean; + getAriaLabel?: (index: number) => string; + getAriaValueText?: (value: number, index: number) => string; + marks?: boolean | Mark[]; + max?: number; + min?: number; + name?: string; + onChange?: (event: React.ChangeEvent<{}>, value: number | number[]) => void; + onChangeCommitted?: (event: React.ChangeEvent<{}>, value: number | number[]) => void; + orientation?: 'horizontal' | 'vertical'; + step?: number | null; + scale?: (value: number) => number; + ThumbComponent?: React.ElementType>; + track?: 'normal' | false | 'inverted'; + value?: number | number[]; + ValueLabelComponent?: React.ElementType; + valueLabelDisplay?: 'on' | 'auto' | 'off'; + valueLabelFormat?: string | ((value: number, index: number) => React.ReactNode); + }; + defaultComponent: D; + classKey: SliderClassKey; } +declare const Slider: OverridableComponent; + export type SliderClassKey = | 'root' | 'colorPrimary' @@ -65,6 +65,9 @@ export type SliderClassKey = | 'markLabel' | 'markLabelActive'; -declare const Slider: React.ComponentType; +export type SliderProps< + D extends React.ElementType = SliderTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default Slider; diff --git a/packages/material-ui/src/SvgIcon/SvgIcon.d.ts b/packages/material-ui/src/SvgIcon/SvgIcon.d.ts index f4179222ce7a81..5c5ec06664966d 100644 --- a/packages/material-ui/src/SvgIcon/SvgIcon.d.ts +++ b/packages/material-ui/src/SvgIcon/SvgIcon.d.ts @@ -1,52 +1,51 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface SvgIconProps - extends StandardProps, SvgIconClassKey, 'children'> { - /** - * Node passed into the SVG element. - */ - children?: React.ReactNode; - /** - * The color of the component. It supports those theme colors that make sense for this component. - * You can use the `htmlColor` prop to apply a color attribute to the SVG element. - */ - color?: 'inherit' | 'primary' | 'secondary' | 'action' | 'disabled' | 'error'; - /** - * The component used for the root node. - * Either a string to use a DOM element or a component. - */ - component?: React.ElementType>; - /** - * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size. - */ - fontSize?: 'inherit' | 'default' | 'small' | 'large'; - /** - * Applies a color attribute to the SVG element. - */ - htmlColor?: string; - /** - * The shape-rendering attribute. The behavior of the different options is described on the - * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering). - * If you are having issues with blurry icons you should investigate this property. - * @document - */ - shapeRendering?: string; - /** - * Provides a human-readable title for the element that contains it. - * https://www.w3.org/TR/SVG-access/#Equivalent - */ - titleAccess?: string; - /** - * Allows you to redefine what the coordinates without units mean inside an SVG element. - * For example, if the SVG element is 500 (width) by 200 (height), - * and you pass viewBox="0 0 50 20", - * this means that the coordinates inside the SVG will go from the top left corner (0,0) - * to bottom right (50,20) and each unit will be worth 10px. - */ - viewBox?: string; +export interface SvgIconTypeMap

{ + props: P & { + /** + * Node passed into the SVG element. + */ + children?: React.ReactNode; + /** + * The color of the component. It supports those theme colors that make sense for this component. + * You can use the `htmlColor` prop to apply a color attribute to the SVG element. + */ + color?: 'inherit' | 'primary' | 'secondary' | 'action' | 'disabled' | 'error'; + /** + * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size. + */ + fontSize?: 'inherit' | 'default' | 'small' | 'large'; + /** + * Applies a color attribute to the SVG element. + */ + htmlColor?: string; + /** + * The shape-rendering attribute. The behavior of the different options is described on the + * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering). + * If you are having issues with blurry icons you should investigate this property. + * @document + */ + shapeRendering?: string; + /** + * Provides a human-readable title for the element that contains it. + * https://www.w3.org/TR/SVG-access/#Equivalent + */ + titleAccess?: string; + /** + * Allows you to redefine what the coordinates without units mean inside an SVG element. + * For example, if the SVG element is 500 (width) by 200 (height), and you pass viewBox="0 0 50 20", + * this means that the coordinates inside the SVG will go from the top left corner (0,0) + * to bottom right (50,20) and each unit will be worth 10px. + */ + viewBox?: string; + }; + defaultComponent: D; + classKey: SvgIconClassKey; } +declare const SvgIcon: OverridableComponent; + export type SvgIconClassKey = | 'root' | 'colorSecondary' @@ -58,4 +57,9 @@ export type SvgIconClassKey = | 'fontSizeSmall' | 'fontSizeLarge'; -export default function SvgIcon(props: SvgIconProps): JSX.Element; +export type SvgIconProps< + D extends React.ElementType = SvgIconTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; + +export default SvgIcon; diff --git a/packages/material-ui/src/Table/Table.d.ts b/packages/material-ui/src/Table/Table.d.ts index 03a4aaac745f03..e5c335d6bf2f6e 100644 --- a/packages/material-ui/src/Table/Table.d.ts +++ b/packages/material-ui/src/Table/Table.d.ts @@ -1,21 +1,27 @@ import * as React from 'react'; -import { StandardProps } from '..'; - -export interface TableProps extends StandardProps { - component?: React.ElementType; - padding?: Padding; - size?: Size; - stickyHeader?: boolean; -} - -export type TableBaseProps = React.TableHTMLAttributes; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; export type Padding = 'default' | 'checkbox' | 'none'; export type Size = 'small' | 'medium'; +export interface TableTypeMap

{ + props: P & { + padding?: Padding; + size?: Size; + stickyHeader?: boolean; + }; + defaultComponent: D; + classKey: TableClassKey; +} + +declare const Table: OverridableComponent; + export type TableClassKey = 'root' | 'stickyHeader'; -declare const Table: React.ComponentType; +export type TableProps< + D extends React.ElementType = TableTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default Table; diff --git a/packages/material-ui/src/TableBody/TableBody.d.ts b/packages/material-ui/src/TableBody/TableBody.d.ts index 049401cddb40fd..23c3dc464feb6f 100644 --- a/packages/material-ui/src/TableBody/TableBody.d.ts +++ b/packages/material-ui/src/TableBody/TableBody.d.ts @@ -1,14 +1,19 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface TableBodyProps extends StandardProps { - component?: React.ElementType; +export interface TableBodyTypeMap

{ + props: P; + defaultComponent: D; + classKey: TableBodyClassKey; } -export type TableBodyClassKey = 'root'; +declare const TableBody: OverridableComponent; -export type TableBodyBaseProps = React.HTMLAttributes; +export type TableBodyClassKey = 'root'; -declare const TableBody: React.ComponentType; +export type TableBodyProps< + D extends React.ElementType = TableBodyTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default TableBody; diff --git a/packages/material-ui/src/TableContainer/TableContainer.d.ts b/packages/material-ui/src/TableContainer/TableContainer.d.ts index 331c4ea85c6b6c..8efeb5e35475f2 100644 --- a/packages/material-ui/src/TableContainer/TableContainer.d.ts +++ b/packages/material-ui/src/TableContainer/TableContainer.d.ts @@ -1,15 +1,19 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface TableContainerProps - extends StandardProps { - component?: React.ElementType; +export interface TableContainerTypeMap

{ + props: P; + defaultComponent: D; + classKey: TableContainerClassKey; } -export type TableContainerBaseProps = React.HTMLAttributes; +declare const TableContainer: OverridableComponent; export type TableContainerClassKey = 'root'; -declare const TableContainer: React.ComponentType; +export type TableContainerProps< + D extends React.ElementType = TableContainerTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default TableContainer; diff --git a/packages/material-ui/src/TableFooter/TableFooter.d.ts b/packages/material-ui/src/TableFooter/TableFooter.d.ts index c67d6075cfb6d7..be6fdddc4c867f 100644 --- a/packages/material-ui/src/TableFooter/TableFooter.d.ts +++ b/packages/material-ui/src/TableFooter/TableFooter.d.ts @@ -1,14 +1,19 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface TableFooterProps extends StandardProps { - component?: React.ElementType; +export interface TableFooterTypeMap

{ + props: P; + defaultComponent: D; + classKey: TableFooterClassKey; } -export type TableFooterClassKey = 'root'; +declare const TableFooter: OverridableComponent; -export type TableFooterBaseProps = React.HTMLAttributes; +export type TableFooterClassKey = 'root'; -declare const TableFooter: React.ComponentType; +export type TableFooterProps< + D extends React.ElementType = TableFooterTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default TableFooter; diff --git a/packages/material-ui/src/TableHead/TableHead.d.ts b/packages/material-ui/src/TableHead/TableHead.d.ts index c25d99f40f150b..cf41cd82b7de96 100644 --- a/packages/material-ui/src/TableHead/TableHead.d.ts +++ b/packages/material-ui/src/TableHead/TableHead.d.ts @@ -1,14 +1,19 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface TableHeadProps extends StandardProps { - component?: React.ElementType; +export interface TableHeadTypeMap

{ + props: P; + defaultComponent: D; + classKey: TableHeadClassKey; } -export type TableHeadClassKey = 'root'; +declare const TableHead: OverridableComponent; -export type TableHeadBaseProps = React.HTMLAttributes; +export type TableHeadClassKey = 'root'; -declare const TableHead: React.ComponentType; +export type TableHeadProps< + D extends React.ElementType = TableHeadTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default TableHead; diff --git a/packages/material-ui/src/TableRow/TableRow.d.ts b/packages/material-ui/src/TableRow/TableRow.d.ts index a32e77f041d976..372b4aa389d379 100644 --- a/packages/material-ui/src/TableRow/TableRow.d.ts +++ b/packages/material-ui/src/TableRow/TableRow.d.ts @@ -1,16 +1,22 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface TableRowProps extends StandardProps { - component?: React.ElementType; - hover?: boolean; - selected?: boolean; +export interface TableRowTypeMap

{ + props: P & { + hover?: boolean; + selected?: boolean; + }; + defaultComponent: D; + classKey: TableRowClassKey; } -export type TableRowBaseProps = React.HTMLAttributes; +declare const TableRow: OverridableComponent; export type TableRowClassKey = 'root' | 'selected' | 'hover' | 'head' | 'footer'; -declare const TableRow: React.ComponentType; +export type TableRowProps< + D extends React.ElementType = TableRowTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default TableRow; diff --git a/packages/material-ui/src/Toolbar/Toolbar.d.ts b/packages/material-ui/src/Toolbar/Toolbar.d.ts index b1590472f48ea5..dd5e3be9316306 100644 --- a/packages/material-ui/src/Toolbar/Toolbar.d.ts +++ b/packages/material-ui/src/Toolbar/Toolbar.d.ts @@ -1,15 +1,22 @@ import * as React from 'react'; -import { StandardProps } from '..'; +import { OverridableComponent, OverrideProps } from '../OverridableComponent'; -export interface ToolbarProps - extends StandardProps, ToolbarClassKey> { - component?: React.ElementType>; - disableGutters?: boolean; - variant?: 'regular' | 'dense'; +export interface ToolbarTypeMap

{ + props: P & { + disableGutters?: boolean; + variant?: 'regular' | 'dense'; + }; + defaultComponent: D; + classKey: ToolbarClassKey; } +declare const Toolbar: OverridableComponent; + export type ToolbarClassKey = 'root' | 'gutters' | 'regular' | 'dense'; -declare const Toolbar: React.ComponentType; +export type ToolbarProps< + D extends React.ElementType = ToolbarTypeMap['defaultComponent'], + P = {} +> = OverrideProps, D>; export default Toolbar;