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

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

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
-import type { SelectedAriaAttributes, ModalAriaAttribute, ModalBackdrop, BreakpointCustomizable, Theme } from '../types';
+import type { SelectedAriaAttributes, ModalAriaAttribute, ModalBackdrop, BreakpointCustomizable, ModalMotionHiddenEndEventDetail, ModalMotionVisibleEndEventDetail, Theme } from '../types';
 export type PModalProps = BaseProps & {
     /**
      * Add ARIA attributes.
@@ -39,6 +38,14 @@ export type PModalProps = BaseProps & {
      * Emitted when the component requests to be dismissed.
      */
     onDismiss?: (event: CustomEvent<void>) => void;
+    /**
+     * Emitted when the modal is closed and the transition is finished.
+     */
+    onMotionHiddenEnd?: (event: CustomEvent<ModalMotionHiddenEndEventDetail>) => void;
+    /**
+     * Emitted when the modal is opened and the transition is finished.
+     */
+    onMotionVisibleEnd?: (event: CustomEvent<ModalMotionVisibleEndEventDetail>) => void;
     /**
      * If true, the modal is open.
      */
@@ -86,6 +93,14 @@ export declare const PModal: import("react").ForwardRefExoticComponent<import("r
      * Emitted when the component requests to be dismissed.
      */
     onDismiss?: (event: CustomEvent<void>) => void;
+    /**
+     * Emitted when the modal is closed and the transition is finished.
+     */
+    onMotionHiddenEnd?: (event: CustomEvent<ModalMotionHiddenEndEventDetail>) => void;
+    /**
+     * Emitted when the modal is opened and the transition is finished.
+     */
+    onMotionVisibleEnd?: (event: CustomEvent<ModalMotionVisibleEndEventDetail>) => void;
     /**
      * If true, the modal is open.
      */
@@ -95,5 +110,5 @@ export declare const PModal: import("react").ForwardRefExoticComponent<import("r
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { ModelSignatureColor, ModelSignatureFetchPriority, ModelSignatureModel, ModelSignatureSize, Theme } from '../types';
 export type PModelSignatureProps = BaseProps & {
@@ -61,5 +60,5 @@ export declare const PModelSignature: import("react").ForwardRefExoticComponent<
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PMultiSelectOptionProps = BaseProps & {
     /**
@@ -20,5 +19,5 @@ export declare const PMultiSelectOption: import("react").ForwardRefExoticCompone
      */
     value: string;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { MultiSelectDropdownDirection, BreakpointCustomizable, MultiSelectUpdateEventDetail, MultiSelectState, Theme } from '../types';
 export type PMultiSelectProps = BaseProps & {
@@ -101,5 +100,5 @@ export declare const PMultiSelect: import("react").ForwardRefExoticComponent<imp
      */
     value?: string[];
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/optgroup.wrapper.d.ts

@@ -0,0 +1,23 @@
+import type { BaseProps } from '../../BaseProps';
+export type POptgroupProps = BaseProps & {
+    /**
+     * Disables the optgroup.
+     */
+    disabled?: boolean;
+    /**
+     * The optgroup label.
+     */
+    label?: string;
+};
+export declare const POptgroup: 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 optgroup.
+     */
+    disabled?: boolean;
+    /**
+     * The optgroup label.
+     */
+    label?: string;
+} & {
+    children?: import("react").ReactNode | undefined;
+} & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { PaginationInternationalization, BreakpointCustomizable, PaginationMaxNumberOfPageLinks, PaginationUpdateEventDetail, Theme } from '../types';
 export type PPaginationProps = BaseProps & {

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, PinCodeLength, PinCodeUpdateEventDetail, PinCodeState, Theme, PinCodeType } from '../types';
 export type PPinCodeProps = BaseProps & {
@@ -117,5 +116,5 @@ export declare const PPinCode: import("react").ForwardRefExoticComponent<import(
      */
     value?: string;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, PopoverAriaAttribute, PopoverDirection, Theme } from '../types';
 export type PPopoverProps = BaseProps & {
@@ -37,5 +36,5 @@ export declare const PPopover: import("react").ForwardRefExoticComponent<import(
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, RadioButtonWrapperState, Theme } from '../types';
 export type PRadioButtonWrapperProps = BaseProps & {
@@ -53,5 +52,5 @@ export declare const PRadioButtonWrapper: import("react").ForwardRefExoticCompon
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { ScrollerAlignScrollIndicator, SelectedAriaAttributes, ScrollerAriaAttribute, ScrollerGradientColor, ScrollerGradientColorScheme, ScrollerScrollIndicatorPosition, ScrollerScrollToPosition, Theme } from '../types';
 export type PScrollerProps = BaseProps & {
@@ -69,5 +68,5 @@ export declare const PScroller: import("react").ForwardRefExoticComponent<import
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, SegmentedControlItemAriaAttribute, SegmentedControlItemIcon } from '../types';
 export type PSegmentedControlItemProps = BaseProps & {
@@ -53,5 +52,5 @@ export declare const PSegmentedControlItem: import("react").ForwardRefExoticComp
      */
     value: string | number;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SegmentedControlBackgroundColor, BreakpointCustomizable, SegmentedControlColumns, SegmentedControlUpdateEventDetail, Theme } from '../types';
 export type PSegmentedControlProps = BaseProps & {
@@ -53,5 +52,5 @@ export declare const PSegmentedControl: import("react").ForwardRefExoticComponen
      */
     value?: string | number;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PSelectOptionProps = BaseProps & {
     /**
@@ -20,5 +19,5 @@ export declare const PSelectOption: import("react").ForwardRefExoticComponent<im
      */
     value?: string;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectWrapperDropdownDirection, SelectWrapperState, Theme } from '../types';
 export type PSelectWrapperDropdownProps = BaseProps & {

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectWrapperDropdownDirection, BreakpointCustomizable, SelectWrapperState, Theme } from '../types';
 export type PSelectWrapperProps = BaseProps & {
@@ -77,5 +76,5 @@ export declare const PSelectWrapper: import("react").ForwardRefExoticComponent<i
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectDropdownDirection, BreakpointCustomizable, SelectUpdateEventDetail, SelectState, Theme } from '../types';
 export type PSelectProps = BaseProps & {
@@ -101,5 +100,5 @@ export declare const PSelect: import("react").ForwardRefExoticComponent<import("
      */
     value?: string;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, SpinnerAriaAttribute, BreakpointCustomizable, SpinnerSize, Theme } from '../types';
 export type PSpinnerProps = BaseProps & {

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { StepperHorizontalItemState } from '../types';
 export type PStepperHorizontalItemProps = BaseProps & {
@@ -21,5 +20,5 @@ export declare const PStepperHorizontalItem: import("react").ForwardRefExoticCom
      */
     state?: StepperHorizontalItemState;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { StepperHorizontalUpdateEventDetail, BreakpointCustomizable, StepperHorizontalSize, Theme } from '../types';
 export type PStepperHorizontalProps = BaseProps & {
@@ -37,5 +36,5 @@ export declare const PStepperHorizontal: import("react").ForwardRefExoticCompone
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, SwitchAlignLabel, SwitchUpdateEventDetail, Theme } from '../types';
 export type PSwitchProps = BaseProps & {
@@ -77,5 +76,5 @@ export declare const PSwitch: import("react").ForwardRefExoticComponent<import("
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,6 +1,5 @@
-/// <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;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PTableCellProps = BaseProps & {
     /**
@@ -12,5 +11,5 @@ export declare const PTableCell: import("react").ForwardRefExoticComponent<impor
      */
     multiline?: boolean;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TableHeadCellSort } from '../types';
 export type PTableHeadCellProps = BaseProps & {
@@ -29,5 +28,5 @@ export declare const PTableHeadCell: import("react").ForwardRefExoticComponent<i
      */
     sort?: TableHeadCellSort;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,6 +1,5 @@
-/// <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;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PTableHeadProps = BaseProps & {};
 export declare const PTableHead: 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;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PTableRowProps = BaseProps & {};
 export declare const PTableRow: 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;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/table.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TableUpdateEventDetail, Theme } from '../types';
 export type PTableProps = BaseProps & {
@@ -37,5 +36,5 @@ export declare const PTable: import("react").ForwardRefExoticComponent<import("r
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/tabs-bar.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TabsBarGradientColor, TabsBarGradientColorScheme, TabsBarUpdateEventDetail, BreakpointCustomizable, TabsBarSize, Theme, TabsBarWeight } from '../types';
 export type PTabsBarProps = BaseProps & {
@@ -69,5 +68,5 @@ export declare const PTabsBar: import("react").ForwardRefExoticComponent<import(
      */
     weight?: TabsBarWeight;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/tabs-item.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PTabsItemProps = BaseProps & {
     /**
@@ -12,5 +11,5 @@ export declare const PTabsItem: import("react").ForwardRefExoticComponent<import
      */
     label: string;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/tabs.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TabsGradientColor, TabsGradientColorScheme, TabsUpdateEventDetail, BreakpointCustomizable, TabsSize, Theme, TabsWeight } from '../types';
 export type PTabsProps = BaseProps & {
@@ -69,5 +68,5 @@ export declare const PTabs: import("react").ForwardRefExoticComponent<import("re
      */
     weight?: TabsWeight;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/tag-dismissible.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, TagDismissibleAriaAttribute, TagDismissibleColor, Theme } from '../types';
 export type PTagDismissibleProps = BaseProps & {
@@ -37,5 +36,5 @@ export declare const PTagDismissible: import("react").ForwardRefExoticComponent<
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/tag.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TagColor, TagIcon, Theme } from '../types';
 export type PTagProps = BaseProps & {
@@ -6,6 +5,10 @@ export type PTagProps = BaseProps & {
      * Background color variations depending on theme property.
      */
     color?: TagColor;
+    /**
+     * Displays as compact version.
+     */
+    compact?: boolean;
     /**
      * The icon shown.
      */
@@ -24,6 +27,10 @@ export declare const PTag: import("react").ForwardRefExoticComponent<import("rea
      * Background color variations depending on theme property.
      */
     color?: TagColor;
+    /**
+     * Displays as compact version.
+     */
+    compact?: boolean;
     /**
      * The icon shown.
      */
@@ -37,5 +44,5 @@ export declare const PTag: import("react").ForwardRefExoticComponent<import("rea
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/text-field-wrapper.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TextFieldWrapperActionIcon, BreakpointCustomizable, TextFieldWrapperState, Theme, TextFieldWrapperUnitPosition } from '../types';
 export type PTextFieldWrapperProps = BaseProps & {
@@ -125,5 +124,5 @@ export declare const PTextFieldWrapper: import("react").ForwardRefExoticComponen
      */
     unitPosition?: TextFieldWrapperUnitPosition;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/text-list-item.wrapper.d.ts

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 export type PTextListItemProps = BaseProps & {};
 export declare const PTextListItem: 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;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/text-list.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TextListListType, TextListOrderType, Theme, TextListType } from '../types';
 export type PTextListProps = BaseProps & {
@@ -37,5 +36,5 @@ export declare const PTextList: import("react").ForwardRefExoticComponent<import
      */
     type?: TextListType;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/text.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { TextAlign, TextColor, BreakpointCustomizable, TextSize, TextTag, Theme, TextWeight } from '../types';
 export type PTextProps = BaseProps & {
@@ -61,5 +60,5 @@ export declare const PText: import("react").ForwardRefExoticComponent<import("re
      */
     weight?: TextWeight;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/textarea-wrapper.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, TextareaWrapperState, Theme } from '../types';
 export type PTextareaWrapperProps = BaseProps & {
@@ -69,5 +68,5 @@ export declare const PTextareaWrapper: import("react").ForwardRefExoticComponent
      */
     theme?: Theme;
 } & {
-    children?: import("react").ReactNode;
+    children?: import("react").ReactNode | undefined;
 } & import("react").RefAttributes<HTMLElement>>;

package/ssr/esm/lib/components/toast.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { Theme } from '../types';
 export type PToastProps = BaseProps & {

package/ssr/esm/lib/components/wordmark.wrapper.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, WordmarkAriaAttribute, WordmarkSize, WordmarkTarget, Theme } from '../types';
 export type PWordmarkProps = BaseProps & {

package/ssr/esm/lib/dsr-components/accordion.d.ts

@@ -1,4 +1,10 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "heading", "description": "Defines the heading used in the accordion. Can be used alternatively to the heading prop. Please **refrain** from using any other than text content as slotted markup." }
+ * @slot {"name": "", "description": "Default slot for the main content" }
+ *
+ * @controlled {"props": ["open"], "event": "update"}
+ */
 export declare class DSRAccordion extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/esm/lib/dsr-components/banner.d.ts

@@ -1,4 +1,11 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "heading", "description": "Defines the heading used in the banner. Can be used alternatively to the heading prop. Can be used for rich content.", "hasAltProp": true }
+ * @slot {"name": "title", "description": "Defines the title used in the banner. Can be used alternatively to the heading prop. Can be used for rich content.", "hasAltProp": true }
+ * @slot {"name": "description", "description": "Defines the description used in the banner. Can be used alternatively to the description prop. Can be used for rich content.", "hasAltProp": true }
+ *
+ * @controlled {"props": ["open"], "event": "dismiss"}
+ */
 export declare class DSRBanner extends Component<any> {
     host: HTMLElement;
     private inlineNotificationElement;

package/ssr/esm/lib/dsr-components/button-group.d.ts

@@ -1,4 +1,7 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "", "description": "Default slot for the buttons to group." }
+ */
 export declare class DSRButtonGroup extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/esm/lib/dsr-components/button-pure.d.ts

@@ -1,4 +1,7 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "", "description": "Default slot for the button label." }
+ */
 export declare class DSRButtonPure extends Component<any> {
     host: HTMLElement;
     private get isDisabledOrLoading();

package/ssr/esm/lib/dsr-components/button-tile.d.ts

@@ -1,4 +1,8 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "header", "description": "Renders a header section above the content area." }
+ * @slot {"name": "", "description": "Default slot for the img or picture tag." }
+ */
 export declare class DSRButtonTile extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/esm/lib/dsr-components/button.d.ts

@@ -1,4 +1,7 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "", "description": "Default slot for the button label." }
+ */
 export declare class DSRButton extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/esm/lib/dsr-components/canvas.d.ts

@@ -1,5 +1,16 @@
 import { Component } from 'react';
-/** @experimental */
+/**
+ * @slot {"name": "header", "description": "Renders a **sticky** header section above the content area." }
+ * @slot {"name": "", "description": "Default slot for the main content" }
+ * @slot {"name": "footer", "description": "Shows a footer section, flowing under the content area when scrollable." }
+ * @slot {"name": "sidebar-start", "description": "Shows a sidebar area on the **start** side (**left** in **LTR** mode / **right** in **RTL** mode). On mobile view it transforms into a flyout." }
+ * @slot {"name": "sidebar-end", "description": "Shows a sidebar area on the **end** side (**right** in **LTR** mode / **left** in **RTL** mode). On mobile view it transforms into a flyout." }
+ *
+ * @controlled {"props": ["sidebarStartOpen"], "event": "dismissSidebarStart"}
+ * @controlled {"props": ["sidebarEndOpen"], "event": "dismissSidebarEnd"}
+ *
+ * @experimental
+ */
 export declare class DSRCanvas extends Component<any> {
     host: HTMLElement;
     private isDesktopView;

package/ssr/esm/lib/dsr-components/carousel.d.ts

@@ -1,4 +1,12 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "heading", "description": "Renders a heading above the carousel." }
+ * @slot {"name": "description", "description": "Shows a footer section, flowing under the content area when scrollable." }
+ * @slot {"name": "controls", "description": "Shows a sidebar area on the **start** side (**left** in **LTR** mode / **right** in **RTL** mode). On mobile view it transforms into a flyout." }
+ * @slot {"name": "", "description": "Default slot for the carousel slides." }
+ *
+ * @controlled { "props": ["activeSlideIndex"], "event": "update", "isInternallyMutated": true }
+ */
 export declare class DSRCarousel extends Component<any> {
     host: HTMLElement;
     private amountOfPages;

package/ssr/esm/lib/dsr-components/checkbox-wrapper.d.ts

@@ -1,4 +1,9 @@
 import { Component } from 'react';
+/**
+ * @slot {"name": "label", "description": "Shows a label. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed." }
+ * @slot {"name": "", "description": "Default slot for the input." }
+ * @slot {"name": "message", "description": "Shows a state message. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed." }
+ */
 export declare class DSRCheckboxWrapper extends Component<any> {
     host: HTMLElement;
     private input;