@mui/joy - npm Package Compare versions

Comparing version 5.0.0-alpha.76 to 5.0.0-alpha.77

Alert/Alert.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Alert/Alert.js

 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "className", "color", "role", "variant", "size", "startDecorator", "endDecorator", "component", "slots", "slotProps"];
+const _excluded = ["children", "className", "color", "invertedColors", "role", "variant", "size", "startDecorator", "endDecorator", "component", "slots", "slotProps"];
 import * as React from 'react';
@@ -11,3 +11,3 @@ import PropTypes from 'prop-types';
 import useThemeProps from '../styles/useThemeProps';
-import { useColorInversion } from '../styles/ColorInversion';
+import { ColorInversionProvider, useColorInversion } from '../styles/ColorInversion';
 import useSlot from '../utils/useSlot';
@@ -38,4 +38,4 @@ import { getAlertUtilityClass } from './alertClasses';
 }) => {
-  var _theme$variants;
-  return _extends({
+  var _theme$variants, _theme$colorInversion;
+  return [_extends({
     '--Alert-radius': theme.vars.radius.sm,
@@ -72,6 +72,7 @@ '--Alert-decoratorChildRadius': 'max((var(--Alert-radius) - var(--variant-borderWidth, 0px)) - var(--Alert-padding), min(var(--Alert-padding) + var(--variant-borderWidth, 0px), var(--Alert-radius) / 2))',
     display: 'flex',
+    position: 'relative',
     alignItems: 'center',
     padding: `var(--Alert-padding)`,
     borderRadius: 'var(--Alert-radius)'
-  }, (_theme$variants = theme.variants[ownerState.variant]) == null ? void 0 : _theme$variants[ownerState.color]);
+  }, (_theme$variants = theme.variants[ownerState.variant]) == null ? void 0 : _theme$variants[ownerState.color]), ownerState.color !== 'context' && ownerState.invertedColors && ((_theme$colorInversion = theme.colorInversion[ownerState.variant]) == null ? void 0 : _theme$colorInversion[ownerState.color])];
 });
@@ -132,2 +133,3 @@ const AlertStartDecorator = styled('span', {
       color: colorProp = 'primary',
+      invertedColors = false,
       role = 'alert',
@@ -180,3 +182,3 @@ variant = 'soft',
   });
