Rename the listbox slot component

mui · Jan 23, 2024 · 3f33a8f · 3f33a8f
1 parent 4bdf749
commit 3f33a8f
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 18 deletions.
diff --git a/docs/data/base/components/menu/MenuIntroduction/css/index.js b/docs/data/base/components/menu/MenuIntroduction/css/index.js
@@ -22,7 +22,7 @@ export default function MenuIntroduction() {
       <Menu
         className="CustomMenuIntroduction"
         slots={{
-          listbox: AnimatedListbox,
+          listbox: Listbox,
         }}
         slotProps={{
           listbox: { className: 'CustomMenuIntroduction--listbox' },
@@ -52,13 +52,13 @@ export default function MenuIntroduction() {
   );
 }
 
-const AnimatedListbox = React.forwardRef(function AnimatedListbox(props, ref) {
+const Listbox = React.forwardRef(function Listbox(props, ref) {
   const { ownerState, ...other } = props;
   const popupContext = React.useContext(PopupContext);
 
   if (popupContext == null) {
     throw new Error(
-      'The `AnimatedListbox` component cannot be rendered outside a `Popup` component',
+      'The `Listbox` component cannot be rendered outside a `Popup` component',
     );
   }
 
@@ -75,7 +75,7 @@ const AnimatedListbox = React.forwardRef(function AnimatedListbox(props, ref) {
   );
 });
 
-AnimatedListbox.propTypes = {
+Listbox.propTypes = {
   ownerState: PropTypes.object.isRequired,
 };
 

diff --git a/docs/data/base/components/menu/MenuIntroduction/css/index.tsx b/docs/data/base/components/menu/MenuIntroduction/css/index.tsx
@@ -21,7 +21,7 @@ export default function MenuIntroduction() {
       <Menu
         className="CustomMenuIntroduction"
         slots={{
-          listbox: AnimatedListbox,
+          listbox: Listbox,
         }}
         slotProps={{
           listbox: { className: 'CustomMenuIntroduction--listbox' },
@@ -51,7 +51,7 @@ export default function MenuIntroduction() {
   );
 }
 
-const AnimatedListbox = React.forwardRef(function AnimatedListbox(
+const Listbox = React.forwardRef(function Listbox(
   props: MenuListboxSlotProps,
   ref: React.ForwardedRef<HTMLUListElement>,
 ) {
@@ -60,7 +60,7 @@ const AnimatedListbox = React.forwardRef(function AnimatedListbox(
 
   if (popupContext == null) {
     throw new Error(
-      'The `AnimatedListbox` component cannot be rendered outside a `Popup` component',
+      'The `Listbox` component cannot be rendered outside a `Popup` component',
     );
   }
 

diff --git a/docs/data/base/components/menu/MenuIntroduction/tailwind/index.js b/docs/data/base/components/menu/MenuIntroduction/tailwind/index.js
@@ -51,7 +51,7 @@ const Menu = React.forwardRef((props, ref) => {
       ref={ref}
       {...props}
       slots={{
-        listbox: AnimatedListbox,
+        listbox: Listbox,
       }}
       slotProps={{
         ...props.slotProps,
@@ -136,13 +136,13 @@ MenuItem.propTypes = {
   className: PropTypes.string,
 };
 
-const AnimatedListbox = React.forwardRef(function AnimatedListbox(props, ref) {
+const Listbox = React.forwardRef(function Listbox(props, ref) {
   const { ownerState, ...other } = props;
   const popupContext = React.useContext(PopupContext);
 
   if (popupContext == null) {
     throw new Error(
-      'The `AnimatedListbox` component cannot be rendered outside a `Popup` component',
+      'The `Listbox` component cannot be rendered outside a `Popup` component',
     );
   }
 
@@ -151,14 +151,13 @@ const AnimatedListbox = React.forwardRef(function AnimatedListbox(props, ref) {
   return (
     <CssTransition
       className={`placement-${verticalPlacement}`}
-      enterClassName="open"
-      exitClassName="closed"
+      enterClassName="base--expanded"
     >
       <ul {...other} ref={ref} />
     </CssTransition>
   );
 });
 
-AnimatedListbox.propTypes = {
+Listbox.propTypes = {
   ownerState: PropTypes.object.isRequired,
 };
diff --git a/docs/data/base/components/menu/MenuIntroduction/tailwind/index.tsx b/docs/data/base/components/menu/MenuIntroduction/tailwind/index.tsx
@@ -51,7 +51,7 @@ const Menu = React.forwardRef<HTMLDivElement, MenuProps>((props, ref) => {
       ref={ref}
       {...props}
       slots={{
-        listbox: AnimatedListbox,
+        listbox: Listbox,
       }}
       slotProps={{
         ...props.slotProps,
@@ -116,7 +116,7 @@ const MenuItem = React.forwardRef<HTMLLIElement, MenuItemProps>((props, ref) =>
   );
 });
 
-const AnimatedListbox = React.forwardRef(function AnimatedListbox(
+const Listbox = React.forwardRef(function Listbox(
   props: MenuListboxSlotProps,
   ref: React.ForwardedRef<HTMLUListElement>,
 ) {
@@ -125,7 +125,7 @@ const AnimatedListbox = React.forwardRef(function AnimatedListbox(
 
   if (popupContext == null) {
     throw new Error(
-      'The `AnimatedListbox` component cannot be rendered outside a `Popup` component',
+      'The `Listbox` component cannot be rendered outside a `Popup` component',
     );
   }
 
@@ -134,8 +134,7 @@ const AnimatedListbox = React.forwardRef(function AnimatedListbox(
   return (
     <CssTransition
       className={`placement-${verticalPlacement}`}
-      enterClassName="open"
-      exitClassName="closed"
+      enterClassName="base--expanded"
     >
       <ul {...other} ref={ref} />
     </CssTransition>