@porsche-design-system/components-vue 3.10.0-rc.2 → 3.10.0-rc.4

package/CHANGELOG.md

@@ -14,6 +14,74 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### [Unreleased]
 
+### [3.10.0-rc.4] - 2024-01-15
+
+#### Added
+
+- `Icon`: Auto-flipping icons (certain ones only) in RTL (right-to-left) mode
+  ([#2957](https://github.com/porsche-design-system/porsche-design-system/pull/2957))
+- `Carousel`: Prop `heading-size`, named slot `header`
+  ([#2915](https://github.com/porsche-design-system/porsche-design-system/pull/2915))
+- `Accordion`: support for custom click area for `compact` variant
+  ([#2920](https://github.com/porsche-design-system/porsche-design-system/pull/2920))
+- `@font-face` supports Middle East languages
+  ([#2946](https://github.com/porsche-design-system/porsche-design-system/pull/2946))
+- Partials: `getFontLinks` supports preloading `arabic`, `pashto` and `urdu` subsets
+  ([#2946](https://github.com/porsche-design-system/porsche-design-system/pull/2946))
+
+#### Changed
+
+- `Flyout Navigation`: Improved validation and `activeIdentifier` isn't automatically updated anymore
+  ([#2935](https://github.com/porsche-design-system/porsche-design-system/pull/2935))
+- `Carousel`: Position and width of heading and description
+  ([#2915](https://github.com/porsche-design-system/porsche-design-system/pull/2915))
+- `Model Signature` asset for `model="macan"`
+- Aligned naming of all `CustomEvent<T>` types and deprecated old ones since they are in fact typing the `detail: T`
+  property of the event
+
+```diff
+- AccordionUpdateEvent
++ AccordionUpdateEventDetail
+- CarouselUpdateEvent
++ CarouselUpdateEventDetail
+- FlyoutNavigationUpdateEvent
++ FlyoutNavigationUpdateEventDetail
+- LinkTileProductLikeEvent
++ LinkTileProductLikeEventDetail
+- MultiSelectUpdateEvent
++ MultiSelectUpdateEventDetail
+- PaginationUpdateEvent
++ PaginationUpdateEventDetail
+- PinCodeUpdateEvent
++ PinCodeUpdateEventDetail
+- SegmentedControlUpdateEvent
++ SegmentedControlUpdateEventDetail
+- StepperHorizontalUpdateEvent
++ StepperHorizontalUpdateEventDetail
+- SwitchUpdateEvent
++ SwitchUpdateEventDetail
+- TableUpdateEvent
++ TableUpdateEventDetail
+- TabsUpdateEvent
++ TabsUpdateEventDetail
+- TabsBarUpdateEvent
++ TabsBarUpdateEventDetail
+```
+
+#### Fixed
+
+- `Pin Code`: Focus correct input when clicking on label
+  ([#2985](https://github.com/porsche-design-system/porsche-design-system/pull/2985))
+- `Flyout Navigation`: Focus dismiss button after opening
+  ([#2935](https://github.com/porsche-design-system/porsche-design-system/pull/2935))
+- `Accordion`: Alignment of slotted heading with custom padding
+  ([#2920](https://github.com/porsche-design-system/porsche-design-system/pull/2920))
+- `Modal`: Scrollbar is hidden ([#2907](https://github.com/porsche-design-system/porsche-design-system/pull/2907))
+- `Toast`: `max-width` when used in scale mode
+  ([#2960](https://github.com/porsche-design-system/porsche-design-system/pull/2960))
+
+### [3.10.0-rc.3] - 2023-12-12
+
 ### [3.10.0-rc.2] - 2023-12-12
 
 ### [3.10.0-rc.1] - 2023-12-11

package/cjs/lib/components/CarouselWrapper.vue.cjs

@@ -1 +1 @@
-"use strict";const e=require("vue"),t=require("../../utils.cjs"),l=e.defineComponent({__name:"CarouselWrapper",props:{activeSlideIndex:{default:0},alignHeader:{default:"start"},description:{},disablePagination:{},heading:{},intl:{},pagination:{default:!0},rewind:{type:Boolean,default:!0},skipLinkTarget:{},slidesPerPage:{default:1},theme:{},width:{default:"basic"},wrapContent:{type:Boolean}},emits:["carouselChange","update"],setup(d,{emit:c}){const p=t.usePrefix("p-carousel"),o=d,n=e.ref(),r=c,s=e.inject(t.themeInjectionKey),i=()=>t.syncProperties(n,{...o,theme:o.theme||s.value});return e.onMounted(()=>{i(),t.addEventListenerToElementRef(n,"carouselChange",r),t.addEventListenerToElementRef(n,"update",r)}),e.onUpdated(i),e.watch(s,a=>{t.syncProperties(n,{theme:o.theme||a})}),(a,u)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(p)),{ref_key:"pdsComponentRef",ref:n},{default:e.withCtx(()=>[e.renderSlot(a.$slots,"default")]),_:3},512))}});module.exports=l;
+"use strict";const e=require("vue"),t=require("../../utils.cjs"),p=e.defineComponent({__name:"CarouselWrapper",props:{activeSlideIndex:{default:0},alignHeader:{default:"start"},aria:{},description:{},disablePagination:{},heading:{},headingSize:{default:"x-large"},intl:{},pagination:{default:!0},rewind:{type:Boolean,default:!0},skipLinkTarget:{},slidesPerPage:{default:1},theme:{},width:{default:"basic"},wrapContent:{type:Boolean}},emits:["carouselChange","update"],setup(d,{emit:l}){const c=t.usePrefix("p-carousel"),a=d,n=e.ref(),r=l,s=e.inject(t.themeInjectionKey),i=()=>t.syncProperties(n,{...a,theme:a.theme||s.value});return e.onMounted(()=>{i(),t.addEventListenerToElementRef(n,"carouselChange",r),t.addEventListenerToElementRef(n,"update",r)}),e.onUpdated(i),e.watch(s,o=>{t.syncProperties(n,{theme:a.theme||o})}),(o,u)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(c)),{ref_key:"pdsComponentRef",ref:n},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"default")]),_:3},512))}});module.exports=p;

package/esm/lib/components/AccordionWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { AccordionUpdateEvent, BreakpointCustomizable, AccordionSize, AccordionTag, Theme } from '../types';
+import type { BreakpointCustomizable, AccordionSize, AccordionTag, Theme } from '../types';
 type PAccordionProps = {
     /**
      * Displays the Accordion as compact version with thinner border and smaller paddings.
@@ -29,14 +29,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     size: string;
     tag: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    accordionChange: (value: AccordionUpdateEvent) => void;
-    update: (value: AccordionUpdateEvent) => void;
+    accordionChange: (value: import("../types").AccordionUpdateEvent) => void;
+    update: (value: import("../types").AccordionUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PAccordionProps>, {
     size: string;
     tag: string;
 }>>> & {
-    onAccordionChange?: ((value: AccordionUpdateEvent) => any) | undefined;
-    onUpdate?: ((value: AccordionUpdateEvent) => any) | undefined;
+    onAccordionChange?: ((value: import("../types").AccordionUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").AccordionUpdateEvent) => any) | undefined;
 }, {
     size: BreakpointCustomizable<"small" | "medium">;
     tag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";

package/esm/lib/components/ButtonPureWrapper.vue.d.ts

@@ -88,7 +88,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     weight: "regular" | "semi-bold" | "bold" | "thin" | "semibold";
     stretch: BreakpointCustomizable<boolean>;
     type: "button" | "reset" | "submit";
-    size: BreakpointCustomizable<"inherit" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large">;
+    size: BreakpointCustomizable<"inherit" | "small" | "medium" | "large" | "x-large" | "xx-small" | "x-small">;
     active: boolean;
     alignLabel: BreakpointCustomizable<"start" | "end" | "left" | "right">;
     disabled: boolean;

package/esm/lib/components/CarouselWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { CarouselAlignHeader, BreakpointCustomizable, CarouselInternationalization, CarouselUpdateEvent, Theme, CarouselWidth } from '../types';
+import type { CarouselAlignHeader, SelectedAriaAttributes, CarouselAriaAttribute, BreakpointCustomizable, CarouselHeadingSize, CarouselInternationalization, Theme, CarouselWidth } from '../types';
 type PCarouselProps = {
     /**
      * Defines which slide to be active (zero-based numbering).
@@ -8,6 +8,10 @@ type PCarouselProps = {
      * Alignment of heading and description
      */
     alignHeader?: CarouselAlignHeader;
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<CarouselAriaAttribute>;
     /**
      * Defines the description used in the carousel.
      */
@@ -20,6 +24,10 @@ type PCarouselProps = {
      * Defines the heading used in the carousel.
      */
     heading?: string;
+    /**
+     * Defines the heading size used in the carousel.
+     */
+    headingSize?: CarouselHeadingSize;
     /**
      * Override the default wordings that are used for aria-labels on the next/prev buttons and pagination.
      */
@@ -57,27 +65,30 @@ type PCarouselProps = {
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PCarouselProps>, {
     activeSlideIndex: number;
     alignHeader: string;
+    headingSize: string;
     pagination: boolean;
     rewind: boolean;
     slidesPerPage: number;
     width: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    carouselChange: (value: CarouselUpdateEvent) => void;
-    update: (value: CarouselUpdateEvent) => void;
+    carouselChange: (value: import("../types").CarouselUpdateEvent) => void;
+    update: (value: import("../types").CarouselUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PCarouselProps>, {
     activeSlideIndex: number;
     alignHeader: string;
+    headingSize: string;
     pagination: boolean;
     rewind: boolean;
     slidesPerPage: number;
     width: string;
 }>>> & {
-    onUpdate?: ((value: CarouselUpdateEvent) => any) | undefined;
-    onCarouselChange?: ((value: CarouselUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").CarouselUpdateEvent) => any) | undefined;
+    onCarouselChange?: ((value: import("../types").CarouselUpdateEvent) => any) | undefined;
 }, {
     width: "extended" | "basic";
     activeSlideIndex: number;
     alignHeader: "center" | "start" | "left";
+    headingSize: CarouselHeadingSize;
     pagination: BreakpointCustomizable<boolean>;
     rewind: boolean;
     slidesPerPage: BreakpointCustomizable<number>;

package/esm/lib/components/CarouselWrapper.vue.mjs

@@ -1,13 +1,15 @@
-import { defineComponent as c, ref as u, inject as m, onMounted as f, onUpdated as h, watch as C, openBlock as g, createBlock as y, resolveDynamicComponent as _, unref as w, withCtx as P, renderSlot as k } from "vue";
-import { usePrefix as v, themeInjectionKey as x, addEventListenerToElementRef as s, syncProperties as i } from "../../utils.mjs";
-const T = /* @__PURE__ */ c({
+import { defineComponent as c, ref as u, inject as f, onMounted as m, onUpdated as h, watch as g, openBlock as C, createBlock as y, resolveDynamicComponent as _, unref as w, withCtx as P, renderSlot as k } from "vue";
+import { usePrefix as x, themeInjectionKey as v, addEventListenerToElementRef as i, syncProperties as s } from "../../utils.mjs";
+const S = /* @__PURE__ */ c({
   __name: "CarouselWrapper",
   props: {
     activeSlideIndex: { default: 0 },
     alignHeader: { default: "start" },
+    aria: {},
     description: {},
     disablePagination: {},
     heading: {},
+    headingSize: { default: "x-large" },
     intl: {},
     pagination: { default: !0 },
     rewind: { type: Boolean, default: !0 },
@@ -18,13 +20,13 @@ const T = /* @__PURE__ */ c({
     wrapContent: { type: Boolean }
   },
   emits: ["carouselChange", "update"],
-  setup(p, { emit: d }) {
-    const l = v("p-carousel"), t = p, e = u(), o = d, a = m(x), r = () => i(e, { ...t, theme: t.theme || a.value });
-    return f(() => {
-      r(), s(e, "carouselChange", o), s(e, "update", o);
-    }), h(r), C(a, (n) => {
-      i(e, { theme: t.theme || n });
-    }), (n, B) => (g(), y(_(w(l)), {
+  setup(d, { emit: p }) {
+    const l = x("p-carousel"), t = d, e = u(), a = p, o = f(v), r = () => s(e, { ...t, theme: t.theme || o.value });
+    return m(() => {
+      r(), i(e, "carouselChange", a), i(e, "update", a);
+    }), h(r), g(o, (n) => {
+      s(e, { theme: t.theme || n });
+    }), (n, B) => (C(), y(_(w(l)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, {
@@ -36,5 +38,5 @@ const T = /* @__PURE__ */ c({
   }
 });
 export {
-  T as default
+  S as default
 };

package/esm/lib/components/CheckboxWrapperWrapper.vue.d.ts

@@ -9,7 +9,7 @@ type PCheckboxWrapperProps = {
      */
     label?: string;
     /**
-     * __Experimental__: Disables the checkbox and shows a loading indicator.
+     * @experimental Disables the checkbox and shows a loading indicator.
      */
     loading?: boolean;
     /**

package/esm/lib/components/FlyoutNavigationItemWrapper.vue.d.ts

@@ -1,5 +1,11 @@
 type PFlyoutNavigationItemProps = {
+    /**
+     * Unique identifier which controls if this item should be shown when the active-identifier on the flyout-navigation is set to this value.
+     */
     identifier: string;
+    /**
+     * Label of the item.
+     */
     label?: string;
 };
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<PFlyoutNavigationItemProps>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<PFlyoutNavigationItemProps>>>, {}, {}>, {

package/esm/lib/components/IconWrapper.vue.d.ts

@@ -39,7 +39,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     name: string;
     size: string;
 }>>>, {
-    size: "inherit" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large";
+    size: "inherit" | "small" | "medium" | "large" | "x-large" | "xx-small" | "x-small";
     name: "list" | "copy" | "grid" | "document" | "search" | "switch" | "360" | "accessibility" | "active-cabin-ventilation" | "add" | "adjust" | "arrow-double-down" | "arrow-double-left" | "arrow-double-right" | "arrow-double-up" | "arrow-down" | "arrow-first" | "arrow-head-down" | "arrow-head-left" | "arrow-head-right" | "arrow-head-up" | "arrow-last" | "arrow-left" | "arrow-right" | "arrow-up" | "augmented-reality" | "battery-empty" | "battery-full" | "bell" | "bookmark" | "broadcast" | "calculator" | "calendar" | "camera" | "car" | "car-battery" | "card" | "charging-active" | "charging-state" | "charging-station" | "chart" | "chat" | "check" | "city" | "climate" | "climate-control" | "clock" | "close" | "closed-caption" | "co2-emission" | "compare" | "configurate" | "country-road" | "cubic-capacity" | "delete" | "disable" | "download" | "duration" | "edit" | "email" | "error-filled" | "exclamation" | "external" | "filter" | "fingerprint" | "flash" | "fuel-station" | "garage" | "gift" | "globe" | "heart" | "heart-filled" | "highway" | "home" | "horn" | "image" | "increase" | "information" | "information-filled" | "key" | "leaf" | "leather" | "light" | "locate" | "lock" | "lock-open" | "logo-apple-podcast" | "logo-baidu" | "logo-delicious" | "logo-digg" | "logo-facebook" | "logo-foursquare" | "logo-gmail" | "logo-google" | "logo-hatena" | "logo-instagram" | "logo-kaixin" | "logo-kakaotalk" | "logo-linkedin" | "logo-naver" | "logo-pinterest" | "logo-qq" | "logo-qq-share" | "logo-reddit" | "logo-skyrock" | "logo-sohu" | "logo-spotify" | "logo-tecent" | "logo-telegram" | "logo-tiktok" | "logo-tumblr" | "logo-twitter" | "logo-viber" | "logo-vk" | "logo-wechat" | "logo-weibo" | "logo-whatsapp" | "logo-xing" | "logo-yahoo" | "logo-youku" | "logo-youtube" | "logout" | "map" | "menu-dots-horizontal" | "menu-dots-vertical" | "menu-lines" | "minus" | "mobile" | "moon" | "oil-can" | "parking-brake" | "parking-light" | "pause" | "phone" | "pin" | "pin-filled" | "play" | "plug" | "plus" | "preheating" | "printer" | "purchase" | "push-pin" | "push-pin-off" | "qr" | "question" | "racing-flag" | "refresh" | "replay" | "reset" | "roof-closed" | "roof-open" | "route" | "rss" | "save" | "screen" | "send" | "share" | "shopping-bag" | "shopping-bag-filled" | "shopping-cart" | "shopping-cart-filled" | "sidelights" | "snowflake" | "sort" | "stack" | "star" | "steering-wheel" | "stopwatch" | "subtract" | "success" | "success-filled" | "sun" | "tablet" | "tachometer" | "tire" | "truck" | "upload" | "user" | "user-filled" | "user-group" | "user-manual" | "video" | "view" | "view-off" | "volume-off" | "volume-up" | "warning" | "warning-filled" | "weight" | "wifi" | "work" | "wrench" | "wrenches" | "zoom-in" | "zoom-out";
     color: "default" | "inherit" | "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | "notification-success" | "notification-warning" | "notification-error" | "notification-info" | "brand" | "neutral-contrast-low" | "neutral-contrast-medium" | "neutral-contrast-high" | "notification-neutral" | "state-disabled";
 }, {}>;

package/esm/lib/components/LinkPureWrapper.vue.d.ts

@@ -85,7 +85,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>>>, {
     weight: "regular" | "semi-bold" | "bold" | "thin" | "semibold";
     stretch: BreakpointCustomizable<boolean>;
-    size: BreakpointCustomizable<"inherit" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large">;
+    size: BreakpointCustomizable<"inherit" | "small" | "medium" | "large" | "x-large" | "xx-small" | "x-small">;
     active: boolean;
     alignLabel: BreakpointCustomizable<"start" | "end" | "left" | "right">;
     hideLabel: BreakpointCustomizable<boolean>;

package/esm/lib/components/LinkTileProductWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { BreakpointCustomizable, LinkTileProductAspectRatio, LinkTileProductLikeEvent, LinkTileProductTarget, Theme } from '../types';
+import type { BreakpointCustomizable, LinkTileProductAspectRatio, LinkTileProductTarget, Theme } from '../types';
 type PLinkTileProductProps = {
     /**
      * Aspect ratio of the link-tile-product.
@@ -47,14 +47,14 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     liked: boolean;
     target: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    like: (value: LinkTileProductLikeEvent) => void;
+    like: (value: import("../types").LinkTileProductLikeEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PLinkTileProductProps>, {
     aspectRatio: string;
     likeButton: boolean;
     liked: boolean;
     target: string;
 }>>> & {
-    onLike?: ((value: LinkTileProductLikeEvent) => any) | undefined;
+    onLike?: ((value: import("../types").LinkTileProductLikeEvent) => any) | undefined;
 }, {
     aspectRatio: BreakpointCustomizable<LinkTileProductAspectRatio>;
     target: string;

package/esm/lib/components/MultiSelectWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { MultiSelectDropdownDirection, BreakpointCustomizable, MultiSelectUpdateEvent, MultiSelectState, Theme } from '../types';
+import type { MultiSelectDropdownDirection, BreakpointCustomizable, MultiSelectState, Theme } from '../types';
 type PMultiSelectProps = {
     /**
      * The description text.
@@ -56,7 +56,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     state: string;
     value: () => never[];
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    update: (value: MultiSelectUpdateEvent) => void;
+    update: (value: import("../types").MultiSelectUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PMultiSelectProps>, {
     description: string;
     disabled: boolean;
@@ -68,7 +68,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     state: string;
     value: () => never[];
 }>>> & {
-    onUpdate?: ((value: MultiSelectUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").MultiSelectUpdateEvent) => any) | undefined;
 }, {
     label: string;
     description: string;

package/esm/lib/components/PaginationWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { PaginationInternationalization, BreakpointCustomizable, PaginationMaxNumberOfPageLinks, PaginationUpdateEvent, Theme } from '../types';
+import type { PaginationInternationalization, BreakpointCustomizable, PaginationMaxNumberOfPageLinks, Theme } from '../types';
 type PPaginationProps = {
     /**
      * Index of the currently active page.
@@ -58,8 +58,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     showLastPage: boolean;
     totalItemsCount: number;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    pageChange: (value: PaginationUpdateEvent) => void;
-    update: (value: PaginationUpdateEvent) => void;
+    pageChange: (value: import("../types").PaginationUpdateEvent) => void;
+    update: (value: import("../types").PaginationUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PPaginationProps>, {
     activePage: number;
     intl: () => {
@@ -72,8 +72,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     showLastPage: boolean;
     totalItemsCount: number;
 }>>> & {
-    onUpdate?: ((value: PaginationUpdateEvent) => any) | undefined;
-    onPageChange?: ((value: PaginationUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").PaginationUpdateEvent) => any) | undefined;
+    onPageChange?: ((value: import("../types").PaginationUpdateEvent) => any) | undefined;
 }, {
     intl: PaginationInternationalization;
     activePage: number;

package/esm/lib/components/PinCodeWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { BreakpointCustomizable, PinCodeLength, PinCodeUpdateEvent, PinCodeState, Theme, PinCodeType } from '../types';
+import type { BreakpointCustomizable, PinCodeLength, PinCodeState, Theme, PinCodeType } from '../types';
 type PPinCodeProps = {
     /**
      * The description text.
@@ -66,7 +66,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     type: string;
     value: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    update: (value: PinCodeUpdateEvent) => void;
+    update: (value: import("../types").PinCodeUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PPinCodeProps>, {
     description: string;
     disabled: boolean;
@@ -80,7 +80,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     type: string;
     value: string;
 }>>> & {
-    onUpdate?: ((value: PinCodeUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").PinCodeUpdateEvent) => any) | undefined;
 }, {
     label: string;
     length: 3 | 4 | 2 | 5 | 1 | 6;

package/esm/lib/components/RadioButtonWrapperWrapper.vue.d.ts

@@ -9,7 +9,7 @@ type PRadioButtonWrapperProps = {
      */
     label?: string;
     /**
-     * __Experimental__: Disables the radio button and shows a loading indicator.
+     * @experimental Disables the radio button and shows a loading indicator.
      */
     loading?: boolean;
     /**

package/esm/lib/components/SegmentedControlWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { SegmentedControlBackgroundColor, BreakpointCustomizable, SegmentedControlColumns, SegmentedControlUpdateEvent, Theme } from '../types';
+import type { SegmentedControlBackgroundColor, BreakpointCustomizable, SegmentedControlColumns, Theme } from '../types';
 type PSegmentedControlProps = {
     /**
      * @deprecated since v3.0.0, will be removed with next major release. Background color variations
@@ -20,13 +20,13 @@ type PSegmentedControlProps = {
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PSegmentedControlProps>, {
     columns: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    segmentedControlChange: (value: SegmentedControlUpdateEvent) => void;
-    update: (value: SegmentedControlUpdateEvent) => void;
+    segmentedControlChange: (value: import("../types").SegmentedControlUpdateEvent) => void;
+    update: (value: import("../types").SegmentedControlUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PSegmentedControlProps>, {
     columns: string;
 }>>> & {
-    onUpdate?: ((value: SegmentedControlUpdateEvent) => any) | undefined;
-    onSegmentedControlChange?: ((value: SegmentedControlUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").SegmentedControlUpdateEvent) => any) | undefined;
+    onSegmentedControlChange?: ((value: import("../types").SegmentedControlUpdateEvent) => any) | undefined;
 }, {
     columns: BreakpointCustomizable<string | number>;
 }, {}>, {

package/esm/lib/components/StepperHorizontalWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { StepperHorizontalUpdateEvent, BreakpointCustomizable, StepperHorizontalSize, Theme } from '../types';
+import type { BreakpointCustomizable, StepperHorizontalSize, Theme } from '../types';
 type PStepperHorizontalProps = {
     size?: BreakpointCustomizable<StepperHorizontalSize>;
     /**
@@ -9,13 +9,13 @@ type PStepperHorizontalProps = {
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PStepperHorizontalProps>, {
     size: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    stepChange: (value: StepperHorizontalUpdateEvent) => void;
-    update: (value: StepperHorizontalUpdateEvent) => void;
+    stepChange: (value: import("../types").StepperHorizontalUpdateEvent) => void;
+    update: (value: import("../types").StepperHorizontalUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PStepperHorizontalProps>, {
     size: string;
 }>>> & {
-    onUpdate?: ((value: StepperHorizontalUpdateEvent) => any) | undefined;
-    onStepChange?: ((value: StepperHorizontalUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").StepperHorizontalUpdateEvent) => any) | undefined;
+    onStepChange?: ((value: import("../types").StepperHorizontalUpdateEvent) => any) | undefined;
 }, {
     size: BreakpointCustomizable<"small" | "medium">;
 }, {}>, {

package/esm/lib/components/SwitchWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { BreakpointCustomizable, SwitchAlignLabel, SwitchUpdateEvent, Theme } from '../types';
+import type { BreakpointCustomizable, SwitchAlignLabel, Theme } from '../types';
 type PSwitchProps = {
     /**
      * Aligns the label.
@@ -37,8 +37,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     loading: boolean;
     stretch: boolean;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    switchChange: (value: SwitchUpdateEvent) => void;
-    update: (value: SwitchUpdateEvent) => void;
+    switchChange: (value: import("../types").SwitchUpdateEvent) => void;
+    update: (value: import("../types").SwitchUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PSwitchProps>, {
     alignLabel: string;
     checked: boolean;
@@ -47,8 +47,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     loading: boolean;
     stretch: boolean;
 }>>> & {
-    onUpdate?: ((value: SwitchUpdateEvent) => any) | undefined;
-    onSwitchChange?: ((value: SwitchUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").SwitchUpdateEvent) => any) | undefined;
+    onSwitchChange?: ((value: import("../types").SwitchUpdateEvent) => any) | undefined;
 }, {
     stretch: BreakpointCustomizable<boolean>;
     alignLabel: BreakpointCustomizable<"start" | "end" | "left" | "right">;

package/esm/lib/components/TabsBarWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { TabsBarGradientColor, TabsBarGradientColorScheme, TabsBarUpdateEvent, BreakpointCustomizable, TabsBarSize, Theme, TabsBarWeight } from '../types';
+import type { TabsBarGradientColor, TabsBarGradientColorScheme, BreakpointCustomizable, TabsBarSize, Theme, TabsBarWeight } from '../types';
 type PTabsBarProps = {
     /**
      * Defines which tab to be visualized as selected (zero-based numbering), undefined if none should be selected.
@@ -30,15 +30,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     size: string;
     weight: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    tabChange: (value: TabsBarUpdateEvent) => void;
-    update: (value: TabsBarUpdateEvent) => void;
+    tabChange: (value: import("../types").TabsBarUpdateEvent) => void;
+    update: (value: import("../types").TabsBarUpdateEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PTabsBarProps>, {
     gradientColor: string;
     size: string;
     weight: string;
 }>>> & {
-    onUpdate?: ((value: TabsBarUpdateEvent) => any) | undefined;
-    onTabChange?: ((value: TabsBarUpdateEvent) => any) | undefined;
+    onUpdate?: ((value: import("../types").TabsBarUpdateEvent) => any) | undefined;
+    onTabChange?: ((value: import("../types").TabsBarUpdateEvent) => any) | undefined;
 }, {
     weight: "regular" | "semi-bold" | "semibold";
     size: BreakpointCustomizable<"small" | "medium">;

package/esm/lib/components/TextFieldWrapperWrapper.vue.d.ts

@@ -33,7 +33,7 @@ type PTextFieldWrapperProps = {
      */
     showCounter?: boolean;
     /**
-     * __Experimental__: Show or hide password toggle for `input type="password"`.
+     * @experimental Show or hide password toggle for `input type="password"`.
      */
     showPasswordToggle?: boolean;
     /**

package/esm/lib/components/TextWrapper.vue.d.ts

@@ -45,7 +45,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     weight: string;
 }>>>, {
     weight: "regular" | "semi-bold" | "bold" | "thin" | "semibold";
-    size: BreakpointCustomizable<"inherit" | "xx-small" | "x-small" | "small" | "medium" | "large" | "x-large">;
+    size: BreakpointCustomizable<"inherit" | "small" | "medium" | "large" | "x-large" | "xx-small" | "x-small">;
     tag: "time" | "p" | "span" | "div" | "address" | "blockquote" | "figcaption" | "cite" | "legend";
     align: "center" | "start" | "end" | "left" | "right";
     color: "default" | "inherit" | "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | "notification-success" | "notification-warning" | "notification-error" | "notification-info" | "brand" | "neutral-contrast-low" | "neutral-contrast-medium" | "neutral-contrast-high" | "notification-neutral";

package/esm/lib/types.d.ts

@@ -446,6 +446,13 @@ export type BreakpointValues<T> = {
     base: T;
 };
 export type BreakpointCustomizable<T> = T | BreakpointValues<T> | string;
+declare const LINK_TARGETS: readonly [
+    "_self",
+    "_blank",
+    "_parent",
+    "_top"
+];
+export type LinkTarget = (typeof LINK_TARGETS)[number] | string;
 declare const THEMES: readonly [
     "light",
     "dark",
@@ -508,6 +515,25 @@ declare const SELECT_DROPDOWN_DIRECTIONS: readonly [
     "auto"
 ];
 export type SelectDropdownDirection = (typeof SELECT_DROPDOWN_DIRECTIONS)[number];
+declare const HEADING_SIZES: readonly [
+    "small",
+    "medium",
+    "large",
+    "x-large",
+    "xx-large",
+    "inherit"
+];
+export type HeadingSize = (typeof HEADING_SIZES)[number];
+declare const TEXT_SIZES: readonly [
+    "xx-small",
+    "x-small",
+    "small",
+    "medium",
+    "large",
+    "x-large",
+    "inherit"
+];
+export type TextSize = (typeof TEXT_SIZES)[number];
 declare const TYPOGRAPHY_ALIGNS: readonly [
     "start",
     "center",
@@ -516,6 +542,32 @@ declare const TYPOGRAPHY_ALIGNS: readonly [
     "right"
 ];
 export type TypographyAlign = (typeof TYPOGRAPHY_ALIGNS)[number];
+declare const TYPOGRAPHY_TEXT_COLORS: readonly [
+    "primary",
+    "contrast-low",
+    "contrast-medium",
+    "contrast-high",
+    "notification-success",
+    "notification-warning",
+    "notification-error",
+    "notification-info",
+    "inherit",
+    "brand",
+    "default",
+    "neutral-contrast-low",
+    "neutral-contrast-medium",
+    "neutral-contrast-high",
+    "notification-neutral"
+];
+export type TypographyTextColor = (typeof TYPOGRAPHY_TEXT_COLORS)[number];
+declare const TYPOGRAPHY_TEXT_WEIGHTS: readonly [
+    "regular",
+    "semi-bold",
+    "bold",
+    "thin",
+    "semibold"
+];
+export type TypographyTextWeight = (typeof TYPOGRAPHY_TEXT_WEIGHTS)[number];
 declare const ALIGN_LABELS: readonly [
     "start",
     "end",
@@ -544,49 +596,6 @@ declare const LINK_BUTTON_VARIANTS: readonly [
     "tertiary"
 ];
 export type LinkButtonVariant = typeof LINK_BUTTON_VARIANTS[number];
-declare const TEXT_COLORS: readonly [
-    "primary",
-    "contrast-low",
-    "contrast-medium",
-    "contrast-high",
-    "notification-success",
-    "notification-warning",
-    "notification-error",
-    "notification-info",
-    "inherit",
-    "brand",
-    "default",
-    "neutral-contrast-low",
-    "neutral-contrast-medium",
-    "neutral-contrast-high",
-    "notification-neutral"
-];
-export type TextColor = (typeof TEXT_COLORS)[number];
-declare const TEXT_SIZES: readonly [
-    "xx-small",
-    "x-small",
-    "small",
-    "medium",
-    "large",
-    "x-large",
-    "inherit"
-];
-export type TextSize = (typeof TEXT_SIZES)[number];
-declare const TEXT_WEIGHTS: readonly [
-    "regular",
-    "semi-bold",
-    "bold",
-    "thin",
-    "semibold"
-];
-export type TextWeight = (typeof TEXT_WEIGHTS)[number];
-declare const LINK_TARGETS: readonly [
-    "_self",
-    "_blank",
-    "_parent",
-    "_top"
-];
-export type LinkTarget = (typeof LINK_TARGETS)[number] | string;
 export type LinkButtonIconName = IconName | "none";
 export type ButtonVariant = LinkButtonVariant;
 export type LinkVariant = LinkButtonVariant;
@@ -607,9 +616,11 @@ declare const ACCORDION_SIZES: readonly [
     "medium"
 ];
 export type AccordionSize = (typeof ACCORDION_SIZES)[number];
+/** @deprecated */
 export type AccordionUpdateEvent = {
     open: boolean;
 };
+export type AccordionUpdateEventDetail = AccordionUpdateEvent;
 export type AccordionTag = HeadingTag;
 declare const BANNER_STATES: readonly [
     "info",
@@ -636,7 +647,7 @@ export type ButtonPureType = ButtonType;
 export type ButtonPureIcon = LinkButtonIconName;
 export type ButtonPureAriaAttribute = ButtonAriaAttribute;
 export type ButtonPureAlignLabel = AlignLabel;
-export type ButtonPureWeight = TextWeight;
+export type ButtonPureWeight = TypographyTextWeight;
 export type ButtonPureSize = TextSize;
 export type ButtonTileAriaAttribute = ButtonAriaAttribute;
 export type ButtonTileIcon = LinkButtonIconName;
@@ -657,11 +668,18 @@ declare const CAROUSEL_ALIGN_HEADERS: readonly [
     "left"
 ];
 export type CarouselAlignHeader = (typeof CAROUSEL_ALIGN_HEADERS)[number];
+export type CarouselHeadingSize = Extract<HeadingSize, "x-large" | "xx-large">;
+declare const CAROUSEL_ARIA_ATTRIBUTES: readonly [
+    "aria-label"
+];
+export type CarouselAriaAttribute = (typeof CAROUSEL_ARIA_ATTRIBUTES)[number];
 export type CarouselInternationalization = Partial<Record<"prev" | "next" | "first" | "last" | "slideLabel" | "slide", string>> | string;
+/** @deprecated */
 export type CarouselUpdateEvent = {
     activeIndex: number;
     previousIndex: number;
 };
+export type CarouselUpdateEventDetail = CarouselUpdateEvent;
 export type CheckboxWrapperState = FormState;
 declare const CONTENT_WRAPPER_BACKGROUND_COLORS: readonly [
     "transparent",
@@ -827,7 +845,9 @@ export type FlyoutNavigationAriaAttribute = (typeof FLYOUT_NAVIGATION_ARIA_ATTRI
 export type FlyoutNavigationUpdate = {
     activeIdentifier: string;
 };
+/** @deprecated */
 export type FlyoutNavigationUpdateEvent = FlyoutNavigationUpdate;
+export type FlyoutNavigationUpdateEventDetail = FlyoutNavigationUpdateEvent;
 declare const GRID_DIRECTIONS: readonly [
     "row",
     "row-reverse",
@@ -876,15 +896,6 @@ declare const GRID_ITEM_OFFSETS: readonly [
     11
 ];
 export type GridItemOffset = typeof GRID_ITEM_OFFSETS[number];
-declare const HEADING_SIZES: readonly [
-    "small",
-    "medium",
-    "large",
-    "x-large",
-    "xx-large",
-    "inherit"
-];
-export type HeadingSize = (typeof HEADING_SIZES)[number];
 declare const HEADING_COLORS: readonly [
     "primary",
     "inherit"
@@ -955,7 +966,7 @@ export type LinkIcon = LinkButtonIconName;
 export type LinkPureIcon = LinkButtonIconName;
 export type LinkPureAriaAttribute = LinkAriaAttribute;
 export type LinkPureAlignLabel = AlignLabel;
-export type LinkPureWeight = TextWeight;
+export type LinkPureWeight = TypographyTextWeight;
 export type LinkPureSize = TextSize;
 export type LinkPureTarget = LinkTarget;
 export type LinkSocialIcon = Extract<IconName, "logo-facebook" | "logo-google" | "logo-instagram" | "logo-linkedin" | "logo-pinterest" | "logo-twitter" | "logo-wechat" | "logo-whatsapp" | "logo-xing" | "logo-youtube" | "logo-baidu" | "logo-delicious" | "logo-digg" | "logo-foursquare" | "logo-gmail" | "logo-hatena" | "logo-kaixin" | "logo-kakaotalk" | "logo-naver" | "logo-qq-share" | "logo-qq" | "logo-reddit" | "logo-skyrock" | "logo-sohu" | "logo-tecent" | "logo-telegram" | "logo-tiktok" | "logo-tumblr" | "logo-viber" | "logo-vk" | "logo-weibo" | "logo-yahoo" | "logo-youku">;
@@ -997,9 +1008,11 @@ export type LinkTileModelSignatureWeight = TileWeight;
 export type LinkTileModelSignatureAspectRatio = TileAspectRatio;
 export type LinkTileModelSignatureLinkDirection = GroupDirection;
 export type LinkTileProductTarget = LinkTarget;
+/** @deprecated */
 export type LinkTileProductLikeEvent = {
     liked: boolean;
 };
+export type LinkTileProductLikeEventDetail = LinkTileProductLikeEvent;
 declare const TILE_PRODUCT_ASPECT_RATIOS: readonly [
     "3:4",
     "9:16"
@@ -1050,20 +1063,24 @@ declare const MODEL_SIGNATURE_COLORS: readonly [
 export type ModelSignatureColor = (typeof MODEL_SIGNATURE_COLORS)[number];
 export type MultiSelectState = FormState;
 export type MultiSelectDropdownDirection = SelectDropdownDirection;
+/** @deprecated */
 export type MultiSelectUpdateEvent = {
-    value: string[];
     name: string;
+    value: string[];
 };
+export type MultiSelectUpdateEventDetail = MultiSelectUpdateEvent;
 declare const PAGINATION_NUMBER_OF_PAGE_LINKS: readonly [
     5,
     7
 ];
 /** @deprecated */
 export type PaginationMaxNumberOfPageLinks = (typeof PAGINATION_NUMBER_OF_PAGE_LINKS)[number];
+/** @deprecated */
 export type PaginationUpdateEvent = {
     page: number;
     previousPage: number;
 };
+export type PaginationUpdateEventDetail = PaginationUpdateEvent;
 export type PaginationInternationalization = Partial<Record<"root" | "prev" | "next" | "page", string>> | string;
 declare const PIN_CODE_TYPES: readonly [
     "number",
@@ -1079,10 +1096,12 @@ declare const PIN_CODE_LENGTHS: readonly [
     6
 ];
 export type PinCodeLength = (typeof PIN_CODE_LENGTHS)[number];
+/** @deprecated */
 export type PinCodeUpdateEvent = {
     value: string;
     isComplete: boolean;
 };
+export type PinCodeUpdateEventDetail = PinCodeUpdateEvent;
 export type PinCodeState = FormState;
 declare const POPOVER_DIRECTIONS: readonly [
     "top",
@@ -1101,9 +1120,11 @@ declare const SEGMENTED_CONTROL_BACKGROUND_COLORS: readonly [
     "background-default"
 ];
 export type SegmentedControlBackgroundColor = (typeof SEGMENTED_CONTROL_BACKGROUND_COLORS)[number];
+/** @deprecated */
 export type SegmentedControlUpdateEvent = {
     value: string | number;
 };
+export type SegmentedControlUpdateEventDetail = SegmentedControlUpdateEvent;
 declare const SEGMENTED_CONTROL_COLUMNS: (string | number)[];
 export type SegmentedControlColumns = (typeof SEGMENTED_CONTROL_COLUMNS)[number];
 export type SegmentedControlItemIcon = LinkButtonIconName;
@@ -1130,9 +1151,11 @@ declare const STEPPER_HORIZONTAL_SIZES: readonly [
     "medium"
 ];
 export type StepperHorizontalSize = (typeof STEPPER_HORIZONTAL_SIZES)[number];
+/** @deprecated */
 export type StepperHorizontalUpdateEvent = {
     activeStepIndex: number;
 };
+export type StepperHorizontalUpdateEventDetail = StepperHorizontalUpdateEvent;
 declare const STEPPER_ITEM_STATES: readonly [
     "current",
     "complete",
@@ -1140,16 +1163,20 @@ declare const STEPPER_ITEM_STATES: readonly [
 ];
 export type StepperHorizontalItemState = (typeof STEPPER_ITEM_STATES)[number];
 export type SwitchAlignLabel = AlignLabel;
+/** @deprecated */
 export type SwitchUpdateEvent = {
     checked: boolean;
 };
+export type SwitchUpdateEventDetail = SwitchUpdateEvent;
 export type Direction = "asc" | "desc";
 export type TableHeadCellSort = {
     id: string;
     active?: boolean;
     direction?: Direction;
 };
+/** @deprecated */
 export type TableUpdateEvent = TableHeadCellSort;
+export type TableUpdateEventDetail = TableUpdateEvent;
 declare const TABS_BAR_SIZES: readonly [
     "small",
     "medium"
@@ -1161,9 +1188,11 @@ declare const TABS_BAR_WEIGHTS: readonly [
     "semibold"
 ];
 export type TabsBarWeight = (typeof TABS_BAR_WEIGHTS)[number];
+/** @deprecated */
 export type TabsBarUpdateEvent = {
     activeTabIndex: number;
 };
+export type TabsBarUpdateEventDetail = TabsBarUpdateEvent;
 /** @deprecated */
 export type TabsBarGradientColorScheme = ScrollerGradientColorScheme;
 export type TabsBarGradientColor = ScrollerGradientColor;
@@ -1172,7 +1201,9 @@ export type TabsWeight = TabsBarWeight;
 /** @deprecated */
 export type TabsGradientColorScheme = TabsBarGradientColorScheme;
 export type TabsGradientColor = TabsBarGradientColor;
+/** @deprecated */
 export type TabsUpdateEvent = TabsBarUpdateEvent;
+export type TabsUpdateEventDetail = TabsUpdateEvent;
 declare const TAG_DISMISSIBLE_COLORS: readonly [
     "background-base",
     "background-surface",
@@ -1213,6 +1244,8 @@ declare const TEXT_TAGS: readonly [
 ];
 export type TextTag = (typeof TEXT_TAGS)[number];
 export type TextAlign = TypographyAlign;
+export type TextColor = TypographyTextColor;
+export type TextWeight = TypographyTextWeight;
 declare const UNIT_POSITIONS: readonly [
     "prefix",
     "suffix"

package/jsdom-polyfill/index.d.ts

@@ -1 +1,2 @@
+/// <reference types="@porsche-design-system/components-js/jsdom-polyfill" />
 export * from '@porsche-design-system/components-js/jsdom-polyfill';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@porsche-design-system/components-vue",
-  "version": "3.10.0-rc.2",
+  "version": "3.10.0-rc.4",
   "description": "Porsche Design System is a component library designed to help developers create the best experience for software or services distributed by Dr. Ing. h.c. F. Porsche AG.",
   "keywords": [
     "porsche",
@@ -17,7 +17,7 @@
   "license": "SEE LICENSE IN LICENSE",
   "homepage": "https://designsystem.porsche.com",
   "dependencies": {
-    "@porsche-design-system/components-js": "3.10.0-rc.2"
+    "@porsche-design-system/components-js": "3.10.0-rc.4"
   },
   "peerDependencies": {
     "vue": ">=3.0.0 <4.0.0"