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

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

@@ -7,18 +7,22 @@ export type PInputTextProps = BaseProps & {
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Show or hide the character counter.
+     * @default false
      */
     counter?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -27,14 +31,17 @@ export type PInputTextProps = BaseProps & {
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -43,6 +50,7 @@ export type PInputTextProps = BaseProps & {
     maxLength?: number;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -67,14 +75,17 @@ export type PInputTextProps = BaseProps & {
     onInput?: (event: CustomEvent<InputTextInputEventDetail>) => void;
     /**
      * A string that provides a brief hint to the user about what kind of information is expected in the field (e.g., placeholder='Enter your full name'). This text is displayed when the input field is empty.
+     * @default ''
      */
     placeholder?: string;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
@@ -83,10 +94,12 @@ export type PInputTextProps = BaseProps & {
     spellCheck?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputTextState;
     /**
      * The text input value.
+     * @default ''
      */
     value?: string;
 };
@@ -97,18 +110,22 @@ export declare const PInputText: import("react").ForwardRefExoticComponent<Omit<
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Show or hide the character counter.
+     * @default false
      */
     counter?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -117,14 +134,17 @@ export declare const PInputText: import("react").ForwardRefExoticComponent<Omit<
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -133,6 +153,7 @@ export declare const PInputText: import("react").ForwardRefExoticComponent<Omit<
     maxLength?: number;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -157,14 +178,17 @@ export declare const PInputText: import("react").ForwardRefExoticComponent<Omit<
     onInput?: (event: CustomEvent<InputTextInputEventDetail>) => void;
     /**
      * A string that provides a brief hint to the user about what kind of information is expected in the field (e.g., placeholder='Enter your full name'). This text is displayed when the input field is empty.
+     * @default ''
      */
     placeholder?: string;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
@@ -173,10 +197,12 @@ export declare const PInputText: import("react").ForwardRefExoticComponent<Omit<
     spellCheck?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputTextState;
     /**
      * The text input value.
+     * @default ''
      */
     value?: string;
 } & {

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

@@ -7,14 +7,17 @@ export type PInputTimeProps = BaseProps & {
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -23,14 +26,17 @@ export type PInputTimeProps = BaseProps & {
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -39,6 +45,7 @@ export type PInputTimeProps = BaseProps & {
     max?: string;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -63,22 +70,27 @@ export type PInputTimeProps = BaseProps & {
     onInput?: (event: CustomEvent<InputTimeInputEventDetail>) => void;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputTimeState;
     /**
      * Defines 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).
+     * @default 60
      */
     step?: number;
     /**
      * The default time value for the input, in hh:mm or hh:mm:ss format (e.g., value='14:00').
+     * @default ''
      */
     value?: string;
 };
@@ -89,14 +101,17 @@ export declare const PInputTime: import("react").ForwardRefExoticComponent<Omit<
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -105,14 +120,17 @@ export declare const PInputTime: import("react").ForwardRefExoticComponent<Omit<
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -121,6 +139,7 @@ export declare const PInputTime: import("react").ForwardRefExoticComponent<Omit<
     max?: string;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -145,22 +164,27 @@ export declare const PInputTime: import("react").ForwardRefExoticComponent<Omit<
     onInput?: (event: CustomEvent<InputTimeInputEventDetail>) => void;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputTimeState;
     /**
      * Defines 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).
+     * @default 60
      */
     step?: number;
     /**
      * The default time value for the input, in hh:mm or hh:mm:ss format (e.g., value='14:00').
+     * @default ''
      */
     value?: string;
 } & {

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

@@ -7,14 +7,17 @@ export type PInputUrlProps = BaseProps & {
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -23,18 +26,22 @@ export type PInputUrlProps = BaseProps & {
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Controls the visibility of the URL icon.
+     * @default false
      */
     indicator?: boolean;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -43,6 +50,7 @@ export type PInputUrlProps = BaseProps & {
     maxLength?: number;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -71,22 +79,27 @@ export type PInputUrlProps = BaseProps & {
     pattern?: string;
     /**
      * A string that provides a brief hint to the user about what kind of information is expected in the field (e.g., placeholder='https://porsche.com/')
+     * @default ''
      */
     placeholder?: string;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputUrlState;
     /**
      * The URL input value.
+     * @default ''
      */
     value?: string;
 };
@@ -97,14 +110,17 @@ export declare const PInputUrl: import("react").ForwardRefExoticComponent<Omit<i
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -113,18 +129,22 @@ export declare const PInputUrl: import("react").ForwardRefExoticComponent<Omit<i
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Controls the visibility of the URL icon.
+     * @default false
      */
     indicator?: boolean;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -133,6 +153,7 @@ export declare const PInputUrl: import("react").ForwardRefExoticComponent<Omit<i
     maxLength?: number;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -161,22 +182,27 @@ export declare const PInputUrl: import("react").ForwardRefExoticComponent<Omit<i
     pattern?: string;
     /**
      * A string that provides a brief hint to the user about what kind of information is expected in the field (e.g., placeholder='https://porsche.com/')
+     * @default ''
      */
     placeholder?: string;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputUrlState;
     /**
      * The URL input value.
+     * @default ''
      */
     value?: string;
 } & {

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

@@ -7,14 +7,17 @@ export type PInputWeekProps = BaseProps & {
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -23,14 +26,17 @@ export type PInputWeekProps = BaseProps & {
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -39,6 +45,7 @@ export type PInputWeekProps = BaseProps & {
     max?: string;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -63,22 +70,27 @@ export type PInputWeekProps = BaseProps & {
     onInput?: (event: CustomEvent<InputWeekInputEventDetail>) => void;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputWeekState;
     /**
      * Defines the stepping interval in weeks. For example, step="1" increments by 1 week. The default is 1 week.
+     * @default 1
      */
     step?: number;
     /**
      * The default week value for the input, in YYYY-Www format (e.g., value='2025-W27').
+     * @default ''
      */
     value?: string;
 };
@@ -89,14 +101,17 @@ export declare const PInputWeek: import("react").ForwardRefExoticComponent<Omit<
     autoComplete?: string;
     /**
      * Displays the input field in compact mode.
+     * @default false
      */
     compact?: boolean;
     /**
      * Supplementary text providing more context or explanation for the input.
+     * @default ''
      */
     description?: string;
     /**
      * Disables the input field. The value will not be submitted with the form.
+     * @default false
      */
     disabled?: boolean;
     /**
@@ -105,14 +120,17 @@ export declare const PInputWeek: import("react").ForwardRefExoticComponent<Omit<
     form?: string;
     /**
      * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
      * Text content for a user-facing label.
+     * @default ''
      */
     label?: string;
     /**
      * @experimental Shows a loading indicator.
+     * @default false
      */
     loading?: boolean;
     /**
@@ -121,6 +139,7 @@ export declare const PInputWeek: import("react").ForwardRefExoticComponent<Omit<
     max?: string;
     /**
      * Dynamic feedback text for validation or status.
+     * @default ''
      */
     message?: string;
     /**
@@ -145,22 +164,27 @@ export declare const PInputWeek: import("react").ForwardRefExoticComponent<Omit<
     onInput?: (event: CustomEvent<InputWeekInputEventDetail>) => void;
     /**
      * A boolean value that, if present, makes the input field uneditable by the user, but its value will still be submitted with the form.
+     * @default false
      */
     readOnly?: boolean;
     /**
      * A boolean value that, if present, indicates that the input field must be filled out before the form can be submitted.
+     * @default false
      */
     required?: boolean;
     /**
      * Indicates the validation or overall status of the input component.
+     * @default 'none'
      */
     state?: InputWeekState;
     /**
      * Defines the stepping interval in weeks. For example, step="1" increments by 1 week. The default is 1 week.
+     * @default 1
      */
     step?: number;
     /**
      * The default week value for the input, in YYYY-Www format (e.g., value='2025-W27').
+     * @default ''
      */
     value?: string;
 } & {