@porsche-design-system/components-react 2.20.0 → 3.0.0-alpha.1

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

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from 'react';
-import type { TabGradientColorTheme, TabChangeEvent, BreakpointCustomizable, TabSize, ThemeExtendedElectric, TabWeight } from '../types';
+import type { TabGradientColorTheme, TabChangeEvent, BreakpointCustomizable, TabSize, Theme, TabWeight } from '../types';
 export type PTabsBarProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines which tab to be visualized as selected (zero-based numbering), undefined if none should be selected.
@@ -20,7 +20,7 @@ export type PTabsBarProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Adapts the color when used on dark background.
      */
-    theme?: ThemeExtendedElectric;
+    theme?: Theme;
     /**
      * The text weight.
      */
@@ -46,7 +46,7 @@ export declare const PTabsBar: import("react").ForwardRefExoticComponent<Omit<HT
     /**
      * Adapts the color when used on dark background.
      */
-    theme?: ThemeExtendedElectric;
+    theme?: Theme;
     /**
      * The text weight.
      */

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

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from 'react';
-import type { TabGradientColorTheme, TabChangeEvent, BreakpointCustomizable, TabSize, ThemeExtendedElectric, TabWeight } from '../types';
+import type { TabGradientColorTheme, TabChangeEvent, BreakpointCustomizable, TabSize, Theme, TabWeight } from '../types';
 export type PTabsProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Defines which tab to be visualized as selected (zero-based numbering).
@@ -20,7 +20,7 @@ export type PTabsProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Adapts the color when used on dark background.
      */
-    theme?: ThemeExtendedElectric;
+    theme?: Theme;
     /**
      * The text weight.
      */
@@ -46,7 +46,7 @@ export declare const PTabs: import("react").ForwardRefExoticComponent<Omit<HTMLA
     /**
      * Adapts the color when used on dark background.
      */
-    theme?: ThemeExtendedElectric;
+    theme?: Theme;
     /**
      * The text weight.
      */

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

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from 'react';
-import type { SelectedAriaAttributes, TagDismissibleAriaAttribute, TagDismissibleColor } from '../types';
+import type { SelectedAriaAttributes, TagDismissibleAriaAttribute, TagDismissibleColor, Theme } from '../types';
 export type PTagDismissibleProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Add ARIA attributes.
@@ -13,6 +13,10 @@ export type PTagDismissibleProps = Omit<HTMLAttributes<{}>, 'color'> & {
      * The label text.
      */
     label?: string;
+    /**
+     * Adapts the color when used on dark background.
+     */
+    theme?: Theme;
 };
 export declare const PTagDismissible: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
@@ -27,6 +31,10 @@ export declare const PTagDismissible: import("react").ForwardRefExoticComponent<
      * The label text.
      */
     label?: string;
+    /**
+     * Adapts the color when used on dark background.
+     */
+    theme?: Theme;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from 'react';
-import type { IconName, BreakpointCustomizable, FormState, TextFieldWrapperUnitPosition } from '../types';
+import type { IconName, BreakpointCustomizable, FormState, Theme, TextFieldWrapperUnitPosition } from '../types';
 export type PTextFieldWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * Action icon can be set to `locate` for `input type="search"` in order to display an action button.
@@ -37,6 +37,10 @@ export type PTextFieldWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
      * The validation state.
      */
     state?: FormState;
+    /**
+     * Adapts the color depending on the theme.
+     */
+    theme?: Theme;
     /**
      * The unit text.
      */
@@ -83,6 +87,10 @@ export declare const PTextFieldWrapper: import("react").ForwardRefExoticComponen
      * The validation state.
      */
     state?: FormState;
+    /**
+     * Adapts the color depending on the theme.
+     */
+    theme?: Theme;
     /**
      * The unit text.
      */

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

