@porsche-design-system/components-react 3.32.0 → 4.0.0-beta.0

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

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { InlineNotificationActionIcon, InlineNotificationHeadingTag, InlineNotificationState, Theme } from '../types';
+import type { InlineNotificationActionIcon, InlineNotificationHeadingTag, InlineNotificationState } from '../types';
 export type PInlineNotificationProps = BaseProps & {
     /**
      * Action icon of the inline-notification.
@@ -37,18 +37,10 @@ export type PInlineNotificationProps = BaseProps & {
      * Emitted when the close button is clicked.
      */
     onDismiss?: (event: CustomEvent<void>) => void;
-    /**
-     * @deprecated since v3.0.0, will be removed with next major release, use `dismissButton` instead. Defines if the inline-notification can be closed/removed by the user.
-     */
-    persistent?: boolean;
     /**
      * State of the inline-notification.
      */
     state?: InlineNotificationState;
-    /**
-     * Adapts the inline-notification color depending on the theme.
-     */
-    theme?: Theme;
 };
 export declare const PInlineNotification: import("react").ForwardRefExoticComponent<Omit<import("react").DOMAttributes<{}>, "onChange" | "onInput" | "onToggle"> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "inert" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
@@ -87,18 +79,10 @@ export declare const PInlineNotification: import("react").ForwardRefExoticCompon
      * Emitted when the close button is clicked.
      */
     onDismiss?: (event: CustomEvent<void>) => void;
-    /**
-     * @deprecated since v3.0.0, will be removed with next major release, use `dismissButton` instead. Defines if the inline-notification can be closed/removed by the user.
-     */
-    persistent?: boolean;
     /**
      * State of the inline-notification.
      */
     state?: InlineNotificationState;
