From a335d87c03fbf907d267c663010daf43287c2c8f Mon Sep 17 00:00:00 2001
From: Sean Campbell <sean.campbell13@gmail.com>
Date: Fri, 24 Jul 2020 19:03:47 -0400
Subject: [PATCH 1/7] [Accordion] Add new classes key

---
 packages/material-ui/src/Accordion/Accordion.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/material-ui/src/Accordion/Accordion.js b/packages/material-ui/src/Accordion/Accordion.js
index 9b15aa3e0cb0af..212707a1f240bd 100644
--- a/packages/material-ui/src/Accordion/Accordion.js
+++ b/packages/material-ui/src/Accordion/Accordion.js
@@ -77,6 +77,8 @@ export const styles = (theme) => {
     expanded: {},
     /* Styles applied to the root element if `disabled={true}`. */
     disabled: {},
+    /* Styles applied to the region element, the container of the children */
+    region: {},
   };
 };
 
@@ -137,7 +139,12 @@ const Accordion = React.forwardRef(function Accordion(props, ref) {
     >
       <AccordionContext.Provider value={contextValue}>{summary}</AccordionContext.Provider>
       <TransitionComponent in={expanded} timeout="auto" {...TransitionProps}>
-        <div aria-labelledby={summary.props.id} id={summary.props['aria-controls']} role="region">
+        <div
+          aria-labelledby={summary.props.id}
+          id={summary.props['aria-controls']}
+          role="region"
+          className={classes.region}
+        >
           {children}
         </div>
       </TransitionComponent>

From f00757ed17600314e00675767fc8315bcb1a56ae Mon Sep 17 00:00:00 2001
From: Sean Campbell <sean.campbell13@gmail.com>
Date: Fri, 24 Jul 2020 19:04:16 -0400
Subject: [PATCH 2/7] [Collapse] Changed container classes key to root

---
 packages/material-ui/src/Collapse/Collapse.js | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/material-ui/src/Collapse/Collapse.js b/packages/material-ui/src/Collapse/Collapse.js
index ffcb0f68668380..b3c1b396328fe6 100644
--- a/packages/material-ui/src/Collapse/Collapse.js
+++ b/packages/material-ui/src/Collapse/Collapse.js
@@ -10,8 +10,8 @@ import useTheme from '../styles/useTheme';
 import { useForkRef } from '../utils';
 
 export const styles = (theme) => ({
-  /* Styles applied to the container element. */
-  container: {
+  /* Styles applied to the root element. */
+  root: {
     height: 0,
     overflow: 'hidden',
     transition: theme.transitions.create('height'),
@@ -23,7 +23,7 @@ export const styles = (theme) => ({
   },
   /* Pseudo-class applied to the root element if `orientation="horizontal"`. */
   horizontal: {},
-  /* Styles applied to the container element when the transition has entered. */
+  /* Styles applied to the root element when the transition has entered. */
   entered: {
     height: 'auto',
     overflow: 'visible',
@@ -31,7 +31,7 @@ export const styles = (theme) => ({
       width: 'auto',
     },
   },
-  /* Styles applied to the container element when the transition has exited and `collapsedSize` != 0px. */
+  /* Styles applied to the root element when the transition has exited and `collapsedSize` != 0px. */
   hidden: {
     visibility: 'hidden',
   },
@@ -226,7 +226,7 @@ const Collapse = React.forwardRef(function Collapse(props, ref) {
       {(state, childProps) => (
         <Component
           className={clsx(
-            classes.container,
+            classes.root,
             {
               [classes.horizontal]: isHorizontal,
               [classes.entered]: state === 'entered',

From e8e99cc38859aa8654e0b787d76fa31a88a787e6 Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Sat, 25 Jul 2020 01:14:00 +0200
Subject: [PATCH 3/7] Update packages/material-ui/src/Accordion/Accordion.js

---
 packages/material-ui/src/Accordion/Accordion.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/material-ui/src/Accordion/Accordion.js b/packages/material-ui/src/Accordion/Accordion.js
index 212707a1f240bd..37d46c839d4b63 100644
--- a/packages/material-ui/src/Accordion/Accordion.js
+++ b/packages/material-ui/src/Accordion/Accordion.js
@@ -77,7 +77,7 @@ export const styles = (theme) => {
     expanded: {},
     /* Styles applied to the root element if `disabled={true}`. */
     disabled: {},
-    /* Styles applied to the region element, the container of the children */
+    /* Styles applied to the region element, the container of the children. */
     region: {},
   };
 };

From f96d8ca7285f24c44c8b8a138323da4a29874dcd Mon Sep 17 00:00:00 2001
From: Sean Campbell <sean.campbell13@gmail.com>
Date: Fri, 24 Jul 2020 19:21:49 -0400
Subject: [PATCH 4/7] Updated Docs

---
 docs/pages/api-docs/accordion.md | 1 +
 docs/pages/api-docs/collapse.md  | 6 +++---
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/docs/pages/api-docs/accordion.md b/docs/pages/api-docs/accordion.md
index 241697672daeee..c0602e95d23bc8 100644
--- a/docs/pages/api-docs/accordion.md
+++ b/docs/pages/api-docs/accordion.md
@@ -50,6 +50,7 @@ Any other props supplied will be provided to the root element ([Paper](/api/pape
 | <span class="prop-name">rounded</span> | <span class="prop-name">.MuiAccordion-rounded</span> | Styles applied to the root element if `square={false}`.
 | <span class="prop-name">expanded</span> | <span class="prop-name">.Mui-expanded</span> | Styles applied to the root element if `expanded={true}`.
 | <span class="prop-name">disabled</span> | <span class="prop-name">.Mui-disabled</span> | Styles applied to the root element if `disabled={true}`.
+| <span class="prop-name">region</span> | <span class="prop-name">.MuiAccordion-region</span> | Styles applied to the region element, the container of the children
 
 You can override the style of the component thanks to one of these customization points:
 
diff --git a/docs/pages/api-docs/collapse.md b/docs/pages/api-docs/collapse.md
index 6e2f75dda96908..7ed5125c1bea4c 100644
--- a/docs/pages/api-docs/collapse.md
+++ b/docs/pages/api-docs/collapse.md
@@ -46,10 +46,10 @@ Any other props supplied will be provided to the root element ([Transition](http
 
 | Rule name | Global class | Description |
 |:-----|:-------------|:------------|
-| <span class="prop-name">container</span> | <span class="prop-name">.MuiCollapse-container</span> | Styles applied to the container element.
+| <span class="prop-name">root</span> | <span class="prop-name">.MuiCollapse-root</span> | Styles applied to the root element.
 | <span class="prop-name">horizontal</span> | <span class="prop-name">.MuiCollapse-horizontal</span> | Pseudo-class applied to the root element if `orientation="horizontal"`.
-| <span class="prop-name">entered</span> | <span class="prop-name">.MuiCollapse-entered</span> | Styles applied to the container element when the transition has entered.
-| <span class="prop-name">hidden</span> | <span class="prop-name">.MuiCollapse-hidden</span> | Styles applied to the container element when the transition has exited and `collapsedSize` != 0px.
+| <span class="prop-name">entered</span> | <span class="prop-name">.MuiCollapse-entered</span> | Styles applied to the root element when the transition has entered.
+| <span class="prop-name">hidden</span> | <span class="prop-name">.MuiCollapse-hidden</span> | Styles applied to the root element when the transition has exited and `collapsedSize` != 0px.
 | <span class="prop-name">wrapper</span> | <span class="prop-name">.MuiCollapse-wrapper</span> | Styles applied to the outer wrapper element.
 | <span class="prop-name">wrapperInner</span> | <span class="prop-name">.MuiCollapse-wrapperInner</span> | Styles applied to the inner wrapper element.
 

From 3e29ce59274d21e460b51518987eb90f8abd1297 Mon Sep 17 00:00:00 2001
From: Sean Campbell <sean.campbell13@gmail.com>
Date: Fri, 24 Jul 2020 19:48:57 -0400
Subject: [PATCH 5/7] Ran yarn docs:api after the period added

---
 docs/pages/api-docs/accordion.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/pages/api-docs/accordion.md b/docs/pages/api-docs/accordion.md
index c0602e95d23bc8..93e08c6baeab00 100644
--- a/docs/pages/api-docs/accordion.md
+++ b/docs/pages/api-docs/accordion.md
@@ -50,7 +50,7 @@ Any other props supplied will be provided to the root element ([Paper](/api/pape
 | <span class="prop-name">rounded</span> | <span class="prop-name">.MuiAccordion-rounded</span> | Styles applied to the root element if `square={false}`.
 | <span class="prop-name">expanded</span> | <span class="prop-name">.Mui-expanded</span> | Styles applied to the root element if `expanded={true}`.
 | <span class="prop-name">disabled</span> | <span class="prop-name">.Mui-disabled</span> | Styles applied to the root element if `disabled={true}`.
-| <span class="prop-name">region</span> | <span class="prop-name">.MuiAccordion-region</span> | Styles applied to the region element, the container of the children
+| <span class="prop-name">region</span> | <span class="prop-name">.MuiAccordion-region</span> | Styles applied to the region element, the container of the children.
 
 You can override the style of the component thanks to one of these customization points:
 

From ad8e4fffd8329dfa951c84783d5776b16d31693f Mon Sep 17 00:00:00 2001
From: Sean Campbell <sean.campbell13@gmail.com>
Date: Fri, 24 Jul 2020 20:14:09 -0400
Subject: [PATCH 6/7] Fix failing tests

---
 packages/material-ui/src/Collapse/Collapse.test.js       | 4 ++--
 packages/material-ui/src/StepContent/StepContent.test.js | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/material-ui/src/Collapse/Collapse.test.js b/packages/material-ui/src/Collapse/Collapse.test.js
index 393b8ae997ba78..10a270a0c87a5d 100644
--- a/packages/material-ui/src/Collapse/Collapse.test.js
+++ b/packages/material-ui/src/Collapse/Collapse.test.js
@@ -29,11 +29,11 @@ describe('<Collapse />', () => {
 
   it('should render a container around the wrapper', () => {
     const { container } = render(
-      <Collapse {...defaultProps} classes={{ container: 'woofCollapse1' }} />,
+      <Collapse {...defaultProps} classes={{ root: 'woofCollapse1' }} />,
     );
     const collapse = container.firstChild;
     expect(collapse.tagName).to.equal('DIV');
-    expect(collapse).to.have.class(classes.container);
+    expect(collapse).to.have.class(classes.root);
     expect(collapse).to.have.class('woofCollapse1');
   });
 
diff --git a/packages/material-ui/src/StepContent/StepContent.test.js b/packages/material-ui/src/StepContent/StepContent.test.js
index 66639fe64ce372..e04dfdbcb3da7d 100644
--- a/packages/material-ui/src/StepContent/StepContent.test.js
+++ b/packages/material-ui/src/StepContent/StepContent.test.js
@@ -43,7 +43,7 @@ describe('<StepContent />', () => {
       </Stepper>,
     );
 
-    const collapse = container.querySelector(`.${collapseClasses.container}`);
+    const collapse = container.querySelector(`.${collapseClasses.root}`);
     const innerDiv = container.querySelector(`.test-content`);
 
     expect(collapse).to.not.equal(null);
@@ -63,7 +63,7 @@ describe('<StepContent />', () => {
         </Stepper>,
       );
 
-      const collapse = container.querySelector(`.${collapseClasses.container}`);
+      const collapse = container.querySelector(`.${collapseClasses.root}`);
       expect(collapse).to.not.equal(null);
     });
 

From 0ebbadf25f3ff353659e26e020864c5ca976eae9 Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Sat, 25 Jul 2020 12:28:38 +0200
Subject: [PATCH 7/7] polish

---
 docs/pages/api-docs/accordion.md                   | 4 ++--
 docs/src/pages/guides/migration-v4/migration-v4.md | 7 +++++++
 packages/material-ui/src/Accordion/Accordion.d.ts  | 2 +-
 packages/material-ui/src/Accordion/Accordion.js    | 4 ++--
 packages/material-ui/src/Collapse/Collapse.d.ts    | 8 +++++++-
 5 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/docs/pages/api-docs/accordion.md b/docs/pages/api-docs/accordion.md
index 93e08c6baeab00..3d877e7028175e 100644
--- a/docs/pages/api-docs/accordion.md
+++ b/docs/pages/api-docs/accordion.md
@@ -48,8 +48,8 @@ Any other props supplied will be provided to the root element ([Paper](/api/pape
 |:-----|:-------------|:------------|
 | <span class="prop-name">root</span> | <span class="prop-name">.MuiAccordion-root</span> | Styles applied to the root element.
 | <span class="prop-name">rounded</span> | <span class="prop-name">.MuiAccordion-rounded</span> | Styles applied to the root element if `square={false}`.
-| <span class="prop-name">expanded</span> | <span class="prop-name">.Mui-expanded</span> | Styles applied to the root element if `expanded={true}`.
-| <span class="prop-name">disabled</span> | <span class="prop-name">.Mui-disabled</span> | Styles applied to the root element if `disabled={true}`.
+| <span class="prop-name">expanded</span> | <span class="prop-name">.Mui-expanded</span> | Pseudo-class applied to the root element if `expanded={true}`.
+| <span class="prop-name">disabled</span> | <span class="prop-name">.Mui-disabled</span> | Pseudo-class applied to the root element if `disabled={true}`.
 | <span class="prop-name">region</span> | <span class="prop-name">.MuiAccordion-region</span> | Styles applied to the region element, the container of the children.
 
 You can override the style of the component thanks to one of these customization points:
diff --git a/docs/src/pages/guides/migration-v4/migration-v4.md b/docs/src/pages/guides/migration-v4/migration-v4.md
index 095b00460a2e4e..da9a714324b48d 100644
--- a/docs/src/pages/guides/migration-v4/migration-v4.md
+++ b/docs/src/pages/guides/migration-v4/migration-v4.md
@@ -79,6 +79,13 @@ This change affects almost all components where you're using the `component` pro
   +<Collapse collapsedSize={40}>
   ```
 
+- The `classes.container` key was changed to match the convention of the other components.
+
+  ```diff
+  -<Collapse classes={{ container: 'collapse' }}>
+  +<Collapse classes={{ root: 'collapse' }}>
+  ```
+
 ### Divider
 
 - Use border instead of background color. It prevents inconsistent height on scaled screens. For people customizing the color of the border, the change requires changing the override CSS property:
diff --git a/packages/material-ui/src/Accordion/Accordion.d.ts b/packages/material-ui/src/Accordion/Accordion.d.ts
index ed0229da7c26d0..31d6afd56edf7a 100644
--- a/packages/material-ui/src/Accordion/Accordion.d.ts
+++ b/packages/material-ui/src/Accordion/Accordion.d.ts
@@ -41,7 +41,7 @@ export interface AccordionProps extends StandardProps<PaperProps, AccordionClass
   TransitionProps?: TransitionProps;
 }
 
-export type AccordionClassKey = 'root' | 'rounded' | 'expanded' | 'disabled';
+export type AccordionClassKey = 'root' | 'rounded' | 'expanded' | 'disabled' | 'region';
 
 /**
  *
diff --git a/packages/material-ui/src/Accordion/Accordion.js b/packages/material-ui/src/Accordion/Accordion.js
index 37d46c839d4b63..aef659171d4aaf 100644
--- a/packages/material-ui/src/Accordion/Accordion.js
+++ b/packages/material-ui/src/Accordion/Accordion.js
@@ -73,9 +73,9 @@ export const styles = (theme) => {
         },
       },
     },
-    /* Styles applied to the root element if `expanded={true}`. */
+    /* Pseudo-class applied to the root element if `expanded={true}`. */
     expanded: {},
-    /* Styles applied to the root element if `disabled={true}`. */
+    /* Pseudo-class applied to the root element if `disabled={true}`. */
     disabled: {},
     /* Styles applied to the region element, the container of the children. */
     region: {},
diff --git a/packages/material-ui/src/Collapse/Collapse.d.ts b/packages/material-ui/src/Collapse/Collapse.d.ts
index f6bf2c81f8ac70..879a461456eae9 100644
--- a/packages/material-ui/src/Collapse/Collapse.d.ts
+++ b/packages/material-ui/src/Collapse/Collapse.d.ts
@@ -33,7 +33,13 @@ export interface CollapseProps extends StandardProps<TransitionProps, CollapseCl
   timeout?: TransitionProps['timeout'] | 'auto';
 }
 
-export type CollapseClassKey = 'container' | 'entered' | 'hidden' | 'wrapper' | 'wrapperInner';
+export type CollapseClassKey =
+  | 'root'
+  | 'horizontal'
+  | 'entered'
+  | 'hidden'
+  | 'wrapper'
+  | 'wrapperInner';
 
 /**
  * The Collapse transition is used by the