From d8facfafdb8cc56d6090108ad46b112e3153a141 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 12:18:31 +0530
Subject: [PATCH 01/21] [grid] Remove 'column' and 'column-reverse' options
 from GridDirection type

---
 packages/mui-material/src/Grid/Grid.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mui-material/src/Grid/Grid.tsx b/packages/mui-material/src/Grid/Grid.tsx
index 82f026147cb593..908a38227bf4c6 100644
--- a/packages/mui-material/src/Grid/Grid.tsx
+++ b/packages/mui-material/src/Grid/Grid.tsx
@@ -10,7 +10,7 @@ import useTheme from '../styles/useTheme';
 
 type ResponsiveStyleValue<T> = T | Array<T | null> | { [key in Breakpoint]?: T | null };
 
-export type GridDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
+export type GridDirection = 'row' | 'row-reverse';
 
 export type GridSpacing = number | string;
 

From fed32f64166660942d0169ebddf0dd61d5499599 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 12:30:23 +0530
Subject: [PATCH 02/21] fix ts issues

---
 docs/data/joy/components/tooltip/PositionedTooltips.tsx         | 2 +-
 docs/data/material/components/popper/PositionedPopper.tsx       | 2 +-
 docs/data/material/components/tooltips/PositionedTooltips.tsx   | 2 +-
 .../material/components/transfer-list/SelectAllTransferList.tsx | 2 +-
 docs/data/material/components/transfer-list/TransferList.tsx    | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.tsx b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