-  return /*#__PURE__*/_jsxs(SlotRoot, _extends({}, rootProps, {
+  const result = /*#__PURE__*/_jsxs(React.Fragment, {
     children: [startDecorator && /*#__PURE__*/_jsx(SlotStartDecorator, _extends({}, startDecoratorProps, {
@@ -187,2 +189,8 @@ children: startDecorator
     }))]
+  });
+  return /*#__PURE__*/_jsx(SlotRoot, _extends({}, rootProps, {
+    children: invertedColors ? /*#__PURE__*/_jsx(ColorInversionProvider, {
+      variant: variant,
+      children: result
+    }) : result
   }));
@@ -218,2 +226,7 @@ });
   /**
+   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+   * @default false
+   */
+  invertedColors: PropTypes.bool,
+  /**
    * The ARIA role attribute of the element.
@@ -220,0 +233,0 @@ * @default 'alert'

Alert/alertClasses.d.ts

@@ -0,0 +0,0 @@ export interface AlertClasses {

Alert/AlertProps.d.ts

@@ -46,2 +46,7 @@ import * as React from 'react';
         /**
+         * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+         * @default false
+         */
+        invertedColors?: boolean;
+        /**
          * The ARIA role attribute of the element.
@@ -48,0 +53,0 @@ * @default 'alert'

Alert/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Alert';

AspectRatio/AspectRatio.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

AspectRatio/aspectRatioClasses.d.ts

@@ -0,0 +0,0 @@ export interface AspectRatioClasses {

AspectRatio/AspectRatioProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AspectRatio/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './AspectRatio';

Autocomplete/Autocomplete.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

Autocomplete/Autocomplete.js

@@ -14,3 +14,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import useAutocomplete from '@mui/base/useAutocomplete';
-import PopperUnstyled from '@mui/base/PopperUnstyled';
+import Popper from '@mui/base/Popper';
 import { useThemeProps } from '../styles';
@@ -610,7 +610,7 @@ import ClearIcon from '../internal/svg-icons/Close';
         className: clsx(listboxProps.className, ((_listboxProps$ownerSt = listboxProps.ownerState) == null ? void 0 : _listboxProps$ownerSt.color) === 'context' && autocompleteClasses.colorContext)
-        // @ts-ignore internal logic (too complex to typed PopperUnstyledOwnProps to SlotListbox but this should be removed when we have `usePopper`)
+        // @ts-ignore internal logic (too complex to typed PopperOwnProps to SlotListbox but this should be removed when we have `usePopper`)
         ,
         modifiers: modifiers
       }, !((_props$slots = props.slots) != null && _props$slots.listbox) && {
-        as: PopperUnstyled,
+        as: Popper,
         slots: {
@@ -617,0 +617,0 @@ root: listboxProps.as || 'ul'

Autocomplete/autocompleteClasses.d.ts

@@ -0,0 +0,0 @@ export interface AutocompleteClasses {

Autocomplete/AutocompleteProps.d.ts

 import * as React from 'react';
 import { AutocompleteChangeDetails, AutocompleteChangeReason, AutocompleteCloseReason, AutocompleteInputChangeReason, AutocompleteValue, UseAutocompleteProps } from '@mui/base/useAutocomplete';
-import { PopperUnstyledOwnProps } from '@mui/base/PopperUnstyled';
+import { PopperOwnProps } from '@mui/base/Popper';
 import { OverridableStringUnion } from '@mui/types';
@@ -116,3 +116,3 @@ import { ColorPaletteProp, SxProps, VariantProp, ApplyColorInversion } from '../styles/types';
         size?: OverridableStringUnion<'sm' | 'md' | 'lg', AutocompletePropsSizeOverrides>;
-    } & Omit<PopperUnstyledOwnProps, 'slots' | 'slotProps' | 'open'>, AutocompleteOwnerState<any, any, any, any>>;
+    } & Omit<PopperOwnProps, 'slots' | 'slotProps' | 'open'>, AutocompleteOwnerState<any, any, any, any>>;
     option: SlotProps<'li', {
@@ -119,0 +119,0 @@ color?: OverridableStringUnion<ColorPaletteProp, AutocompletePropsColorOverrides>;

Autocomplete/index.d.ts

@@ -0,0 +0,0 @@ export { createFilterOptions } from '@mui/base/useAutocomplete';

AutocompleteListbox/AutocompleteListbox.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AutocompleteListbox/autocompleteListboxClasses.d.ts

@@ -0,0 +0,0 @@ export interface AutocompleteListboxClasses {

AutocompleteListbox/AutocompleteListboxProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AutocompleteListbox/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './AutocompleteListbox';

AutocompleteOption/AutocompleteOption.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AutocompleteOption/autocompleteOptionClasses.d.ts

@@ -0,0 +0,0 @@ export interface AutocompleteOptionClasses {

AutocompleteOption/AutocompleteOptionProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AutocompleteOption/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './AutocompleteOption';

Avatar/Avatar.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Avatar/avatarClasses.d.ts

@@ -0,0 +0,0 @@ export interface AvatarClasses {

Avatar/AvatarProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Avatar/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Avatar';

AvatarGroup/AvatarGroup.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AvatarGroup/avatarGroupClasses.d.ts

@@ -0,0 +0,0 @@ export interface AvatarGroupClasses {

AvatarGroup/AvatarGroupProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

AvatarGroup/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './AvatarGroup';

Badge/Badge.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Badge/badgeClasses.d.ts

@@ -0,0 +0,0 @@ export interface BadgeClasses {

Badge/BadgeProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Badge/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Badge';

Box/Box.d.ts

 import { Theme } from '../styles/types';
 declare const Box: import("@mui/types").OverridableComponent<import("@mui/system").BoxTypeMap<{}, "div", Theme>>;
 export default Box;

Box/BoxProps.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

Box/index.d.ts

 export { default } from './Box';
 export * from './BoxProps';

Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Breadcrumbs/breadcrumbsClasses.d.ts

@@ -0,0 +0,0 @@ export interface BreadcrumbsClasses {

Breadcrumbs/BreadcrumbsProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Breadcrumbs/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Breadcrumbs';

Button/Button.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Button/buttonClasses.d.ts

@@ -0,0 +0,0 @@ export interface ButtonClasses {

Button/ButtonProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Button/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Button';

Card/Card.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Card/cardClasses.d.ts

@@ -0,0 +0,0 @@ export interface CardClasses {

Card/CardContext.d.ts

 import * as React from 'react';
 export declare const CardRowContext: React.Context<boolean>;

Card/CardProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Card/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Card';

CardContent/CardContent.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

CardContent/cardContentClasses.d.ts

@@ -0,0 +0,0 @@ export interface CardContentClasses {

CardContent/CardContentProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

CardContent/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './CardContent';

CardCover/CardCover.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

CardCover/cardCoverClasses.d.ts

@@ -0,0 +0,0 @@ export interface CardCoverClasses {

CardCover/CardCoverProps.d.ts

@@ -0,0 +0,0 @@ import { OverrideProps } from '@mui/types';

CardCover/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './CardCover';

CardOverflow/CardOverflow.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

CardOverflow/cardOverflowClasses.d.ts

@@ -0,0 +0,0 @@ export interface CardOverflowClasses {

CardOverflow/CardOverflowProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

CardOverflow/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './CardOverflow';

Checkbox/Checkbox.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Checkbox/checkboxClasses.d.ts

@@ -0,0 +0,0 @@ export interface CheckboxClasses {

Checkbox/CheckboxProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Checkbox/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Checkbox';

Chip/Chip.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Chip/Chip.js

@@ -139,2 +139,4 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
     right: 0,
+    width: '100%',
+    // To fix Firefox issue (https://github.com/mui/material-ui/issues/36877)
     border: 'none',
@@ -141,0 +143,0 @@ cursor: 'pointer',

Chip/chipClasses.d.ts

@@ -0,0 +0,0 @@ export interface ChipClasses {

Chip/ChipContext.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Chip/ChipProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Chip/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Chip';

ChipDelete/ChipDelete.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ChipDelete/chipDeleteClasses.d.ts

@@ -0,0 +0,0 @@ export interface ChipDeleteClasses {

ChipDelete/ChipDeleteProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ChipDelete/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ChipDelete';

CircularProgress/CircularProgress.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

CircularProgress/circularProgressClasses.d.ts

@@ -0,0 +0,0 @@ export interface CircularProgressClasses {

CircularProgress/CircularProgressProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

CircularProgress/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './CircularProgress';

className/index.d.ts

 export { unstable_ClassNameGenerator } from '@mui/utils';
 export declare const generateUtilityClass: (componentName: string, slot: string) => string;
 export declare const generateUtilityClasses: <T extends string>(componentName: string, slots: T[]) => Record<T, string>;

colors/colors.d.ts

@@ -0,0 +0,0 @@ declare const colors: {

colors/index.d.ts

 export { default } from './colors';

Container/Container.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Container/containerClasses.d.ts

@@ -0,0 +0,0 @@ import { ContainerClasses } from '@mui/system';

Container/ContainerProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Container/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Container';

CssBaseline/CssBaseline.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

CssBaseline/CssBaselineProps.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

CssBaseline/index.d.ts

 export { default } from './CssBaseline';
 export * from './CssBaselineProps';

Divider/Divider.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Divider/dividerClasses.d.ts

@@ -0,0 +0,0 @@ export interface DividerClasses {

Divider/DividerProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Divider/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Divider';

FormControl/FormControl.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

FormControl/formControlClasses.d.ts

@@ -0,0 +0,0 @@ export interface FormControlClasses {

FormControl/FormControlContext.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

FormControl/FormControlProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

FormControl/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './FormControl';

FormHelperText/FormHelperText.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

FormHelperText/formHelperTextClasses.d.ts

@@ -0,0 +0,0 @@ export interface FormHelperTextClasses {

FormHelperText/FormHelperTextProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

FormHelperText/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './FormHelperText';

FormLabel/FormLabel.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

FormLabel/formLabelClasses.d.ts

@@ -0,0 +0,0 @@ export interface FormLabelClasses {

FormLabel/FormLabelProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

FormLabel/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './FormLabel';

GlobalStyles/index.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

Grid/Grid.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Grid/gridClasses.d.ts

@@ -0,0 +0,0 @@ import { GridClasses } from '@mui/system/Unstable_Grid';

Grid/GridProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Grid/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Grid';

IconButton/IconButton.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

IconButton/iconButtonClasses.d.ts

@@ -0,0 +0,0 @@ export interface IconButtonClasses {

IconButton/IconButtonProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

IconButton/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './IconButton';

index.d.ts

@@ -0,0 +0,0 @@ export { default as colors } from './colors';

index.js

 /**
- * @mui/joy v5.0.0-alpha.76
+ * @mui/joy v5.0.0-alpha.77
  *
@@ -4,0 +4,0 @@ * @license MIT

Input/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Input';

Input/Input.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Input/inputClasses.d.ts

@@ -0,0 +0,0 @@ export interface InputClasses {

Input/InputProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Input/useForwardedInput.d.ts

@@ -0,0 +0,0 @@ import { FormControlContextValue } from '../FormControl/FormControlContext';

internal/svg-icons/ArrowDropDown.d.ts

@@ -0,0 +0,0 @@ /**

internal/svg-icons/Cancel.d.ts

@@ -0,0 +0,0 @@ /**

internal/svg-icons/Check.d.ts

@@ -0,0 +0,0 @@ /**

internal/svg-icons/Close.d.ts

@@ -0,0 +0,0 @@ /**

internal/svg-icons/HorizontalRule.d.ts

@@ -0,0 +0,0 @@ /**

internal/svg-icons/Person.d.ts

@@ -0,0 +0,0 @@ /**

internal/svg-icons/Unfold.d.ts

@@ -0,0 +0,0 @@ /**

LinearProgress/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './LinearProgress';

LinearProgress/LinearProgress.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

LinearProgress/linearProgressClasses.d.ts

@@ -0,0 +0,0 @@ export interface LinearProgressClasses {

LinearProgress/LinearProgressProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Link/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Link';

Link/Link.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Link/linkClasses.d.ts

@@ -0,0 +0,0 @@ export interface LinkClasses {

Link/LinkProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

List/ComponentListContext.d.ts

 import * as React from 'react';
 declare const ComponentListContext: React.Context<string | undefined>;
 export default ComponentListContext;

List/GroupListContext.d.ts

 import * as React from 'react';
 declare const GroupListContext: React.Context<"menu" | "select" | undefined>;
 export default GroupListContext;

List/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './List';

List/List.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

List/listClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListClasses {

List/ListProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

List/ListProvider.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

List/NestedListContext.d.ts

 import * as React from 'react';
 declare const NestedListContext: React.Context<string | boolean>;
 export default NestedListContext;

List/RowListContext.d.ts

 import * as React from 'react';
 declare const RowListContext: React.Context<boolean>;
 export default RowListContext;

List/WrapListContext.d.ts

 import * as React from 'react';
 declare const WrapListContext: React.Context<boolean>;
 export default WrapListContext;

ListDivider/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ListDivider';

ListDivider/ListDivider.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ListDivider/listDividerClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListDividerClasses {

ListDivider/ListDividerProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ListItem/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ListItem';

ListItem/ListItem.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ListItem/listItemClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListItemClasses {

ListItem/ListItemProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ListItemButton/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ListItemButton';

ListItemButton/ListItemButton.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ListItemButton/ListItemButton.js

@@ -49,4 +49,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
     display: 'flex',
-    flexDirection: ownerState.orientation === 'vertical' ? 'column' : 'row',
+    flexDirection: 'row',
     alignItems: 'center',
+    alignSelf: 'stretch'
+  }, ownerState.orientation === 'vertical' && {
+    flexDirection: 'column',
+    justifyContent: 'center'
+  }, {
     textAlign: 'initial',
@@ -53,0 +58,0 @@ textDecoration: 'initial',

ListItemButton/listItemButtonClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListItemButtonClasses {

ListItemButton/ListItemButtonOrientationContext.d.ts

 import * as React from 'react';
 declare const ListItemButtonOrientationContext: React.Context<"horizontal" | "vertical">;
 export default ListItemButtonOrientationContext;

ListItemButton/ListItemButtonProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ListItemContent/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ListItemContent';

ListItemContent/ListItemContent.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ListItemContent/listItemContentClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListItemContentClasses {

ListItemContent/ListItemContentProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ListItemDecorator/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ListItemDecorator';

ListItemDecorator/ListItemDecorator.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ListItemDecorator/ListItemDecorator.js

@@ -28,8 +28,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
   display: 'inline-flex',
-  alignItems: 'center',
   color: `var(--ListItemDecorator-color)`
 }, ownerState.parentOrientation === 'horizontal' ? {
-  minInlineSize: 'var(--ListItemDecorator-size)'
+  minInlineSize: 'var(--ListItemDecorator-size)',
+  alignItems: 'center'
 } : {
-  minBlockSize: 'var(--ListItemDecorator-size)'
+  minBlockSize: 'var(--ListItemDecorator-size)',
+  justifyContent: 'center'
 }));
@@ -36,0 +37,0 @@ /**

ListItemDecorator/listItemDecoratorClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListItemDecoratorClasses {

ListItemDecorator/ListItemDecoratorProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ListSubheader/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ListSubheader';

ListSubheader/ListSubheader.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ListSubheader/listSubheaderClasses.d.ts

@@ -0,0 +0,0 @@ export interface ListSubheaderClasses {

ListSubheader/ListSubheaderContext.d.ts

 import * as React from 'react';
 declare const ListSubheaderDispatch: React.Context<React.Dispatch<React.SetStateAction<string>> | undefined>;
 export default ListSubheaderDispatch;

ListSubheader/ListSubheaderProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Menu/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Menu';

Menu/Menu.d.ts

@@ -12,5 +12,5 @@ import { OverridableComponent } from '@mui/types';
  * - [Menu API](https://mui.com/joy-ui/api/menu/)
- * - inherits [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/)
+ * - inherits [Popper API](https://mui.com/base/api/popper/)
  */
 declare const Menu: OverridableComponent<MenuTypeMap<{}, "ul">>;
 export default Menu;

Menu/Menu.js

 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["actions", "anchorEl", "children", "color", "component", "disablePortal", "keepMounted", "id", "onClose", "open", "modifiers", "variant", "size", "slots", "slotProps"];
+const _excluded = ["actions", "anchorEl", "children", "color", "component", "disablePortal", "keepMounted", "invertedColors", "id", "onClose", "open", "modifiers", "variant", "size", "slots", "slotProps"];
 import * as React from 'react';
@@ -9,3 +9,3 @@ import PropTypes from 'prop-types';
 import useMenu, { MenuProvider } from '@mui/base/useMenu';
-import PopperUnstyled from '@mui/base/PopperUnstyled';
+import Popper from '@mui/base/Popper';
 import { useSlotProps } from '@mui/base/utils';
@@ -16,3 +16,3 @@ import { StyledList } from '../List/List';
 import { styled, useThemeProps } from '../styles';
-import ColorInversion, { useColorInversion } from '../styles/ColorInversion';
+import ColorInversion, { ColorInversionProvider, useColorInversion } from '../styles/ColorInversion';
 import { getMenuUtilityClass } from './menuClasses';
@@ -41,5 +41,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 }) => {
-  var _theme$variants;
+  var _theme$variants, _theme$colorInversion;
   const variantStyle = (_theme$variants = theme.variants[ownerState.variant]) == null ? void 0 : _theme$variants[ownerState.color];
-  return _extends({
+  return [_extends({
     '--focus-outline-offset': `calc(${theme.vars.focus.thickness} * -1)`,
@@ -56,3 +56,3 @@ // to prevent the focus outline from being cut by overflow
     backgroundColor: theme.vars.palette.background.popup
-  });
+  }), ownerState.color !== 'context' && ownerState.invertedColors && ((_theme$colorInversion = theme.colorInversion[ownerState.variant]) == null ? void 0 : _theme$colorInversion[ownerState.color])];
 });
