@mui/material 7.0.0-beta.0 → 7.0.0-beta.2

package/Portal/Portal.types.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+export interface PortalProps {
+  /**
+   * The children to render into the `container`.
+   */
+  children?: React.ReactNode;
+  /**
+   * An HTML element or function that returns one.
+   * The `container` will have the portal children appended to it.
+   *
+   * You can also provide a callback, which is called in a React layout effect.
+   * This lets you set the container from a ref, and also makes server-side rendering possible.
+   *
+   * By default, it uses the body of the top-level document object,
+   * so it's simply `document.body` most of the time.
+   */
+  container?: Element | (() => Element | null) | null;
+  /**
+   * The `children` will be under the DOM hierarchy of the parent component.
+   * @default false
+   */
+  disablePortal?: boolean;
+}

package/Portal/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from "./Portal.js";
+export * from "./Portal.js";
+export * from "./Portal.types.js";

package/Radio/Radio.d.ts

@@ -0,0 +1,86 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { OverridableStringUnion } from '@mui/types';
+import { InternalStandardProps as StandardProps, Theme } from "../index.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+import { SwitchBaseProps } from "../internal/SwitchBase.js";
+import { RadioClasses } from "./radioClasses.js";
+export interface RadioPropsSizeOverrides {}
+export interface RadioPropsColorOverrides {}
+export interface RadioRootSlotPropsOverrides {}
+export interface RadioInputSlotPropsOverrides {}
+export interface RadioSlots {
+  /**
+   * The component that renders the root slot.
+   * @default SwitchBase
+   */
+  root: React.ElementType;
+  /**
+   * The component that renders the input slot.
+   * @default SwitchBase's input
+   */
+  input: React.ElementType;
+}
+export type RadioSlotsAndSlotProps = CreateSlotsAndSlotProps<RadioSlots, {
+  /**
+   * Props forwarded to the root slot.
+   * By default, the avaible props are based on the span element.
+   */
+  root: SlotProps<React.ElementType<SwitchBaseProps>, RadioRootSlotPropsOverrides, RadioOwnerState>;
+  /**
+   * Props forwarded to the input slot.
+   * By default, the avaible props are based on the input element.
+   */
+  input: SlotProps<'input', RadioInputSlotPropsOverrides, RadioOwnerState>;
+}>;
+export interface RadioProps extends StandardProps<SwitchBaseProps, 'checkedIcon' | 'color' | 'icon' | 'type' | 'slots' | 'slotProps'>, RadioSlotsAndSlotProps {
+  /**
+   * The icon to display when the component is checked.
+   * @default <RadioButtonIcon checked />
+   */
+  checkedIcon?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<RadioClasses>;
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * @default 'primary'
+   */
+  color?: OverridableStringUnion<'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | 'default', RadioPropsColorOverrides>;
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled?: boolean;
+  /**
+   * The icon to display when the component is unchecked.
+   * @default <RadioButtonIcon />
+   */
+  icon?: React.ReactNode;
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   * @default 'medium'
+   */
+  size?: OverridableStringUnion<'small' | 'medium', RadioPropsSizeOverrides>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+export interface RadioOwnerState extends Omit<RadioProps, 'slots' | 'slotProps'> {}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/)
+ *
+ * API:
+ *
+ * - [Radio API](https://next.mui.com/material-ui/api/radio/)
+ * - inherits [ButtonBase API](https://next.mui.com/material-ui/api/button-base/)
+ */
+export default function Radio(props: RadioProps): React.JSX.Element;

package/Radio/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./Radio.js";
+export * from "./Radio.js";
+export { default as radioClasses } from "./radioClasses.js";
+export * from "./radioClasses.js";

package/Radio/radioClasses.d.ts

@@ -0,0 +1,18 @@
+export interface RadioClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** State class applied to the root element if `checked={true}`. */
+  checked: string;
+  /** State class applied to the root element if `disabled={true}`. */
+  disabled: string;
+  /** Styles applied to the root element if `color="primary"`. */
+  colorPrimary: string;
+  /** Styles applied to the root element if `color="secondary"`. */
+  colorSecondary: string;
+  /** Styles applied to the root element if `size="small"`. */
+  sizeSmall: string;
+}
+export type RadioClassKey = keyof RadioClasses;
+export declare function getRadioUtilityClass(slot: string): string;
+declare const radioClasses: RadioClasses;
+export default radioClasses;

package/RadioGroup/RadioGroup.d.ts

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { FormGroupProps } from "../FormGroup/index.js";
+export interface RadioGroupProps extends Omit<FormGroupProps, 'onChange'> {
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue?: any;
+  /**
+   * The name used to reference the value of the control.
+   * If you don't provide this prop, it falls back to a randomly generated name.
+   */
+  name?: string;
+  /**
+   * Callback fired when a radio button is selected.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {string} value The value of the selected radio button.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange?: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;
+  /**
+   * Value of the selected radio button. The DOM API casts this to a string.
+   */
+  value?: any;
+}
+
+/**
+ *
+ * Demos:
+ *
+ * - [Radio Group](https://next.mui.com/material-ui/react-radio-button/)
+ *
+ * API:
+ *
+ * - [RadioGroup API](https://next.mui.com/material-ui/api/radio-group/)
+ * - inherits [FormGroup API](https://next.mui.com/material-ui/api/form-group/)
+ */
+export default function RadioGroup(props: RadioGroupProps): React.JSX.Element;

package/RadioGroup/RadioGroupContext.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export interface RadioGroupContextValue {
+  name: string | undefined;
+  onChange: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;
+  value: any;
+}
+/**
+ * @ignore - internal component.
+ */
+declare const RadioGroupContext: React.Context<RadioGroupContextValue | undefined>;
+export default RadioGroupContext;

package/RadioGroup/index.d.ts

@@ -0,0 +1,5 @@
+export { default } from "./RadioGroup.js";
+export * from "./RadioGroup.js";
+export { default as useRadioGroup, RadioGroupState } from "./useRadioGroup.js";
+export { default as radioGroupClasses } from "./radioGroupClasses.js";
+export * from "./radioGroupClasses.js";

package/RadioGroup/radioGroupClasses.d.ts

@@ -0,0 +1,6 @@
+import { FormGroupClasses } from "../FormGroup/index.js";
+export type RadioGroupClassKey = keyof FormGroupClasses;
+export type RadioGroupClasses = FormGroupClasses;
+export declare function getRadioGroupUtilityClass(slot: string): string;
+declare const radioGroupClasses: RadioGroupClasses;
+export default radioGroupClasses;

package/RadioGroup/useRadioGroup.d.ts

@@ -0,0 +1,3 @@
+import { RadioGroupContextValue } from "./RadioGroupContext.js";
+export interface RadioGroupState extends RadioGroupContextValue {}
+export default function useRadioGroup(): RadioGroupState | undefined;

package/Rating/Rating.d.ts

@@ -0,0 +1,183 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { OverridableStringUnion } from '@mui/types';
+import { Theme } from "../index.js";
+import { RatingClasses } from "./ratingClasses.js";
+import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
+import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
+export interface IconContainerProps extends React.HTMLAttributes<HTMLSpanElement> {
+  value: number;
+}
+export interface RatingPropsSizeOverrides {}
+export interface RatingRootSlotPropsOverrides {}
+export interface RatingLabelSlotPropsOverrides {}
+export interface RatingIconSlotPropsOverrides {}
+export interface RatingDecimalSlotPropsOverrides {}
+export interface RatingSlots {
+  /**
+   * The component used for the root slot.
+   * @default 'span'
+   */
+  root: React.ElementType;
+  /**
+   * The component used for the label slot.
+   * @default 'label'
+   */
+  label: React.ElementType;
+  /**
+   * The component used for the icon slot.
+   * @default 'span'
+   */
+  icon: React.ElementType;
+  /**
+   * The component used fo r the decimal slot.
+   * @default 'span'
+   */
+  decimal: React.ElementType;
+}
+export type RatingSlotsAndSlotProps = CreateSlotsAndSlotProps<RatingSlots, {
+  /**
+   * Props forwarded to the root slot.
+   * By default, the avaible props are based on the span element.
+   */
+  root: SlotProps<'span', RatingRootSlotPropsOverrides, RatingOwnerState>;
+  /**
+   * Props forwarded to the label slot.
+   * By default, the avaible props are based on the label element.
+   */
+  label: SlotProps<'label', RatingLabelSlotPropsOverrides, RatingOwnerState>;
+  /**
+   * Props forwarded to the icon slot.
+   * By default, the avaible props are based on the span element.
+   */
+  icon: SlotProps<'span', RatingIconSlotPropsOverrides, RatingOwnerState>;
+  /**
+   * Props forwarded to the decimal slot.
+   * By default, the avaible props are based on the span element.
+   */
+  decimal: SlotProps<'span', RatingDecimalSlotPropsOverrides, RatingOwnerState>;
+}>;
+export interface RatingOwnProps extends RatingSlotsAndSlotProps {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<RatingClasses>;
+  /**
+   * The default value. Use when the component is not controlled.
+   * @default null
+   */
+  defaultValue?: number;
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled?: boolean;
+  /**
+   * The icon to display when empty.
+   * @default <StarBorder fontSize="inherit" />
+   */
+  emptyIcon?: React.ReactNode;
+  /**
+   * The label read when the rating input is empty.
+   * @default 'Empty'
+   */
+  emptyLabelText?: React.ReactNode;
+  /**
+   * Accepts a function which returns a string value that provides a user-friendly name for the current value of the rating.
+   * This is important for screen reader users.
+   *
+   * For localization purposes, you can use the provided [translations](https://mui.com/material-ui/guides/localization/).
+   * @param {number} value The rating label's value to format.
+   * @returns {string}
+   * @default function defaultLabelText(value) {
+   *   return `${value || '0'} Star${value !== 1 ? 's' : ''}`;
+   * }
+   */
+  getLabelText?: (value: number) => string;
+  /**
+   * If `true`, only the selected icon will be highlighted.
+   * @default false
+   */
+  highlightSelectedOnly?: boolean;
+  /**
+   * The icon to display.
+   * @default <Star fontSize="inherit" />
+   */
+  icon?: React.ReactNode;
+  /**
+   * The component containing the icon.
+   * @deprecated Use `slotProps.icon.component` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @default function IconContainer(props) {
+   *   const { value, ...other } = props;
+   *   return <span {...other} />;
+   * }
+   */
+  IconContainerComponent?: React.ElementType<IconContainerProps>;
+  /**
+   * Maximum rating.
+   * @default 5
+   */
+  max?: number;
+  /**
+   * The name attribute of the radio `input` elements.
+   * This input `name` should be unique within the page.
+   * Being unique within a form is insufficient since the `name` is used to generate IDs.
+   */
+  name?: string;
+  /**
+   * Callback fired when the value changes.
+   * @param {React.SyntheticEvent} event The event source of the callback.
+   * @param {number|null} value The new value.
+   */
+  onChange?: (event: React.SyntheticEvent, value: number | null) => void;
+  /**
+   * Callback function that is fired when the hover state changes.
+   * @param {React.SyntheticEvent} event The event source of the callback.
+   * @param {number} value The new value.
+   */
+  onChangeActive?: (event: React.SyntheticEvent, value: number) => void;
+  /**
+   * The minimum increment value change allowed.
+   * @default 1
+   */
+  precision?: number;
+  /**
+   * Removes all hover effects and pointer events.
+   * @default false
+   */
+  readOnly?: boolean;
+  /**
+   * The size of the component.
+   * @default 'medium'
+   */
+  size?: OverridableStringUnion<'small' | 'medium' | 'large', RatingPropsSizeOverrides>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * The rating value.
+   */
+  value?: number | null;
+}
+export interface RatingOwnerState extends Omit<RatingProps, 'slots' | 'slotProps'> {}
+export type RatingTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'span'> = {
+  props: AdditionalProps & RatingOwnProps;
+  defaultComponent: RootComponent;
+};
+
+/**
+ *
+ * Demos:
+ *
+ * - [Rating](https://next.mui.com/material-ui/react-rating/)
+ *
+ * API:
+ *
+ * - [Rating API](https://next.mui.com/material-ui/api/rating/)
+ */
+declare const Rating: OverridableComponent<RatingTypeMap>;
+export type RatingProps<RootComponent extends React.ElementType = RatingTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<RatingTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+export default Rating;

package/Rating/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./Rating.js";
+export * from "./Rating.js";
+export { default as ratingClasses } from "./ratingClasses.js";
+export * from "./ratingClasses.js";

package/Rating/ratingClasses.d.ts

@@ -0,0 +1,40 @@
+export interface RatingClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the root element if `size="small"`. */
+  sizeSmall: string;
+  /** Styles applied to the root element if `size="medium"`. */
+  sizeMedium: string;
+  /** Styles applied to the root element if `size="large"`. */
+  sizeLarge: string;
+  /** Styles applied to the root element if `readOnly={true}`. */
+  readOnly: string;
+  /** State class applied to the root element if `disabled={true}`. */
+  disabled: string;
+  /** State class applied to the root element if keyboard focused. */
+  focusVisible: string;
+  /** Visually hide an element. */
+  visuallyHidden: string;
+  /** Styles applied to the label elements. */
+  label: string;
+  /** Styles applied to the label of the "no value" input when it is active. */
+  labelEmptyValueActive: string;
+  /** Styles applied to the icon wrapping elements. */
+  icon: string;
+  /** Styles applied to the icon wrapping elements when empty. */
+  iconEmpty: string;
+  /** Styles applied to the icon wrapping elements when filled. */
+  iconFilled: string;
+  /** Styles applied to the icon wrapping elements when hover. */
+  iconHover: string;
+  /** Styles applied to the icon wrapping elements when focus. */
+  iconFocus: string;
+  /** Styles applied to the icon wrapping elements when active. */
+  iconActive: string;
+  /** Styles applied to the icon wrapping elements when decimals are necessary. */
+  decimal: string;
+}
+export type RatingClassKey = keyof RatingClasses;
+export declare function getRatingUtilityClass(slot: string): string;
+declare const ratingClasses: RatingClasses;
+export default ratingClasses;

