@mui/material 5.14.6 → 5.14.8

package/TabScrollButton/TabScrollButton.d.ts

@@ -1,7 +1,8 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { SlotComponentProps } from '@mui/base';
-import { InternalStandardProps as StandardProps, SvgIcon, Theme } from '..';
+import { ButtonBaseProps } from '../ButtonBase';
+import { SvgIcon, Theme } from '..';
 import { TabScrollButtonClasses } from './tabScrollButtonClasses';
 
 export interface TabScrollButtonStartIconSlotPropsOverrides {}
@@ -11,7 +12,7 @@ export interface TabScrollButtonOwnerState extends TabScrollButtonProps {
   isRtl: boolean;
 }
 
-export interface TabScrollButtonProps extends StandardProps<React.HTMLAttributes<HTMLDivElement>> {
+export interface TabScrollButtonProps extends ButtonBaseProps {
   /**
    * The content of the component.
    */

package/Table/Table.d.ts

@@ -7,42 +7,44 @@ import { TableClasses } from './tableClasses';
 
 export interface TablePropsSizeOverrides {}
 
+export interface TableOwnProps {
+  /**
+   * The content of the table, normally `TableHead` and `TableBody`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableClasses>;
+  /**
+   * Allows TableCells to inherit padding of the Table.
+   * @default 'normal'
+   */
+  padding?: 'normal' | 'checkbox' | 'none';
+  /**
+   * Allows TableCells to inherit size of the Table.
+   * @default 'medium'
+   */
+  size?: OverridableStringUnion<'small' | 'medium', TablePropsSizeOverrides>;
+  /**
+   * Set the header sticky.
+   *
+   * ⚠️ It doesn't work with IE11.
+   * @default false
+   */
+  stickyHeader?: boolean;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export interface TableTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'table',
+  RootComponent extends React.ElementType = 'table',
 > {
-  props: AdditionalProps & {
-    /**
-     * The content of the table, normally `TableHead` and `TableBody`.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableClasses>;
-    /**
-     * Allows TableCells to inherit padding of the Table.
-     * @default 'normal'
-     */
-    padding?: 'normal' | 'checkbox' | 'none';
-    /**
-     * Allows TableCells to inherit size of the Table.
-     * @default 'medium'
-     */
-    size?: OverridableStringUnion<'small' | 'medium', TablePropsSizeOverrides>;
-    /**
-     * Set the header sticky.
-     *
-     * ⚠️ It doesn't work with IE11.
-     * @default false
-     */
-    stickyHeader?: boolean;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  *

package/TableBody/TableBody.d.ts

@@ -4,25 +4,27 @@ import { Theme } from '..';
 import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { TableBodyClasses } from './tableBodyClasses';
 
+export interface TableBodyOwnProps {
+  /**
+   * The content of the component, normally `TableRow`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableBodyClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export interface TableBodyTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'tbody',
+  RootComponent extends React.ElementType = 'tbody',
 > {
-  props: AdditionalProps & {
-    /**
-     * The content of the component, normally `TableRow`.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableBodyClasses>;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableBodyOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  *

package/TableContainer/TableContainer.d.ts

@@ -4,25 +4,27 @@ import { Theme } from '..';
 import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { TableContainerClasses } from './tableContainerClasses';
 
+export interface TableContainerOwnProps {
+  /**
+   * The content of the component, normally `Table`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableContainerClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export interface TableContainerTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'div',
+  RootComponent extends React.ElementType = 'div',
 > {
-  props: AdditionalProps & {
-    /**
-     * The content of the component, normally `Table`.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableContainerClasses>;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableContainerOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  *

package/TableFooter/TableFooter.d.ts

@@ -4,25 +4,27 @@ import { Theme } from '..';
 import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { TableFooterClasses } from './tableFooterClasses';
 
+export interface TableFooterOwnProps {
+  /**
+   * The content of the component, normally `TableRow`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableFooterClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export interface TableFooterTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'tfoot',
+  RootComponent extends React.ElementType = 'tfoot',
 > {
-  props: AdditionalProps & {
-    /**
-     * The content of the component, normally `TableRow`.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableFooterClasses>;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableFooterOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  *

package/TableHead/TableHead.d.ts

@@ -4,25 +4,27 @@ import { Theme } from '..';
 import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { TableHeadClasses } from './tableHeadClasses';
 
+export interface TableHeadOwnProps {
+  /**
+   * The content of the component, normally `TableRow`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableHeadClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export interface TableHeadTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'thead',
+  RootComponent extends React.ElementType = 'thead',
 > {
-  props: AdditionalProps & {
-    /**
-     * The content of the component, normally `TableRow`.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableHeadClasses>;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableHeadOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  *

package/TablePagination/TablePagination.d.ts

@@ -15,116 +15,119 @@ export interface LabelDisplayedRowsArgs {
   page: number;
 }
 
-export interface TablePaginationTypeMap<
-  AdditionalProps,
-  DefaultComponent extends React.ElementType,
-> {
-  props: AdditionalProps &
-    TablePaginationBaseProps & {
-      /**
-       * The component used for displaying the actions.
-       * Either a string to use a HTML element or a component.
-       * @default TablePaginationActions
-       */
-      ActionsComponent?: React.ElementType<TablePaginationActionsProps>;
-      /**
-       * Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) component.
-       */
-      backIconButtonProps?: Partial<IconButtonProps>;
-      /**
-       * Override or extend the styles applied to the component.
-       */
-      classes?: Partial<TablePaginationClasses>;
-      /**
-       * The total number of rows.
-       *
-       * To enable server side pagination for an unknown number of items, provide -1.
-       */
-      count: number;
-      /**
-       * Accepts a function which returns a string value that provides a user-friendly name for the current page.
-       * This is important for screen reader users.
-       *
-       * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
-       * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous').
-       * @returns {string}
-       * @default function defaultGetAriaLabel(type) {
-       *   return `Go to ${type} page`;
-       * }
-       */
-      getItemAriaLabel?: (type: 'first' | 'last' | 'next' | 'previous') => string;
-      /**
-       * Customize the displayed rows label. Invoked with a `{ from, to, count, page }`
-       * object.
-       *
-       * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
-       * @default function defaultLabelDisplayedRows({ from, to, count }) {
-       *   return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`;
-       * }
-       */
-      labelDisplayedRows?: (paginationInfo: LabelDisplayedRowsArgs) => React.ReactNode;
-      /**
-       * Customize the rows per page label.
-       *
-       * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
-       * @default 'Rows per page:'
-       */
-      labelRowsPerPage?: React.ReactNode;
-      /**
-       * Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element.
-       */
-      nextIconButtonProps?: Partial<IconButtonProps>;
-      /**
-       * Callback fired when the page is changed.
-       *
-       * @param {React.MouseEvent<HTMLButtonElement> | null} event The event source of the callback.
-       * @param {number} page The page selected.
-       */
-      onPageChange: (event: React.MouseEvent<HTMLButtonElement> | null, page: number) => void;
-      /**
-       * Callback fired when the number of rows per page is changed.
-       *
-       * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback.
-       */
-      onRowsPerPageChange?: React.ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;
-      /**
-       * The zero-based index of the current page.
-       */
-      page: number;
-      /**
-       * The number of rows per page.
-       *
-       * Set -1 to display all the rows.
-       */
-      rowsPerPage: number;
-      /**
-       * Customizes the options of the rows per page select field. If less than two options are
-       * available, no select field will be displayed.
-       * Use -1 for the value with a custom label to show all the rows.
-       * @default [10, 25, 50, 100]
-       */
-      rowsPerPageOptions?: Array<number | { value: number; label: string }>;
-      /**
-       * Props applied to the rows per page [`Select`](/material-ui/api/select/) element.
-       * @default {}
-       */
-      SelectProps?: Partial<SelectProps>;
-      /**
-       * If `true`, show the first-page button.
-       * @default false
-       */
-      showFirstButton?: boolean;
-      /**
-       * If `true`, show the last-page button.
-       * @default false
-       */
-      showLastButton?: boolean;
-      /**
-       * The system prop that allows defining system overrides as well as additional CSS styles.
-       */
-      sx?: SxProps<Theme>;
-    };
-  defaultComponent: DefaultComponent;
+/**
+ * This type is kept for compatibility. Use `TablePaginationOwnProps` instead.
+ */
+export type TablePaginationBaseProps = Omit<TableCellProps, 'classes' | 'component' | 'children'>;
+
+export interface TablePaginationOwnProps extends TablePaginationBaseProps {
+  /**
+   * The component used for displaying the actions.
+   * Either a string to use a HTML element or a component.
+   * @default TablePaginationActions
+   */
+  ActionsComponent?: React.ElementType<TablePaginationActionsProps>;
+  /**
+   * Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) component.
+   */
+  backIconButtonProps?: Partial<IconButtonProps>;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TablePaginationClasses>;
+  /**
+   * The total number of rows.
+   *
+   * To enable server side pagination for an unknown number of items, provide -1.
+   */
+  count: number;
+  /**
+   * Accepts a function which returns a string value that provides a user-friendly name for the current page.
+   * This is important for screen reader users.
+   *
+   * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
+   * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous').
+   * @returns {string}
+   * @default function defaultGetAriaLabel(type) {
+   *   return `Go to ${type} page`;
+   * }
+   */
+  getItemAriaLabel?: (type: 'first' | 'last' | 'next' | 'previous') => string;
+  /**
+   * Customize the displayed rows label. Invoked with a `{ from, to, count, page }`
+   * object.
+   *
+   * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
+   * @default function defaultLabelDisplayedRows({ from, to, count }) {
+   *   return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`;
+   * }
+   */
+  labelDisplayedRows?: (paginationInfo: LabelDisplayedRowsArgs) => React.ReactNode;
+  /**
+   * Customize the rows per page label.
+   *
+   * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).
+   * @default 'Rows per page:'
+   */
+  labelRowsPerPage?: React.ReactNode;
+  /**
+   * Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element.
+   */
+  nextIconButtonProps?: Partial<IconButtonProps>;
+  /**
+   * Callback fired when the page is changed.
+   *
+   * @param {React.MouseEvent<HTMLButtonElement> | null} event The event source of the callback.
+   * @param {number} page The page selected.
+   */
+  onPageChange: (event: React.MouseEvent<HTMLButtonElement> | null, page: number) => void;
+  /**
+   * Callback fired when the number of rows per page is changed.
+   *
+   * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback.
+   */
+  onRowsPerPageChange?: React.ChangeEventHandler<HTMLTextAreaElement | HTMLInputElement>;
+  /**
+   * The zero-based index of the current page.
+   */
+  page: number;
+  /**
+   * The number of rows per page.
+   *
+   * Set -1 to display all the rows.
+   */
+  rowsPerPage: number;
+  /**
+   * Customizes the options of the rows per page select field. If less than two options are
+   * available, no select field will be displayed.
+   * Use -1 for the value with a custom label to show all the rows.
+   * @default [10, 25, 50, 100]
+   */
+  rowsPerPageOptions?: Array<number | { value: number; label: string }>;
+  /**
+   * Props applied to the rows per page [`Select`](/material-ui/api/select/) element.
+   * @default {}
+   */
+  SelectProps?: Partial<SelectProps>;
+  /**
+   * If `true`, show the first-page button.
+   * @default false
+   */
+  showFirstButton?: boolean;
+  /**
+   * If `true`, show the last-page button.
+   * @default false
+   */
+  showLastButton?: boolean;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
+export interface TablePaginationTypeMap<AdditionalProps, RootComponent extends React.ElementType> {
+  props: AdditionalProps & TablePaginationOwnProps;
+  defaultComponent: RootComponent;
 }
 
 /**
@@ -143,8 +146,6 @@ declare const TablePagination: OverridableComponent<
   TablePaginationTypeMap<{}, React.JSXElementConstructor<TablePaginationBaseProps>>
 >;
 
-export type TablePaginationBaseProps = Omit<TableCellProps, 'classes' | 'component' | 'children'>;
-
 export type TablePaginationProps<
   RootComponent extends React.ElementType = React.JSXElementConstructor<TablePaginationBaseProps>,
   AdditionalProps = {},

package/TableRow/TableRow.d.ts

@@ -4,35 +4,37 @@ import { Theme } from '..';
 import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { TableRowClasses } from './tableRowClasses';
 
+export interface TableRowOwnProps {
+  /**
+   * Should be valid <tr> children such as `TableCell`.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableRowClasses>;
+  /**
+   * If `true`, the table row will shade on hover.
+   * @default false
+   */
+  hover?: boolean;
+  /**
+   * If `true`, the table row will have the selected shading.
+   * @default false
+   */
+  selected?: boolean;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export interface TableRowTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'tr',
+  RootComponent extends React.ElementType = 'tr',
 > {
-  props: AdditionalProps & {
-    /**
-     * Should be valid <tr> children such as `TableCell`.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableRowClasses>;
-    /**
-     * If `true`, the table row will shade on hover.
-     * @default false
-     */
-    hover?: boolean;
-    /**
-     * If `true`, the table row will have the selected shading.
-     * @default false
-     */
-    selected?: boolean;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableRowOwnProps;
+  defaultComponent: RootComponent;
 }
 /**
  * Will automatically set dynamic row height

package/TableSortLabel/TableSortLabel.d.ts

@@ -5,45 +5,49 @@ import { ExtendButtonBase, ExtendButtonBaseTypeMap } from '../ButtonBase';
 import { OverrideProps } from '../OverridableComponent';
 import { TableSortLabelClasses } from './tableSortLabelClasses';
 
+export interface TableSortLabelOwnProps {
+  /**
+   * If `true`, the label will have the active styling (should be true for the sorted column).
+   * @default false
+   */
+  active?: boolean;
+  /**
+   * Label contents, the arrow will be appended automatically.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TableSortLabelClasses>;
+  /**
+   * The current sort direction.
+   * @default 'asc'
+   */
+  direction?: 'asc' | 'desc';
+  /**
+   * Hide sort icon when active is false.
+   * @default false
+   */
+  hideSortIcon?: boolean;
+  /**
+   * Sort icon to use.
+   * @default ArrowDownwardIcon
+   */
+  IconComponent?: React.JSXElementConstructor<{
+    className: string;
+  }>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+
 export type TableSortLabelTypeMap<
   AdditionalProps = {},
-  DefaultComponent extends React.ElementType = 'span',
+  RootComponent extends React.ElementType = 'span',
 > = ExtendButtonBaseTypeMap<{
-  props: AdditionalProps & {
-    /**
-     * If `true`, the label will have the active styling (should be true for the sorted column).
-     * @default false
-     */
-    active?: boolean;
-    /**
-     * Label contents, the arrow will be appended automatically.
-     */
-    children?: React.ReactNode;
-    /**
-     * Override or extend the styles applied to the component.
-     */
-    classes?: Partial<TableSortLabelClasses>;
-    /**
-     * The current sort direction.
-     * @default 'asc'
-     */
-    direction?: 'asc' | 'desc';
-    /**
-     * Hide sort icon when active is false.
-     * @default false
-     */
-    hideSortIcon?: boolean;
-    /**
-     * Sort icon to use.
-     * @default ArrowDownwardIcon
-     */
-    IconComponent?: React.JSXElementConstructor<{ className: string }>;
-    /**
-     * The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-  };
-  defaultComponent: DefaultComponent;
+  props: AdditionalProps & TableSortLabelOwnProps;
+  defaultComponent: RootComponent;
 }>;
 
 /**