@porsche-design-system/components-react 3.16.0-rc.0 → 3.16.0-rc.1

package/esm/lib/components/model-signature.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { ModelSignatureColor, ModelSignatureFetchPriority, ModelSignatureModel, ModelSignatureSize, Theme } from '../types';
-export type PModelSignatureProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PModelSignatureProps = BaseProps & {
     /**
      * Adapts the color of the component.
      */
@@ -30,7 +31,7 @@ export type PModelSignatureProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PModelSignature: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PModelSignature: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Adapts the color of the component.
      */

package/esm/lib/components/model-signature.wrapper.mjs

@@ -17,6 +17,7 @@ const PModelSignature = forwardRef(({ color = 'primary', fetchPriority = 'auto',
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/multi-select-option.wrapper.d.ts

@@ -1,5 +1,6 @@
-import { type HTMLAttributes } from 'react';
-export type PMultiSelectOptionProps = Omit<HTMLAttributes<{}>, 'color'> & {
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
+export type PMultiSelectOptionProps = BaseProps & {
     /**
      * Disables the option.
      */
@@ -9,7 +10,7 @@ export type PMultiSelectOptionProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value: string;
 };
-export declare const PMultiSelectOption: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PMultiSelectOption: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Disables the option.
      */

package/esm/lib/components/multi-select-option.wrapper.mjs

@@ -17,6 +17,7 @@ const PMultiSelectOption = forwardRef(({ disabled = false, value, className, ...
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/multi-select.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { MultiSelectDropdownDirection, BreakpointCustomizable, MultiSelectUpdateEventDetail, MultiSelectState, Theme } from '../types';
-export type PMultiSelectProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PMultiSelectProps = BaseProps & {
     /**
      * The description text.
      */
@@ -50,7 +51,7 @@ export type PMultiSelectProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value?: string[];
 };
-export declare const PMultiSelect: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PMultiSelect: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * The description text.
      */

package/esm/lib/components/multi-select.wrapper.mjs

@@ -18,6 +18,7 @@ const PMultiSelect = forwardRef(({ description = '', disabled = false, dropdownD
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/pagination.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { PaginationInternationalization, BreakpointCustomizable, PaginationMaxNumberOfPageLinks, PaginationUpdateEventDetail, Theme } from '../types';
-export type PPaginationProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PPaginationProps = BaseProps & {
     /**
      * Index of the currently active page.
      */
@@ -55,7 +56,7 @@ export type PPaginationProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     totalItemsCount: number;
 };
-export declare const PPagination: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PPagination: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Index of the currently active page.
      */

package/esm/lib/components/pagination.wrapper.mjs

@@ -19,6 +19,7 @@ const PPagination = forwardRef(({ activePage = 1, allyLabel, allyLabelNext, ally
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/pin-code.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, PinCodeLength, PinCodeUpdateEventDetail, PinCodeState, Theme, PinCodeType } from '../types';
-export type PPinCodeProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PPinCodeProps = BaseProps & {
     /**
      * The description text.
      */
@@ -58,7 +59,7 @@ export type PPinCodeProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value?: string;
 };
-export declare const PPinCode: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PPinCode: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * The description text.
      */

package/esm/lib/components/pin-code.wrapper.mjs

@@ -18,6 +18,7 @@ const PPinCode = forwardRef(({ description = '', disabled = false, hideLabel = f
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/popover.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, PopoverAriaAttribute, PopoverDirection, Theme } from '../types';
-export type PPopoverProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PPopoverProps = BaseProps & {
     /**
      * Add ARIA attributes.
      */
@@ -18,7 +19,7 @@ export type PPopoverProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PPopover: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PPopover: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Add ARIA attributes.
      */

package/esm/lib/components/popover.wrapper.mjs

@@ -17,6 +17,7 @@ const PPopover = forwardRef(({ aria, description, direction = 'bottom', theme, c
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/radio-button-wrapper.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, RadioButtonWrapperState, Theme } from '../types';
-export type PRadioButtonWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PRadioButtonWrapperProps = BaseProps & {
     /**
      * Show or hide label. For better accessibility it's recommended to show the label.
      */
@@ -26,7 +27,7 @@ export type PRadioButtonWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PRadioButtonWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PRadioButtonWrapper: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Show or hide label. For better accessibility it's recommended to show the label.
      */

package/esm/lib/components/radio-button-wrapper.wrapper.mjs

@@ -17,6 +17,7 @@ const PRadioButtonWrapper = forwardRef(({ hideLabel = false, label = '', loading
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/scroller.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { ScrollerAlignScrollIndicator, SelectedAriaAttributes, ScrollerAriaAttribute, ScrollerGradientColor, ScrollerGradientColorScheme, ScrollerScrollIndicatorPosition, ScrollerScrollToPosition, Theme } from '../types';
-export type PScrollerProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PScrollerProps = BaseProps & {
     /**
      * Sets the vertical position of scroll indicator.
      */
@@ -34,7 +35,7 @@ export type PScrollerProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PScroller: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PScroller: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Sets the vertical position of scroll indicator.
      */

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

@@ -17,6 +17,7 @@ const PScroller = forwardRef(({ alignScrollIndicator = 'center', aria, gradientC
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/segmented-control-item.wrapper.d.ts

@@ -1,6 +1,11 @@
-import { type HTMLAttributes } from 'react';
-import type { SegmentedControlItemIcon } from '../types';
-export type PSegmentedControlItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
+import type { SelectedAriaAttributes, SegmentedControlItemAriaAttribute, SegmentedControlItemIcon } from '../types';
+export type PSegmentedControlItemProps = BaseProps & {
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<SegmentedControlItemAriaAttribute>;
     /**
      * Disables the button. No events will be triggered while disabled state is active.
      */
@@ -22,7 +27,11 @@ export type PSegmentedControlItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value: string | number;
 };
-export declare const PSegmentedControlItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSegmentedControlItem: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<"aria-label"> | undefined;
     /**
      * Disables the button. No events will be triggered while disabled state is active.
      */

package/esm/lib/components/segmented-control-item.wrapper.mjs

@@ -4,19 +4,20 @@ import { forwardRef, useRef } from 'react';
 import { usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PSegmentedControlItem = forwardRef(({ disabled = false, icon, iconSource, label, value, className, ...rest }, ref) => {
+const PSegmentedControlItem = forwardRef(({ aria, disabled = false, icon, iconSource, label, value, className, ...rest }, ref) => {
     const elementRef = useRef();
     const WebComponentTag = usePrefix('p-segmented-control-item');
-    const propsToSync = [disabled, icon, iconSource, label, value];
+    const propsToSync = [aria, disabled, icon, iconSource, label, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['disabled', 'icon', 'iconSource', 'label', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['aria', 'disabled', 'icon', 'iconSource', 'label', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/segmented-control.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { SegmentedControlBackgroundColor, BreakpointCustomizable, SegmentedControlColumns, SegmentedControlUpdateEventDetail, Theme } from '../types';
-export type PSegmentedControlProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PSegmentedControlProps = BaseProps & {
     /**
      * @deprecated since v3.0.0, will be removed with next major release. Background color variations
      */
@@ -26,7 +27,7 @@ export type PSegmentedControlProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value?: string | number;
 };
-export declare const PSegmentedControl: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSegmentedControl: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * @deprecated since v3.0.0, will be removed with next major release. Background color variations
      */

package/esm/lib/components/segmented-control.wrapper.mjs

@@ -19,6 +19,7 @@ const PSegmentedControl = forwardRef(({ backgroundColor, columns = 'auto', onSeg
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/select-option.wrapper.d.ts

@@ -1,5 +1,6 @@
-import { type HTMLAttributes } from 'react';
-export type PSelectOptionProps = Omit<HTMLAttributes<{}>, 'color'> & {
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
+export type PSelectOptionProps = BaseProps & {
     /**
      * Disables the option.
      */
@@ -9,7 +10,7 @@ export type PSelectOptionProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value?: string;
 };
-export declare const PSelectOption: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSelectOption: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Disables the option.
      */

package/esm/lib/components/select-option.wrapper.mjs

@@ -17,6 +17,7 @@ const PSelectOption = forwardRef(({ disabled = false, value, className, ...rest
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/select-wrapper.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { SelectWrapperDropdownDirection, BreakpointCustomizable, SelectWrapperState, Theme } from '../types';
-export type PSelectWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PSelectWrapperProps = BaseProps & {
     /**
      * The description text.
      */
@@ -38,7 +39,7 @@ export type PSelectWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PSelectWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSelectWrapper: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * The description text.
      */

package/esm/lib/components/select-wrapper.wrapper.mjs

@@ -17,6 +17,7 @@ const PSelectWrapper = forwardRef(({ description = '', dropdownDirection = 'auto
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/select.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { SelectDropdownDirection, BreakpointCustomizable, SelectUpdateEventDetail, SelectState, Theme } from '../types';
-export type PSelectProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PSelectProps = BaseProps & {
     /**
      * The description text.
      */
@@ -50,7 +51,7 @@ export type PSelectProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     value?: string;
 };
-export declare const PSelect: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSelect: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * The description text.
      */

package/esm/lib/components/select.wrapper.mjs

@@ -18,6 +18,7 @@ const PSelect = forwardRef(({ description = '', disabled = false, dropdownDirect
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/spinner.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, SpinnerAriaAttribute, BreakpointCustomizable, SpinnerSize, Theme } from '../types';
-export type PSpinnerProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PSpinnerProps = BaseProps & {
     /**
      * Add ARIA attributes.
      */
@@ -14,7 +15,7 @@ export type PSpinnerProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PSpinner: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSpinner: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Add ARIA attributes.
      */

package/esm/lib/components/spinner.wrapper.mjs

@@ -17,6 +17,7 @@ const PSpinner = forwardRef(({ aria, size = 'small', theme, className, ...rest }
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/stepper-horizontal-item.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { StepperHorizontalItemState } from '../types';
-export type PStepperHorizontalItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PStepperHorizontalItemProps = BaseProps & {
     /**
      * Disables the stepper-horizontal-item. No events will be triggered while disabled state is active.
      */
@@ -10,7 +11,7 @@ export type PStepperHorizontalItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     state?: StepperHorizontalItemState;
 };
-export declare const PStepperHorizontalItem: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PStepperHorizontalItem: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Disables the stepper-horizontal-item. No events will be triggered while disabled state is active.
      */

package/esm/lib/components/stepper-horizontal-item.wrapper.mjs

@@ -17,6 +17,7 @@ const PStepperHorizontalItem = forwardRef(({ disabled = false, state, className,
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/stepper-horizontal.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { StepperHorizontalUpdateEventDetail, BreakpointCustomizable, StepperHorizontalSize, Theme } from '../types';
-export type PStepperHorizontalProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PStepperHorizontalProps = BaseProps & {
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `update` event instead. Emitted when active step is changed.
      */
@@ -18,7 +19,7 @@ export type PStepperHorizontalProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PStepperHorizontal: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PStepperHorizontal: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `update` event instead. Emitted when active step is changed.
      */

package/esm/lib/components/stepper-horizontal.wrapper.mjs

@@ -19,6 +19,7 @@ const PStepperHorizontal = forwardRef(({ onStepChange, onUpdate, size = 'small',
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/switch.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, SwitchAlignLabel, SwitchUpdateEventDetail, Theme } from '../types';
-export type PSwitchProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PSwitchProps = BaseProps & {
     /**
      * Aligns the label.
      */
@@ -38,7 +39,7 @@ export type PSwitchProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     theme?: Theme;
 };
-export declare const PSwitch: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PSwitch: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Aligns the label.
      */

package/esm/lib/components/switch.wrapper.mjs

@@ -19,6 +19,7 @@ const PSwitch = forwardRef(({ alignLabel = 'end', checked = false, disabled = fa
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/table-body.wrapper.d.ts

@@ -1,5 +1,6 @@
-import { type HTMLAttributes } from 'react';
-export type PTableBodyProps = Omit<HTMLAttributes<{}>, 'color'> & {};
-export declare const PTableBody: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
+export type PTableBodyProps = BaseProps & {};
+export declare const PTableBody: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

package/esm/lib/components/table-body.wrapper.mjs

@@ -12,6 +12,7 @@ const PTableBody = forwardRef(({ className, ...rest }, ref) => {
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/table-cell.wrapper.d.ts

@@ -1,11 +1,12 @@
-import { type HTMLAttributes } from 'react';
-export type PTableCellProps = Omit<HTMLAttributes<{}>, 'color'> & {
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
+export type PTableCellProps = BaseProps & {
     /**
      * Displays slotted text multiline or forced into a single line.
      */
     multiline?: boolean;
 };
-export declare const PTableCell: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PTableCell: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Displays slotted text multiline or forced into a single line.
      */

package/esm/lib/components/table-cell.wrapper.mjs

@@ -15,6 +15,7 @@ const PTableCell = forwardRef(({ multiline = false, className, ...rest }, ref) =
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/table-head-cell.wrapper.d.ts

@@ -1,6 +1,7 @@
-import { type HTMLAttributes } from 'react';
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
 import type { TableHeadCellSort } from '../types';
-export type PTableHeadCellProps = Omit<HTMLAttributes<{}>, 'color'> & {
+export type PTableHeadCellProps = BaseProps & {
     /**
      * Hides the label but stays accessible for screen readers. This property only takes effect when sort property is not defined.
      */
@@ -14,7 +15,7 @@ export type PTableHeadCellProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     sort?: TableHeadCellSort;
 };
-export declare const PTableHeadCell: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+export declare const PTableHeadCell: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
      * Hides the label but stays accessible for screen readers. This property only takes effect when sort property is not defined.
      */

package/esm/lib/components/table-head-cell.wrapper.mjs

@@ -17,6 +17,7 @@ const PTableHeadCell = forwardRef(({ hideLabel = false, multiline = false, sort,
         class: useMergedClass(elementRef, className),
         ref: syncRef(elementRef, ref)
     };
+    // @ts-ignore
     return jsx(WebComponentTag, { ...props });
 });
 

package/esm/lib/components/table-head-row.wrapper.d.ts

@@ -1,5 +1,6 @@
-import { type HTMLAttributes } from 'react';
-export type PTableHeadRowProps = Omit<HTMLAttributes<{}>, 'color'> & {};
-export declare const PTableHeadRow: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
+/// <reference types="react" />
+import type { BaseProps } from '../../BaseProps';
+export type PTableHeadRowProps = BaseProps & {};
+export declare const PTableHeadRow: import("react").ForwardRefExoticComponent<import("react").DOMAttributes<{}> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;