@porsche-design-system/components-react 3.0.0-rc.1 → 3.0.0-rc.3

package/CHANGELOG.md

@@ -9,6 +9,60 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### [Unreleased]
 
+### [3.0.0-rc.3] - 2023-05-10
+
+#### Fixed
+
+- `Tabs Bar` focus behavior via keyboard navigation
+  ([#2546](https://github.com/porsche-design-system/porsche-design-system/pull/2546))
+- Rendering of `Wordmark` in Safari ([#2542](https://github.com/porsche-design-system/porsche-design-system/pull/2542))
+- Disabled dragging/ghosting of icons
+  ([#2536](https://github.com/porsche-design-system/porsche-design-system/pull/2536))
+
+#### Changed
+
+- Styles: `dropShadow{Low|Medium|High}Style`s use `box-shadow` instead of `filter: drop-shadow()` to fix glitches
+  together with `frostedGlassStyle` in Firefox
+  ([#2545](https://github.com/porsche-design-system/porsche-design-system/pull/2545))
+- Size of icon and height of `Accordion`
+  ([#2536](https://github.com/porsche-design-system/porsche-design-system/pull/2536))
+
+### [3.0.0-rc.2] - 2023-05-09
+
+#### Fixed
+
+- `Checkbox Wrapper` Safari visual state change while hovering
+  ([#2508](https://github.com/porsche-design-system/porsche-design-system/pull/2508))
+- `Checkbox Wrapper` keyboard arrow navigation
+  ([#2508](https://github.com/porsche-design-system/porsche-design-system/pull/2508))
+- `Modal` fix hover state of dismiss button
+  ([#2510](https://github.com/porsche-design-system/porsche-design-system/pull/2510))
+- `Link Pure`, `Button Pure`: adjust offset of `:hover` and `active` styles
+  ([#2511](https://github.com/porsche-design-system/porsche-design-system/pull/2511))
+- `Tabs Bar`, `Tabs` ([#2521](https://github.com/porsche-design-system/porsche-design-system/pull/2521)):
+  - `focus` state of tabpanel
+  - Indicator bar height
+- Optimize icon/text alignment of `Link Pure` and `Button Pure` in Safari
+- `Select Wrapper` multiline option height and scaling behavior
+  ([#2524](https://github.com/porsche-design-system/porsche-design-system/pull/2524))
+- Fixed accessibility issues of `Tabs`, `Tabs Bar` and `Stepper Horizontal` to comply with v.4.7.0 of `axe-core`
+  ([#2530](https://github.com/porsche-design-system/porsche-design-system/pull/2530))
+- React: `patchRemixRunProcessBrowserGlobalIdentifier` binary now supports Remix 1.16.0
+  ([#2537](https://github.com/porsche-design-system/porsche-design-system/pull/2537))
+- Angular: added optional modifier to optional properties for better type checking in strict mode
+  ([#2544](https://github.com/porsche-design-system/porsche-design-system/pull/2544))
+
+#### Added
+
+- Deprecation warning to `Icon` component if `lazy` prop is used
+  ([#2521](https://github.com/porsche-design-system/porsche-design-system/pull/2521))
+- `aria` prop to `Scroller` component
+  ([#2530](https://github.com/porsche-design-system/porsche-design-system/pull/2530))
+
+#### Changed
+
+- Model signature asset of 718 model ([#2532](https://github.com/porsche-design-system/porsche-design-system/pull/2532))
+
 ### [3.0.0-rc.1] - 2023-04-19
 
 #### Added

package/bin/patchRemixRunProcessBrowserGlobalIdentifier.js

@@ -26,32 +26,41 @@ var fs__namespace = /*#__PURE__*/_interopNamespaceDefault(fs);
 
 const patchRemixRunProcessBrowserGlobalIdentifier = () => {
     const packageEntry = require.resolve('@remix-run/dev');
-    const compilerDirPath = path__namespace.resolve(packageEntry, '../compiler');
-    const [fileName] = fs__namespace
-        .readdirSync(compilerDirPath)
-        // file is currently called compileBrowser.js, but the other part is compilerServer.js
-        // that's why we also consider compilerBrowser.js to be on the safe side
-        .filter((fileName) => fileName.match(/^compiler?Browser\.js$/));
-    const filePath = path__namespace.resolve(compilerDirPath, fileName);
-    const filePathBackup = filePath.replace(/\.js$/, '-original$&');
-    if (!fs__namespace.existsSync(filePathBackup)) {
-        fs__namespace.copyFileSync(filePath, filePathBackup);
-    }
-    else {
-        fs__namespace.copyFileSync(filePathBackup, filePath);
-    }
-    const fileContent = fs__namespace.readFileSync(filePath, 'utf8');
-    // prepending should be safer than appending because JSON.stringify() might be multiline like in source
-    // https://github.com/remix-run/remix/blob/05ffb6e2db8f2a0e09caffad6e9b3c897c34cb7d/packages/remix-dev/compiler/compileBrowser.ts#L159-L163
-    const newFileContent = fileContent.replace(/"process\.env\.REMIX_DEV_SERVER_WS_PORT": JSON\.stringify\(.*/, '"process.browser": "true",\n      $&');
-    const prettyFilePath = filePath.replace(packageEntry.substring(0, packageEntry.indexOf('/node_modules')), '.');
-    if (newFileContent.includes('"process.browser": "true"')) {
-        console.log(`Successfully patched ${prettyFilePath}`);
-    }
-    else {
-        console.error(`Patching ${prettyFilePath} failed`);
-    }
-    fs__namespace.writeFileSync(filePath, newFileContent);
+    const compilerDirPaths = [
+        path__namespace.resolve(packageEntry, '../compiler'),
+        path__namespace.resolve(packageEntry, '../compiler/js'), // since 1.16.0 the file was moved into js sub-folder
+    ].filter(fs__namespace.existsSync);
+    const filePaths = compilerDirPaths
+        .map((compilerDirPath) => fs__namespace.readdirSync(compilerDirPath).map((fileName) => `${compilerDirPath}/${fileName}`))
+        .flat()
+        // file is currently called compileBrowser.js
+        // since 1.16.0 the file is called compiler.js
+        .filter((fileName) => fileName.match(/\/(?:compileBrowser|compiler)\.js$/));
+    filePaths.forEach((filePath) => {
+        const filePathBackup = filePath.replace(/\.js$/, '-original$&');
+        if (!fs__namespace.existsSync(filePathBackup)) {
+            fs__namespace.copyFileSync(filePath, filePathBackup);
+        }
+        else {
+            fs__namespace.copyFileSync(filePathBackup, filePath);
+        }
+        const fileContent = fs__namespace.readFileSync(filePath, 'utf8');
+        // we want to extend the define config
+        // https://github.com/remix-run/remix/blob/main/packages/remix-dev/compiler/js/compiler.ts#L221-L226
+        if (fileContent.match(/define: \{/)) {
+            // prepending should be safer than appending because JSON.stringify() might be multiline like in source
+            // https://github.com/remix-run/remix/blob/05ffb6e2db8f2a0e09caffad6e9b3c897c34cb7d/packages/remix-dev/compiler/compileBrowser.ts#L159-L163
+            const newFileContent = fileContent.replace(/"process\.env\.NODE_ENV": JSON\.stringify\(.*/, '"process.browser": "true", // added by Porsche Design System\'s patchRemixRunProcessBrowserGlobalIdentifier.js\n      $&');
+            const prettyFilePath = filePath.replace(packageEntry.substring(0, packageEntry.indexOf('/node_modules')), '.');
+            if (newFileContent.includes('"process.browser": "true"')) {
+                console.log(`Successfully patched ${prettyFilePath}`);
+            }
+            else {
+                console.error(`Patching ${prettyFilePath} failed`);
+            }
+            fs__namespace.writeFileSync(filePath, newFileContent);
+        }
+    });
 };
 patchRemixRunProcessBrowserGlobalIdentifier();
 

package/esm/lib/components/icon.wrapper.js

@@ -3,7 +3,7 @@ import { forwardRef, useRef } from 'react';
 import { usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.js';
 import { syncRef } from '../../utils.js';
 
-const PIcon = forwardRef(({ aria, color = 'primary', lazy = false, name = 'arrow-right', size = 'small', source, theme = 'light', className, ...rest }, ref) => {
+const PIcon = forwardRef(({ aria, color = 'primary', lazy, name = 'arrow-right', size = 'small', source, theme = 'light', className, ...rest }, ref) => {
     const elementRef = useRef();
     const WebComponentTag = usePrefix('p-icon');
     const propsToSync = [aria, color, lazy, name, size, source, theme];

package/esm/lib/components/scroller.wrapper.js

@@ -3,13 +3,13 @@ import { forwardRef, useRef } from 'react';
 import { usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.js';
 import { syncRef } from '../../utils.js';
 
-const PScroller = forwardRef(({ alignScrollIndicator = 'center', gradientColor = 'background-base', gradientColorScheme, scrollIndicatorPosition, scrollToPosition, scrollbar = false, theme = 'light', className, ...rest }, ref) => {
+const PScroller = forwardRef(({ alignScrollIndicator = 'center', aria, gradientColor = 'background-base', gradientColorScheme, scrollIndicatorPosition, scrollToPosition, scrollbar = false, theme = 'light', className, ...rest }, ref) => {
     const elementRef = useRef();
     const WebComponentTag = usePrefix('p-scroller');
-    const propsToSync = [alignScrollIndicator, gradientColor, gradientColorScheme, scrollIndicatorPosition, scrollToPosition, scrollbar, theme];
+    const propsToSync = [alignScrollIndicator, aria, gradientColor, gradientColorScheme, scrollIndicatorPosition, scrollToPosition, scrollbar, theme];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['alignScrollIndicator', 'gradientColor', 'gradientColorScheme', 'scrollIndicatorPosition', 'scrollToPosition', 'scrollbar', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['alignScrollIndicator', 'aria', 'gradientColor', 'gradientColorScheme', 'scrollIndicatorPosition', 'scrollToPosition', 'scrollbar', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/lib/components/accordion.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { AccordionUpdateEvent, BreakpointCustomizable, AccordionSize, AccordionTag, Theme } from '../types';
-export type PAccordionProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PAccordionProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Displays the Accordion as compact version with thinner border and smaller paddings.
      */
@@ -34,7 +34,7 @@ export type PAccordionProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     theme?: Theme;
 };
-export declare const PAccordion: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PAccordion: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Displays the Accordion as compact version with thinner border and smaller paddings.
      */

package/lib/components/banner.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BannerState, Theme, BannerWidth } from '../types';
-export type PBannerProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PBannerProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Description of the banner.
      */
@@ -39,7 +39,7 @@ export type PBannerProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     width?: BannerWidth;
 };
-export declare const PBanner: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PBanner: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Description of the banner.
      */

package/lib/components/button-group.wrapper.d.ts

@@ -1,12 +1,12 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, ButtonGroupDirection } from '../types';
-export type PButtonGroupProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PButtonGroupProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines the direction of the main and cross axis. The default is ’{base: ‘column’, xs: ‘row’}' showing buttons vertically stacked on mobile viewports and side-by-side in a horizontal row from breakpoint ‘xs’. You always need to provide a base value when using breakpoints.
      */
     direction?: BreakpointCustomizable<ButtonGroupDirection>;
 };
-export declare const PButtonGroup: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PButtonGroup: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Defines the direction of the main and cross axis. The default is ’{base: ‘column’, xs: ‘row’}' showing buttons vertically stacked on mobile viewports and side-by-side in a horizontal row from breakpoint ‘xs’. You always need to provide a base value when using breakpoints.
      */

package/lib/components/button-pure.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, ButtonPureAlignLabel, SelectedAriaAttributes, ButtonPureAriaAttribute, ButtonPureIcon, ButtonPureSize, Theme, ButtonPureType, ButtonPureWeight } from '../types';
-export type PButtonPureProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PButtonPureProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Display button in active state.
      */
@@ -55,7 +55,7 @@ export type PButtonPureProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> &
      */
     weight?: ButtonPureWeight;
 };
-export declare const PButtonPure: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PButtonPure: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Display button in active state.
      */

package/lib/components/button-tile.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { ButtonTileAlign, SelectedAriaAttributes, ButtonTileAriaAttribute, BreakpointCustomizable, ButtonTileAspectRatio, ButtonTileIcon, ButtonTileSize, ButtonTileType, ButtonTileWeight } from '../types';
-export type PButtonTileProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PButtonTileProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Alignment of button and description.
      */
@@ -58,7 +58,7 @@ export type PButtonTileProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> &
      */
     weight?: BreakpointCustomizable<ButtonTileWeight>;
 };
-export declare const PButtonTile: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PButtonTile: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Alignment of button and description.
      */

package/lib/components/button.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, ButtonAriaAttribute, BreakpointCustomizable, ButtonIcon, Theme, ButtonType, ButtonVariant } from '../types';
-export type PButtonProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PButtonProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Add ARIA attributes.
      */
@@ -38,7 +38,7 @@ export type PButtonProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     variant?: ButtonVariant;
 };
-export declare const PButton: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PButton: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Add ARIA attributes.
      */

package/lib/components/carousel.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { CarouselAlignHeader, BreakpointCustomizable, CarouselInternationalization, CarouselUpdateEvent, Theme, CarouselWidth } from '../types';
-export type PCarouselProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PCarouselProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines which slide to be active (zero-based numbering).
      */
@@ -59,7 +59,7 @@ export type PCarouselProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     wrapContent?: boolean;
 };
-export declare const PCarousel: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PCarousel: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Defines which slide to be active (zero-based numbering).
      */

package/lib/components/checkbox-wrapper.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, CheckboxWrapperState, Theme } from '../types';
-export type PCheckboxWrapperProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PCheckboxWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Show or hide label. For better accessibility it's recommended to show the label.
      */
@@ -26,7 +26,7 @@ export type PCheckboxWrapperProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange
      */
     theme?: Theme;
 };
-export declare const PCheckboxWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PCheckboxWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Show or hide label. For better accessibility it's recommended to show the label.
      */

package/lib/components/content-wrapper.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { ContentWrapperBackgroundColor, Theme, ContentWrapperWidth } from '../types';
-export type PContentWrapperProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PContentWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Has no effect anymore
      * @deprecated since v3.0.0, will be removed with next major release
@@ -17,7 +17,7 @@ export type PContentWrapperProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'
     width?: ContentWrapperWidth;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Grid instead. */
-export declare const PContentWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PContentWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Has no effect anymore
      * @deprecated since v3.0.0, will be removed with next major release

package/lib/components/crest.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, CrestAriaAttribute, CrestTarget } from '../types';
-export type PCrestProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PCrestProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Add ARIA attributes.
      */
@@ -14,7 +14,7 @@ export type PCrestProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     target?: CrestTarget;
 };
-export declare const PCrest: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PCrest: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Add ARIA attributes.
      */

package/lib/components/display.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { DisplayAlign, DisplayColor, BreakpointCustomizable, DisplaySize, DisplayTag, Theme } from '../types';
-export type PDisplayProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PDisplayProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Text alignment of the component.
      */
@@ -26,7 +26,7 @@ export type PDisplayProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     theme?: Theme;
 };
-export declare const PDisplay: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PDisplay: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Text alignment of the component.
      */

package/lib/components/divider.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { DividerColor, BreakpointCustomizable, DividerDirection, DividerOrientation, Theme } from '../types';
-export type PDividerProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PDividerProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines color depending on theme.
      */
@@ -18,7 +18,7 @@ export type PDividerProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     theme?: Theme;
 };
-export declare const PDivider: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PDivider: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Defines color depending on theme.
      */

package/lib/components/fieldset-wrapper.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { FieldsetWrapperLabelSize, FieldsetWrapperState, Theme } from '../types';
-export type PFieldsetWrapperProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PFieldsetWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * The label text.
      */
@@ -27,7 +27,7 @@ export type PFieldsetWrapperProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange
     theme?: Theme;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Please use "p-fieldset" instead. */
-export declare const PFieldsetWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PFieldsetWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * The label text.
      */

package/lib/components/fieldset.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { FieldsetLabelSize, FieldsetState, Theme } from '../types';
-export type PFieldsetProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PFieldsetProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * The label text.
      */
@@ -26,7 +26,7 @@ export type PFieldsetProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     theme?: Theme;
 };
-export declare const PFieldset: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PFieldset: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * The label text.
      */

package/lib/components/flex-item.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, FlexItemAlignSelf, FlexItemFlex, FlexItemGrow, FlexItemOffset, FlexItemShrink, FlexItemWidth } from '../types';
-export type PFlexItemProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PFlexItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines how this flex item is aligned along the cross axis. This overwrites the cross axis alignment set by the container. Corresponds to the "alignSelf" css property.
      */
@@ -27,7 +27,7 @@ export type PFlexItemProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
     width?: BreakpointCustomizable<FlexItemWidth>;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Flex instead. */
-export declare const PFlexItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PFlexItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Defines how this flex item is aligned along the cross axis. This overwrites the cross axis alignment set by the container. Corresponds to the "alignSelf" css property.
      */

package/lib/components/flex.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, FlexAlignContent, FlexAlignItems, FlexDirection, FlexInline, FlexJustifyContent, FlexWrap } from '../types';
-export type PFlexProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PFlexProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * This aligns a flex container's individual lines when there is extra space in the cross-axis, similar to how "justifyContent" aligns individual items along the main axis.
      */
@@ -27,7 +27,7 @@ export type PFlexProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
     wrap?: BreakpointCustomizable<FlexWrap>;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Flex instead. */
-export declare const PFlex: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PFlex: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * This aligns a flex container's individual lines when there is extra space in the cross-axis, similar to how "justifyContent" aligns individual items along the main axis.
      */

package/lib/components/grid-item.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, GridItemOffset, GridItemSize } from '../types';
-export type PGridItemProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PGridItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * The offset of the column. Can be between 0 and 11. Also defines the offset of the column for specific breakpoints, like {base: 6, l: 3}. You always need to provide a base value when doing this.
      */
@@ -11,7 +11,7 @@ export type PGridItemProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
     size?: BreakpointCustomizable<GridItemSize>;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Grid instead. */
-export declare const PGridItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PGridItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * The offset of the column. Can be between 0 and 11. Also defines the offset of the column for specific breakpoints, like {base: 6, l: 3}. You always need to provide a base value when doing this.
      */

package/lib/components/grid.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, GridDirection, GridGutter, GridWrap } from '../types';
-export type PGridProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PGridProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines the direction of the main and cross axis. The default "row" defines the main axis as horizontal left to right. Also defines the direction for specific breakpoints, like {base: "column", l: "row"}. You always need to provide a base value when doing this.
      */
@@ -16,7 +16,7 @@ export type PGridProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
     wrap?: BreakpointCustomizable<GridWrap>;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Grid instead. */
-export declare const PGrid: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PGrid: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Defines the direction of the main and cross axis. The default "row" defines the main axis as horizontal left to right. Also defines the direction for specific breakpoints, like {base: "column", l: "row"}. You always need to provide a base value when doing this.
      */

package/lib/components/heading.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { HeadingAlign, HeadingColor, BreakpointCustomizable, HeadingSize, HeadingTag, Theme } from '../types';
-export type PHeadingProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PHeadingProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Text alignment of the component.
      */
@@ -26,7 +26,7 @@ export type PHeadingProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     theme?: Theme;
 };
-export declare const PHeading: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PHeading: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Text alignment of the component.
      */

package/lib/components/headline.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { HeadlineAlign, HeadlineColor, HeadlineTag, Theme, HeadlineVariant } from '../types';
-export type PHeadlineProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PHeadlineProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Text alignment of the component.
      */
@@ -27,7 +27,7 @@ export type PHeadlineProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
     variant?: HeadlineVariant;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Please use "p-heading" instead. */
-export declare const PHeadline: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PHeadline: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Text alignment of the component.
      */

package/lib/components/icon.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, IconAriaAttribute, IconColor, IconName, IconSize, Theme } from '../types';
-export type PIconProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PIconProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Add ARIA attributes.
      */
@@ -31,7 +31,7 @@ export type PIconProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     theme?: Theme;
 };
-export declare const PIcon: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PIcon: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Add ARIA attributes.
      */

package/lib/components/icon.wrapper.js

@@ -5,7 +5,7 @@ var react = require('react');
 var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 
-const PIcon = react.forwardRef(({ aria, color = 'primary', lazy = false, name = 'arrow-right', size = 'small', source, theme = 'light', className, ...rest }, ref) => {
+const PIcon = react.forwardRef(({ aria, color = 'primary', lazy, name = 'arrow-right', size = 'small', source, theme = 'light', className, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-icon');
     const propsToSync = [aria, color, lazy, name, size, source, theme];

package/lib/components/inline-notification.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { InlineNotificationActionIcon, InlineNotificationState, Theme } from '../types';
-export type PInlineNotificationProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PInlineNotificationProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Action icon of the inline-notification.
      */
@@ -46,7 +46,7 @@ export type PInlineNotificationProps = Omit<HTMLAttributes<{}>, 'color' | 'onCha
      */
     theme?: Theme;
 };
-export declare const PInlineNotification: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PInlineNotification: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Action icon of the inline-notification.
      */

package/lib/components/link-pure.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, LinkPureAlignLabel, SelectedAriaAttributes, LinkPureAriaAttribute, LinkPureIcon, LinkPureSize, LinkPureTarget, Theme, LinkPureWeight } from '../types';
-export type PLinkPureProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PLinkPureProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Display link in active state.
      */
@@ -63,7 +63,7 @@ export type PLinkPureProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
      */
     weight?: LinkPureWeight;
 };
-export declare const PLinkPure: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PLinkPure: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Display link in active state.
      */

package/lib/components/link-social.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, LinkSocialIcon, LinkSocialTarget, Theme } from '../types';
-export type PLinkSocialProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PLinkSocialProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Show or hide label.
      */
@@ -31,7 +31,7 @@ export type PLinkSocialProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> &
     theme?: Theme;
 };
 /** @deprecated since v3.0.0, will be removed with next major release. Use `p-link` with corresponding social icon instead. */
-export declare const PLinkSocial: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PLinkSocial: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Show or hide label.
      */

package/lib/components/link-tile-model-signature.wrapper.d.ts

@@ -1,6 +1,6 @@
 import { HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, LinkTileModelSignatureAspectRatio, LinkTileModelSignatureHeadingTag, LinkTileModelSignatureLinkDirection, LinkTileModelSignatureModel, LinkTileModelSignatureWeight } from '../types';
-export type PLinkTileModelSignatureProps = Omit<HTMLAttributes<{}>, 'color' | 'onChange'> & {
+export type PLinkTileModelSignatureProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Aspect ratio of the link-tile-model-signature.
      */
@@ -30,7 +30,7 @@ export type PLinkTileModelSignatureProps = Omit<HTMLAttributes<{}>, 'color' | 'o
      */
     weight?: BreakpointCustomizable<LinkTileModelSignatureWeight>;
 };
-export declare const PLinkTileModelSignature: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color" | "onChange"> & {
+export declare const PLinkTileModelSignature: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
      * Aspect ratio of the link-tile-model-signature.
      */