@porsche-design-system/components-react 3.2.0-rc.0 → 3.3.0-rc.0

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, LinkSocialIcon, LinkSocialTarget, Theme } from '../types';
 export type PLinkSocialProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -35,31 +35,31 @@ export declare const PLinkSocial: import("react").ForwardRefExoticComponent<Omit
     /**
      * Show or hide label.
      */
-    hideLabel?: BreakpointCustomizable<boolean>;
+    hideLabel?: BreakpointCustomizable<boolean> | undefined;
     /**
      * When providing an url then the component will be rendered as `<a>`.
      */
-    href?: string;
+    href?: string | undefined;
     /**
      * The icon shown.
      */
-    icon?: LinkSocialIcon;
+    icon?: LinkSocialIcon | undefined;
     /**
      * A URL path to a custom icon.
      */
-    iconSource?: string;
+    iconSource?: string | undefined;
     /**
      * Specifies the relationship of the target object to the link object.
      */
-    rel?: string;
+    rel?: string | undefined;
     /**
      * Target attribute where the link should be opened.
      */
-    target?: LinkSocialTarget;
+    target?: string | undefined;
     /**
      * Adapts the link color when used on dark background.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, LinkTileModelSignatureAspectRatio, LinkTileModelSignatureHeadingTag, LinkTileModelSignatureLinkDirection, LinkTileModelSignatureModel, LinkTileModelSignatureWeight } from '../types';
 export type PLinkTileModelSignatureProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -34,11 +34,11 @@ export declare const PLinkTileModelSignature: import("react").ForwardRefExoticCo
     /**
      * Aspect ratio of the link-tile-model-signature.
      */
-    aspectRatio?: BreakpointCustomizable<LinkTileModelSignatureAspectRatio>;
+    aspectRatio?: BreakpointCustomizable<"1:1" | "4:3" | "3:4" | "16:9" | "9:16"> | undefined;
     /**
      * Description text.
      */
-    description?: string;
+    description?: string | undefined;
     /**
      * Heading text.
      */
@@ -46,19 +46,19 @@ export declare const PLinkTileModelSignature: import("react").ForwardRefExoticCo
     /**
      * Sets a custom headline tag which wraps the heading to enhance semantics.
      */
-    headingTag?: LinkTileModelSignatureHeadingTag;
+    headingTag?: "h2" | "h3" | "h4" | "h5" | "h6" | undefined;
     /**
      * Defines the direction of the main and cross axis of the links. The default is '{base: ‘column’, xs: ‘row’}' showing buttons vertically stacked on mobile viewports and side-by-side in a horizontal row from breakpoint 'xs'.
      */
-    linkDirection?: BreakpointCustomizable<LinkTileModelSignatureLinkDirection>;
+    linkDirection?: BreakpointCustomizable<"row" | "column"> | undefined;
     /**
      * Adapts the model of the component.
      */
-    model?: LinkTileModelSignatureModel;
+    model?: "718" | "911" | "boxster" | "cayenne" | "cayman" | "macan" | "panamera" | "taycan" | "turbo-s" | "turbo" | undefined;
     /**
      * Adapts the font weight of the heading.
      */
-    weight?: BreakpointCustomizable<LinkTileModelSignatureWeight>;
+    weight?: BreakpointCustomizable<"regular" | "semi-bold"> | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { LinkTileAlign, SelectedAriaAttributes, LinkTileAriaAttribute, BreakpointCustomizable, LinkTileAspectRatio, LinkTileSize, LinkTileTarget, LinkTileWeight } from '../types';
 export type PLinkTileProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -58,19 +58,19 @@ export declare const PLinkTile: import("react").ForwardRefExoticComponent<Omit<H
     /**
      * Alignment of link and description.
      */
-    align?: LinkTileAlign;
+    align?: "top" | "bottom" | undefined;
     /**
      * Add ARIA attributes.
      */
-    aria?: SelectedAriaAttributes<LinkTileAriaAttribute>;
+    aria?: SelectedAriaAttributes<"aria-label"> | undefined;
     /**
      * Aspect ratio of the link-tile.
      */