@@ -69,3 +69,3 @@
  * - [Menu API](https://mui.com/joy-ui/api/menu/)
- * - inherits [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/)
+ * - inherits [Popper API](https://mui.com/base/api/popper/)
  */
@@ -86,2 +86,3 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       keepMounted = false,
+      invertedColors = false,
       id,
@@ -120,2 +121,3 @@ onClose,
     disablePortal,
+    invertedColors,
     color,
@@ -156,4 +158,20 @@ variant,
   });
-  const result = /*#__PURE__*/_jsx(MenuRoot, _extends({}, rootProps, !((_props$slots = props.slots) != null && _props$slots.root) && {
-    as: PopperUnstyled,
+  let result = /*#__PURE__*/_jsx(MenuProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/_jsx(GroupListContext.Provider, {
+      value: "menu",
+      children: /*#__PURE__*/_jsx(ListProvider, {
+        nested: true,
+        children: children
+      })
+    })
+  });
+  if (invertedColors) {
+    result = /*#__PURE__*/_jsx(ColorInversionProvider, {
+      variant: variant,
+      children: result
+    });
+  }
+  result = /*#__PURE__*/_jsx(MenuRoot, _extends({}, rootProps, !((_props$slots = props.slots) != null && _props$slots.root) && {
+    as: Popper,
     slots: {
@@ -163,18 +181,3 @@ root: component || 'ul'
   }, {
-    children: /*#__PURE__*/_jsx(MenuProvider, {
-      value: contextValue,
-      children: /*#__PURE__*/_jsx(GroupListContext.Provider, {
-        value: "menu",
-        children: /*#__PURE__*/_jsx(ListProvider, {
-          nested: true,
-          children: disablePortal ? children :
-          /*#__PURE__*/
-          // For portal popup, the children should not inherit color inversion from the upper parent.
-          _jsx(ColorInversion.Provider, {
-            value: undefined,
-            children: children
-          })
-        })
-      })
-    })
+    children: result
   }));
@@ -230,2 +233,7 @@ return disablePortal ? result :
   /**
+   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+   * @default false
+   */
+  invertedColors: PropTypes.bool,
+  /**
    * Always keep the children in the DOM.
@@ -232,0 +240,0 @@ * This prop can be useful in SEO situation or

Menu/menuClasses.d.ts

@@ -0,0 +0,0 @@ export interface MenuClasses {

Menu/MenuProps.d.ts

 import * as React from 'react';
 import { OverrideProps, OverridableStringUnion } from '@mui/types';
-import { PopperUnstyledProps } from '@mui/base/PopperUnstyled';
-import { MenuUnstyledActions } from '@mui/base/MenuUnstyled';
+import { PopperProps } from '@mui/base/Popper';
+import { MenuActions } from '@mui/base/Menu';
 import { ColorPaletteProp, VariantProp, SxProps, ApplyColorInversion } from '../styles/types';
@@ -24,3 +24,3 @@ import { SlotProps, CreateSlotsAndSlotProps } from '../utils/types';
 }
-export type { MenuUnstyledActions } from '@mui/base/MenuUnstyled';
+export type { MenuActions } from '@mui/base/Menu';
 export interface MenuTypeMap<P = {}, D extends React.ElementType = 'ul'> {
@@ -32,3 +32,3 @@ props: P & {
          */
-        actions?: React.Ref<MenuUnstyledActions>;
+        actions?: React.Ref<MenuActions>;
         /**
@@ -40,2 +40,7 @@ * The color of the component. It supports those theme colors that make sense for this component.
         /**
+         * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+         * @default false
+         */
+        invertedColors?: boolean;
+        /**
          * Triggered when focus leaves the menu and the menu should close.
@@ -63,3 +68,3 @@ */
         variant?: OverridableStringUnion<VariantProp, MenuPropsVariantOverrides>;
-    } & MenuSlotsAndSlotProps & Omit<PopperUnstyledProps, 'children' | 'open'>;
+    } & MenuSlotsAndSlotProps & Omit<PopperProps, 'children' | 'open'>;
     defaultComponent: D;
@@ -66,0 +71,0 @@ }

MenuItem/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './MenuItem';

MenuItem/MenuItem.d.ts

@@ -0,0 +0,0 @@ import { ExtendMenuItem, MenuItemTypeMap } from './MenuItemProps';

MenuItem/MenuItem.js

 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["children", "disabled", "component", "selected", "color", "variant", "slots", "slotProps"];
+const _excluded = ["children", "disabled", "component", "selected", "color", "orientation", "variant", "slots", "slotProps"];
 import * as React from 'react';
@@ -14,2 +14,3 @@ import PropTypes from 'prop-types';
 import RowListContext from '../List/RowListContext';
+import ListItemButtonOrientationContext from '../ListItemButton/ListItemButtonOrientationContext';
 import useSlot from '../utils/useSlot';
@@ -59,2 +60,3 @@ import { jsx as _jsx } from "react/jsx-runtime";
       color: colorProp = selected ? 'primary' : 'neutral',
+      orientation = 'horizontal',
       variant = 'plain',
@@ -82,2 +84,3 @@ slots = {},
     focusVisible,
+    orientation,
     selected,
@@ -101,5 +104,8 @@ row,
   });
-  return /*#__PURE__*/_jsx(SlotRoot, _extends({}, rootProps, {
-    children: children
-  }));
+  return /*#__PURE__*/_jsx(ListItemButtonOrientationContext.Provider, {
+    value: orientation,
+    children: /*#__PURE__*/_jsx(SlotRoot, _extends({}, rootProps, {
+      children: children
+    }))
+  });
 });