index 1ef39f9dfe7b2b..0e79d9c0e0fd67 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.tsx
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
@@ -33,7 +33,7 @@ export default function PositionedTooltips() {
             <Button variant="plain">left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container direction="column" sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
           <Grid>
             <Tooltip title="Add" placement="right-start">
               <Button variant="plain">right-start</Button>
diff --git a/docs/data/material/components/popper/PositionedPopper.tsx b/docs/data/material/components/popper/PositionedPopper.tsx
index db8f008cb1c247..ef7fa1e6aa14fb 100644
--- a/docs/data/material/components/popper/PositionedPopper.tsx
+++ b/docs/data/material/components/popper/PositionedPopper.tsx
@@ -53,7 +53,7 @@ export default function PositionedPopper() {
           <br />
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
-        <Grid container direction="column" sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
           <Grid>
             <Button onClick={handleClick('right-start')}>right-start</Button>
           </Grid>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.tsx b/docs/data/material/components/tooltips/PositionedTooltips.tsx
index a56035b3e174bf..f718f7c465fdf5 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.tsx
+++ b/docs/data/material/components/tooltips/PositionedTooltips.tsx
@@ -33,7 +33,7 @@ export default function PositionedTooltips() {
             <Button>left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container direction="column" sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
           <Grid>
             <Tooltip title="Add" placement="right-start">
               <Button>right-start</Button>
diff --git a/docs/data/material/components/transfer-list/SelectAllTransferList.tsx b/docs/data/material/components/transfer-list/SelectAllTransferList.tsx
index c4d486c6c5d3f1..239f8e59ea70e5 100644
--- a/docs/data/material/components/transfer-list/SelectAllTransferList.tsx
+++ b/docs/data/material/components/transfer-list/SelectAllTransferList.tsx
@@ -133,7 +133,7 @@ export default function SelectAllTransferList() {
     >
       <Grid>{customList('Choices', left)}</Grid>
       <Grid>
-        <Grid container direction="column" sx={{ alignItems: 'center' }}>
+        <Grid container sx={{ alignItems: 'center' }}>
           <Button
             sx={{ my: 0.5 }}
             variant="outlined"
diff --git a/docs/data/material/components/transfer-list/TransferList.tsx b/docs/data/material/components/transfer-list/TransferList.tsx
index 042020d3df7ed9..be205ccdf31708 100644
--- a/docs/data/material/components/transfer-list/TransferList.tsx
+++ b/docs/data/material/components/transfer-list/TransferList.tsx
@@ -97,7 +97,7 @@ export default function TransferList() {
     >
       <Grid>{customList(left)}</Grid>
       <Grid>
-        <Grid container direction="column" sx={{ alignItems: 'center' }}>
+        <Grid container sx={{ alignItems: 'center' }}>
           <Button
             sx={{ my: 0.5 }}
             variant="outlined"

From 66267f2fe383e231aebcb6a4415c47bc89cc07f2 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 12:33:11 +0530
Subject: [PATCH 03/21] fix demos

---
 docs/data/joy/components/tooltip/PositionedTooltips.js          | 2 +-
 docs/data/material/components/popper/PositionedPopper.js        | 2 +-
 docs/data/material/components/tooltips/PositionedTooltips.js    | 2 +-
 .../material/components/transfer-list/SelectAllTransferList.js  | 2 +-
 docs/data/material/components/transfer-list/TransferList.js     | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.js b/docs/data/joy/components/tooltip/PositionedTooltips.js
index 1ef39f9dfe7b2b..0e79d9c0e0fd67 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.js
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.js
@@ -33,7 +33,7 @@ export default function PositionedTooltips() {
             <Button variant="plain">left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container direction="column" sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
           <Grid>
             <Tooltip title="Add" placement="right-start">
               <Button variant="plain">right-start</Button>
diff --git a/docs/data/material/components/popper/PositionedPopper.js b/docs/data/material/components/popper/PositionedPopper.js
index c58dd0d6b511b9..046ddb896e2d87 100644
--- a/docs/data/material/components/popper/PositionedPopper.js
+++ b/docs/data/material/components/popper/PositionedPopper.js
@@ -51,7 +51,7 @@ export default function PositionedPopper() {
           <br />
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
-        <Grid container direction="column" sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
           <Grid>
             <Button onClick={handleClick('right-start')}>right-start</Button>
           </Grid>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.js b/docs/data/material/components/tooltips/PositionedTooltips.js
index a56035b3e174bf..f718f7c465fdf5 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.js
+++ b/docs/data/material/components/tooltips/PositionedTooltips.js
@@ -33,7 +33,7 @@ export default function PositionedTooltips() {
             <Button>left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container direction="column" sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
           <Grid>
             <Tooltip title="Add" placement="right-start">
               <Button>right-start</Button>
diff --git a/docs/data/material/components/transfer-list/SelectAllTransferList.js b/docs/data/material/components/transfer-list/SelectAllTransferList.js
index e1d54bda3edaba..1ec19e5a762cac 100644
--- a/docs/data/material/components/transfer-list/SelectAllTransferList.js
+++ b/docs/data/material/components/transfer-list/SelectAllTransferList.js
@@ -132,7 +132,7 @@ export default function SelectAllTransferList() {
     >
       <Grid>{customList('Choices', left)}</Grid>
       <Grid>
-        <Grid container direction="column" sx={{ alignItems: 'center' }}>
+        <Grid container sx={{ alignItems: 'center' }}>
           <Button
             sx={{ my: 0.5 }}
             variant="outlined"
diff --git a/docs/data/material/components/transfer-list/TransferList.js b/docs/data/material/components/transfer-list/TransferList.js
index 85fe352bec33fb..92a3d991d5e0bd 100644
--- a/docs/data/material/components/transfer-list/TransferList.js
+++ b/docs/data/material/components/transfer-list/TransferList.js
@@ -97,7 +97,7 @@ export default function TransferList() {
     >
       <Grid>{customList(left)}</Grid>
       <Grid>
-        <Grid container direction="column" sx={{ alignItems: 'center' }}>
+        <Grid container sx={{ alignItems: 'center' }}>
           <Button
             sx={{ my: 0.5 }}
             variant="outlined"

From a0d56e83d43e97df9b7a8e08cc8c5438a50496c2 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 12:57:37 +0530
Subject: [PATCH 04/21] fix

---
 .../components/tooltip/PositionedTooltips.tsx | 33 ++++----
 .../components/popper/PositionedPopper.tsx    | 21 +++--
 .../tooltips/PositionedTooltips.tsx           | 33 ++++----
 .../transfer-list/SelectAllTransferList.tsx   | 43 +++++-----
 .../components/transfer-list/TransferList.tsx | 83 ++++++++++---------
 5 files changed, 114 insertions(+), 99 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.tsx b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
index 0e79d9c0e0fd67..bbd9efe6f40cad 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.tsx
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
@@ -2,6 +2,7 @@ import Box from '@mui/joy/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/joy/Button';
 import Tooltip from '@mui/joy/Tooltip';
+import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -34,21 +35,23 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Grid>
-            <Tooltip title="Add" placement="right-start">
-              <Button variant="plain">right-start</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right">
-              <Button variant="plain">right</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right-end">
-              <Button variant="plain">right-end</Button>
-            </Tooltip>
-          </Grid>
+          <Stack>
+            <Grid>
+              <Tooltip title="Add" placement="right-start">
+                <Button variant="plain">right-start</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right">
+                <Button variant="plain">right</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right-end">
+                <Button variant="plain">right-end</Button>
+              </Tooltip>
+            </Grid>
+          </Stack>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/popper/PositionedPopper.tsx b/docs/data/material/components/popper/PositionedPopper.tsx
index ef7fa1e6aa14fb..633ecdf44e7d13 100644
--- a/docs/data/material/components/popper/PositionedPopper.tsx
+++ b/docs/data/material/components/popper/PositionedPopper.tsx
@@ -6,6 +6,7 @@ import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Fade from '@mui/material/Fade';
 import Paper from '@mui/material/Paper';
+import Stack from '@mui/material/Stack';
 
 export default function PositionedPopper() {
   const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);
@@ -54,15 +55,17 @@ export default function PositionedPopper() {
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
         <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Grid>
-            <Button onClick={handleClick('right-start')}>right-start</Button>
-          </Grid>
-          <Grid>
-            <Button onClick={handleClick('right')}>right</Button>
-          </Grid>
-          <Grid>
-            <Button onClick={handleClick('right-end')}>right-end</Button>
-          </Grid>
+          <Stack>
+            <Grid>
+              <Button onClick={handleClick('right-start')}>right-start</Button>
+            </Grid>
+            <Grid>
+              <Button onClick={handleClick('right')}>right</Button>
+            </Grid>
+            <Grid>
+              <Button onClick={handleClick('right-end')}>right-end</Button>
+            </Grid>
+          </Stack>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.tsx b/docs/data/material/components/tooltips/PositionedTooltips.tsx
index f718f7c465fdf5..0bb8120c03b4fe 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.tsx
+++ b/docs/data/material/components/tooltips/PositionedTooltips.tsx
@@ -2,6 +2,7 @@ import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Tooltip from '@mui/material/Tooltip';
+import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -34,21 +35,23 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Grid>
-            <Tooltip title="Add" placement="right-start">
-              <Button>right-start</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right">
-              <Button>right</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right-end">
-              <Button>right-end</Button>
-            </Tooltip>
-          </Grid>
+          <Stack>
+            <Grid>
+              <Tooltip title="Add" placement="right-start">
+                <Button>right-start</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right">
+                <Button>right</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right-end">
+                <Button>right-end</Button>
+              </Tooltip>
+            </Grid>
+          </Stack>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/transfer-list/SelectAllTransferList.tsx b/docs/data/material/components/transfer-list/SelectAllTransferList.tsx
index 239f8e59ea70e5..c44dbe9dd9a6ca 100644
--- a/docs/data/material/components/transfer-list/SelectAllTransferList.tsx
+++ b/docs/data/material/components/transfer-list/SelectAllTransferList.tsx
@@ -9,6 +9,7 @@ import ListItemIcon from '@mui/material/ListItemIcon';
 import Checkbox from '@mui/material/Checkbox';
 import Button from '@mui/material/Button';
 import Divider from '@mui/material/Divider';
+import Stack from '@mui/material/Stack';
 
 function not(a: readonly number[], b: readonly number[]) {
   return a.filter((value) => !b.includes(value));
@@ -134,26 +135,28 @@ export default function SelectAllTransferList() {
       <Grid>{customList('Choices', left)}</Grid>
       <Grid>
         <Grid container sx={{ alignItems: 'center' }}>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedRight}
-            disabled={leftChecked.length === 0}
-            aria-label="move selected right"
-          >
-            &gt;
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedLeft}
-            disabled={rightChecked.length === 0}
-            aria-label="move selected left"
-          >
-            &lt;
-          </Button>
+          <Stack>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedRight}
+              disabled={leftChecked.length === 0}
+              aria-label="move selected right"
+            >
+              &gt;
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedLeft}
+              disabled={rightChecked.length === 0}
+              aria-label="move selected left"
+            >
+              &lt;
+            </Button>
+          </Stack>
         </Grid>
       </Grid>
       <Grid>{customList('Chosen', right)}</Grid>
diff --git a/docs/data/material/components/transfer-list/TransferList.tsx b/docs/data/material/components/transfer-list/TransferList.tsx
index be205ccdf31708..1d391e7581646a 100644
--- a/docs/data/material/components/transfer-list/TransferList.tsx
+++ b/docs/data/material/components/transfer-list/TransferList.tsx
@@ -7,6 +7,7 @@ import ListItemText from '@mui/material/ListItemText';
 import Checkbox from '@mui/material/Checkbox';
 import Button from '@mui/material/Button';
 import Paper from '@mui/material/Paper';
+import Stack from '@mui/material/Stack';
 
 function not(a: readonly number[], b: readonly number[]) {
   return a.filter((value) => !b.includes(value));
@@ -98,46 +99,48 @@ export default function TransferList() {
       <Grid>{customList(left)}</Grid>
       <Grid>
         <Grid container sx={{ alignItems: 'center' }}>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleAllRight}
-            disabled={left.length === 0}
-            aria-label="move all right"
-          >
-            ≫
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedRight}
-            disabled={leftChecked.length === 0}
-            aria-label="move selected right"
-          >
-            &gt;
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedLeft}
-            disabled={rightChecked.length === 0}
-            aria-label="move selected left"
-          >
-            &lt;
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleAllLeft}
-            disabled={right.length === 0}
-            aria-label="move all left"
-          >
-            ≪
-          </Button>
+          <Stack>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleAllRight}
+              disabled={left.length === 0}
+              aria-label="move all right"
+            >
+              ≫
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedRight}
+              disabled={leftChecked.length === 0}
+              aria-label="move selected right"
+            >
+              &gt;
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedLeft}
+              disabled={rightChecked.length === 0}
+              aria-label="move selected left"
+            >
+              &lt;
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleAllLeft}
+              disabled={right.length === 0}
+              aria-label="move all left"
+            >
+              ≪
+            </Button>
+          </Stack>
         </Grid>
       </Grid>
       <Grid>{customList(right)}</Grid>

From 6d8dfcf100455886091603114e17566b9be7bc7a Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 12:58:12 +0530
Subject: [PATCH 05/21] reigger


From 589823adf65264392ec7243015adcaef84fba39c Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 14:29:11 +0530
Subject: [PATCH 06/21] docs-format

---
 .../components/tooltip/PositionedTooltips.js  | 33 ++++----
 .../components/popper/PositionedPopper.js     | 21 +++--
 .../components/tooltips/PositionedTooltips.js | 33 ++++----
 .../transfer-list/SelectAllTransferList.js    | 43 +++++-----
 .../components/transfer-list/TransferList.js  | 83 ++++++++++---------
 5 files changed, 114 insertions(+), 99 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.js b/docs/data/joy/components/tooltip/PositionedTooltips.js
index 0e79d9c0e0fd67..bbd9efe6f40cad 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.js
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.js
@@ -2,6 +2,7 @@ import Box from '@mui/joy/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/joy/Button';
 import Tooltip from '@mui/joy/Tooltip';
+import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -34,21 +35,23 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Grid>
-            <Tooltip title="Add" placement="right-start">
-              <Button variant="plain">right-start</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right">
-              <Button variant="plain">right</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right-end">
-              <Button variant="plain">right-end</Button>
-            </Tooltip>
-          </Grid>
+          <Stack>
+            <Grid>
+              <Tooltip title="Add" placement="right-start">
+                <Button variant="plain">right-start</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right">
+                <Button variant="plain">right</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right-end">
+                <Button variant="plain">right-end</Button>
+              </Tooltip>
+            </Grid>
+          </Stack>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/popper/PositionedPopper.js b/docs/data/material/components/popper/PositionedPopper.js
index 046ddb896e2d87..259b660b96b9fb 100644
--- a/docs/data/material/components/popper/PositionedPopper.js
+++ b/docs/data/material/components/popper/PositionedPopper.js
@@ -6,6 +6,7 @@ import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Fade from '@mui/material/Fade';
 import Paper from '@mui/material/Paper';
+import Stack from '@mui/material/Stack';
 
 export default function PositionedPopper() {
   const [anchorEl, setAnchorEl] = React.useState(null);
@@ -52,15 +53,17 @@ export default function PositionedPopper() {
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
         <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Grid>
-            <Button onClick={handleClick('right-start')}>right-start</Button>
-          </Grid>
-          <Grid>
-            <Button onClick={handleClick('right')}>right</Button>
-          </Grid>
-          <Grid>
-            <Button onClick={handleClick('right-end')}>right-end</Button>
-          </Grid>
+          <Stack>
+            <Grid>
+              <Button onClick={handleClick('right-start')}>right-start</Button>
+            </Grid>
+            <Grid>
+              <Button onClick={handleClick('right')}>right</Button>
+            </Grid>
+            <Grid>
+              <Button onClick={handleClick('right-end')}>right-end</Button>
+            </Grid>
+          </Stack>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.js b/docs/data/material/components/tooltips/PositionedTooltips.js
index f718f7c465fdf5..0bb8120c03b4fe 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.js
+++ b/docs/data/material/components/tooltips/PositionedTooltips.js
@@ -2,6 +2,7 @@ import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Tooltip from '@mui/material/Tooltip';
+import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -34,21 +35,23 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Grid>
-            <Tooltip title="Add" placement="right-start">
-              <Button>right-start</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right">
-              <Button>right</Button>
-            </Tooltip>
-          </Grid>
-          <Grid>
-            <Tooltip title="Add" placement="right-end">
-              <Button>right-end</Button>
-            </Tooltip>
-          </Grid>
+          <Stack>
+            <Grid>
+              <Tooltip title="Add" placement="right-start">
+                <Button>right-start</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right">
+                <Button>right</Button>
+              </Tooltip>
+            </Grid>
+            <Grid>
+              <Tooltip title="Add" placement="right-end">
+                <Button>right-end</Button>
+              </Tooltip>
+            </Grid>
+          </Stack>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/transfer-list/SelectAllTransferList.js b/docs/data/material/components/transfer-list/SelectAllTransferList.js
index 1ec19e5a762cac..a5086f255b8a7d 100644
--- a/docs/data/material/components/transfer-list/SelectAllTransferList.js
+++ b/docs/data/material/components/transfer-list/SelectAllTransferList.js
@@ -9,6 +9,7 @@ import ListItemIcon from '@mui/material/ListItemIcon';
 import Checkbox from '@mui/material/Checkbox';
 import Button from '@mui/material/Button';
 import Divider from '@mui/material/Divider';
+import Stack from '@mui/material/Stack';
 
 function not(a, b) {
   return a.filter((value) => !b.includes(value));
@@ -133,26 +134,28 @@ export default function SelectAllTransferList() {
       <Grid>{customList('Choices', left)}</Grid>
       <Grid>
         <Grid container sx={{ alignItems: 'center' }}>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedRight}
-            disabled={leftChecked.length === 0}
-            aria-label="move selected right"
-          >
-            &gt;
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedLeft}
-            disabled={rightChecked.length === 0}
-            aria-label="move selected left"
-          >
-            &lt;
-          </Button>
+          <Stack>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedRight}
+              disabled={leftChecked.length === 0}
+              aria-label="move selected right"
+            >
+              &gt;
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedLeft}
+              disabled={rightChecked.length === 0}
+              aria-label="move selected left"
+            >
+              &lt;
+            </Button>
+          </Stack>
         </Grid>
       </Grid>
       <Grid>{customList('Chosen', right)}</Grid>
diff --git a/docs/data/material/components/transfer-list/TransferList.js b/docs/data/material/components/transfer-list/TransferList.js
index 92a3d991d5e0bd..5da01a0ccc6c0c 100644
--- a/docs/data/material/components/transfer-list/TransferList.js
+++ b/docs/data/material/components/transfer-list/TransferList.js
@@ -7,6 +7,7 @@ import ListItemText from '@mui/material/ListItemText';
 import Checkbox from '@mui/material/Checkbox';
 import Button from '@mui/material/Button';
 import Paper from '@mui/material/Paper';
+import Stack from '@mui/material/Stack';
 
 function not(a, b) {
   return a.filter((value) => !b.includes(value));
@@ -98,46 +99,48 @@ export default function TransferList() {
       <Grid>{customList(left)}</Grid>
       <Grid>
         <Grid container sx={{ alignItems: 'center' }}>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleAllRight}
-            disabled={left.length === 0}
-            aria-label="move all right"
-          >
-            ≫
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedRight}
-            disabled={leftChecked.length === 0}
-            aria-label="move selected right"
-          >
-            &gt;
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleCheckedLeft}
-            disabled={rightChecked.length === 0}
-            aria-label="move selected left"
-          >
-            &lt;
-          </Button>
-          <Button
-            sx={{ my: 0.5 }}
-            variant="outlined"
-            size="small"
-            onClick={handleAllLeft}
-            disabled={right.length === 0}
-            aria-label="move all left"
-          >
-            ≪
-          </Button>
+          <Stack>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleAllRight}
+              disabled={left.length === 0}
+              aria-label="move all right"
+            >
+              ≫
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedRight}
+              disabled={leftChecked.length === 0}
+              aria-label="move selected right"
+            >
+              &gt;
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleCheckedLeft}
+              disabled={rightChecked.length === 0}
+              aria-label="move selected left"
+            >
+              &lt;
+            </Button>
+            <Button
+              sx={{ my: 0.5 }}
+              variant="outlined"
+              size="small"
+              onClick={handleAllLeft}
+              disabled={right.length === 0}
+              aria-label="move all left"
+            >
+              ≪
+            </Button>
+          </Stack>
         </Grid>
       </Grid>
       <Grid>{customList(right)}</Grid>