-    aspectRatio?: BreakpointCustomizable<LinkTileAspectRatio>;
+    aspectRatio?: BreakpointCustomizable<"1:1" | "4:3" | "3:4" | "16:9" | "9:16"> | undefined;
     /**
      * Displays the link-tile as compact version with description and link icon only.
      */
-    compact?: BreakpointCustomizable<boolean>;
+    compact?: BreakpointCustomizable<boolean> | undefined;
     /**
      * Description text.
      */
@@ -78,11 +78,11 @@ export declare const PLinkTile: import("react").ForwardRefExoticComponent<Omit<H
     /**
      * Special download attribute to open native browser download dialog if target url points to a downloadable file.
      */
-    download?: string;
+    download?: string | undefined;
     /**
      * Show gradient.
      */
-    gradient?: boolean;
+    gradient?: boolean | undefined;
     /**
      * href of the `<a>`.
      */
@@ -94,19 +94,19 @@ export declare const PLinkTile: import("react").ForwardRefExoticComponent<Omit<H
     /**
      * Specifies the relationship of the target object to the link object.
      */
-    rel?: string;
+    rel?: string | undefined;
     /**
      * Font size of the description.
      */
-    size?: BreakpointCustomizable<LinkTileSize>;
+    size?: BreakpointCustomizable<"default" | "inherit"> | undefined;
     /**
      * Target attribute where the link should be opened.
      */
-    target?: LinkTileTarget;
+    target?: string | undefined;
     /**
      * Font weight of the description.
      */
-    weight?: BreakpointCustomizable<LinkTileWeight>;
+    weight?: BreakpointCustomizable<"regular" | "semi-bold" | "semibold"> | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, LinkAriaAttribute, BreakpointCustomizable, LinkIcon, LinkTarget, Theme, LinkVariant } from '../types';
 export type PLinkProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -46,43 +46,43 @@ export declare const PLink: import("react").ForwardRefExoticComponent<Omit<HTMLA
     /**
      * Add ARIA attributes.
      */
-    aria?: SelectedAriaAttributes<LinkAriaAttribute>;
+    aria?: SelectedAriaAttributes<"aria-label"> | undefined;
     /**
      * Special download attribute to open native browser download dialog if target url points to a downloadable file.
      */
-    download?: string;
+    download?: string | undefined;
     /**
      * Show or hide label. For better accessibility it is recommended to show the label.
      */
-    hideLabel?: BreakpointCustomizable<boolean>;
+    hideLabel?: BreakpointCustomizable<boolean> | undefined;
     /**
      * When providing an url then the component will be rendered as `<a>`.
      */
-    href?: string;
+    href?: string | undefined;
     /**
      * The icon shown. By choosing 'none', no icon is displayed.
      */
-    icon?: LinkIcon;
+    icon?: import("../types").LinkButtonIconName | undefined;
     /**
      * A URL path to a custom icon.
      */
-    iconSource?: string;
+    iconSource?: string | undefined;
     /**
      * Specifies the relationship of the target object to the link object.
      */
-    rel?: string;
+    rel?: string | undefined;
     /**
      * Target attribute where the link should be opened.
      */
-    target?: LinkTarget;
+    target?: string | undefined;
     /**
      * Adapts the link color when used on dark background.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
     /**
      * The style variant of the link.
      */
-    variant?: LinkVariant;
+    variant?: "primary" | "secondary" | "tertiary" | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, MarqueAriaAttribute, MarqueSize, MarqueTarget, MarqueVariant } from '../types';
 export type PMarqueProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -31,25 +31,25 @@ export declare const PMarque: import("react").ForwardRefExoticComponent<Omit<HTM
     /**
      * Add ARIA attributes.
      */
-    aria?: SelectedAriaAttributes<MarqueAriaAttribute>;
+    aria?: SelectedAriaAttributes<"aria-label"> | undefined;
     /**
      * When providing an url then the component will be rendered as `<a>`.
      */
-    href?: string;
+    href?: string | undefined;
     /**
      * Adapts sizing of marque.
      */