@@ -129,2 +135,7 @@ process.env.NODE_ENV !== "production" ? MenuItem.propTypes /* remove-proptypes */ = {
   /**
+   * The content direction flow.
+   * @default 'horizontal'
+   */
+  orientation: PropTypes.oneOf(['horizontal', 'vertical']),
+  /**
    * If `true`, the component is selected.
@@ -131,0 +142,0 @@ * @default false

MenuItem/menuItemClasses.d.ts

@@ -0,0 +0,0 @@ export interface MenuItemClasses {

MenuItem/MenuItemProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

MenuList/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './MenuList';

MenuList/MenuList.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

MenuList/menuListClasses.d.ts

@@ -0,0 +0,0 @@ export interface MenuListClasses {

MenuList/MenuListProps.d.ts

 import * as React from 'react';
 import { OverrideProps, OverridableStringUnion } from '@mui/types';
-import { MenuUnstyledActions } from '@mui/base/MenuUnstyled';
+import { MenuActions as BaseMenuActions } from '@mui/base/Menu';
 import { ColorPaletteProp, VariantProp, SxProps, ApplyColorInversion } from '../styles/types';
@@ -23,4 +23,2 @@ import { SlotProps, CreateSlotsAndSlotProps } from '../utils/types';
 }
-export interface MenuActions extends MenuUnstyledActions {
-}
 export interface MenuListTypeMap<P = {}, D extends React.ElementType = 'ul'> {
@@ -32,3 +30,3 @@ props: P & {
          */
-        actions?: React.Ref<MenuUnstyledActions>;
+        actions?: React.Ref<BaseMenuActions>;
         /**
@@ -35,0 +33,0 @@ * The color of the component. It supports those theme colors that make sense for this component.

Modal/CloseModalContext.d.ts

 import * as React from 'react';
 declare const CloseModalContext: React.Context<((event: {}, reason: "backdropClick" | "escapeKeyDown" | "closeClick") => void) | undefined>;
 export default CloseModalContext;

Modal/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Modal';

Modal/Modal.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Modal/Modal.js

@@ -10,3 +10,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import FocusTrap from '@mui/base/FocusTrap';
-import { ModalManager } from '@mui/base/ModalUnstyled';
+import { ModalManager } from '@mui/base/Modal';
 import { styled, useThemeProps } from '../styles';
@@ -88,3 +88,3 @@ import useSlot from '../utils/useSlot';
  */
-const Modal = /*#__PURE__*/React.forwardRef(function ModalUnstyled(inProps, ref) {
+const Modal = /*#__PURE__*/React.forwardRef(function ModalU(inProps, ref) {
   const props = useThemeProps({
@@ -91,0 +91,0 @@ props: inProps,

Modal/modalClasses.d.ts

@@ -0,0 +0,0 @@ export interface ModalClasses {

Modal/ModalProps.d.ts

 import * as React from 'react';
-import { ModalUnstyledOwnProps } from '@mui/base/ModalUnstyled';
+import { ModalOwnProps } from '@mui/base/Modal';
 import { OverrideProps } from '@mui/types';
@@ -24,3 +24,3 @@ import { SxProps } from '../styles/types';
 export interface ModalTypeMap<P = {}, D extends React.ElementType = 'div'> {
-    props: P & Pick<ModalUnstyledOwnProps, 'children' | 'container' | 'disableAutoFocus' | 'disableEnforceFocus' | 'disableEscapeKeyDown' | 'disablePortal' | 'disableRestoreFocus' | 'disableScrollLock' | 'hideBackdrop' | 'keepMounted' | 'open'> & {
+    props: P & Pick<ModalOwnProps, 'children' | 'container' | 'disableAutoFocus' | 'disableEnforceFocus' | 'disableEscapeKeyDown' | 'disablePortal' | 'disableRestoreFocus' | 'disableScrollLock' | 'hideBackdrop' | 'keepMounted' | 'open'> & {
         /**
@@ -27,0 +27,0 @@ * Callback fired when the component requests to be closed.

ModalClose/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ModalClose';

ModalClose/ModalClose.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ModalClose/modalCloseClasses.d.ts

@@ -0,0 +0,0 @@ export interface ModalCloseClasses {

ModalClose/ModalCloseProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ModalDialog/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ModalDialog';

ModalDialog/ModalDialog.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ModalDialog/modalDialogClasses.d.ts

@@ -0,0 +0,0 @@ export interface ModalDialogClasses {

ModalDialog/ModalDialogProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ModalDialog/ModalDialogSizeContext.d.ts

 import * as React from 'react';
 declare const ModalDialogSizeContext: React.Context<"sm" | "md" | "lg" | undefined>;
 export default ModalDialogSizeContext;

ModalDialog/ModalDialogVariantColorContext.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ModalOverflow/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ModalOverflow';

ModalOverflow/ModalOverflow.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ModalOverflow/modalOverflowClasses.d.ts

@@ -0,0 +0,0 @@ export interface ModalOverflowClasses {

ModalOverflow/ModalOverflowProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

modern/Alert/Alert.js

 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["children", "className", "color", "role", "variant", "size", "startDecorator", "endDecorator", "component", "slots", "slotProps"];
+const _excluded = ["children", "className", "color", "invertedColors", "role", "variant", "size", "startDecorator", "endDecorator", "component", "slots", "slotProps"];
 import * as React from 'react';
@@ -11,3 +11,3 @@ import PropTypes from 'prop-types';
 import useThemeProps from '../styles/useThemeProps';
-import { useColorInversion } from '../styles/ColorInversion';
+import { ColorInversionProvider, useColorInversion } from '../styles/ColorInversion';
 import useSlot from '../utils/useSlot';
@@ -37,3 +37,3 @@ import { getAlertUtilityClass } from './alertClasses';
   ownerState
-}) => _extends({
+}) => [_extends({
   '--Alert-radius': theme.vars.radius.sm,
@@ -70,6 +70,7 @@ '--Alert-decoratorChildRadius': 'max((var(--Alert-radius) - var(--variant-borderWidth, 0px)) - var(--Alert-padding), min(var(--Alert-padding) + var(--variant-borderWidth, 0px), var(--Alert-radius) / 2))',
   display: 'flex',
+  position: 'relative',
   alignItems: 'center',
   padding: `var(--Alert-padding)`,
   borderRadius: 'var(--Alert-radius)'
-}, theme.variants[ownerState.variant]?.[ownerState.color]));
+}, theme.variants[ownerState.variant]?.[ownerState.color]), ownerState.color !== 'context' && ownerState.invertedColors && theme.colorInversion[ownerState.variant]?.[ownerState.color]]);
 const AlertStartDecorator = styled('span', {
@@ -123,2 +124,3 @@ name: 'JoyAlert',
       color: colorProp = 'primary',
+      invertedColors = false,
       role = 'alert',
@@ -171,3 +173,3 @@ variant = 'soft',
   });
-  return /*#__PURE__*/_jsxs(SlotRoot, _extends({}, rootProps, {
+  const result = /*#__PURE__*/_jsxs(React.Fragment, {
     children: [startDecorator && /*#__PURE__*/_jsx(SlotStartDecorator, _extends({}, startDecoratorProps, {
@@ -178,2 +180,8 @@ children: startDecorator
     }))]
+  });
+  return /*#__PURE__*/_jsx(SlotRoot, _extends({}, rootProps, {
+    children: invertedColors ? /*#__PURE__*/_jsx(ColorInversionProvider, {
+      variant: variant,
+      children: result
+    }) : result
   }));
@@ -209,2 +217,7 @@ });
   /**
+   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+   * @default false
+   */
+  invertedColors: PropTypes.bool,
+  /**
    * The ARIA role attribute of the element.
@@ -211,0 +224,0 @@ * @default 'alert'

modern/Autocomplete/Autocomplete.js

@@ -14,3 +14,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import useAutocomplete from '@mui/base/useAutocomplete';
-import PopperUnstyled from '@mui/base/PopperUnstyled';
+import Popper from '@mui/base/Popper';
 import { useThemeProps } from '../styles';
@@ -602,7 +602,7 @@ import ClearIcon from '../internal/svg-icons/Close';
         className: clsx(listboxProps.className, listboxProps.ownerState?.color === 'context' && autocompleteClasses.colorContext)
-        // @ts-ignore internal logic (too complex to typed PopperUnstyledOwnProps to SlotListbox but this should be removed when we have `usePopper`)
+        // @ts-ignore internal logic (too complex to typed PopperOwnProps to SlotListbox but this should be removed when we have `usePopper`)
         ,
         modifiers: modifiers
       }, !props.slots?.listbox && {
-        as: PopperUnstyled,
+        as: Popper,
         slots: {
@@ -609,0 +609,0 @@ root: listboxProps.as || 'ul'

modern/Chip/Chip.js

@@ -136,2 +136,4 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
   right: 0,
+  width: '100%',
+  // To fix Firefox issue (https://github.com/mui/material-ui/issues/36877)
   border: 'none',
@@ -138,0 +140,0 @@ cursor: 'pointer',

modern/index.js

 /**
- * @mui/joy v5.0.0-alpha.76
+ * @mui/joy v5.0.0-alpha.77
  *
@@ -4,0 +4,0 @@ * @license MIT

modern/ListItemButton/ListItemButton.js

@@ -47,4 +47,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
   display: 'flex',
-  flexDirection: ownerState.orientation === 'vertical' ? 'column' : 'row',
+  flexDirection: 'row',
   alignItems: 'center',
+  alignSelf: 'stretch'
+}, ownerState.orientation === 'vertical' && {
+  flexDirection: 'column',
+  justifyContent: 'center'
+}, {
   textAlign: 'initial',
@@ -51,0 +56,0 @@ textDecoration: 'initial',

modern/ListItemDecorator/ListItemDecorator.js

@@ -28,8 +28,9 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
   display: 'inline-flex',
-  alignItems: 'center',
   color: `var(--ListItemDecorator-color)`
 }, ownerState.parentOrientation === 'horizontal' ? {
-  minInlineSize: 'var(--ListItemDecorator-size)'
+  minInlineSize: 'var(--ListItemDecorator-size)',
+  alignItems: 'center'
 } : {
-  minBlockSize: 'var(--ListItemDecorator-size)'
+  minBlockSize: 'var(--ListItemDecorator-size)',
+  justifyContent: 'center'
 }));
@@ -36,0 +37,0 @@ /**

modern/Menu/Menu.js

 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["actions", "anchorEl", "children", "color", "component", "disablePortal", "keepMounted", "id", "onClose", "open", "modifiers", "variant", "size", "slots", "slotProps"];
+const _excluded = ["actions", "anchorEl", "children", "color", "component", "disablePortal", "keepMounted", "invertedColors", "id", "onClose", "open", "modifiers", "variant", "size", "slots", "slotProps"];
 import * as React from 'react';
@@ -9,3 +9,3 @@ import PropTypes from 'prop-types';
 import useMenu, { MenuProvider } from '@mui/base/useMenu';
-import PopperUnstyled from '@mui/base/PopperUnstyled';
+import Popper from '@mui/base/Popper';
 import { useSlotProps } from '@mui/base/utils';
@@ -16,3 +16,3 @@ import { StyledList } from '../List/List';
 import { styled, useThemeProps } from '../styles';
-import ColorInversion, { useColorInversion } from '../styles/ColorInversion';
+import ColorInversion, { ColorInversionProvider, useColorInversion } from '../styles/ColorInversion';
 import { getMenuUtilityClass } from './menuClasses';
@@ -42,3 +42,3 @@ import { jsx as _jsx } from "react/jsx-runtime";
   const variantStyle = theme.variants[ownerState.variant]?.[ownerState.color];
-  return _extends({
+  return [_extends({
     '--focus-outline-offset': `calc(${theme.vars.focus.thickness} * -1)`,
@@ -55,3 +55,3 @@ // to prevent the focus outline from being cut by overflow
     backgroundColor: theme.vars.palette.background.popup
-  });
+  }), ownerState.color !== 'context' && ownerState.invertedColors && theme.colorInversion[ownerState.variant]?.[ownerState.color]];
 });
@@ -68,3 +68,3 @@
  * - [Menu API](https://mui.com/joy-ui/api/menu/)
- * - inherits [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/)
+ * - inherits [Popper API](https://mui.com/base/api/popper/)
  */
@@ -84,2 +84,3 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       keepMounted = false,
+      invertedColors = false,
       id,
@@ -118,2 +119,3 @@ onClose,
     disablePortal,
+    invertedColors,
     color,
@@ -154,4 +156,20 @@ variant,
   });
-  const result = /*#__PURE__*/_jsx(MenuRoot, _extends({}, rootProps, !props.slots?.root && {
-    as: PopperUnstyled,
+  let result = /*#__PURE__*/_jsx(MenuProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/_jsx(GroupListContext.Provider, {
+      value: "menu",
+      children: /*#__PURE__*/_jsx(ListProvider, {
+        nested: true,
+        children: children
+      })
+    })
+  });
+  if (invertedColors) {
+    result = /*#__PURE__*/_jsx(ColorInversionProvider, {
+      variant: variant,
+      children: result
+    });
+  }
+  result = /*#__PURE__*/_jsx(MenuRoot, _extends({}, rootProps, !props.slots?.root && {
+    as: Popper,
     slots: {
@@ -161,18 +179,3 @@ root: component || 'ul'
   }, {
-    children: /*#__PURE__*/_jsx(MenuProvider, {
-      value: contextValue,
-      children: /*#__PURE__*/_jsx(GroupListContext.Provider, {
-        value: "menu",
-        children: /*#__PURE__*/_jsx(ListProvider, {
-          nested: true,
-          children: disablePortal ? children :
-          /*#__PURE__*/
-          // For portal popup, the children should not inherit color inversion from the upper parent.
-          _jsx(ColorInversion.Provider, {
-            value: undefined,
-            children: children
-          })
-        })
-      })
-    })
+    children: result
   }));
@@ -228,2 +231,7 @@ return disablePortal ? result :
   /**
+   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+   * @default false
+   */
+  invertedColors: PropTypes.bool,
+  /**
    * Always keep the children in the DOM.
@@ -230,0 +238,0 @@ * This prop can be useful in SEO situation or

modern/MenuItem/MenuItem.js

 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["children", "disabled", "component", "selected", "color", "variant", "slots", "slotProps"];
+const _excluded = ["children", "disabled", "component", "selected", "color", "orientation", "variant", "slots", "slotProps"];
 import * as React from 'react';
@@ -14,2 +14,3 @@ import PropTypes from 'prop-types';
 import RowListContext from '../List/RowListContext';
+import ListItemButtonOrientationContext from '../ListItemButton/ListItemButtonOrientationContext';
 import useSlot from '../utils/useSlot';
@@ -59,2 +60,3 @@ import { jsx as _jsx } from "react/jsx-runtime";
       color: colorProp = selected ? 'primary' : 'neutral',
+      orientation = 'horizontal',
       variant = 'plain',
@@ -82,2 +84,3 @@ slots = {},
     focusVisible,
+    orientation,
     selected,
@@ -101,5 +104,8 @@ row,
   });
-  return /*#__PURE__*/_jsx(SlotRoot, _extends({}, rootProps, {
-    children: children
-  }));
+  return /*#__PURE__*/_jsx(ListItemButtonOrientationContext.Provider, {
+    value: orientation,
+    children: /*#__PURE__*/_jsx(SlotRoot, _extends({}, rootProps, {
+      children: children
+    }))
+  });
 });
@@ -129,2 +135,7 @@ process.env.NODE_ENV !== "production" ? MenuItem.propTypes /* remove-proptypes */ = {
   /**
+   * The content direction flow.
+   * @default 'horizontal'
+   */
+  orientation: PropTypes.oneOf(['horizontal', 'vertical']),
+  /**
    * If `true`, the component is selected.
@@ -131,0 +142,0 @@ * @default false

modern/Modal/Modal.js

@@ -10,3 +10,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import FocusTrap from '@mui/base/FocusTrap';
-import { ModalManager } from '@mui/base/ModalUnstyled';
+import { ModalManager } from '@mui/base/Modal';
 import { styled, useThemeProps } from '../styles';
@@ -88,3 +88,3 @@ import useSlot from '../utils/useSlot';
  */
-const Modal = /*#__PURE__*/React.forwardRef(function ModalUnstyled(inProps, ref) {
+const Modal = /*#__PURE__*/React.forwardRef(function ModalU(inProps, ref) {
   const props = useThemeProps({
@@ -91,0 +91,0 @@ props: inProps,

modern/Select/Select.js

@@ -9,3 +9,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import { unstable_capitalize as capitalize, unstable_useForkRef as useForkRef } from '@mui/utils';
-import PopperUnstyled from '@mui/base/PopperUnstyled';
+import Popper from '@mui/base/Popper';
 import useSelect, { SelectActionTypes, SelectProvider } from '@mui/base/useSelect';
@@ -498,7 +498,7 @@ import composeClasses from '@mui/base/composeClasses';
       className: clsx(listboxProps.className, listboxProps.ownerState?.color === 'context' && selectClasses.colorContext)
-      // @ts-ignore internal logic (too complex to typed PopperUnstyledOwnProps to SlotListbox but this should be removed when we have `usePopper`)
+      // @ts-ignore internal logic (too complex to typed PopperOwnProps to SlotListbox but this should be removed when we have `usePopper`)
       ,
       modifiers: modifiers
     }, !props.slots?.listbox && {
-      as: PopperUnstyled,
+      as: Popper,
       slots: {
@@ -505,0 +505,0 @@ root: listboxProps.as || 'ul'

modern/styles/ColorInversion.js

 import * as React from 'react';
-import { useTheme as useSystemTheme } from '@mui/system';
+import { useTheme } from './ThemeProvider';
 import defaultTheme from './defaultTheme';
@@ -30,3 +30,3 @@ import { jsx as _jsx } from "react/jsx-runtime";
 }) {
-  const theme = useSystemTheme(defaultTheme);
+  const theme = useTheme();
   return /*#__PURE__*/_jsx(ColorInversion.Provider, {
@@ -33,0 +33,0 @@ value: variant ?

modern/styles/extendTheme.js

@@ -233,3 +233,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
         surface: getCssVarColor('palette-common-black'),
-        popup: getCssVarColor('palette-neutral-800'),
+        popup: getCssVarColor('palette-neutral-900'),
         level1: getCssVarColor('palette-neutral-800'),
@@ -236,0 +236,0 @@ level2: getCssVarColor('palette-neutral-700'),

modern/styles/variantUtils.js

@@ -196,4 +196,4 @@ import _extends from "@babel/runtime/helpers/esm/extends";
           [prefixVar('--palette-divider')]: `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.32)`,
-          '--variant-plainColor': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 1)`,
-          '--variant-plainHoverColor': getCssVar(`palette-${color}-600`),
+          '--variant-plainColor': `rgba(${getCssVar(`palette-${color}-darkChannel`)} / 0.8)`,
+          '--variant-plainHoverColor': `rgba(${getCssVar(`palette-${color}-darkChannel`)} / 1)`,
           '--variant-plainHoverBg': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.12)`,
@@ -200,0 +200,0 @@ '--variant-plainActiveBg': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.24)`,

modern/TabPanel/TabPanel.js

@@ -9,3 +9,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import useTabPanel from '@mui/base/useTabPanel';
-import { useTabsContext } from '@mui/base/TabsUnstyled';
+import { useTabsContext } from '@mui/base/Tabs';
 import { styled, useThemeProps } from '../styles';
@@ -12,0 +12,0 @@ import SizeTabsContext from '../Tabs/SizeTabsContext';

modern/Tooltip/Tooltip.js

@@ -8,3 +8,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import { unstable_capitalize as capitalize, unstable_useControlled as useControlled, unstable_useEventCallback as useEventCallback, unstable_useForkRef as useForkRef, unstable_useIsFocusVisible as useIsFocusVisible, unstable_useId as useId } from '@mui/utils';
-import { PopperUnstyled, unstable_composeClasses as composeClasses } from '@mui/base';
+import { Popper, unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
@@ -527,3 +527,3 @@ import useThemeProps from '../styles/useThemeProps';
   const result = /*#__PURE__*/_jsxs(SlotRoot, _extends({}, rootProps, !props.slots?.root && {
-    as: PopperUnstyled,
+    as: Popper,
     slots: {
@@ -530,0 +530,0 @@ root: component || 'div'

node/Alert/Alert.js

@@ -21,3 +21,3 @@ "use strict";
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["children", "className", "color", "role", "variant", "size", "startDecorator", "endDecorator", "component", "slots", "slotProps"];
+const _excluded = ["children", "className", "color", "invertedColors", "role", "variant", "size", "startDecorator", "endDecorator", "component", "slots", "slotProps"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -46,4 +46,4 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 }) => {
-  var _theme$variants;
-  return (0, _extends2.default)({
+  var _theme$variants, _theme$colorInversion;
+  return [(0, _extends2.default)({
     '--Alert-radius': theme.vars.radius.sm,
@@ -80,6 +80,7 @@ '--Alert-decoratorChildRadius': 'max((var(--Alert-radius) - var(--variant-borderWidth, 0px)) - var(--Alert-padding), min(var(--Alert-padding) + var(--variant-borderWidth, 0px), var(--Alert-radius) / 2))',
     display: 'flex',
+    position: 'relative',
     alignItems: 'center',
     padding: `var(--Alert-padding)`,
     borderRadius: 'var(--Alert-radius)'
-  }, (_theme$variants = theme.variants[ownerState.variant]) == null ? void 0 : _theme$variants[ownerState.color]);
+  }, (_theme$variants = theme.variants[ownerState.variant]) == null ? void 0 : _theme$variants[ownerState.color]), ownerState.color !== 'context' && ownerState.invertedColors && ((_theme$colorInversion = theme.colorInversion[ownerState.variant]) == null ? void 0 : _theme$colorInversion[ownerState.color])];
 });
@@ -140,2 +141,3 @@ const AlertStartDecorator = (0, _styled.default)('span', {
       color: colorProp = 'primary',
+      invertedColors = false,
       role = 'alert',
@@ -188,3 +190,3 @@ variant = 'soft',
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(SlotRoot, (0, _extends2.default)({}, rootProps, {
+  const result = /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
     children: [startDecorator && /*#__PURE__*/(0, _jsxRuntime.jsx)(SlotStartDecorator, (0, _extends2.default)({}, startDecoratorProps, {
@@ -195,2 +197,8 @@ children: startDecorator
     }))]
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SlotRoot, (0, _extends2.default)({}, rootProps, {
+    children: invertedColors ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ColorInversion.ColorInversionProvider, {
+      variant: variant,
+      children: result
+    }) : result
   }));
@@ -226,2 +234,7 @@ });
   /**
+   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+   * @default false
+   */
+  invertedColors: _propTypes.default.bool,
+  /**
    * The ARIA role attribute of the element.
@@ -228,0 +241,0 @@ * @default 'alert'

node/Autocomplete/Autocomplete.js

@@ -16,3 +16,3 @@ "use strict";
 var _useAutocomplete = _interopRequireDefault(require("@mui/base/useAutocomplete"));
-var _PopperUnstyled = _interopRequireDefault(require("@mui/base/PopperUnstyled"));
+var _Popper = _interopRequireDefault(require("@mui/base/Popper"));
 var _styles = require("../styles");
@@ -616,7 +616,7 @@ var _Close = _interopRequireDefault(require("../internal/svg-icons/Close"));
         className: (0, _clsx.default)(listboxProps.className, ((_listboxProps$ownerSt = listboxProps.ownerState) == null ? void 0 : _listboxProps$ownerSt.color) === 'context' && _autocompleteClasses.default.colorContext)
-        // @ts-ignore internal logic (too complex to typed PopperUnstyledOwnProps to SlotListbox but this should be removed when we have `usePopper`)
+        // @ts-ignore internal logic (too complex to typed PopperOwnProps to SlotListbox but this should be removed when we have `usePopper`)
         ,
         modifiers: modifiers
       }, !((_props$slots = props.slots) != null && _props$slots.listbox) && {
-        as: _PopperUnstyled.default,
+        as: _Popper.default,
         slots: {
@@ -623,0 +623,0 @@ root: listboxProps.as || 'ul'

node/Chip/Chip.js

@@ -147,2 +147,4 @@ "use strict";
     right: 0,
+    width: '100%',
+    // To fix Firefox issue (https://github.com/mui/material-ui/issues/36877)
     border: 'none',
@@ -149,0 +151,0 @@ cursor: 'pointer',

node/index.js

 /**
- * @mui/joy v5.0.0-alpha.76
+ * @mui/joy v5.0.0-alpha.77
  *
@@ -4,0 +4,0 @@ * @license MIT

node/ListItemButton/ListItemButton.js

@@ -58,4 +58,9 @@ "use strict";
     display: 'flex',
-    flexDirection: ownerState.orientation === 'vertical' ? 'column' : 'row',
+    flexDirection: 'row',
     alignItems: 'center',
+    alignSelf: 'stretch'
+  }, ownerState.orientation === 'vertical' && {
+    flexDirection: 'column',
+    justifyContent: 'center'
+  }, {
     textAlign: 'initial',
@@ -62,0 +67,0 @@ textDecoration: 'initial',

node/ListItemDecorator/ListItemDecorator.js

@@ -37,8 +37,9 @@ "use strict";
   display: 'inline-flex',
-  alignItems: 'center',
   color: `var(--ListItemDecorator-color)`
 }, ownerState.parentOrientation === 'horizontal' ? {
-  minInlineSize: 'var(--ListItemDecorator-size)'
+  minInlineSize: 'var(--ListItemDecorator-size)',
+  alignItems: 'center'
 } : {
-  minBlockSize: 'var(--ListItemDecorator-size)'
+  minBlockSize: 'var(--ListItemDecorator-size)',
+  justifyContent: 'center'
 }));
@@ -45,0 +46,0 @@ /**

node/Menu/Menu.js

@@ -15,3 +15,3 @@ "use strict";
 var _useMenu = _interopRequireWildcard(require("@mui/base/useMenu"));
-var _PopperUnstyled = _interopRequireDefault(require("@mui/base/PopperUnstyled"));
+var _Popper = _interopRequireDefault(require("@mui/base/Popper"));
 var _utils2 = require("@mui/base/utils");
@@ -25,3 +25,3 @@ var _List = require("../List/List");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["actions", "anchorEl", "children", "color", "component", "disablePortal", "keepMounted", "id", "onClose", "open", "modifiers", "variant", "size", "slots", "slotProps"];
+const _excluded = ["actions", "anchorEl", "children", "color", "component", "disablePortal", "keepMounted", "invertedColors", "id", "onClose", "open", "modifiers", "variant", "size", "slots", "slotProps"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -50,5 +50,5 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 }) => {
-  var _theme$variants;
+  var _theme$variants, _theme$colorInversion;
   const variantStyle = (_theme$variants = theme.variants[ownerState.variant]) == null ? void 0 : _theme$variants[ownerState.color];
-  return (0, _extends2.default)({
+  return [(0, _extends2.default)({
     '--focus-outline-offset': `calc(${theme.vars.focus.thickness} * -1)`,
@@ -65,3 +65,3 @@ // to prevent the focus outline from being cut by overflow
     backgroundColor: theme.vars.palette.background.popup
-  });
+  }), ownerState.color !== 'context' && ownerState.invertedColors && ((_theme$colorInversion = theme.colorInversion[ownerState.variant]) == null ? void 0 : _theme$colorInversion[ownerState.color])];
 });
@@ -78,3 +78,3 @@
  * - [Menu API](https://mui.com/joy-ui/api/menu/)
- * - inherits [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/)
+ * - inherits [Popper API](https://mui.com/base/api/popper/)
  */
@@ -95,2 +95,3 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       keepMounted = false,
+      invertedColors = false,
       id,
@@ -129,2 +130,3 @@ onClose,
     disablePortal,
+    invertedColors,
     color,
@@ -165,4 +167,20 @@ variant,
   });
-  const result = /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuRoot, (0, _extends2.default)({}, rootProps, !((_props$slots = props.slots) != null && _props$slots.root) && {
-    as: _PopperUnstyled.default,
+  let result = /*#__PURE__*/(0, _jsxRuntime.jsx)(_useMenu.MenuProvider, {
+    value: contextValue,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GroupListContext.default.Provider, {
+      value: "menu",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListProvider.default, {
+        nested: true,
+        children: children
+      })
+    })
+  });
+  if (invertedColors) {
+    result = /*#__PURE__*/(0, _jsxRuntime.jsx)(_ColorInversion.ColorInversionProvider, {
+      variant: variant,
+      children: result
+    });
+  }
+  result = /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuRoot, (0, _extends2.default)({}, rootProps, !((_props$slots = props.slots) != null && _props$slots.root) && {
+    as: _Popper.default,
     slots: {
@@ -172,18 +190,3 @@ root: component || 'ul'
   }, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_useMenu.MenuProvider, {
-      value: contextValue,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GroupListContext.default.Provider, {
-        value: "menu",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListProvider.default, {
-          nested: true,
-          children: disablePortal ? children :
-          /*#__PURE__*/
-          // For portal popup, the children should not inherit color inversion from the upper parent.
-          (0, _jsxRuntime.jsx)(_ColorInversion.default.Provider, {
-            value: undefined,
-            children: children
-          })
-        })
-      })
-    })
+    children: result
   }));
@@ -239,2 +242,7 @@ return disablePortal ? result :
   /**
+   * If `true`, the children with an implicit color prop invert their colors to match the component's variant and color.
+   * @default false
+   */
+  invertedColors: _propTypes.default.bool,
+  /**
    * Always keep the children in the DOM.
@@ -241,0 +249,0 @@ * This prop can be useful in SEO situation or

node/MenuItem/MenuItem.js

@@ -20,5 +20,6 @@ "use strict";
 var _RowListContext = _interopRequireDefault(require("../List/RowListContext"));
+var _ListItemButtonOrientationContext = _interopRequireDefault(require("../ListItemButton/ListItemButtonOrientationContext"));
 var _useSlot = _interopRequireDefault(require("../utils/useSlot"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["children", "disabled", "component", "selected", "color", "variant", "slots", "slotProps"];
+const _excluded = ["children", "disabled", "component", "selected", "color", "orientation", "variant", "slots", "slotProps"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -68,2 +69,3 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
       color: colorProp = selected ? 'primary' : 'neutral',
+      orientation = 'horizontal',
       variant = 'plain',
@@ -91,2 +93,3 @@ slots = {},
     focusVisible,
+    orientation,
     selected,
@@ -110,5 +113,8 @@ row,
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(SlotRoot, (0, _extends2.default)({}, rootProps, {
-    children: children
-  }));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemButtonOrientationContext.default.Provider, {
+    value: orientation,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(SlotRoot, (0, _extends2.default)({}, rootProps, {
+      children: children
+    }))
+  });
 });
@@ -138,2 +144,7 @@ process.env.NODE_ENV !== "production" ? MenuItem.propTypes /* remove-proptypes */ = {
   /**
+   * The content direction flow.
+   * @default 'horizontal'
+   */
+  orientation: _propTypes.default.oneOf(['horizontal', 'vertical']),
+  /**
    * If `true`, the component is selected.
@@ -140,0 +151,0 @@ * @default false

node/Modal/Modal.js

@@ -16,3 +16,3 @@ "use strict";
 var _FocusTrap = _interopRequireDefault(require("@mui/base/FocusTrap"));
-var _ModalUnstyled = require("@mui/base/ModalUnstyled");
+var _Modal = require("@mui/base/Modal");
 var _styles = require("../styles");
@@ -49,3 +49,3 @@ var _useSlot = _interopRequireDefault(require("../utils/useSlot"));
 // Modals don't open on the server so this won't conflict with concurrent requests.
-const manager = new _ModalUnstyled.ModalManager();
+const manager = new _Modal.ModalManager();
 const ModalRoot = (0, _styles.styled)('div', {
@@ -97,3 +97,3 @@ name: 'JoyModal',
  */
-const Modal = /*#__PURE__*/React.forwardRef(function ModalUnstyled(inProps, ref) {
+const Modal = /*#__PURE__*/React.forwardRef(function ModalU(inProps, ref) {
   const props = (0, _styles.useThemeProps)({
@@ -100,0 +100,0 @@ props: inProps,

node/Select/Select.js

@@ -14,3 +14,3 @@ "use strict";
 var _utils = require("@mui/utils");
-var _PopperUnstyled = _interopRequireDefault(require("@mui/base/PopperUnstyled"));
+var _Popper = _interopRequireDefault(require("@mui/base/Popper"));
 var _useSelect = _interopRequireWildcard(require("@mui/base/useSelect"));
@@ -517,7 +517,7 @@ var _composeClasses = _interopRequireDefault(require("@mui/base/composeClasses"));
       className: (0, _clsx.default)(listboxProps.className, ((_listboxProps$ownerSt = listboxProps.ownerState) == null ? void 0 : _listboxProps$ownerSt.color) === 'context' && _selectClasses.default.colorContext)
-      // @ts-ignore internal logic (too complex to typed PopperUnstyledOwnProps to SlotListbox but this should be removed when we have `usePopper`)
+      // @ts-ignore internal logic (too complex to typed PopperOwnProps to SlotListbox but this should be removed when we have `usePopper`)
       ,
       modifiers: modifiers
     }, !((_props$slots = props.slots) != null && _props$slots.listbox) && {
-      as: _PopperUnstyled.default,
+      as: _Popper.default,
       slots: {
@@ -524,0 +524,0 @@ root: listboxProps.as || 'ul'

node/styles/ColorInversion.js

@@ -10,3 +10,3 @@ "use strict";
 var React = _interopRequireWildcard(require("react"));
-var _system = require("@mui/system");
+var _ThemeProvider = require("./ThemeProvider");
 var _defaultTheme = _interopRequireDefault(require("./defaultTheme"));
@@ -43,3 +43,3 @@ var _jsxRuntime = require("react/jsx-runtime");
   var _theme$colorInversion;
-  const theme = (0, _system.useTheme)(_defaultTheme.default);
+  const theme = (0, _ThemeProvider.useTheme)();
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(ColorInversion.Provider, {
@@ -46,0 +46,0 @@ value: variant ?

node/styles/extendTheme.js

@@ -244,3 +244,3 @@ "use strict";
         surface: getCssVarColor('palette-common-black'),
-        popup: getCssVarColor('palette-neutral-800'),
+        popup: getCssVarColor('palette-neutral-900'),
         level1: getCssVarColor('palette-neutral-800'),
@@ -247,0 +247,0 @@ level2: getCssVarColor('palette-neutral-700'),

node/styles/variantUtils.js

@@ -210,4 +210,4 @@ "use strict";
           [prefixVar('--palette-divider')]: `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.32)`,
-          '--variant-plainColor': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 1)`,
-          '--variant-plainHoverColor': getCssVar(`palette-${color}-600`),
+          '--variant-plainColor': `rgba(${getCssVar(`palette-${color}-darkChannel`)} / 0.8)`,
+          '--variant-plainHoverColor': `rgba(${getCssVar(`palette-${color}-darkChannel`)} / 1)`,
           '--variant-plainHoverBg': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.12)`,
@@ -214,0 +214,0 @@ '--variant-plainActiveBg': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.24)`,

node/TabPanel/TabPanel.js

@@ -15,3 +15,3 @@ "use strict";
 var _useTabPanel = _interopRequireDefault(require("@mui/base/useTabPanel"));
-var _TabsUnstyled = require("@mui/base/TabsUnstyled");
+var _Tabs = require("@mui/base/Tabs");
 var _styles = require("../styles");
@@ -76,3 +76,3 @@ var _SizeTabsContext = _interopRequireDefault(require("../Tabs/SizeTabsContext"));
     orientation
-  } = (0, _TabsUnstyled.useTabsContext)() || {
+  } = (0, _Tabs.useTabsContext)() || {
     orientation: 'horizontal'
@@ -79,0 +79,0 @@ };

node/Tooltip/Tooltip.js

@@ -538,3 +538,3 @@ "use strict";
   const result = /*#__PURE__*/(0, _jsxRuntime.jsxs)(SlotRoot, (0, _extends2.default)({}, rootProps, !((_props$slots = props.slots) != null && _props$slots.root) && {
-    as: _base.PopperUnstyled,
+    as: _base.Popper,
     slots: {
@@ -541,0 +541,0 @@ root: component || 'div'

Option/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Option';

Option/Option.d.ts

@@ -0,0 +0,0 @@ import { ExtendOption, OptionTypeMap } from './OptionProps';

Option/optionClasses.d.ts

@@ -0,0 +0,0 @@ export interface OptionClasses {

Option/OptionProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

package.json

 {
   "name": "@mui/joy",
-  "version": "5.0.0-alpha.76",
+  "version": "5.0.0-alpha.77",
   "private": false,
@@ -47,4 +47,4 @@ "author": "MUI Team",
     "@babel/runtime": "^7.21.0",
-    "@mui/base": "5.0.0-alpha.126",
-    "@mui/core-downloads-tracker": "^5.12.1",
+    "@mui/base": "5.0.0-alpha.127",
+    "@mui/core-downloads-tracker": "^5.12.2",
     "@mui/system": "^5.12.1",
@@ -51,0 +51,0 @@ "@mui/types": "^7.2.4",

Radio/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Radio';

Radio/Radio.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Radio/radioClasses.d.ts

@@ -0,0 +0,0 @@ export interface RadioClasses {

Radio/RadioProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

RadioGroup/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './RadioGroup';

RadioGroup/RadioGroup.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

RadioGroup/radioGroupClasses.d.ts

@@ -0,0 +0,0 @@ export interface RadioGroupClasses {

RadioGroup/RadioGroupContext.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

RadioGroup/RadioGroupProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

ScopedCssBaseline/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './ScopedCssBaseline';

ScopedCssBaseline/ScopedCssBaseline.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

ScopedCssBaseline/scopedCssBaselineClasses.d.ts

@@ -0,0 +0,0 @@ export interface ScopedCssBaselineClasses {

ScopedCssBaseline/ScopedCssBaselineProps.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

Select/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Select';

Select/Select.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Select/Select.js

@@ -9,3 +9,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import { unstable_capitalize as capitalize, unstable_useForkRef as useForkRef } from '@mui/utils';
-import PopperUnstyled from '@mui/base/PopperUnstyled';
+import Popper from '@mui/base/Popper';
 import useSelect, { SelectActionTypes, SelectProvider } from '@mui/base/useSelect';
@@ -509,7 +509,7 @@ import composeClasses from '@mui/base/composeClasses';
       className: clsx(listboxProps.className, ((_listboxProps$ownerSt = listboxProps.ownerState) == null ? void 0 : _listboxProps$ownerSt.color) === 'context' && selectClasses.colorContext)
-      // @ts-ignore internal logic (too complex to typed PopperUnstyledOwnProps to SlotListbox but this should be removed when we have `usePopper`)
+      // @ts-ignore internal logic (too complex to typed PopperOwnProps to SlotListbox but this should be removed when we have `usePopper`)
       ,
       modifiers: modifiers
     }, !((_props$slots = props.slots) != null && _props$slots.listbox) && {
-      as: PopperUnstyled,
+      as: Popper,
       slots: {
@@ -516,0 +516,0 @@ root: listboxProps.as || 'ul'

Select/selectClasses.d.ts

@@ -0,0 +0,0 @@ export interface SelectClasses {

Select/SelectProps.d.ts

 import * as React from 'react';
 import { OverridableStringUnion, OverrideProps } from '@mui/types';
-import { PopperUnstyledOwnProps } from '@mui/base/PopperUnstyled';
+import { PopperOwnProps } from '@mui/base/Popper';
 import { SelectOption } from '@mui/base/useOption';
@@ -57,3 +57,3 @@ import { ColorPaletteProp, SxProps, VariantProp, ApplyColorInversion } from '../styles/types';
         size?: OverridableStringUnion<'sm' | 'md' | 'lg', SelectPropsSizeOverrides>;
-    } & Omit<PopperUnstyledOwnProps, 'slots' | 'slotProps' | 'open'>, SelectOwnerState<any>>;
+    } & Omit<PopperOwnProps, 'slots' | 'slotProps' | 'open'>, SelectOwnerState<any>>;
 }>;
@@ -60,0 +60,0 @@ export interface SelectStaticProps {

Sheet/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Sheet';

Sheet/Sheet.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Sheet/sheetClasses.d.ts

@@ -0,0 +0,0 @@ export interface SheetClasses {

Sheet/SheetProps.d.ts

@@ -0,0 +0,0 @@ import { OverridableStringUnion, OverrideProps } from '@mui/types';

Slider/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Slider';

Slider/Slider.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Slider/sliderClasses.d.ts

@@ -0,0 +0,0 @@ export interface SliderClasses {

Slider/SliderProps.d.ts

 import * as React from 'react';
-import { SliderUnstyledClasses, SliderUnstyledOwnProps } from '@mui/base/SliderUnstyled';
+import { SliderClasses, SliderOwnProps } from '@mui/base/Slider';
 import { OverridableStringUnion, OverrideProps } from '@mui/types';
@@ -68,7 +68,7 @@ import { ColorPaletteProp, SxProps, VariantProp, ApplyColorInversion } from '../styles/types';
 export type SliderTypeMap<D extends React.ElementType = 'span', P = {}> = {
-    props: P & Omit<SliderUnstyledOwnProps, 'slots' | 'slotProps'> & {
+    props: P & Omit<SliderOwnProps, 'slots' | 'slotProps'> & {
         /**
          * Override or extend the styles applied to the component.
          */
-        classes?: Partial<SliderUnstyledClasses>;
+        classes?: Partial<SliderClasses>;
         /**
@@ -75,0 +75,0 @@ * The color of the component. It supports those theme colors that make sense for this component.

Stack/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Stack';

Stack/Stack.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Stack/stackClasses.d.ts

@@ -0,0 +0,0 @@ import { StackClasses } from '@mui/system';

Stack/StackProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

styles/ColorInversion.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

styles/ColorInversion.js

 import * as React from 'react';
-import { useTheme as useSystemTheme } from '@mui/system';
+import { useTheme } from './ThemeProvider';
 import defaultTheme from './defaultTheme';
@@ -31,3 +31,3 @@ import { jsx as _jsx } from "react/jsx-runtime";
   var _theme$colorInversion;
-  const theme = useSystemTheme(defaultTheme);
+  const theme = useTheme();
   return /*#__PURE__*/_jsx(ColorInversion.Provider, {
@@ -34,0 +34,0 @@ value: variant ?

styles/CssVarsProvider.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

styles/defaultTheme.d.ts

 declare const defaultTheme: import("./types").Theme;
 export default defaultTheme;

styles/extendTheme.d.ts

@@ -0,0 +0,0 @@ import { BreakpointsOptions, SpacingOptions, SxConfig } from '@mui/system';

styles/extendTheme.js

@@ -235,3 +235,3 @@ import _extends from "@babel/runtime/helpers/esm/extends";
         surface: getCssVarColor('palette-common-black'),
-        popup: getCssVarColor('palette-neutral-800'),
+        popup: getCssVarColor('palette-neutral-900'),
         level1: getCssVarColor('palette-neutral-800'),
@@ -238,0 +238,0 @@ level2: getCssVarColor('palette-neutral-700'),

styles/identifier.d.ts

 declare const _default: "$$joy";
 export default _default;

styles/index.d.ts

@@ -0,0 +0,0 @@ export type { BreakpointOverrides } from '@mui/system';

styles/shouldSkipGeneratingVar.d.ts

 export default function shouldSkipGeneratingVar(keys: string[]): boolean;

styles/styled.d.ts

 import { Theme } from './types';
 declare const styled: import("@mui/system").CreateMUIStyled<Theme>;
 export default styled;

styles/StyledEngineProvider.d.ts

 export { StyledEngineProvider as default } from '@mui/system';

styles/styleUtils.d.ts

@@ -0,0 +0,0 @@ import { Theme, SxProps } from './types';

styles/sxConfig.d.ts

 import { SxConfig } from '@mui/system';
 declare const sxConfig: SxConfig;
 export default sxConfig;

styles/ThemeProvider.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

styles/types/colorScheme.d.ts

@@ -0,0 +0,0 @@ import { OverridableStringUnion } from '@mui/types';

styles/types/colorSystem.d.ts

@@ -0,0 +0,0 @@ import { OverridableStringUnion, Simplify } from '@mui/types';

styles/types/focus.d.ts

@@ -0,0 +0,0 @@ import { CSSObject } from '@mui/system';

styles/types/index.d.ts

@@ -0,0 +0,0 @@ export * from './colorScheme';

styles/types/radius.d.ts

@@ -0,0 +0,0 @@ import { OverridableRecord } from './utils';

styles/types/shadow.d.ts

@@ -0,0 +0,0 @@ import { OverridableRecord } from './utils';

styles/types/theme.d.ts

@@ -0,0 +0,0 @@ import { OverridableStringUnion } from '@mui/types';

styles/types/typography.d.ts

@@ -0,0 +0,0 @@ import { CSSObject } from '@mui/system';

styles/types/utils.d.ts

@@ -0,0 +0,0 @@ /**

styles/types/variants.d.ts

@@ -0,0 +0,0 @@ import { OverridableStringUnion } from '@mui/types';

styles/types/zIndex.d.ts

@@ -0,0 +0,0 @@ import { OverridableRecord } from './utils';

styles/useThemeProps.d.ts

@@ -0,0 +0,0 @@ export default function useThemeProps<T extends {}>({ props, name, }: {

styles/variantUtils.d.ts

@@ -0,0 +0,0 @@ import { CSSObject } from '@mui/system';

styles/variantUtils.js

@@ -200,4 +200,4 @@ import _extends from "@babel/runtime/helpers/esm/extends";
           [prefixVar('--palette-divider')]: `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.32)`,
-          '--variant-plainColor': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 1)`,
-          '--variant-plainHoverColor': getCssVar(`palette-${color}-600`),
+          '--variant-plainColor': `rgba(${getCssVar(`palette-${color}-darkChannel`)} / 0.8)`,
+          '--variant-plainHoverColor': `rgba(${getCssVar(`palette-${color}-darkChannel`)} / 1)`,
           '--variant-plainHoverBg': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.12)`,
@@ -204,0 +204,0 @@ '--variant-plainActiveBg': `rgba(${getCssVar(`palette-${color}-mainChannel`)} / 0.24)`,

SvgIcon/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './SvgIcon';

SvgIcon/SvgIcon.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

SvgIcon/svgIconClasses.d.ts

@@ -0,0 +0,0 @@ export interface SvgIconClasses {

SvgIcon/SvgIconProps.d.ts

@@ -0,0 +0,0 @@ import { OverridableStringUnion, OverrideProps } from '@mui/types';

Switch/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Switch';

Switch/Switch.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Switch/switchClasses.d.ts

@@ -0,0 +0,0 @@ export interface SwitchClasses {

Switch/SwitchProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Tab/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Tab';

Tab/Tab.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Tab/tabClasses.d.ts

@@ -0,0 +0,0 @@ export interface TabClasses {

Tab/TabProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Table/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Table';

Table/Table.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Table/tableClasses.d.ts

@@ -0,0 +0,0 @@ export interface TableClasses {

Table/TableProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

TabList/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './TabList';

TabList/TabList.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

TabList/tabListClasses.d.ts

@@ -0,0 +0,0 @@ export interface TabListClasses {

TabList/TabListProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

TabPanel/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './TabPanel';

TabPanel/TabPanel.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

TabPanel/TabPanel.js

@@ -9,3 +9,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import useTabPanel from '@mui/base/useTabPanel';
-import { useTabsContext } from '@mui/base/TabsUnstyled';
+import { useTabsContext } from '@mui/base/Tabs';
 import { styled, useThemeProps } from '../styles';
@@ -12,0 +12,0 @@ import SizeTabsContext from '../Tabs/SizeTabsContext';

TabPanel/tabPanelClasses.d.ts

@@ -0,0 +0,0 @@ export interface TabPanelClasses {

TabPanel/TabPanelProps.d.ts

 import * as React from 'react';
 import { OverridableStringUnion, OverrideProps } from '@mui/types';
-import { TabPanelUnstyledOwnProps } from '@mui/base/TabPanelUnstyled';
+import { TabPanelOwnProps } from '@mui/base/TabPanel';
 import { SxProps } from '../styles/types';
@@ -20,3 +20,3 @@ import { SlotProps, CreateSlotsAndSlotProps } from '../utils/types';
 export interface TabPanelTypeMap<P = {}, D extends React.ElementType = 'div'> {
-    props: P & Omit<TabPanelUnstyledOwnProps, 'value' | 'slots' | 'slotProps'> & {
+    props: P & Omit<TabPanelOwnProps, 'value' | 'slots' | 'slotProps'> & {
         /**
@@ -23,0 +23,0 @@ * The value of the TabPanel. It will be shown when the Tab with the corresponding value is selected.

Tabs/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Tabs';

Tabs/SizeTabsContext.d.ts

 import * as React from 'react';
 declare const SizeTabsContext: React.Context<"sm" | "md" | "lg">;
 export default SizeTabsContext;

Tabs/Tabs.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Tabs/tabsClasses.d.ts

@@ -0,0 +0,0 @@ export interface TabsClasses {

Tabs/TabsProps.d.ts

 import * as React from 'react';
 import { OverridableStringUnion, OverrideProps } from '@mui/types';
-import { TabsUnstyledOwnProps } from '@mui/base/TabsUnstyled';
+import { TabsOwnProps } from '@mui/base/Tabs';
 import { ColorPaletteProp, SxProps, VariantProp, ApplyColorInversion } from '../styles/types';
@@ -24,3 +24,3 @@ import { SlotProps, CreateSlotsAndSlotProps } from '../utils/types';
 export interface TabsTypeMap<P = {}, D extends React.ElementType = 'div'> {
-    props: P & Omit<TabsUnstyledOwnProps, 'slots' | 'slotProps'> & {
+    props: P & Omit<TabsOwnProps, 'slots' | 'slotProps'> & {
         /**
@@ -27,0 +27,0 @@ * The color of the component. It supports those theme colors that make sense for this component.

Textarea/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Textarea';

Textarea/Textarea.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Textarea/textareaClasses.d.ts

@@ -0,0 +0,0 @@ export interface TextareaClasses {

Textarea/TextareaProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

TextField/index.d.ts

 export { default } from './TextField';

TextField/TextField.d.ts

@@ -0,0 +0,0 @@ /**

Tooltip/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Tooltip';

Tooltip/Tooltip.d.ts

@@ -0,0 +0,0 @@ import { OverridableComponent } from '@mui/types';

Tooltip/Tooltip.js

@@ -8,3 +8,3 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import { unstable_capitalize as capitalize, unstable_useControlled as useControlled, unstable_useEventCallback as useEventCallback, unstable_useForkRef as useForkRef, unstable_useIsFocusVisible as useIsFocusVisible, unstable_useId as useId } from '@mui/utils';
-import { PopperUnstyled, unstable_composeClasses as composeClasses } from '@mui/base';
+import { Popper, unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
@@ -530,3 +530,3 @@ import useThemeProps from '../styles/useThemeProps';
   const result = /*#__PURE__*/_jsxs(SlotRoot, _extends({}, rootProps, !((_props$slots = props.slots) != null && _props$slots.root) && {
-    as: PopperUnstyled,
+    as: Popper,
     slots: {
@@ -533,0 +533,0 @@ root: component || 'div'

Tooltip/tooltipClasses.d.ts

@@ -0,0 +0,0 @@ export interface TooltipClasses {

Tooltip/TooltipProps.d.ts

 import * as React from 'react';
-import { PopperUnstyledProps } from '@mui/base';
+import { PopperProps } from '@mui/base';
 import { OverridableStringUnion, OverrideProps } from '@mui/types';
@@ -29,7 +29,7 @@ import { ColorPaletteProp, SxProps, VariantProp, ApplyColorInversion } from '../styles/types';
         sx?: SxProps;
-    } & Omit<PopperUnstyledProps, 'direction'>, TooltipOwnerState>;
+    } & Omit<PopperProps, 'direction'>, TooltipOwnerState>;
     arrow: SlotProps<'span', {}, TooltipOwnerState>;
 }>;
 export interface TooltipTypeMap<P = {}, D extends React.ElementType = 'div'> {
-    props: P & TooltipSlotsAndSlotProps & Pick<PopperUnstyledProps, 'disablePortal' | 'direction' | 'keepMounted' | 'modifiers'> & {
+    props: P & TooltipSlotsAndSlotProps & Pick<PopperProps, 'disablePortal' | 'direction' | 'keepMounted' | 'modifiers'> & {
         /**
@@ -36,0 +36,0 @@ * If `true`, adds an arrow to the tooltip.

Typography/index.d.ts

@@ -0,0 +0,0 @@ export { default } from './Typography';

Typography/Typography.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

Typography/typographyClasses.d.ts

@@ -0,0 +0,0 @@ export interface TypographyClasses {

Typography/TypographyProps.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

utils/createSvgIcon.d.ts

@@ -0,0 +0,0 @@ import * as React from 'react';

utils/index.d.ts

 export { default as createSvgIcon } from './createSvgIcon';

utils/shouldSpreadAdditionalProps.d.ts

 declare const shouldSpreadAdditionalProps: (Slot: any) => boolean;
 export default shouldSpreadAdditionalProps;

utils/types.d.ts

@@ -0,0 +0,0 @@ /// <reference types="react" />

utils/useSlot.d.ts

@@ -78,3 +78,3 @@ import * as React from 'react';
      * props forward to `T` only if the `slotProps.*.component` is not provided.
-     * e.g. Autocomplete's listbox uses PopperUnstyled + StyledComponent
+     * e.g. Autocomplete's listbox uses Popper + StyledComponent
      */
@@ -81,0 +81,0 @@ internalForwardedProps?: any;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

71450

increased by0.18%

Worsened metrics

Total package byte prevSize

3451721

decreased by-0.02%

Dependency changes

• + Added@mui/base@5.0.0-alpha.127(transitive)

• - Removed@mui/base@5.0.0-alpha.126(transitive)

• Updated@mui/base@5.0.0-alpha.127

• Updated@mui/core-downloads-tracker@^5.12.2