-    /**
-     * Adapts the inline-notification color depending on the theme.
-     */
-    theme?: Theme;
 } & {
     children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/esm/lib/components/inline-notification.wrapper.mjs

@@ -1,18 +1,18 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInlineNotification = /*#__PURE__*/ forwardRef(({ actionIcon = 'arrow-right', actionLabel, actionLoading = false, description = '', dismissButton = true, heading = '', headingTag = 'h5', onAction, onDismiss, persistent, state = 'info', theme, className, ...rest }, ref) => {
+const PInlineNotification = /*#__PURE__*/ forwardRef(({ actionIcon = 'arrow-right', actionLabel, actionLoading = false, description = '', dismissButton = true, heading = '', headingTag = 'h5', onAction, onDismiss, state = 'info', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'action', onAction);
     useEventCallback(elementRef, 'dismiss', onDismiss);
     const WebComponentTag = usePrefix('p-inline-notification');
-    const propsToSync = [actionIcon, actionLabel, actionLoading, description, dismissButton, heading, headingTag, persistent, state, theme || useTheme()];
+    const propsToSync = [actionIcon, actionLabel, actionLoading, description, dismissButton, heading, headingTag, state];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['actionIcon', 'actionLabel', 'actionLoading', 'description', 'dismissButton', 'heading', 'headingTag', 'persistent', 'state', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['actionIcon', 'actionLabel', 'actionLoading', 'description', 'dismissButton', 'heading', 'headingTag', 'state'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-date.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputDateBlurEventDetail, InputDateChangeEventDetail, InputDateInputEventDetail, InputDateState, Theme } from '../types';
+import type { BreakpointCustomizable, InputDateBlurEventDetail, InputDateChangeEventDetail, InputDateInputEventDetail, InputDateState } from '../types';
 export type PInputDateProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., auto-complete='bday' for a birthday).
@@ -77,10 +77,6 @@ export type PInputDateProps = BaseProps & {
      * Defines the granularity of the date input. This value is given in days. The default is 1 (one day).
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default date value for the input, in YYYY-MM-DD format (e.g., value='2025-07-02').
      */
@@ -163,10 +159,6 @@ export declare const PInputDate: import("react").ForwardRefExoticComponent<Omit<
      * Defines the granularity of the date input. This value is given in days. The default is 1 (one day).
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default date value for the input, in YYYY-MM-DD format (e.g., value='2025-07-02').
      */

package/esm/lib/components/input-date.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputDate = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, readOnly = false, required = false, state = 'none', step = 1, theme, value = '', className, ...rest }, ref) => {
+const PInputDate = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, readOnly = false, required = false, state = 'none', step = 1, value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-date');
-    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, max, message, min, name, readOnly, required, state, step, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, max, message, min, name, readOnly, required, state, step, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'readOnly', 'required', 'state', 'step', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'readOnly', 'required', 'state', 'step', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-email.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputEmailBlurEventDetail, InputEmailChangeEventDetail, InputEmailInputEventDetail, InputEmailState, Theme } from '../types';
+import type { BreakpointCustomizable, InputEmailBlurEventDetail, InputEmailChangeEventDetail, InputEmailInputEventDetail, InputEmailState } from '../types';
 export type PInputEmailProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='email').
@@ -89,10 +89,6 @@ export type PInputEmailProps = BaseProps & {
      * Indicates the validation or overall status of the input component.
      */
     state?: InputEmailState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default email address (or comma-separated list of addresses) for the input.
      */
@@ -187,10 +183,6 @@ export declare const PInputEmail: import("react").ForwardRefExoticComponent<Omit
      * Indicates the validation or overall status of the input component.
      */
     state?: InputEmailState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default email address (or comma-separated list of addresses) for the input.
      */

package/esm/lib/components/input-email.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputEmail = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, indicator = false, label = '', loading = false, maxLength, message = '', minLength, multiple = false, name, onBlur, onChange, onInput, pattern, placeholder = '', readOnly = false, required = false, state = 'none', theme, value = '', className, ...rest }, ref) => {
+const PInputEmail = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, indicator = false, label = '', loading = false, maxLength, message = '', minLength, multiple = false, name, onBlur, onChange, onInput, pattern, placeholder = '', readOnly = false, required = false, state = 'none', value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-email');
-    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, indicator, label, loading, maxLength, message, minLength, multiple, name, pattern, placeholder, readOnly, required, state, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, indicator, label, loading, maxLength, message, minLength, multiple, name, pattern, placeholder, readOnly, required, state, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'indicator', 'label', 'loading', 'maxLength', 'message', 'minLength', 'multiple', 'name', 'pattern', 'placeholder', 'readOnly', 'required', 'state', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'indicator', 'label', 'loading', 'maxLength', 'message', 'minLength', 'multiple', 'name', 'pattern', 'placeholder', 'readOnly', 'required', 'state', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-month.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputMonthBlurEventDetail, InputMonthChangeEventDetail, InputMonthInputEventDetail, InputMonthState, Theme } from '../types';
+import type { BreakpointCustomizable, InputMonthBlurEventDetail, InputMonthChangeEventDetail, InputMonthInputEventDetail, InputMonthState } from '../types';
 export type PInputMonthProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features.
@@ -77,10 +77,6 @@ export type PInputMonthProps = BaseProps & {
      * Defines the stepping interval in months. For example, step="1" increments by 1 month, step="12" by 1 year. The default is 1 month.
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default month value for the input, in YYYY-MM format (e.g., value='2025-07').
      */
@@ -163,10 +159,6 @@ export declare const PInputMonth: import("react").ForwardRefExoticComponent<Omit
      * Defines the stepping interval in months. For example, step="1" increments by 1 month, step="12" by 1 year. The default is 1 month.
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default month value for the input, in YYYY-MM format (e.g., value='2025-07').
      */

package/esm/lib/components/input-month.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputMonth = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, readOnly = false, required = false, state = 'none', step = 1, theme, value = '', className, ...rest }, ref) => {
+const PInputMonth = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, readOnly = false, required = false, state = 'none', step = 1, value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-month');
-    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, max, message, min, name, readOnly, required, state, step, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, max, message, min, name, readOnly, required, state, step, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'readOnly', 'required', 'state', 'step', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'readOnly', 'required', 'state', 'step', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-number.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputNumberBlurEventDetail, InputNumberChangeEventDetail, InputNumberInputEventDetail, InputNumberState, Theme } from '../types';
+import type { BreakpointCustomizable, InputNumberBlurEventDetail, InputNumberChangeEventDetail, InputNumberInputEventDetail, InputNumberState } from '../types';
 export type PInputNumberProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='postal-code').
