@porsche-design-system/components-react 3.6.0-rc.2 → 3.6.1-rc.0

package/CHANGELOG.md

@@ -14,6 +14,17 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### [Unreleased]
 
+### [3.6.1-rc.0] - 2023-08-29
+
+#### Fixed
+
+- Overlapping issues of `Accordion` contents when positioned outside of content area
+  ([#2746](https://github.com/porsche-design-system/porsche-design-system/pull/2746))
+- Backwards compatibility with previous versions of Porsche Design System
+  ([#2752](https://github.com/porsche-design-system/porsche-design-system/pull/2752))
+
+### [3.6.0] - 2023-08-28
+
 ### [3.6.0-rc.2] - 2023-08-28
 
 #### Fixed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@porsche-design-system/components-react",
-  "version": "3.6.0-rc.2",
+  "version": "3.6.1-rc.0",
   "description": "Porsche Design System is a component library designed to help developers create the best experience for software or services distributed by Dr. Ing. h.c. F. Porsche AG.",
   "keywords": [
     "porsche",
@@ -17,7 +17,7 @@
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://designsystem.porsche.com",
   "dependencies": {
-    "@porsche-design-system/components-js": "3.6.0-rc.2"
+    "@porsche-design-system/components-js": "3.6.1-rc.0"
   },
   "peerDependencies": {
     "react": ">=17.0.0 <19.0.0",

package/ssr/cjs/components/dist/styles/esm/styles-entry.cjs

@@ -4068,12 +4068,18 @@ const getComponentCss$Z = (size, compact, open, theme) => {
                     transition: `grid-template-rows ${transitionDuration} ease-out, visibility 0s linear ${transitionDuration}`,
                 }),
             '& div': {
-                overflow: 'hidden',
+                overflow: open ? 'visible' : 'hidden',
+                // Fix overflow issues for overlapping content (e.g. select dropdown)
+                animation: open ? `$overflow ${transitionDuration}` : 'none',
                 // Necessary to make focus outlines fully visible
                 padding: '4px',
                 margin: '-4px',
             },
         },
+        '@keyframes overflow': {
+            from: { overflow: 'hidden' },
+            to: { overflow: 'hidden' },
+        },
     });
 };
 

package/ssr/esm/components/dist/styles/esm/styles-entry.mjs

@@ -4066,12 +4066,18 @@ const getComponentCss$Z = (size, compact, open, theme) => {
                     transition: `grid-template-rows ${transitionDuration} ease-out, visibility 0s linear ${transitionDuration}`,
                 }),
             '& div': {
-                overflow: 'hidden',
+                overflow: open ? 'visible' : 'hidden',
+                // Fix overflow issues for overlapping content (e.g. select dropdown)
+                animation: open ? `$overflow ${transitionDuration}` : 'none',
                 // Necessary to make focus outlines fully visible
                 padding: '4px',
                 margin: '-4px',
             },
         },
+        '@keyframes overflow': {
+            from: { overflow: 'hidden' },
+            to: { overflow: 'hidden' },
+        },
     });
 };