structural first pass:

docs/data/material/components/click-away-listener/click-away-listener.md

@@ -15,11 +15,13 @@ githubLabel: 'component: ClickAwayListener'
 
 Click-Away Listener is a utility component that listens for click events outside of its child.
 (Note that it only accepts _one_ child element.)
-
 This is useful for components like the [Popper](/material-ui/react-popper/) which should close when the user clicks anywhere else in the document.
-
 Click-Away Listener also supports the [Portal](/material-ui/react-portal/) component.
 
+The demo below shows how to hide a menu dropdown when users click anywhere else on the page:
+
+{{"demo": "ClickAway.js"}}
+
 ## Basics
 
 ### Import
@@ -28,10 +30,6 @@ Click-Away Listener also supports the [Portal](/material-ui/react-portal/) compo
 import ClickAwayListener from '@mui/material/ClickAwayListener';
 ```
 
-The demo below shows how to hide a menu dropdown when users click anywhere else on the page:
-
-{{"demo": "ClickAway.js"}}
-
 ## Customization
 
 ### Use with Portal

docs/data/material/components/no-ssr/no-ssr.md

@@ -12,26 +12,26 @@ components: NoSsr
 
 ## Introduction
 
-No-SSR is a utility component that prevents its children from being rendered on the server.
+No-SSR is a utility component that prevents its children from being rendered on the server, deferring their rendering to the client instead, as shown in the following demo:
 
-This component can be useful in a variety of situations:
+{{"demo": "SimpleNoSsr.js"}}
+
+This can be useful in a variety of situations:
 
 - To create an escape hatch for broken dependencies that don't support server-side rendering (SSR)
 - To improve the time to first paint by only rendering above the fold
 - To reduce the rendering time on the server
 - To turn on service degradation when the server load is too heavy
 - To improve the Time to Interactive (TTI) by only rendering what's important (using the `defer` prop)
 
-## Component
+## Basics
+
+### Import
 
 ```jsx
-import { NoSsr } from '@mui/base/NoSsr';
+import NoSsr from '@mui/material/NoSsr';
 ```
 
-At its core, the No-SSR component's purpose is to defer rendering from the server to the client, as shown in the following demo:
-
-{{"demo": "SimpleNoSsr.js"}}
-
 ## Customization
 
 ### Delay client-side rendering

docs/data/material/components/portal/portal.md

@@ -16,28 +16,31 @@ githubLabel: 'component: Portal'
 Portal is a utility component built around [React's `createPortal()` API](https://react.dev/reference/react-dom/createPortal).
 It gives you the functionality of `createPortal()` in a convenient component form.
 
-The Portal component is used internally by the [Modal](/base-ui/react-modal/) and [Popper](/base-ui/react-popper/) components.
-
-## Component
-
-```jsx
-import { Portal } from '@mui/base/Portal';
-```
-
-Normally, children of a component are rendered within that component's DOM tree.
-But sometimes it's necessary to mount a child at a different location in the DOM.
-
 :::info
 According to [the React docs](https://react.dev/reference/react-dom/createPortal), portals are useful when "you need the child element to visually 'break out' of its container"—for instance, modals and tooltips, which need to exist outside of the normal flow of the document.
 :::
 
+The Portal component is used internally by the [Modal](/base-ui/react-modal/) and [Popper](/base-ui/react-popper/) components.
+
+Normally, children of a component are rendered within that component's DOM tree.
+But sometimes it's necessary to mount a child at a different location in the DOM.
 The Portal component accepts a `container` prop that passes a `ref` to the DOM node where its children will be mounted.
 
 The following demo shows how a `<span>` nested within a Portal can be appended to a node outside of the Portal's DOM hierarchy—click **Mount children** to see how it behaves:
 
 {{"demo": "SimplePortal.js"}}
 
-### Server-side
+## Basics
+
+### Import
+
+```jsx
+import Portal from '@mui/material/Portal';
+```
+
+## Customization
+
+### Server-side Portals
 
 The DOM API isn't available on the server, so you need to use the `container` prop callback.
 This callback is called during a React layout effect:

docs/data/material/components/textarea-autosize/textarea-autosize.md

@@ -7,30 +7,26 @@ githubLabel: 'component: TextareaAutosize'
 
 # Textarea Autosize
 
-<p class="description">The Textarea Autosize component gives you a textarea HTML element that automatically adjusts its height to match the length of the content within.</p>
+<p class="description">The Textarea Autosize component automatically adjusts its height to match the length of the content within.</p>
 
 {{"component": "@mui/docs/ComponentLinkHeader", "design": false}}
 
 ## Introduction
 
 Textarea Autosize is a utility component that replaces the native `<textarea>` HTML.
-
 The height of the Textarea Autosize component automatically adjusts as a response to keyboard inputs and window resizing events.
 
-{{"demo": "UnstyledTextareaIntroduction", "defaultCodeOpen": false, "bg": "gradient"}}
-
-## Component
-
-```jsx
-import { TextareaAutosize } from '@mui/base/TextareaAutosize';
-```
-
-Textarea Autosize behaves similarly to the native HTML`<textarea>`.
 By default, an empty Textarea Autosize component renders as a single row, as shown in the following demo:
 
 {{"demo": "UnstyledTextarea", "defaultCodeOpen": false}}
 
-## Customization
+## Basics
+
+### Import
+
+```jsx
+import TextareaAutosize from '@mui/material/TextareaAutosize';
+```
 
 ### Minimum height