From f79817ea10fe72d9fcceab88a6b24841efcf08a7 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 14:47:26 +0530
Subject: [PATCH 07/21] fix

---
 docs/data/joy/components/tooltip/PositionedTooltips.js  | 2 +-
 docs/data/joy/components/tooltip/PositionedTooltips.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.js b/docs/data/joy/components/tooltip/PositionedTooltips.js
index bbd9efe6f40cad..3a208e39449282 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.js
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.js
@@ -34,7 +34,7 @@ export default function PositionedTooltips() {
             <Button variant="plain">left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
           <Stack>
             <Grid>
               <Tooltip title="Add" placement="right-start">
diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.tsx b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
index bbd9efe6f40cad..3a208e39449282 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.tsx
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
@@ -34,7 +34,7 @@ export default function PositionedTooltips() {
             <Button variant="plain">left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
+        <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
           <Stack>
             <Grid>
               <Tooltip title="Add" placement="right-start">

From 62d5051d4afcc7e999a4b521a38e22e5d670f909 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 14:56:15 +0530
Subject: [PATCH 08/21] fix

---
 docs/data/joy/components/tooltip/PositionedTooltips.js  | 2 +-
 docs/data/joy/components/tooltip/PositionedTooltips.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.js b/docs/data/joy/components/tooltip/PositionedTooltips.js
index 3a208e39449282..1a529b71482144 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.js
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.js
@@ -35,7 +35,7 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack>
+          <Stack sx={{ alignItems: 'end' }}>
             <Grid>
               <Tooltip title="Add" placement="right-start">
                 <Button variant="plain">right-start</Button>
diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.tsx b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
index 3a208e39449282..1a529b71482144 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.tsx
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
@@ -35,7 +35,7 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack>
+          <Stack sx={{ alignItems: 'end' }}>
             <Grid>
               <Tooltip title="Add" placement="right-start">
                 <Button variant="plain">right-start</Button>

From 44f67c81c6645b585794123c82d12524a99950b3 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 15:21:14 +0530
Subject: [PATCH 09/21] fix docs:api

---
 docs/pages/material-ui/api/grid.json    | 2 +-
 packages/mui-material/src/Grid/Grid.tsx | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/docs/pages/material-ui/api/grid.json b/docs/pages/material-ui/api/grid.json
index 9459b0453fa54e..c234dd670673e3 100644
--- a/docs/pages/material-ui/api/grid.json
+++ b/docs/pages/material-ui/api/grid.json
@@ -18,7 +18,7 @@
     "direction": {
       "type": {
         "name": "union",
-        "description": "'column-reverse'<br>&#124;&nbsp;'column'<br>&#124;&nbsp;'row-reverse'<br>&#124;&nbsp;'row'<br>&#124;&nbsp;Array&lt;'column-reverse'<br>&#124;&nbsp;'column'<br>&#124;&nbsp;'row-reverse'<br>&#124;&nbsp;'row'&gt;<br>&#124;&nbsp;object"
+        "description": "'row-reverse'<br>&#124;&nbsp;'row'<br>&#124;&nbsp;Array&lt;'row-reverse'<br>&#124;&nbsp;'row'&gt;<br>&#124;&nbsp;object"
       },
       "default": "'row'"
     },
diff --git a/packages/mui-material/src/Grid/Grid.tsx b/packages/mui-material/src/Grid/Grid.tsx
index 908a38227bf4c6..6cab8c538c1377 100644
--- a/packages/mui-material/src/Grid/Grid.tsx
+++ b/packages/mui-material/src/Grid/Grid.tsx
@@ -178,8 +178,8 @@ Grid.propTypes /* remove-proptypes */ = {
    * @default 'row'
    */
   direction: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
-    PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']),
-    PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])),
+    PropTypes.oneOf(['row-reverse', 'row']),
+    PropTypes.arrayOf(PropTypes.oneOf(['row-reverse', 'row'])),
     PropTypes.object,
   ]),
   /**

From 54d915655183707fdd9f7711b0c37c7ce31d1b9f Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 15:57:51 +0530
Subject: [PATCH 10/21] trigger


From 16460d9af4c56650e5a97f7002346cdf48a5ccb1 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 16:14:08 +0530
Subject: [PATCH 11/21] trigger-ci


From f7c8123ee200cf1dfb5c0ec0a32ec4886197d930 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 6 Jan 2026 16:33:14 +0530
Subject: [PATCH 12/21]  [docs] Fix incorrect indentation in migration guide

---
 .../migrating-from-deprecated-apis.md         | 36 +++++++++----------
 1 file changed, 18 insertions(+), 18 deletions(-)

diff --git a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md
index a2546888769599..b67251760d2616 100644
--- a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md
+++ b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md
@@ -287,18 +287,18 @@ All of the Autocomplete's slot (`*Component`) props were deprecated in favor of
 
 ```diff
  <Autocomplete
--    PaperComponent={CustomPaperComponent}
--    PopperComponent={CustomPopperComponent}
--    ListboxComponent={CustomListboxComponent}
-+    slots={{
-+        paper: CustomPaperComponent,
-+        popper: CustomPopperComponent,
-+    }}
-+    slotProps={{
-+        listbox: {
-+            component: CustomListboxComponent,
-+        },
-+    }}
+-  PaperComponent={CustomPaperComponent}
+-  PopperComponent={CustomPopperComponent}
+-  ListboxComponent={CustomListboxComponent}
++  slots={{
++    paper: CustomPaperComponent,
++    popper: CustomPopperComponent,
++  }}
++  slotProps={{
++    listbox: {
++      component: CustomListboxComponent,
++    },
++  }}
  />
 ```
 
@@ -313,12 +313,12 @@ All of the Autocomplete's slot props (`*Props`) props were deprecated in favor o
 
 ```diff
  <Autocomplete
--    ChipProps={CustomChipProps}
--    ListboxProps={CustomListboxProps}
-+    slotProps={{
-+        chip: CustomChipProps,
-+        listbox: CustomListboxProps,
-+    }}
+-  ChipProps={CustomChipProps}
+-  ListboxProps={CustomListboxProps}
++  slotProps={{
++    chip: CustomChipProps,
++    listbox: CustomListboxProps,
++  }}
  />
 ```
 

From c03dd6d7111e4346b6c62f21c0d8fcb1f947c756 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Mon, 12 Jan 2026 11:44:51 +0530
Subject: [PATCH 13/21] remove direction from grid classes and gridprops

---
 docs/pages/system/api/grid.json               | 2 +-
 packages/mui-material/src/Grid/gridClasses.ts | 2 +-
 packages/mui-system/src/Grid/Grid.tsx         | 4 ++--
 packages/mui-system/src/Grid/GridProps.ts     | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/pages/system/api/grid.json b/docs/pages/system/api/grid.json
index 4cd038309b7d7b..16e24a7434c3da 100644
--- a/docs/pages/system/api/grid.json
+++ b/docs/pages/system/api/grid.json
@@ -18,7 +18,7 @@
     "direction": {
       "type": {
         "name": "union",
-        "description": "'column-reverse'<br>&#124;&nbsp;'column'<br>&#124;&nbsp;'row-reverse'<br>&#124;&nbsp;'row'<br>&#124;&nbsp;Array&lt;'column-reverse'<br>&#124;&nbsp;'column'<br>&#124;&nbsp;'row-reverse'<br>&#124;&nbsp;'row'&gt;<br>&#124;&nbsp;object"
+        "description": "'row-reverse'<br>&#124;&nbsp;'row'<br>&#124;&nbsp;Array&lt;'row-reverse'<br>&#124;&nbsp;'row'&gt;<br>&#124;&nbsp;object"
       },
       "default": "'row'"
     },
diff --git a/packages/mui-material/src/Grid/gridClasses.ts b/packages/mui-material/src/Grid/gridClasses.ts
index d6e72ce39544c7..6d4ec112325cf9 100644
--- a/packages/mui-material/src/Grid/gridClasses.ts
+++ b/packages/mui-material/src/Grid/gridClasses.ts
@@ -15,7 +15,7 @@ export function getGridUtilityClass(slot: string): string {
 }
 
 const SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10] as const;
-const DIRECTIONS = ['column-reverse', 'column', 'row-reverse', 'row'] as const;
+const DIRECTIONS = ['row-reverse', 'row'] as const;
 const WRAPS = ['nowrap', 'wrap-reverse', 'wrap'] as const;
 const GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] as const;
 
diff --git a/packages/mui-system/src/Grid/Grid.tsx b/packages/mui-system/src/Grid/Grid.tsx
index 4e708392ba88df..c4e413bd536d46 100644
--- a/packages/mui-system/src/Grid/Grid.tsx
+++ b/packages/mui-system/src/Grid/Grid.tsx
@@ -54,8 +54,8 @@ Grid.propTypes /* remove-proptypes */ = {
    * @default 'row'
    */
   direction: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
-    PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']),
-    PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])),
+    PropTypes.oneOf(['row-reverse', 'row']),
+    PropTypes.arrayOf(PropTypes.oneOf(['row-reverse', 'row'])),
     PropTypes.object,
   ]),
   /**
diff --git a/packages/mui-system/src/Grid/GridProps.ts b/packages/mui-system/src/Grid/GridProps.ts
index 3886e6b39db2ec..928ae757517dda 100644
--- a/packages/mui-system/src/Grid/GridProps.ts
+++ b/packages/mui-system/src/Grid/GridProps.ts
@@ -6,7 +6,7 @@ import { SystemProps } from '../Box';
 
 type ResponsiveStyleValue<T> = T | Array<T | null> | { [key in Breakpoint]?: T | null };
 
-export type GridDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
+export type GridDirection = 'row' | 'row-reverse';
 
 export type GridSpacing = number | string;
 

From 873d8537a75bbf03ef55c7d86817f48ab1753977 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Mon, 12 Jan 2026 11:59:47 +0530
Subject: [PATCH 14/21] fix ogment

---
 docs/pages/material-ui/api/pigment-grid.json          | 2 +-
 packages/mui-material/src/PigmentGrid/PigmentGrid.tsx | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/docs/pages/material-ui/api/pigment-grid.json b/docs/pages/material-ui/api/pigment-grid.json
index 381d98a646c4a4..5e52d8e655139c 100644
--- a/docs/pages/material-ui/api/pigment-grid.json
+++ b/docs/pages/material-ui/api/pigment-grid.json
@@ -18,7 +18,7 @@
     "direction": {
       "type": {
         "name": "union",
-        "description": "'column'<br>&#124;&nbsp;'column-reverse'<br>&#124;&nbsp;'row'<br>&#124;&nbsp;'row-reverse'<br>&#124;&nbsp;Array&lt;'column'<br>&#124;&nbsp;'column-reverse'<br>&#124;&nbsp;'row'<br>&#124;&nbsp;'row-reverse'&gt;<br>&#124;&nbsp;object"
+        "description": "'row'<br>&#124;&nbsp;'row-reverse'<br>&#124;&nbsp;Array&lt;'row'<br>&#124;&nbsp;'row-reverse'&gt;<br>&#124;&nbsp;object"
       },
       "default": "'row'"
     },
diff --git a/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx b/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx
index 8d1cde0e06e8fe..a53e8c5afe3c3a 100644
--- a/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx
+++ b/packages/mui-material/src/PigmentGrid/PigmentGrid.tsx
@@ -16,7 +16,7 @@ import { Breakpoint, Theme } from '../styles';
 
 type ResponsiveStyleValue<T> = T | Array<T | null> | { [key in Breakpoint]?: T | null };
 
-export type GridDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
+export type GridDirection = 'row' | 'row-reverse';
 
 export type GridSpacing = number | string;
 
@@ -180,8 +180,8 @@ PigmentGrid.propTypes /* remove-proptypes */ = {
    * @default 'row'
    */
   direction: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
-    PropTypes.oneOf(['column', 'column-reverse', 'row', 'row-reverse']),
-    PropTypes.arrayOf(PropTypes.oneOf(['column', 'column-reverse', 'row', 'row-reverse'])),
+    PropTypes.oneOf(['row', 'row-reverse']),
+    PropTypes.arrayOf(PropTypes.oneOf(['row', 'row-reverse'])),
     PropTypes.object,
   ]),
   /**

From 56259a72eb5ba638c1e4b0a0ef3bb938ac92d313 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Mon, 12 Jan 2026 16:12:49 +0530
Subject: [PATCH 15/21] fix demos

---
 docs/data/material/components/popper/PositionedPopper.js      | 4 ++--
 docs/data/material/components/popper/PositionedPopper.tsx     | 4 ++--
 docs/data/material/components/tooltips/PositionedTooltips.js  | 4 ++--
 docs/data/material/components/tooltips/PositionedTooltips.tsx | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/docs/data/material/components/popper/PositionedPopper.js b/docs/data/material/components/popper/PositionedPopper.js
index 259b660b96b9fb..906d5d34e141ee 100644
--- a/docs/data/material/components/popper/PositionedPopper.js
+++ b/docs/data/material/components/popper/PositionedPopper.js
@@ -52,8 +52,8 @@ export default function PositionedPopper() {
           <br />
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
-        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Stack>
+        <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
+          <Stack sx={{ alignItems: 'end' }}>
             <Grid>
               <Button onClick={handleClick('right-start')}>right-start</Button>
             </Grid>
diff --git a/docs/data/material/components/popper/PositionedPopper.tsx b/docs/data/material/components/popper/PositionedPopper.tsx
index 633ecdf44e7d13..f1453b60b28be4 100644
--- a/docs/data/material/components/popper/PositionedPopper.tsx
+++ b/docs/data/material/components/popper/PositionedPopper.tsx
@@ -54,8 +54,8 @@ export default function PositionedPopper() {
           <br />
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
-        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Stack>
+        <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
+          <Stack sx={{ alignItems: 'end' }}>
             <Grid>
               <Button onClick={handleClick('right-start')}>right-start</Button>
             </Grid>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.js b/docs/data/material/components/tooltips/PositionedTooltips.js
index 0bb8120c03b4fe..ac26005702f3ef 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.js
+++ b/docs/data/material/components/tooltips/PositionedTooltips.js
@@ -34,8 +34,8 @@ export default function PositionedTooltips() {
             <Button>left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Stack>
+        <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
+          <Stack sx={{ alignItems: 'end' }}>
             <Grid>
               <Tooltip title="Add" placement="right-start">
                 <Button>right-start</Button>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.tsx b/docs/data/material/components/tooltips/PositionedTooltips.tsx
index 0bb8120c03b4fe..ac26005702f3ef 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.tsx
+++ b/docs/data/material/components/tooltips/PositionedTooltips.tsx
@@ -34,8 +34,8 @@ export default function PositionedTooltips() {
             <Button>left-end</Button>
           </Tooltip>
         </Grid>
-        <Grid container sx={{ alignItems: 'flex-end' }} size={6}>
-          <Stack>
+        <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
+          <Stack sx={{ alignItems: 'end' }}>
             <Grid>
               <Tooltip title="Add" placement="right-start">
                 <Button>right-start</Button>

From c3e56f2875c02d7f3deba1e4b4a83d8831bc4de6 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Mon, 12 Jan 2026 18:42:35 +0530
Subject: [PATCH 16/21] update descriptions

---
 docs/translations/api-docs/grid/grid.json |  2 +-
 packages/mui-material/src/Grid/Grid.tsx   | 18 ++++++++++++++----
 packages/mui-system/src/Grid/Grid.tsx     |  9 +++++++--
 packages/mui-system/src/Grid/GridProps.ts |  9 +++++++--
 4 files changed, 29 insertions(+), 9 deletions(-)

diff --git a/docs/translations/api-docs/grid/grid.json b/docs/translations/api-docs/grid/grid.json
index 284d73c71a45f1..d51ee8557d401b 100644
--- a/docs/translations/api-docs/grid/grid.json
+++ b/docs/translations/api-docs/grid/grid.json
@@ -10,7 +10,7 @@
       "description": "If <code>true</code>, the component will have the flex <em>container</em> behavior. You should be wrapping <em>items</em> with a <em>container</em>."
     },
     "direction": {
-      "description": "Defines the <code>flex-direction</code> style property. It is applied for all screen sizes."
+      "description": "Defines the <code>flex-direction</code> style property for the container.<br>⚠️ Only <code>row</code> and <code>row-reverse</code> are supported. <code>column</code> and <code>column-reverse</code> are not supported, because the Grid component is designed to subdivide layouts into <strong>columns</strong>, not rows.<br>For vertical layouts, use <code>Stack</code> (optionally inside a Grid item)."
     },
     "offset": {
       "description": "Defines the offset value for the type <code>item</code> components."
diff --git a/packages/mui-material/src/Grid/Grid.tsx b/packages/mui-material/src/Grid/Grid.tsx
index 6cab8c538c1377..6ede95ac1054d9 100644
--- a/packages/mui-material/src/Grid/Grid.tsx
+++ b/packages/mui-material/src/Grid/Grid.tsx
@@ -42,8 +42,13 @@ export interface GridBaseProps {
    */
   container?: boolean;
   /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
