check container first

mui · Sep 12, 2024 · 961fa8b · 961fa8b
1 parent 2a45a3a
commit 961fa8b
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -120,9 +120,9 @@
     "unist-util-visit": "^2.0.3",
     "yargs": "^17.7.2"
   },
-  "packageManager": "pnpm@9.7.1",
+  "packageManager": "pnpm@9.10.0",
   "engines": {
-    "pnpm": "9.7.1"
+    "pnpm": "9.10.0"
   },
   "resolutions": {
     "@babel/core": "^7.24.4",

diff --git a/packages/pigment-css-react/src/Grid.jsx b/packages/pigment-css-react/src/Grid.jsx
@@ -209,7 +209,7 @@ const Grid = React.forwardRef(function Grid(
       ownerState={ownerState}
     >
       {React.Children.map(children, (child) => {
-        if (React.isValidElement(child) && isGridComponent(child)) {
+        if (container && React.isValidElement(child) && isGridComponent(child)) {
           return React.cloneElement(child, {
             unstable_parent_columns: selfColumns,
             unstable_parent_column_spacing: selfColumnSpacing,

diff --git a/packages/pigment-css-react/tests/Grid/Grid.test.js b/packages/pigment-css-react/tests/Grid/Grid.test.js
@@ -36,4 +36,17 @@ describe('Pigment CSS - Grid', () => {
     expect(getByTestId('grid-container')).not.to.equal(null);
     expect(getByTestId('grid-item')).not.to.equal(null);
   });
+
+  it('should not pass down unstable props for non container Grid', () => {
+    function Child({ unstable_parent_columns }) {
+      return <div>{unstable_parent_columns}</div>;
+    }
+    Child.muiName = 'Grid';
+    const { queryByText } = render(
+      <GridOutput>
+        <Child />
+      </GridOutput>,
+    );
+    expect(queryByText('12')).to.equal(null);
+  });
 });
diff --git a/packages/pigment-css-react/tests/Grid/fixtures/Grid.output.js b/packages/pigment-css-react/tests/Grid/fixtures/Grid.output.js
@@ -305,7 +305,7 @@ const Grid = React.forwardRef(function Grid(
       ownerState={ownerState}
     >
       {React.Children.map(children, (child) => {
-        if (React.isValidElement(child) && isGridComponent(child)) {
+        if (container && React.isValidElement(child) && isGridComponent(child)) {
           return React.cloneElement(child, {
             unstable_parent_columns: selfColumns,
             unstable_parent_column_spacing: selfColumnSpacing,