@porsche-design-system/components-react 3.3.0 → 3.4.0

package/lib/components/popover.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/radio-button-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/scroller.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/segmented-control-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/segmented-control.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/select-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/spinner.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/stepper-horizontal-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/stepper-horizontal.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/switch.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table-body.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table-cell.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table-head-cell.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table-head-row.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table-head.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table-row.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/table.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/tabs-bar.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/tabs-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/tabs.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/tag-dismissible.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/tag.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/text-field-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/text-list-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/text-list.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/text.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/textarea-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/toast.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/lib/components/wordmark.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@porsche-design-system/components-react",
-  "version": "3.3.0",
+  "version": "3.4.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.3.0"
+    "@porsche-design-system/components-js": "3.4.0"
   },
   "peerDependencies": {
     "react": ">=17.0.0 <19.0.0",

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

@@ -314,17 +314,27 @@ const hasVisibleIcon = (iconName, iconSource) => {
     return iconName !== 'none' || !!iconSource;
 };
 
-const childrenMutationMap = new Map();
+/**
+ * Map of observed nodes and their corresponding callback functions.
+ */
+const observedNodesMap = new Map();
+/**
+ * Mutation observer for observing changes in the children of observed nodes.
+ */
 hasWindow &&
     new MutationObserver((mutations) => {
         // there may be race conditions in jsdom-polyfill tests  where the map is already empty when a mutation happens
-        if (childrenMutationMap.size) {
-            const mapKeys = Array.from(childrenMutationMap.keys());
+        if (observedNodesMap.size) {
+            const observedNodes = Array.from(observedNodesMap.keys());
             mutations
                 // remove duplicates so we execute callback only once per node
                 .filter((mutation, idx, arr) => arr.findIndex((m) => m.target === mutation.target) === idx)
-                // find node in map that contains the mutated element to find and invoke its callback
-                .forEach((mutation) => childrenMutationMap.get(mapKeys.find((node) => node.contains(mutation.target)))?.());
+                // find all observing parent nodes of mutated node and invoke their callbacks
+                .forEach((mutation) => {
+                observedNodes
+                    .filter((node) => node.contains(mutation.target))
+                    .forEach((node) => observedNodesMap.get(node)?.());
+            });
         }
     });
 

package/ssr/components/dist/utils/esm/utils-entry.js

@@ -155,17 +155,27 @@ const hasVisibleIcon = (iconName, iconSource) => {
     return iconName !== 'none' || !!iconSource;
 };
 
-const childrenMutationMap = new Map();
+/**
+ * Map of observed nodes and their corresponding callback functions.
+ */
+const observedNodesMap = new Map();
+/**
+ * Mutation observer for observing changes in the children of observed nodes.
+ */
 hasWindow &&
     new MutationObserver((mutations) => {
         // there may be race conditions in jsdom-polyfill tests  where the map is already empty when a mutation happens
-        if (childrenMutationMap.size) {
-            const mapKeys = Array.from(childrenMutationMap.keys());
+        if (observedNodesMap.size) {
+            const observedNodes = Array.from(observedNodesMap.keys());
             mutations
                 // remove duplicates so we execute callback only once per node
                 .filter((mutation, idx, arr) => arr.findIndex((m) => m.target === mutation.target) === idx)
-                // find node in map that contains the mutated element to find and invoke its callback
-                .forEach((mutation) => childrenMutationMap.get(mapKeys.find((node) => node.contains(mutation.target)))?.());
+                // find all observing parent nodes of mutated node and invoke their callbacks
+                .forEach((mutation) => {
+                observedNodes
+                    .filter((node) => node.contains(mutation.target))
+                    .forEach((node) => observedNodesMap.get(node)?.());
+            });
         }
     });
 
@@ -4065,7 +4075,6 @@ exports.buildCrestSrcSet = buildCrestSrcSet;
 exports.buildIconUrl = buildIconUrl;
 exports.buildSrcSet = buildSrcSet;
 exports.cdnBaseUrl = cdnBaseUrl;
-exports.childrenMutationMap = childrenMutationMap;
 exports.createPaginationModel = createPaginationModel;
 exports.createRange = createRange;
 exports.crestCdnBaseUrl = crestCdnBaseUrl;
@@ -4118,6 +4127,7 @@ exports.isType = isType;
 exports.isUrl = isUrl;
 exports.isWithinForm = isWithinForm;
 exports.modelSignatureHeight = modelSignatureHeight;
+exports.observedNodesMap = observedNodesMap;
 exports.parseAndGetAriaAttributes = parseAndGetAriaAttributes;
 exports.parseJSONAttribute = parseJSONAttribute;
 exports.showCustomCalendarOrTimeIndicator = showCustomCalendarOrTimeIndicator;

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/accordion.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/banner.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/button-group.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/button-pure.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/button-tile.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/button.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/carousel.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/checkbox-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/content-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/crest.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/display.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/divider.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/fieldset-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/fieldset.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/flex-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/flex.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/flyout.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/grid-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/grid.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/heading.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/headline.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/icon.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/inline-notification.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/link-pure.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/link-social.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/link-tile-model-signature.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/link-tile.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/link.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/marque.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/modal.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/model-signature.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/pagination.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/popover.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/radio-button-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/scroller.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/segmented-control-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/segmented-control.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/select-wrapper-dropdown.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/select-wrapper.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/spinner.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/stepper-horizontal-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/stepper-horizontal.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/switch.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-body.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-cell.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-head-cell.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-head-row.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-head.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-row.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tabs-bar.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tabs-item.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tabs.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tag-dismissible.wrapper.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');