@@ -85,10 +85,6 @@ export type PInputNumberProps = BaseProps & {
      * The granularity that the value must adhere to.
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The number input value.
      */
@@ -179,10 +175,6 @@ export declare const PInputNumber: import("react").ForwardRefExoticComponent<Omi
      * The granularity that the value must adhere to.
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The number input value.
      */

package/esm/lib/components/input-number.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputNumber = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, controls = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, state = 'none', step = 1, theme, value = '', className, ...rest }, ref) => {
+const PInputNumber = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, controls = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, state = 'none', step = 1, value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-number');
-    const propsToSync = [autoComplete, compact, controls, description, disabled, form, hideLabel, label, loading, max, message, min, name, placeholder, readOnly, required, state, step, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, controls, description, disabled, form, hideLabel, label, loading, max, message, min, name, placeholder, readOnly, required, state, step, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'controls', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'placeholder', 'readOnly', 'required', 'state', 'step', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'controls', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'placeholder', 'readOnly', 'required', 'state', 'step', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-password.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputPasswordBlurEventDetail, InputPasswordChangeEventDetail, InputPasswordInputEventDetail, InputPasswordState, Theme } from '../types';
+import type { BreakpointCustomizable, InputPasswordBlurEventDetail, InputPasswordChangeEventDetail, InputPasswordInputEventDetail, InputPasswordState } from '../types';
 export type PInputPasswordProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='current-password', autocomplete='new-password').
@@ -77,10 +77,6 @@ export type PInputPasswordProps = BaseProps & {
      * Indicates the validation or overall status of the input component.
      */
     state?: InputPasswordState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * Show or hide password toggle for `input type="password"`.
      */
@@ -167,10 +163,6 @@ export declare const PInputPassword: import("react").ForwardRefExoticComponent<O
      * Indicates the validation or overall status of the input component.
      */
     state?: InputPasswordState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * Show or hide password toggle for `input type="password"`.
      */

package/esm/lib/components/input-password.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputPassword = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, state = 'none', theme, toggle = false, value = '', className, ...rest }, ref) => {
+const PInputPassword = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, state = 'none', toggle = false, value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-password');
-    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, maxLength, message, minLength, name, placeholder, readOnly, required, state, theme || useTheme(), toggle, value];
+    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, maxLength, message, minLength, name, placeholder, readOnly, required, state, toggle, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'placeholder', 'readOnly', 'required', 'state', 'theme', 'toggle', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'placeholder', 'readOnly', 'required', 'state', 'toggle', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-search.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputSearchBlurEventDetail, InputSearchChangeEventDetail, InputSearchInputEventDetail, InputSearchState, Theme } from '../types';
+import type { BreakpointCustomizable, InputSearchBlurEventDetail, InputSearchChangeEventDetail, InputSearchInputEventDetail, InputSearchState } from '../types';
 export type PInputSearchProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='on').