@@ -18,7 +18,7 @@ export type PTextProps = Omit<HTMLAttributes<{}>, 'color'> & {
      */
     size?: BreakpointCustomizable<TextSize>;
     /**
-     * Sets a custom HTML tag depending of the usage of the text component.
+     * Sets a custom HTML tag depending on the usage of the text component.
      */
     tag?: TextTag;
     /**
@@ -48,7 +48,7 @@ export declare const PText: import("react").ForwardRefExoticComponent<Omit<HTMLA
      */
     size?: BreakpointCustomizable<TextSize>;
     /**
-     * Sets a custom HTML tag depending of the usage of the text component.
+     * Sets a custom HTML tag depending on the usage of the text component.
      */
     tag?: TextTag;
     /**

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

@@ -1,5 +1,5 @@
 import { HTMLAttributes } from 'react';
-import type { BreakpointCustomizable, FormState } from '../types';
+import type { BreakpointCustomizable, FormState, Theme } from '../types';
 export type PTextareaWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
     /**
      * The description text.
@@ -25,6 +25,10 @@ export type PTextareaWrapperProps = Omit<HTMLAttributes<{}>, 'color'> & {
      * The validation state.
      */
     state?: FormState;
+    /**
+     * Adapts the color depending on the theme.
+     */
+    theme?: Theme;
 };
 export declare const PTextareaWrapper: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<{}>, "color"> & {
     /**
@@ -51,6 +55,10 @@ export declare const PTextareaWrapper: import("react").ForwardRefExoticComponent
      * The validation state.
      */
     state?: FormState;
+    /**
+     * Adapts the color depending on the theme.
+     */
+    theme?: Theme;
 } & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<HTMLElement>>;

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

@@ -1,6 +1,5 @@
 import { Component } from 'react';
 export declare class DSRButton extends Component<any> {
     host: HTMLElement;
-    private get isDisabledOrLoading();
     render(): JSX.Element;
 }

package/ssr/lib/dsr-components/content-wrapper.d.ts

@@ -1,4 +1,5 @@
 import { Component } from 'react';
+/** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Grid instead. */
 export declare class DSRContentWrapper extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/lib/dsr-components/display.d.ts

@@ -0,0 +1,5 @@
+import { Component } from 'react';
+export declare class DSRDisplay extends Component<any> {
+    host: HTMLElement;
+    render(): JSX.Element;
+}

package/ssr/lib/dsr-components/flex-item.d.ts

@@ -1,4 +1,5 @@
 import { Component } from 'react';
+/** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Flex instead. */
 export declare class DSRFlexItem extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/lib/dsr-components/flex.d.ts

@@ -1,4 +1,5 @@
 import { Component } from 'react';
+/** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Flex instead. */
 export declare class DSRFlex extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/lib/dsr-components/grid-item.d.ts

@@ -1,6 +1,6 @@
 import { Component } from 'react';
-import type { GridItemInternalHTMLProps } from '@porsche-design-system/components/dist/utils';
+/** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Grid instead. */
 export declare class DSRGridItem extends Component<any> {
-    host: HTMLElement & GridItemInternalHTMLProps;
+    host: HTMLElement;
     render(): JSX.Element;
 }

package/ssr/lib/dsr-components/grid.d.ts

@@ -1,4 +1,5 @@
 import { Component } from 'react';
+/** @deprecated since v3.0.0, will be removed with next major release. Use native CSS Grid instead. */
 export declare class DSRGrid extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/lib/dsr-components/heading.d.ts

@@ -0,0 +1,5 @@
+import { Component } from 'react';
+export declare class DSRHeading extends Component<any> {
+    host: HTMLElement;
+    render(): JSX.Element;
+}

package/ssr/lib/dsr-components/headline.d.ts

@@ -1,4 +1,5 @@
 import { Component } from 'react';
+/** @deprecated since v3.0.0, will be removed with next major release. Please use "p-heading" instead. */
 export declare class DSRHeadline extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/lib/dsr-components/icon.d.ts

@@ -1,8 +1,5 @@
 import { Component } from 'react';
 export declare class DSRIcon extends Component<any> {
     host: HTMLElement;
-    private intersectionObserver?;
-    private key;
-    private svgContent;
     render(): JSX.Element;
 }

package/ssr/lib/dsr-components/link-social.d.ts

@@ -1,4 +1,5 @@
 import { Component } from 'react';
+/** @deprecated since v3.0.0, will be removed with next major release. Use `p-link` with corresponding social instead. */
 export declare class DSRLinkSocial extends Component<any> {
     host: HTMLElement;
     render(): JSX.Element;

package/ssr/lib/dsr-components/state-message.d.ts

@@ -3,6 +3,7 @@ type StateMessageProps = {
     id?: string;
     state: any;
     message: string;
+    theme: any;
     host: HTMLElement;
 };
 export declare const StateMessage: FC<StateMessageProps>;

package/ssr/lib/dsr-components/switch.d.ts

@@ -4,6 +4,5 @@ export type SwitchChangeEvent = {
 };
 export declare class DSRSwitch extends Component<any> {
     host: HTMLElement;
-    private get isDisabledOrLoading();
     render(): JSX.Element;
 }

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

@@ -5,6 +5,5 @@ export declare class DSRTextareaWrapper extends Component<any> {
     private counterElement;
     private ariaElement;
     private hasCounter;
-    private isCounterVisible;
     render(): JSX.Element;
 }