-    size?: MarqueSize;
+    size?: "small" | "medium" | "responsive" | undefined;
     /**
      * Target attribute where the link should be opened.
      */
-    target?: MarqueTarget;
+    target?: string | undefined;
     /**
      * Show/hide trademark sign (only has effect when variant is set to default).
      */
-    trademark?: boolean;
+    trademark?: boolean | undefined;
     /**
      * Shows marque in special editions
      */
-    variant?: MarqueVariant;
+    variant?: "default" | "75-years" | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, ModalAriaAttribute, BreakpointCustomizable } from '../types';
 export type PModalProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -42,35 +42,35 @@ export declare const PModal: import("react").ForwardRefExoticComponent<Omit<HTML
     /**
      * Add ARIA attributes.
      */
-    aria?: SelectedAriaAttributes<ModalAriaAttribute>;
+    aria?: SelectedAriaAttributes<"aria-label"> | undefined;
     /**
      * If true, the modal will not be closable via backdrop click.
      */
-    disableBackdropClick?: boolean;
+    disableBackdropClick?: boolean | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `dismissButton` instead. If true, the modal will not have a dismiss button.
      */
-    disableCloseButton?: boolean;
+    disableCloseButton?: boolean | undefined;
     /**
      * If false, the modal will not have a dismiss button.
      */
-    dismissButton?: boolean;
+    dismissButton?: boolean | undefined;
     /**
      * If true the modal uses max viewport height and width. Should only be used for mobile.
      */
-    fullscreen?: BreakpointCustomizable<boolean>;
+    fullscreen?: BreakpointCustomizable<boolean> | undefined;
     /**
      * The title of the modal
      */
-    heading?: string;
+    heading?: string | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `dismiss` event instead. Emitted when the component requests to be dismissed.
      */
-    onClose?: (event: CustomEvent<void>) => void;
+    onClose?: ((event: CustomEvent<void>) => void) | undefined;
     /**
      * Emitted when the component requests to be dismissed.
      */
-    onDismiss?: (event: CustomEvent<void>) => void;
+    onDismiss?: ((event: CustomEvent<void>) => void) | undefined;
     /**
      * If true, the modal is open.
      */

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { ModelSignatureColor, ModelSignatureModel, ModelSignatureSize, Theme } from '../types';
 export type PModelSignatureProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -22,17 +22,17 @@ export declare const PModelSignature: import("react").ForwardRefExoticComponent<
     /**
      * Adapts the color of the component.
      */
-    color?: ModelSignatureColor;
+    color?: "inherit" | "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | undefined;
     /**
      * Adapts the model of the component.
      */
-    model?: ModelSignatureModel;
+    model?: "718" | "911" | "boxster" | "cayenne" | "cayman" | "macan" | "panamera" | "taycan" | "turbo-s" | "turbo" | undefined;
     /**
      * Adapts the size of the component.
      */
-    size?: ModelSignatureSize;
+    size?: "small" | "inherit" | undefined;
     /**
      * Adapts color depending on theme.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { PaginationInternationalization, BreakpointCustomizable, PaginationMaxNumberOfPageLinks, PaginationUpdateEvent, Theme } from '../types';
 export type PPaginationProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -62,47 +62,47 @@ export declare const PPagination: import("react").ForwardRefExoticComponent<Omit
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `intl.root` instead. Aria label what the pagination is used for.
      */
-    allyLabel?: string;
+    allyLabel?: string | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `intl.next` instead. Aria label for next page icon.
      */
-    allyLabelNext?: string;
+    allyLabelNext?: string | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `intl.page` instead. Aria label for page navigation.
      */
-    allyLabelPage?: string;
+    allyLabelPage?: string | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `intl.prev` instead. Aria label for previous page icon.
      */
-    allyLabelPrev?: string;
+    allyLabelPrev?: string | undefined;
     /**
      * Override the default wordings that are used for aria-labels on the next/prev and page buttons.
      */
-    intl?: PaginationInternationalization;
+    intl?: PaginationInternationalization | undefined;
     /**
      * The total count of items which should be shown per page.
      */