+   * Defines the `flex-direction` style property for the container.
+   *
+   * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
+   * because the Grid component is designed to subdivide layouts into **columns**, not rows.
+   *
+   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   *
    * @default 'row'
    */
   direction?: ResponsiveStyleValue<GridDirection>;
@@ -173,8 +178,13 @@ Grid.propTypes /* remove-proptypes */ = {
    */
   container: PropTypes.bool,
   /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
+   * Defines the `flex-direction` style property for the container.
+   *
+   * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
+   * because the Grid component is designed to subdivide layouts into **columns**, not rows.
+   *
+   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   *
    * @default 'row'
    */
   direction: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
diff --git a/packages/mui-system/src/Grid/Grid.tsx b/packages/mui-system/src/Grid/Grid.tsx
index c4e413bd536d46..b8f1edb3b9d688 100644
--- a/packages/mui-system/src/Grid/Grid.tsx
+++ b/packages/mui-system/src/Grid/Grid.tsx
@@ -49,8 +49,13 @@ Grid.propTypes /* remove-proptypes */ = {
    */
   container: PropTypes.bool,
   /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
+   * Defines the `flex-direction` style property for the container.
+   *
+   * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
+   * because the Grid component is designed to subdivide layouts into **columns**, not rows.
+   *
+   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   *
    * @default 'row'
    */
   direction: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([
diff --git a/packages/mui-system/src/Grid/GridProps.ts b/packages/mui-system/src/Grid/GridProps.ts
index 928ae757517dda..a79fd82d56a6a8 100644
--- a/packages/mui-system/src/Grid/GridProps.ts
+++ b/packages/mui-system/src/Grid/GridProps.ts
@@ -38,8 +38,13 @@ export interface GridBaseProps {
    */
   container?: boolean;
   /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
+   * Defines the `flex-direction` style property for the container.
+   *
+   * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
+   * because the Grid component is designed to subdivide layouts into **columns**, not rows.
+   *
+   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   *
    * @default 'row'
    */
   direction?: ResponsiveStyleValue<GridDirection>;

From 507f38236472ca326cda914af8565d79d41072e6 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 20 Jan 2026 11:43:43 +0530
Subject: [PATCH 17/21] jun review

---
 .../components/tooltip/PositionedTooltips.js  | 31 +++++++---------
 .../components/tooltip/PositionedTooltips.tsx | 31 +++++++---------
 .../components/popper/PositionedPopper.js     | 36 +++++++++----------
 .../components/popper/PositionedPopper.tsx    | 18 ++++------
 .../components/tooltips/PositionedTooltips.js | 31 +++++++---------
 .../tooltips/PositionedTooltips.tsx           | 31 +++++++---------
 6 files changed, 76 insertions(+), 102 deletions(-)

diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.js b/docs/data/joy/components/tooltip/PositionedTooltips.js
index 1a529b71482144..d171e1372d02ed 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.js
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.js
@@ -2,7 +2,6 @@ import Box from '@mui/joy/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/joy/Button';
 import Tooltip from '@mui/joy/Tooltip';
-import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -35,23 +34,19 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack sx={{ alignItems: 'end' }}>
-            <Grid>
-              <Tooltip title="Add" placement="right-start">
-                <Button variant="plain">right-start</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right">
-                <Button variant="plain">right</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right-end">
-                <Button variant="plain">right-end</Button>
-              </Tooltip>
-            </Grid>
-          </Stack>
+          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'end' }}>
+            <Tooltip title="Add" placement="right-start">
+              <Button variant="plain">right-start</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right">
+              <Button variant="plain">right</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right-end">
+              <Button variant="plain">right-end</Button>
+            </Tooltip>
+          </Box>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/joy/components/tooltip/PositionedTooltips.tsx b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
index 1a529b71482144..d171e1372d02ed 100644
--- a/docs/data/joy/components/tooltip/PositionedTooltips.tsx
+++ b/docs/data/joy/components/tooltip/PositionedTooltips.tsx
@@ -2,7 +2,6 @@ import Box from '@mui/joy/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/joy/Button';
 import Tooltip from '@mui/joy/Tooltip';
-import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -35,23 +34,19 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack sx={{ alignItems: 'end' }}>
-            <Grid>
-              <Tooltip title="Add" placement="right-start">
-                <Button variant="plain">right-start</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right">
-                <Button variant="plain">right</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right-end">
-                <Button variant="plain">right-end</Button>
-              </Tooltip>
-            </Grid>
-          </Stack>
+          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'end' }}>
+            <Tooltip title="Add" placement="right-start">
+              <Button variant="plain">right-start</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right">
+              <Button variant="plain">right</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right-end">
+              <Button variant="plain">right-end</Button>
+            </Tooltip>
+          </Box>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/popper/PositionedPopper.js b/docs/data/material/components/popper/PositionedPopper.js
index 906d5d34e141ee..7f9feacd5f6114 100644
--- a/docs/data/material/components/popper/PositionedPopper.js
+++ b/docs/data/material/components/popper/PositionedPopper.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import Box from '@mui/material/Box';
-import Popper from '@mui/material/Popper';
+import Popper, { PopperPlacementType } from '@mui/material/Popper';
 import Typography from '@mui/material/Typography';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
@@ -9,15 +9,17 @@ import Paper from '@mui/material/Paper';
 import Stack from '@mui/material/Stack';
 
 export default function PositionedPopper() {
-  const [anchorEl, setAnchorEl] = React.useState(null);
+  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);
   const [open, setOpen] = React.useState(false);
-  const [placement, setPlacement] = React.useState();
+  const [placement, setPlacement] = React.useState<PopperPlacementType>();
 
-  const handleClick = (newPlacement) => (event) => {
-    setAnchorEl(event.currentTarget);
-    setOpen((prev) => placement !== newPlacement || !prev);
-    setPlacement(newPlacement);
-  };
+  const handleClick =
+    (newPlacement: PopperPlacementType) =>
+    (event: React.MouseEvent<HTMLButtonElement>) => {
+      setAnchorEl(event.currentTarget);
+      setOpen((prev) => placement !== newPlacement || !prev);
+      setPlacement(newPlacement);
+    };
 
   return (
     <Box sx={{ width: 500 }}>
@@ -53,17 +55,13 @@ export default function PositionedPopper() {
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack sx={{ alignItems: 'end' }}>
-            <Grid>
-              <Button onClick={handleClick('right-start')}>right-start</Button>
-            </Grid>
-            <Grid>
-              <Button onClick={handleClick('right')}>right</Button>
-            </Grid>
-            <Grid>
-              <Button onClick={handleClick('right-end')}>right-end</Button>
-            </Grid>
-          </Stack>
+          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'end' }}>
+            <Button onClick={handleClick('right-start')}>right-start</Button>
+
+            <Button onClick={handleClick('right')}>right</Button>
+
+            <Button onClick={handleClick('right-end')}>right-end</Button>
+          </Box>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/popper/PositionedPopper.tsx b/docs/data/material/components/popper/PositionedPopper.tsx
index f1453b60b28be4..7f9feacd5f6114 100644
--- a/docs/data/material/components/popper/PositionedPopper.tsx
+++ b/docs/data/material/components/popper/PositionedPopper.tsx
@@ -55,17 +55,13 @@ export default function PositionedPopper() {
           <Button onClick={handleClick('left-end')}>left-end</Button>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack sx={{ alignItems: 'end' }}>
-            <Grid>
-              <Button onClick={handleClick('right-start')}>right-start</Button>
-            </Grid>
-            <Grid>
-              <Button onClick={handleClick('right')}>right</Button>
-            </Grid>
-            <Grid>
-              <Button onClick={handleClick('right-end')}>right-end</Button>
-            </Grid>
-          </Stack>
+          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'end' }}>
+            <Button onClick={handleClick('right-start')}>right-start</Button>
+
+            <Button onClick={handleClick('right')}>right</Button>
+
+            <Button onClick={handleClick('right-end')}>right-end</Button>
+          </Box>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.js b/docs/data/material/components/tooltips/PositionedTooltips.js
index ac26005702f3ef..a06f347139670d 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.js
+++ b/docs/data/material/components/tooltips/PositionedTooltips.js
@@ -2,7 +2,6 @@ import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Tooltip from '@mui/material/Tooltip';
-import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -35,23 +34,19 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack sx={{ alignItems: 'end' }}>
-            <Grid>
-              <Tooltip title="Add" placement="right-start">
-                <Button>right-start</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right">
-                <Button>right</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right-end">
-                <Button>right-end</Button>
-              </Tooltip>
-            </Grid>
-          </Stack>
+          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'end' }}>
+            <Tooltip title="Add" placement="right-start">
+              <Button>right-start</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right">
+              <Button>right</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right-end">
+              <Button>right-end</Button>
+            </Tooltip>
+          </Box>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>
diff --git a/docs/data/material/components/tooltips/PositionedTooltips.tsx b/docs/data/material/components/tooltips/PositionedTooltips.tsx
index ac26005702f3ef..a06f347139670d 100644
--- a/docs/data/material/components/tooltips/PositionedTooltips.tsx
+++ b/docs/data/material/components/tooltips/PositionedTooltips.tsx
@@ -2,7 +2,6 @@ import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Tooltip from '@mui/material/Tooltip';
-import Stack from '@mui/material/Stack';
 
 export default function PositionedTooltips() {
   return (
@@ -35,23 +34,19 @@ export default function PositionedTooltips() {
           </Tooltip>
         </Grid>
         <Grid container sx={{ justifyContent: 'flex-end' }} size={6}>
-          <Stack sx={{ alignItems: 'end' }}>
-            <Grid>
-              <Tooltip title="Add" placement="right-start">
-                <Button>right-start</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right">
-                <Button>right</Button>
-              </Tooltip>
-            </Grid>
-            <Grid>
-              <Tooltip title="Add" placement="right-end">
-                <Button>right-end</Button>
-              </Tooltip>
-            </Grid>
-          </Stack>
+          <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'end' }}>
+            <Tooltip title="Add" placement="right-start">
+              <Button>right-start</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right">
+              <Button>right</Button>
+            </Tooltip>
+
+            <Tooltip title="Add" placement="right-end">
+              <Button>right-end</Button>
+            </Tooltip>
+          </Box>
         </Grid>
       </Grid>
       <Grid container sx={{ justifyContent: 'center' }}>

From 094b865c06e3df03b9de04f3e8085670754953cb Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 20 Jan 2026 11:53:27 +0530
Subject: [PATCH 18/21] update docs

---
 docs/translations/api-docs/grid/grid.json | 2 +-
 packages/mui-material/src/Grid/Grid.tsx   | 4 ++--
 packages/mui-system/src/Grid/Grid.tsx     | 2 +-
 packages/mui-system/src/Grid/GridProps.ts | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/translations/api-docs/grid/grid.json b/docs/translations/api-docs/grid/grid.json
index d51ee8557d401b..e48e42a341d106 100644
--- a/docs/translations/api-docs/grid/grid.json
+++ b/docs/translations/api-docs/grid/grid.json
@@ -10,7 +10,7 @@
       "description": "If <code>true</code>, the component will have the flex <em>container</em> behavior. You should be wrapping <em>items</em> with a <em>container</em>."
     },
     "direction": {
-      "description": "Defines the <code>flex-direction</code> style property for the container.<br>⚠️ Only <code>row</code> and <code>row-reverse</code> are supported. <code>column</code> and <code>column-reverse</code> are not supported, because the Grid component is designed to subdivide layouts into <strong>columns</strong>, not rows.<br>For vertical layouts, use <code>Stack</code> (optionally inside a Grid item)."
+      "description": "Defines the <code>flex-direction</code> style property for the container.<br>⚠️ Only <code>row</code> and <code>row-reverse</code> are supported. <code>column</code> and <code>column-reverse</code> are not supported, because the Grid component is designed to subdivide layouts into <strong>columns</strong>, not rows.<br>For vertical layouts, use <code>Stack</code> instead."
     },
     "offset": {
       "description": "Defines the offset value for the type <code>item</code> components."
diff --git a/packages/mui-material/src/Grid/Grid.tsx b/packages/mui-material/src/Grid/Grid.tsx
index 6ede95ac1054d9..4a960c5454d53d 100644
--- a/packages/mui-material/src/Grid/Grid.tsx
+++ b/packages/mui-material/src/Grid/Grid.tsx
@@ -47,7 +47,7 @@ export interface GridBaseProps {
    * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
    * because the Grid component is designed to subdivide layouts into **columns**, not rows.
    *
-   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   * For vertical layouts, use `Stack` instead.
    *
    * @default 'row'
    */
@@ -183,7 +183,7 @@ Grid.propTypes /* remove-proptypes */ = {
    * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
    * because the Grid component is designed to subdivide layouts into **columns**, not rows.
    *
-   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   * For vertical layouts, use `Stack` instead.
    *
    * @default 'row'
    */
diff --git a/packages/mui-system/src/Grid/Grid.tsx b/packages/mui-system/src/Grid/Grid.tsx
index b8f1edb3b9d688..9aa41b2611097e 100644
--- a/packages/mui-system/src/Grid/Grid.tsx
+++ b/packages/mui-system/src/Grid/Grid.tsx
@@ -54,7 +54,7 @@ Grid.propTypes /* remove-proptypes */ = {
    * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
    * because the Grid component is designed to subdivide layouts into **columns**, not rows.
    *
-   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   * For vertical layouts, use `Stack` instead.
    *
    * @default 'row'
    */
diff --git a/packages/mui-system/src/Grid/GridProps.ts b/packages/mui-system/src/Grid/GridProps.ts
index a79fd82d56a6a8..6dff68d3423a88 100644
--- a/packages/mui-system/src/Grid/GridProps.ts
+++ b/packages/mui-system/src/Grid/GridProps.ts
@@ -43,7 +43,7 @@ export interface GridBaseProps {
    * ⚠️ Only `row` and `row-reverse` are supported. `column` and `column-reverse` are not supported,
    * because the Grid component is designed to subdivide layouts into **columns**, not rows.
    *
-   * For vertical layouts, use `Stack` (optionally inside a Grid item).
+   * For vertical layouts, use `Stack` instead.
    *
    * @default 'row'
    */

From 91b76d25953ad7855af8b7e67a8b0bd1d2d60ed2 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 20 Jan 2026 11:59:52 +0530
Subject: [PATCH 19/21] FIX

---
 .../components/popper/PositionedPopper.js        | 16 +++++++---------
 1 file changed, 7 insertions(+), 9 deletions(-)

diff --git a/docs/data/material/components/popper/PositionedPopper.js b/docs/data/material/components/popper/PositionedPopper.js
index 7f9feacd5f6114..a9ff230ca5a518 100644
--- a/docs/data/material/components/popper/PositionedPopper.js
+++ b/docs/data/material/components/popper/PositionedPopper.js
@@ -9,17 +9,15 @@ import Paper from '@mui/material/Paper';
 import Stack from '@mui/material/Stack';
 
 export default function PositionedPopper() {
-  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);
+  const [anchorEl, setAnchorEl] = React.useState(null);
   const [open, setOpen] = React.useState(false);
-  const [placement, setPlacement] = React.useState<PopperPlacementType>();
+  const [placement, setPlacement] = React.useState();
 
-  const handleClick =
-    (newPlacement: PopperPlacementType) =>
-    (event: React.MouseEvent<HTMLButtonElement>) => {
-      setAnchorEl(event.currentTarget);
-      setOpen((prev) => placement !== newPlacement || !prev);
-      setPlacement(newPlacement);
-    };
+  const handleClick = (newPlacement) => (event) => {
+    setAnchorEl(event.currentTarget);
+    setOpen((prev) => placement !== newPlacement || !prev);
+    setPlacement(newPlacement);
+  };
 
   return (
     <Box sx={{ width: 500 }}>

From e32eb2603e4f65382b4d2574512c93f5f74d1622 Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 20 Jan 2026 12:00:17 +0530
Subject: [PATCH 20/21] fix

---
 docs/data/material/components/popper/PositionedPopper.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/docs/data/material/components/popper/PositionedPopper.js b/docs/data/material/components/popper/PositionedPopper.js
index a9ff230ca5a518..73231d43df30dd 100644
--- a/docs/data/material/components/popper/PositionedPopper.js
+++ b/docs/data/material/components/popper/PositionedPopper.js
@@ -1,12 +1,11 @@
 import * as React from 'react';
 import Box from '@mui/material/Box';
-import Popper, { PopperPlacementType } from '@mui/material/Popper';
+import Popper from '@mui/material/Popper';
 import Typography from '@mui/material/Typography';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Fade from '@mui/material/Fade';
 import Paper from '@mui/material/Paper';
-import Stack from '@mui/material/Stack';
 
 export default function PositionedPopper() {
   const [anchorEl, setAnchorEl] = React.useState(null);

From 57cc3be315e4b57a1558ffd5201c03cb945e4c0a Mon Sep 17 00:00:00 2001
From: sai6855 <fayazceg@gmail.com>
Date: Tue, 20 Jan 2026 12:14:43 +0530
Subject: [PATCH 21/21] fix

---
 docs/data/material/components/popper/PositionedPopper.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/docs/data/material/components/popper/PositionedPopper.tsx b/docs/data/material/components/popper/PositionedPopper.tsx
index 7f9feacd5f6114..a5823bfa325da1 100644
--- a/docs/data/material/components/popper/PositionedPopper.tsx
+++ b/docs/data/material/components/popper/PositionedPopper.tsx
@@ -6,7 +6,6 @@ import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Fade from '@mui/material/Fade';
 import Paper from '@mui/material/Paper';
-import Stack from '@mui/material/Stack';
 
 export default function PositionedPopper() {
   const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);