@@ -85,10 +85,6 @@ export type PInputSearchProps = BaseProps & {
      * Indicates the validation or overall status of the input component.
      */
     state?: InputSearchState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The search input value.
      */
@@ -179,10 +175,6 @@ export declare const PInputSearch: import("react").ForwardRefExoticComponent<Omi
      * Indicates the validation or overall status of the input component.
      */
     state?: InputSearchState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The search input value.
      */

package/esm/lib/components/input-search.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputSearch = /*#__PURE__*/ forwardRef(({ autoComplete, clear = false, compact = false, description = '', disabled = false, form, hideLabel = false, indicator = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, state = 'none', theme, value = '', className, ...rest }, ref) => {
+const PInputSearch = /*#__PURE__*/ forwardRef(({ autoComplete, clear = false, compact = false, description = '', disabled = false, form, hideLabel = false, indicator = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, state = 'none', value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-search');
-    const propsToSync = [autoComplete, clear, compact, description, disabled, form, hideLabel, indicator, label, loading, maxLength, message, minLength, name, placeholder, readOnly, required, state, theme || useTheme(), value];
+    const propsToSync = [autoComplete, clear, compact, description, disabled, form, hideLabel, indicator, label, loading, maxLength, message, minLength, name, placeholder, readOnly, required, state, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'clear', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'indicator', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'placeholder', 'readOnly', 'required', 'state', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'clear', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'indicator', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'placeholder', 'readOnly', 'required', 'state', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-tel.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputTelBlurEventDetail, InputTelChangeEventDetail, InputTelInputEventDetail, InputTelState, Theme } from '../types';
+import type { BreakpointCustomizable, InputTelBlurEventDetail, InputTelChangeEventDetail, InputTelInputEventDetail, InputTelState } from '../types';
 export type PInputTelProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='tel').
@@ -85,10 +85,6 @@ export type PInputTelProps = BaseProps & {
      * Indicates the validation or overall status of the input component.
      */
     state?: InputTelState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The tel input value.
      */
@@ -179,10 +175,6 @@ export declare const PInputTel: import("react").ForwardRefExoticComponent<Omit<i
      * Indicates the validation or overall status of the input component.
      */
     state?: InputTelState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The tel input value.
      */

package/esm/lib/components/input-tel.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputTel = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, indicator = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, pattern, placeholder = '', readOnly = false, required = false, state = 'none', theme, value = '', className, ...rest }, ref) => {
+const PInputTel = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, indicator = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, pattern, placeholder = '', readOnly = false, required = false, state = 'none', value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-tel');
-    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, indicator, label, loading, maxLength, message, minLength, name, pattern, placeholder, readOnly, required, state, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, indicator, label, loading, maxLength, message, minLength, name, pattern, placeholder, readOnly, required, state, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'indicator', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'pattern', 'placeholder', 'readOnly', 'required', 'state', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'indicator', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'pattern', 'placeholder', 'readOnly', 'required', 'state', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-text.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputTextBlurEventDetail, InputTextChangeEventDetail, InputTextInputEventDetail, InputTextState, Theme } from '../types';
+import type { BreakpointCustomizable, InputTextBlurEventDetail, InputTextChangeEventDetail, InputTextInputEventDetail, InputTextState } from '../types';
 export type PInputTextProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='name').
@@ -85,10 +85,6 @@ export type PInputTextProps = BaseProps & {
      * Indicates the validation or overall status of the input component.
      */
     state?: InputTextState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The text input value.
      */
@@ -179,10 +175,6 @@ export declare const PInputText: import("react").ForwardRefExoticComponent<Omit<
      * Indicates the validation or overall status of the input component.
      */
     state?: InputTextState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The text input value.
      */

package/esm/lib/components/input-text.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputText = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, counter = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, spellCheck, state = 'none', theme, value = '', className, ...rest }, ref) => {
+const PInputText = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, counter = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, maxLength, message = '', minLength, name, onBlur, onChange, onInput, placeholder = '', readOnly = false, required = false, spellCheck, state = 'none', value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-text');
-    const propsToSync = [autoComplete, compact, counter, description, disabled, form, hideLabel, label, loading, maxLength, message, minLength, name, placeholder, readOnly, required, spellCheck, state, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, counter, description, disabled, form, hideLabel, label, loading, maxLength, message, minLength, name, placeholder, readOnly, required, spellCheck, state, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'counter', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'placeholder', 'readOnly', 'required', 'spellCheck', 'state', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'counter', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'maxLength', 'message', 'minLength', 'name', 'placeholder', 'readOnly', 'required', 'spellCheck', 'state', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-time.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputTimeBlurEventDetail, InputTimeChangeEventDetail, InputTimeInputEventDetail, InputTimeState, Theme } from '../types';
+import type { BreakpointCustomizable, InputTimeBlurEventDetail, InputTimeChangeEventDetail, InputTimeInputEventDetail, InputTimeState } from '../types';
 export type PInputTimeProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., auto-complete='on').
@@ -77,10 +77,6 @@ export type PInputTimeProps = BaseProps & {
      * efines the granularity of the time input. The step value is given in seconds. The default is 60 (one minute). You can also specify smaller increments (e.g., step='1' for seconds, step='0.001' for milliseconds).
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default time value for the input, in hh:mm or hh:mm:ss format (e.g., value='14:00').
      */
@@ -163,10 +159,6 @@ export declare const PInputTime: import("react").ForwardRefExoticComponent<Omit<
      * efines the granularity of the time input. The step value is given in seconds. The default is 60 (one minute). You can also specify smaller increments (e.g., step='1' for seconds, step='0.001' for milliseconds).
      */
     step?: number;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The default time value for the input, in hh:mm or hh:mm:ss format (e.g., value='14:00').
      */

package/esm/lib/components/input-time.wrapper.mjs

@@ -1,19 +1,19 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef } from 'react';
-import { useEventCallback, usePrefix, useTheme, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
+import { useEventCallback, usePrefix, useBrowserLayoutEffect, useMergedClass } from '../../hooks.mjs';
 import { syncRef } from '../../utils.mjs';
 
-const PInputTime = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, readOnly = false, required = false, state = 'none', step = 60, theme, value = '', className, ...rest }, ref) => {
+const PInputTime = /*#__PURE__*/ forwardRef(({ autoComplete, compact = false, description = '', disabled = false, form, hideLabel = false, label = '', loading = false, max, message = '', min, name, onBlur, onChange, onInput, readOnly = false, required = false, state = 'none', step = 60, value = '', className, ...rest }, ref) => {
     const elementRef = useRef(undefined);
     useEventCallback(elementRef, 'blur', onBlur);
     useEventCallback(elementRef, 'change', onChange);
     useEventCallback(elementRef, 'input', onInput);
     const WebComponentTag = usePrefix('p-input-time');
-    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, max, message, min, name, readOnly, required, state, step, theme || useTheme(), value];
+    const propsToSync = [autoComplete, compact, description, disabled, form, hideLabel, label, loading, max, message, min, name, readOnly, required, state, step, value];
     useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'readOnly', 'required', 'state', 'step', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['autoComplete', 'compact', 'description', 'disabled', 'form', 'hideLabel', 'label', 'loading', 'max', 'message', 'min', 'name', 'readOnly', 'required', 'state', 'step', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     const props = {
         ...rest,

package/esm/lib/components/input-url.wrapper.d.ts

@@ -1,5 +1,5 @@
 import type { BaseProps } from '../../BaseProps';
-import type { BreakpointCustomizable, InputUrlBlurEventDetail, InputUrlChangeEventDetail, InputUrlInputEventDetail, InputUrlState, Theme } from '../types';
+import type { BreakpointCustomizable, InputUrlBlurEventDetail, InputUrlChangeEventDetail, InputUrlInputEventDetail, InputUrlState } from '../types';
 export type PInputUrlProps = BaseProps & {
     /**
      * Provides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='url').
@@ -85,10 +85,6 @@ export type PInputUrlProps = BaseProps & {
      * Indicates the validation or overall status of the input component.
      */
     state?: InputUrlState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The url input value.
      */
@@ -179,10 +175,6 @@ export declare const PInputUrl: import("react").ForwardRefExoticComponent<Omit<i
      * Indicates the validation or overall status of the input component.
      */
     state?: InputUrlState;
-    /**
-     * Controls the visual appearance of the component.
-     */
-    theme?: Theme;
     /**
      * The url input value.
      */