-    itemsPerPage?: number;
+    itemsPerPage?: number | undefined;
     /**
      * The maximum number of page links rendered.
      */
-    maxNumberOfPageLinks?: BreakpointCustomizable<PaginationMaxNumberOfPageLinks>;
+    maxNumberOfPageLinks?: BreakpointCustomizable<7 | 5> | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `update` event instead. Emitted when the page changes.
      */
-    onPageChange?: (event: CustomEvent<PaginationUpdateEvent>) => void;
+    onPageChange?: ((event: CustomEvent<PaginationUpdateEvent>) => void) | undefined;
     /**
      * Emitted when the page changes.
      */
-    onUpdate?: (event: CustomEvent<PaginationUpdateEvent>) => void;
+    onUpdate?: ((event: CustomEvent<PaginationUpdateEvent>) => void) | undefined;
     /**
      * Show or hide the button to jump to the last page.
      */
-    showLastPage?: boolean;
+    showLastPage?: boolean | undefined;
     /**
      * Adapts the color when used on dark background.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
     /**
      * The total count of items.
      */

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SelectedAriaAttributes, PopoverAriaAttribute, PopoverDirection, Theme } from '../types';
 export type PPopoverProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -22,19 +22,19 @@ export declare const PPopover: import("react").ForwardRefExoticComponent<Omit<HT
     /**
      * Add ARIA attributes.
      */
-    aria?: SelectedAriaAttributes<PopoverAriaAttribute>;
+    aria?: SelectedAriaAttributes<"aria-label"> | undefined;
     /**
      * Descriptive text to show additional information when popover is open
      */
-    description?: string;
+    description?: string | undefined;
     /**
      * Preferred direction in which popover should open, given there is enough space in viewport. Otherwise, it will be opened in the direction with most available space.
      */
-    direction?: PopoverDirection;
+    direction?: "top" | "bottom" | "left" | "right" | undefined;
     /**
      * Adapts the popover color depending on the theme.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { BreakpointCustomizable, RadioButtonWrapperState, Theme } from '../types';
 export type PRadioButtonWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -26,23 +26,23 @@ export declare const PRadioButtonWrapper: import("react").ForwardRefExoticCompon
     /**
      * Show or hide label. For better accessibility it's recommended to show the label.
      */
-    hideLabel?: BreakpointCustomizable<boolean>;
+    hideLabel?: BreakpointCustomizable<boolean> | undefined;
     /**
      * The label text.
      */
-    label?: string;
+    label?: string | undefined;
     /**
      * The message styled depending on validation state.
      */
-    message?: string;
+    message?: string | undefined;
     /**
      * The validation state.
      */
-    state?: RadioButtonWrapperState;
+    state?: "none" | "success" | "error" | undefined;
     /**
      * Adapts the color depending on the theme.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { ScrollerAlignScrollIndicator, SelectedAriaAttributes, ScrollerAriaAttribute, ScrollerGradientColor, ScrollerGradientColorScheme, ScrollerScrollIndicatorPosition, ScrollerScrollToPosition, Theme } from '../types';
 export type PScrollerProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -38,35 +38,35 @@ export declare const PScroller: import("react").ForwardRefExoticComponent<Omit<H
     /**
      * Sets the vertical position of scroll indicator.
      */
-    alignScrollIndicator?: ScrollerAlignScrollIndicator;
+    alignScrollIndicator?: "center" | "top" | undefined;
     /**
      * Add ARIA role.
      */
-    aria?: SelectedAriaAttributes<ScrollerAriaAttribute>;
+    aria?: SelectedAriaAttributes<"role"> | undefined;
     /**
      * Adapts the background gradient color of prev and next button.
      */
-    gradientColor?: ScrollerGradientColor;
+    gradientColor?: "background-base" | "background-surface" | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `gradientColor` instead. Adapts the background gradient color of prev and next button.
      */
-    gradientColorScheme?: ScrollerGradientColorScheme;
+    gradientColorScheme?: "default" | "surface" | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `alignScrollIndicator` instead. Sets the vertical position of scroll indicator
      */