package/ScopedCssBaseline/ScopedCssBaseline.d.ts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from "../styles/index.js";
+import { OverridableComponent, OverrideProps } from "../OverridableComponent/index.js";
+import { ScopedCssBaselineClasses } from "./scopedCssBaselineClasses.js";
+export interface ScopedCssBaselineOwnProps {
+  /**
+   * The content of the component.
+   */
+  children?: React.ReactNode;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<ScopedCssBaselineClasses>;
+  /**
+   * Enable `color-scheme` CSS property to use `theme.palette.mode`.
+   * For more details, check out https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme
+   * For browser support, check out https://caniuse.com/?search=color-scheme
+   */
+  enableColorScheme?: boolean;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+}
+export interface ScopedCssBaselineTypeMap<AdditionalProps = {}, RootComponent extends React.ElementType = 'div'> {
+  props: AdditionalProps & ScopedCssBaselineOwnProps;
+  defaultComponent: RootComponent;
+}
+/**
+ *
+ * Demos:
+ *
+ * - [CSS Baseline](https://next.mui.com/material-ui/react-css-baseline/)
+ *
+ * API:
+ *
+ * - [ScopedCssBaseline API](https://next.mui.com/material-ui/api/scoped-css-baseline/)
+ */
+declare const ScopedCssBaseline: OverridableComponent<ScopedCssBaselineTypeMap>;
+export type ScopedCssBaselineProps<RootComponent extends React.ElementType = ScopedCssBaselineTypeMap['defaultComponent'], AdditionalProps = {}> = OverrideProps<ScopedCssBaselineTypeMap<AdditionalProps, RootComponent>, RootComponent> & {
+  component?: React.ElementType;
+};
+
+/**
+ *
+ * Demos:
+ *
+ * - [Css Baseline](https://mui.com/components/css-baseline/)
+ *
+ * API:
+ *
+ * - [ScopedCssBaseline API](https://mui.com/api/scoped-css-baseline/)
+ */
+export default ScopedCssBaseline;

package/ScopedCssBaseline/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from "./ScopedCssBaseline.js";
+export * from "./ScopedCssBaseline.js";
+export { default as scopedCssBaselineClasses } from "./scopedCssBaselineClasses.js";
+export * from "./scopedCssBaselineClasses.js";

package/ScopedCssBaseline/scopedCssBaselineClasses.d.ts

@@ -0,0 +1,8 @@
+export interface ScopedCssBaselineClasses {
+  /** Styles applied to the root element. */
+  root: string;
+}
+export type ScopedCssBaselineClassKey = keyof ScopedCssBaselineClasses;
+export declare function getScopedCssBaselineUtilityClass(slot: string): string;
+declare const scopedCssBaselineClasses: Record<"root", string>;
+export default scopedCssBaselineClasses;