-    scrollIndicatorPosition?: ScrollerScrollIndicatorPosition;
+    scrollIndicatorPosition?: "center" | "top" | undefined;
     /**
      * Scrolls the scroll area to the left either smooth or immediately.
      */
-    scrollToPosition?: ScrollerScrollToPosition;
+    scrollToPosition?: ScrollerScrollToPosition | undefined;
     /**
      * Specifies if scrollbar should be shown.
      */
-    scrollbar?: boolean;
+    scrollbar?: boolean | undefined;
     /**
      * Adapts the color when used on dark background.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SegmentedControlItemIcon } from '../types';
 export type PSegmentedControlItemProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -26,19 +26,19 @@ export declare const PSegmentedControlItem: import("react").ForwardRefExoticComp
     /**
      * Disables the button. No events will be triggered while disabled state is active.
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
      * The icon shown.
      */
-    icon?: SegmentedControlItemIcon;
+    icon?: import("../types").LinkButtonIconName | undefined;
     /**
      * A URL path to a custom icon.
      */
-    iconSource?: string;
+    iconSource?: string | undefined;
     /**
      * The label text.
      */
-    label?: string;
+    label?: string | undefined;
     /**
      * The value of this item which is emitted by the parent element if it becomes selected. This property is **required**.
      */

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SegmentedControlBackgroundColor, SegmentedControlUpdateEvent, Theme } from '../types';
 export type PSegmentedControlProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -26,23 +26,23 @@ export declare const PSegmentedControl: import("react").ForwardRefExoticComponen
     /**
      * @deprecated since v3.0.0, will be removed with next major release. Background color variations
      */
-    backgroundColor?: SegmentedControlBackgroundColor;
+    backgroundColor?: "background-surface" | "background-default" | undefined;
     /**
      * @deprecated since v3.0.0, will be removed with next major release, use `update` event instead. Emitted when selected element changes.
      */
-    onSegmentedControlChange?: (event: CustomEvent<SegmentedControlUpdateEvent>) => void;
+    onSegmentedControlChange?: ((event: CustomEvent<SegmentedControlUpdateEvent>) => void) | undefined;
     /**
      * Emitted when selected element changes.
      */
-    onUpdate?: (event: CustomEvent<SegmentedControlUpdateEvent>) => void;
+    onUpdate?: ((event: CustomEvent<SegmentedControlUpdateEvent>) => void) | undefined;
     /**
      * Adapts the segmented-control color depending on the theme.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
     /**
      * Sets the initial value of the segmented-control.
      */
-    value?: string | number;
+    value?: string | number | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import type { SelectWrapperDropdownDirection, BreakpointCustomizable, SelectWrapperState, Theme } from '../types';
 export type PSelectWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
@@ -42,39 +42,39 @@ export declare const PSelectWrapper: import("react").ForwardRefExoticComponent<O
     /**
      * The description text.
      */
-    description?: string;
+    description?: string | undefined;
     /**
      * Changes the direction to which the dropdown list appears.
      */
-    dropdownDirection?: SelectWrapperDropdownDirection;
+    dropdownDirection?: "auto" | "down" | "up" | undefined;
     /**
      * Filters select options by typing a character
      */
-    filter?: boolean;
+    filter?: boolean | undefined;
     /**
      * Show or hide label. For better accessibility it is recommended to show the label.
      */
-    hideLabel?: BreakpointCustomizable<boolean>;
+    hideLabel?: BreakpointCustomizable<boolean> | undefined;
     /**
      * The label text.
      */
-    label?: string;
+    label?: string | undefined;
     /**
      * The message styled depending on validation state.
      */
-    message?: string;
+    message?: string | undefined;
     /**
      * Forces rendering of native browser select dropdown
      */
-    native?: boolean;
+    native?: boolean | undefined;
     /**
      * The validation state.
      */
-    state?: SelectWrapperState;
+    state?: "none" | "success" | "error" | undefined;
     /**
      * Adapts the select color depending on the theme.
      */
-    theme?: Theme;
+    theme?: "light" | "dark" | undefined;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;