@porsche-design-system/components-vue 3.0.0-alpha.2 → 3.0.0-alpha.4

package/lib/components/ModalWrapper.vue.js

@@ -1,28 +1,29 @@
-import { defineComponent as s, ref as p, onMounted as f, onUpdated as d, openBlock as u, createBlock as c, resolveDynamicComponent as m, unref as i, withCtx as C, renderSlot as B } from "vue";
-import { getPrefixedTagName as _, syncProperties as t, addEventListenerToElementRef as y } from "../../utils.js";
-const b = /* @__PURE__ */ s({
+import { defineComponent as p, ref as d, onMounted as f, onUpdated as u, openBlock as i, createBlock as m, resolveDynamicComponent as c, unref as B, withCtx as C, renderSlot as y } from "vue";
+import { getPrefixedTagName as _, syncProperties as n, addEventListenerToElementRef as a } from "../../utils.js";
+const b = /* @__PURE__ */ p({
   __name: "ModalWrapper",
   props: {
     aria: null,
     disableBackdropClick: { type: Boolean, default: !1 },
-    disableCloseButton: { type: Boolean, default: !1 },
+    disableCloseButton: { type: Boolean },
+    dismissButton: { type: Boolean, default: !0 },
     fullscreen: { default: !1 },
     heading: null,
     open: { type: Boolean, default: !1 }
   },
-  emits: ["close"],
-  setup(n, { emit: a }) {
-    const o = n, l = _("p-modal"), e = p();
+  emits: ["close", "dismiss"],
+  setup(l, { emit: o }) {
+    const t = l, s = _("p-modal"), e = d();
     return f(() => {
-      t(e.value, o), y(e.value, "close", a);
-    }), d(() => {
-      t(e.value, o);
-    }), (r, k) => (u(), c(m(i(l)), {
+      n(e.value, t), a(e.value, "close", o), a(e.value, "dismiss", o);
+    }), u(() => {
+      n(e.value, t);
+    }), (r, v) => (i(), m(c(B(s)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, {
       default: C(() => [
-        B(r.$slots, "default")
+        y(r.$slots, "default")
       ]),
       _: 3
     }, 512));

package/lib/components/ModelSignatureWrapper.vue.d.ts

@@ -3,11 +3,11 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     /**
      * Adapts the color of the component.
      */
-    color?: "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | "inherit" | undefined;
+    color?: "inherit" | "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | undefined;
     /**
      * Adapts the model of the component.
      */
-    model?: "911" | "718" | "boxster" | "cayenne" | "cayman" | "macan" | "panamera" | "taycan" | "turbo-s" | "turbo" | undefined;
+    model?: "718" | "911" | "boxster" | "cayenne" | "cayman" | "macan" | "panamera" | "taycan" | "turbo-s" | "turbo" | undefined;
     /**
      * Adapts the size of the component.
      */
@@ -25,11 +25,11 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     /**
      * Adapts the color of the component.
      */
-    color?: "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | "inherit" | undefined;
+    color?: "inherit" | "primary" | "contrast-low" | "contrast-medium" | "contrast-high" | undefined;
     /**
      * Adapts the model of the component.
      */
-    model?: "911" | "718" | "boxster" | "cayenne" | "cayman" | "macan" | "panamera" | "taycan" | "turbo-s" | "turbo" | undefined;
+    model?: "718" | "911" | "boxster" | "cayenne" | "cayman" | "macan" | "panamera" | "taycan" | "turbo-s" | "turbo" | undefined;
     /**
      * Adapts the size of the component.
      */

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

@@ -1,25 +1,29 @@
-import type { BreakpointCustomizable, NumberOfPageLinks, PageChangeEvent, Theme } from '../types';
+import type { BreakpointCustomizable, PaginationMaxNumberOfPageLinks, PaginationChangeEvent, Theme } from '../types';
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
      * Index of the currently active page.
      */
     activePage: number;
     /**
-     * Aria label what the pagination is used for.
+     * @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 | undefined;
     /**
-     * Aria label for next page icon.
+     * @deprecated since v3.0.0, will be removed with next major release, use `intl.next` instead. Aria label for next page icon.
      */
     allyLabelNext?: string | undefined;
     /**
-     * Aria label for page navigation.
+     * @deprecated since v3.0.0, will be removed with next major release, use `intl.page` instead. Aria label for page navigation.
      */
     allyLabelPage?: string | undefined;
     /**
-     * Aria label for previous page icon.
+     * @deprecated since v3.0.0, will be removed with next major release, use `intl.prev` instead. Aria label for previous page icon.
      */
     allyLabelPrev?: string | undefined;
+    /**
+     * Override the default wordings that are used for aria-labels on the next/prev and page buttons.
+     */
+    intl?: Partial<Record<"page" | "prev" | "next" | "root", string>> | undefined;
     /**
      * The total count of items which should be shown per page.
      */
@@ -38,10 +42,12 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     totalItemsCount: number;
 }>, {
     activePage: number;
-    allyLabel: string;
-    allyLabelNext: string;
-    allyLabelPage: string;
-    allyLabelPrev: string;
+    intl: () => {
+        root: string;
+        prev: string;
+        next: string;
+        page: string;
+    };
     itemsPerPage: number;
     maxNumberOfPageLinks: () => {
         base: number;
@@ -50,28 +56,34 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     theme: string;
     totalItemsCount: number;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    pageChange: (value: PageChangeEvent) => void;
+    change: (value: PaginationChangeEvent) => void;
+} & {
+    pageChange: (value: PaginationChangeEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
      * Index of the currently active page.
      */
     activePage: number;
     /**
-     * Aria label what the pagination is used for.
+     * @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 | undefined;
     /**
-     * Aria label for next page icon.
+     * @deprecated since v3.0.0, will be removed with next major release, use `intl.next` instead. Aria label for next page icon.
      */
     allyLabelNext?: string | undefined;
     /**
-     * Aria label for page navigation.
+     * @deprecated since v3.0.0, will be removed with next major release, use `intl.page` instead. Aria label for page navigation.
      */
     allyLabelPage?: string | undefined;
     /**
-     * Aria label for previous page icon.
+     * @deprecated since v3.0.0, will be removed with next major release, use `intl.prev` instead. Aria label for previous page icon.
      */
     allyLabelPrev?: string | undefined;
+    /**
+     * Override the default wordings that are used for aria-labels on the next/prev and page buttons.
+     */
+    intl?: Partial<Record<"page" | "prev" | "next" | "root", string>> | undefined;
     /**
      * The total count of items which should be shown per page.
      */
@@ -90,10 +102,12 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     totalItemsCount: number;
 }>, {
     activePage: number;
-    allyLabel: string;
-    allyLabelNext: string;
-    allyLabelPage: string;
-    allyLabelPrev: string;
+    intl: () => {
+        root: string;
+        prev: string;
+        next: string;
+        page: string;
+    };
     itemsPerPage: number;
     maxNumberOfPageLinks: () => {
         base: number;
@@ -102,16 +116,14 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     theme: string;
     totalItemsCount: number;
 }>>> & {
-    onPageChange?: ((value: PageChangeEvent) => any) | undefined;
+    onChange?: ((value: PaginationChangeEvent) => any) | undefined;
+    onPageChange?: ((value: PaginationChangeEvent) => any) | undefined;
 }, {
     theme: Theme;
+    intl: Partial<Record<"page" | "prev" | "next" | "root", string>>;
     activePage: number;
-    allyLabel: string;
-    allyLabelNext: string;
-    allyLabelPage: string;
-    allyLabelPrev: string;
     itemsPerPage: number;
-    maxNumberOfPageLinks: BreakpointCustomizable<NumberOfPageLinks>;
+    maxNumberOfPageLinks: BreakpointCustomizable<PaginationMaxNumberOfPageLinks>;
     totalItemsCount: number;
 }>;
 export default _default;

package/lib/components/PaginationWrapper.vue.js

@@ -1,31 +1,32 @@
-import { defineComponent as r, ref as p, onMounted as f, onUpdated as s, openBlock as u, createBlock as i, resolveDynamicComponent as m, unref as d } from "vue";
-import { getPrefixedTagName as g, syncProperties as t, addEventListenerToElementRef as c } from "../../utils.js";
-const x = /* @__PURE__ */ r({
+import { defineComponent as p, ref as u, onMounted as s, onUpdated as g, openBlock as f, createBlock as i, resolveDynamicComponent as m, unref as c } from "vue";
+import { getPrefixedTagName as d, syncProperties as t, addEventListenerToElementRef as l } from "../../utils.js";
+const b = /* @__PURE__ */ p({
   __name: "PaginationWrapper",
   props: {
     activePage: { default: 1 },
-    allyLabel: { default: "Pagination" },
-    allyLabelNext: { default: "Next page" },
-    allyLabelPage: { default: "Page" },
-    allyLabelPrev: { default: "Previous page" },
+    allyLabel: null,
+    allyLabelNext: null,
+    allyLabelPage: null,
+    allyLabelPrev: null,
+    intl: { default: () => ({ root: "Pagination", prev: "Previous page", next: "Next page", page: "Page" }) },
     itemsPerPage: { default: 1 },
     maxNumberOfPageLinks: { default: () => ({ base: 5, xs: 7 }) },
     theme: { default: "light" },
     totalItemsCount: { default: 1 }
   },
-  emits: ["pageChange"],
-  setup(n, { emit: o }) {
-    const a = n, l = g("p-pagination"), e = p();
-    return f(() => {
-      t(e.value, a), c(e.value, "pageChange", o);
-    }), s(() => {
-      t(e.value, a);
-    }), (P, v) => (u(), i(m(d(l)), {
+  emits: ["change", "pageChange"],
+  setup(o, { emit: a }) {
+    const n = o, r = d("p-pagination"), e = u();
+    return s(() => {
+      t(e.value, n), l(e.value, "change", a), l(e.value, "pageChange", a);
+    }), g(() => {
+      t(e.value, n);
+    }), (P, v) => (f(), i(m(c(r)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, null, 512));
   }
 });
 export {
-  x as default
+  b as default
 };

package/lib/components/PopoverWrapper.vue.d.ts

@@ -11,7 +11,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * 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?: "top" | "left" | "right" | "bottom" | undefined;
+    direction?: "top" | "bottom" | "left" | "right" | undefined;
     /**
      * Adapts the popover color depending on the theme.
      */
@@ -31,7 +31,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * 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?: "top" | "left" | "right" | "bottom" | undefined;
+    direction?: "top" | "bottom" | "left" | "right" | undefined;
     /**
      * Adapts the popover color depending on the theme.
      */

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

@@ -1,4 +1,4 @@
-import type { BreakpointCustomizable, FormState, Theme } from '../types';
+import type { BreakpointCustomizable, RadioButtonWrapperState, Theme } from '../types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
      * Show or hide label. For better accessibility it's recommended to show the label.
@@ -56,7 +56,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>>>, {
     label: string;
     theme: Theme;
-    state: FormState;
+    state: RadioButtonWrapperState;
     hideLabel: BreakpointCustomizable<boolean>;
     message: string;
 }>, {

package/lib/components/ScrollerWrapper.vue.d.ts

@@ -1,50 +1,77 @@
-import type { GradientColorTheme, ScrollIndicatorPosition, ScrollToPosition, Theme } from '../types';
+import type { ScrollerAlignScrollIndicator, ScrollerGradientColor, ScrollerScrollToPosition, Theme } from '../types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    /**
+     * Sets the vertical position of scroll indicator
+     */
+    alignScrollIndicator?: "top" | "center" | undefined;
     /**
      * Adapts the background gradient color of prev and next button.
      */
+    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?: "default" | "surface" | undefined;
     /**
-     * Sets the vertical position of scroll indicator icon
+     * @deprecated since v3.0.0, will be removed with next major release, use `alignScrollIndicator` instead. Sets the vertical position of scroll indicator
      */
     scrollIndicatorPosition?: "top" | "center" | undefined;
     /**
      * Scrolls the scroll area to the left either smooth or immediately
      */
-    scrollToPosition?: ScrollToPosition | undefined;
+    scrollToPosition?: ScrollerScrollToPosition | undefined;
+    /**
+     * Specifies if scrollbar should be shown
+     */
+    scrollbar?: boolean | undefined;
     /**
      * Adapts the color when used on dark background.
      */
     theme?: "light" | "dark" | undefined;
 }>, {
-    gradientColorScheme: string;
-    scrollIndicatorPosition: string;
+    alignScrollIndicator: string;
+    gradientColor: string;
+    scrollbar: boolean;
     theme: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    /**
+     * Sets the vertical position of scroll indicator
+     */
+    alignScrollIndicator?: "top" | "center" | undefined;
     /**
      * Adapts the background gradient color of prev and next button.
      */
+    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?: "default" | "surface" | undefined;
     /**
-     * Sets the vertical position of scroll indicator icon
+     * @deprecated since v3.0.0, will be removed with next major release, use `alignScrollIndicator` instead. Sets the vertical position of scroll indicator
      */
     scrollIndicatorPosition?: "top" | "center" | undefined;
     /**
      * Scrolls the scroll area to the left either smooth or immediately
      */
-    scrollToPosition?: ScrollToPosition | undefined;
+    scrollToPosition?: ScrollerScrollToPosition | undefined;
+    /**
+     * Specifies if scrollbar should be shown
+     */
+    scrollbar?: boolean | undefined;
     /**
      * Adapts the color when used on dark background.
      */
     theme?: "light" | "dark" | undefined;
 }>, {
-    gradientColorScheme: string;
-    scrollIndicatorPosition: string;
+    alignScrollIndicator: string;
+    gradientColor: string;
+    scrollbar: boolean;
     theme: string;
 }>>>, {
     theme: Theme;
-    gradientColorScheme: GradientColorTheme;
-    scrollIndicatorPosition: ScrollIndicatorPosition;
+    alignScrollIndicator: ScrollerAlignScrollIndicator;
+    gradientColor: ScrollerGradientColor;
+    scrollbar: boolean;
 }>, {
     default: (_: {}) => any;
 }>;

package/lib/components/ScrollerWrapper.vue.js

@@ -1,25 +1,28 @@
-import { defineComponent as a, ref as p, onMounted as s, onUpdated as c, openBlock as f, createBlock as d, resolveDynamicComponent as i, unref as m, withCtx as u, renderSlot as C } from "vue";
-import { getPrefixedTagName as _, syncProperties as t } from "../../utils.js";
+import { defineComponent as a, ref as s, onMounted as c, onUpdated as p, openBlock as d, createBlock as f, resolveDynamicComponent as i, unref as u, withCtx as m, renderSlot as g } from "vue";
+import { getPrefixedTagName as C, syncProperties as r } from "../../utils.js";
 const k = /* @__PURE__ */ a({
   __name: "ScrollerWrapper",
   props: {
-    gradientColorScheme: { default: "default" },
-    scrollIndicatorPosition: { default: "center" },
+    alignScrollIndicator: { default: "center" },
+    gradientColor: { default: "background-base" },
+    gradientColorScheme: null,
+    scrollIndicatorPosition: null,
     scrollToPosition: null,
+    scrollbar: { type: Boolean, default: !1 },
     theme: { default: "light" }
   },
-  setup(r) {
-    const o = r, n = _("p-scroller"), e = p();
-    return s(() => {
-      t(e.value, o);
-    }), c(() => {
-      t(e.value, o);
-    }), (l, g) => (f(), d(i(m(n)), {
+  setup(t) {
+    const o = t, n = C("p-scroller"), e = s();
+    return c(() => {
+      r(e.value, o);
+    }), p(() => {
+      r(e.value, o);
+    }), (l, _) => (d(), f(i(u(n)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, {
-      default: u(() => [
-        C(l.$slots, "default")
+      default: m(() => [
+        g(l.$slots, "default")
       ]),
       _: 3
     }, 512));

package/lib/components/SegmentedControlItemWrapper.vue.d.ts

@@ -6,7 +6,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * The icon shown.
      */
-    icon?: "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" | "document" | "download" | "duration" | "edit" | "email" | "error-filled" | "exclamation" | "external" | "filter" | "flash" | "fuel-station" | "garage" | "gift" | "globe" | "grid" | "highway" | "home" | "horn" | "image" | "increase" | "information" | "information-filled" | "key" | "leaf" | "leather" | "light" | "list" | "locate" | "lock" | "lock-open" | "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-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" | "play" | "plug" | "plus" | "preheating" | "printer" | "purchase" | "question" | "racing-flag" | "refresh" | "replay" | "reset" | "route" | "rss" | "save" | "screen" | "search" | "send" | "share" | "shopping-bag" | "shopping-cart" | "sidelights" | "snowflake" | "sort" | "stack" | "star" | "steering-wheel" | "stopwatch" | "subtract" | "success" | "success-filled" | "sun" | "switch" | "tablet" | "tachometer" | "truck" | "upload" | "user" | "user-group" | "user-manual" | "video" | "view" | "view-off" | "volume-off" | "volume-up" | "warning" | "warning-filled" | "weight" | "wifi" | "work" | "wrench" | "wrenches" | "zoom-in" | "zoom-out" | undefined;
+    icon?: import("../types").LinkButtonIconName | undefined;
     /**
      * A URL path to a custom icon.
      */
@@ -29,7 +29,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     /**
      * The icon shown.
      */
-    icon?: "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" | "document" | "download" | "duration" | "edit" | "email" | "error-filled" | "exclamation" | "external" | "filter" | "flash" | "fuel-station" | "garage" | "gift" | "globe" | "grid" | "highway" | "home" | "horn" | "image" | "increase" | "information" | "information-filled" | "key" | "leaf" | "leather" | "light" | "list" | "locate" | "lock" | "lock-open" | "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-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" | "play" | "plug" | "plus" | "preheating" | "printer" | "purchase" | "question" | "racing-flag" | "refresh" | "replay" | "reset" | "route" | "rss" | "save" | "screen" | "search" | "send" | "share" | "shopping-bag" | "shopping-cart" | "sidelights" | "snowflake" | "sort" | "stack" | "star" | "steering-wheel" | "stopwatch" | "subtract" | "success" | "success-filled" | "sun" | "switch" | "tablet" | "tachometer" | "truck" | "upload" | "user" | "user-group" | "user-manual" | "video" | "view" | "view-off" | "volume-off" | "volume-up" | "warning" | "warning-filled" | "weight" | "wifi" | "work" | "wrench" | "wrenches" | "zoom-in" | "zoom-out" | undefined;
+    icon?: import("../types").LinkButtonIconName | undefined;
     /**
      * A URL path to a custom icon.
      */

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

@@ -1,7 +1,7 @@
 import type { SegmentedControlChangeEvent, Theme } from '../types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
-     * @deprecated Background color variations
+     * @deprecated since v3.0.0, will be removed with next major release. Background color variations
      */
     backgroundColor?: "background-surface" | "background-default" | undefined;
     /**
@@ -15,10 +15,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>, {
     theme: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (value: SegmentedControlChangeEvent) => void;
+} & {
     segmentedControlChange: (value: SegmentedControlChangeEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
-     * @deprecated Background color variations
+     * @deprecated since v3.0.0, will be removed with next major release. Background color variations
      */
     backgroundColor?: "background-surface" | "background-default" | undefined;
     /**
@@ -32,6 +34,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
 }>, {
     theme: string;
 }>>> & {
+    onChange?: ((value: SegmentedControlChangeEvent) => any) | undefined;
     onSegmentedControlChange?: ((value: SegmentedControlChangeEvent) => any) | undefined;
 }, {
     theme: Theme;

package/lib/components/SegmentedControlWrapper.vue.js

@@ -1,25 +1,25 @@
-import { defineComponent as p, ref as s, onMounted as m, onUpdated as d, openBlock as f, createBlock as u, resolveDynamicComponent as c, unref as C, withCtx as g, renderSlot as i } from "vue";
-import { getPrefixedTagName as _, syncProperties as o, addEventListenerToElementRef as h } from "../../utils.js";
-const y = /* @__PURE__ */ p({
+import { defineComponent as s, ref as d, onMounted as m, onUpdated as u, openBlock as c, createBlock as f, resolveDynamicComponent as g, unref as C, withCtx as i, renderSlot as h } from "vue";
+import { getPrefixedTagName as v, syncProperties as t, addEventListenerToElementRef as r } from "../../utils.js";
+const y = /* @__PURE__ */ s({
   __name: "SegmentedControlWrapper",
   props: {
     backgroundColor: null,
     theme: { default: "light" },
     value: null
   },
-  emits: ["segmentedControlChange"],
-  setup(t, { emit: r }) {
-    const n = t, l = _("p-segmented-control"), e = s();
+  emits: ["change", "segmentedControlChange"],
+  setup(a, { emit: n }) {
+    const o = a, l = v("p-segmented-control"), e = d();
     return m(() => {
-      o(e.value, n), h(e.value, "segmentedControlChange", r);
-    }), d(() => {
-      o(e.value, n);
-    }), (a, v) => (f(), u(c(C(l)), {
+      t(e.value, o), r(e.value, "change", n), r(e.value, "segmentedControlChange", n);
+    }), u(() => {
+      t(e.value, o);
+    }), (p, _) => (c(), f(g(C(l)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, {
-      default: g(() => [
-        i(a.$slots, "default")
+      default: i(() => [
+        h(p.$slots, "default")
       ]),
       _: 3
     }, 512));

package/lib/components/SelectWrapperWrapper.vue.d.ts

@@ -1,4 +1,4 @@
-import type { DropdownDirection, BreakpointCustomizable, FormState, Theme } from '../types';
+import type { SelectWrapperDropdownDirection, BreakpointCustomizable, SelectWrapperState, Theme } from '../types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     /**
      * The description text.
@@ -97,11 +97,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     filter: boolean;
     label: string;
     theme: Theme;
-    state: FormState;
-    hideLabel: BreakpointCustomizable<boolean>;
     description: string;
+    state: SelectWrapperState;
+    hideLabel: BreakpointCustomizable<boolean>;
     message: string;
-    dropdownDirection: DropdownDirection;
+    dropdownDirection: SelectWrapperDropdownDirection;
     native: boolean;
 }>, {
     default: (_: {}) => any;

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

@@ -1,4 +1,4 @@
-import type { StepChangeEvent, BreakpointCustomizable, StepperHorizontalSize, Theme } from '../types';
+import type { StepperHorizontalChangeEvent, BreakpointCustomizable, StepperHorizontalSize, Theme } from '../types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     size?: BreakpointCustomizable<"small" | "medium"> | undefined;
     /**
@@ -9,7 +9,9 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     size: string;
     theme: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    stepChange: (value: StepChangeEvent) => void;
+    change: (value: StepperHorizontalChangeEvent) => void;
+} & {
+    stepChange: (value: StepperHorizontalChangeEvent) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     size?: BreakpointCustomizable<"small" | "medium"> | undefined;
     /**
@@ -20,7 +22,8 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     size: string;
     theme: string;
 }>>> & {
-    onStepChange?: ((value: StepChangeEvent) => any) | undefined;
+    onChange?: ((value: StepperHorizontalChangeEvent) => any) | undefined;
+    onStepChange?: ((value: StepperHorizontalChangeEvent) => any) | undefined;
 }, {
     size: BreakpointCustomizable<StepperHorizontalSize>;
     theme: Theme;

package/lib/components/StepperHorizontalWrapper.vue.js

@@ -1,24 +1,24 @@
-import { defineComponent as s, ref as l, onMounted as f, onUpdated as m, openBlock as d, createBlock as i, resolveDynamicComponent as u, unref as c, withCtx as C, renderSlot as h } from "vue";
-import { getPrefixedTagName as _, syncProperties as o, addEventListenerToElementRef as g } from "../../utils.js";
-const y = /* @__PURE__ */ s({
+import { defineComponent as l, ref as f, onMounted as m, onUpdated as d, openBlock as c, createBlock as u, resolveDynamicComponent as i, unref as h, withCtx as g, renderSlot as C } from "vue";
+import { getPrefixedTagName as _, syncProperties as o, addEventListenerToElementRef as r } from "../../utils.js";
+const y = /* @__PURE__ */ l({
   __name: "StepperHorizontalWrapper",
   props: {
     size: { default: "small" },
     theme: { default: "light" }
   },
-  emits: ["stepChange"],
-  setup(n, { emit: r }) {
-    const t = n, p = _("p-stepper-horizontal"), e = l();
-    return f(() => {
-      o(e.value, t), g(e.value, "stepChange", r);
-    }), m(() => {
-      o(e.value, t);
-    }), (a, v) => (d(), i(u(c(p)), {
+  emits: ["change", "stepChange"],
+  setup(a, { emit: t }) {
+    const n = a, p = _("p-stepper-horizontal"), e = f();
+    return m(() => {
+      o(e.value, n), r(e.value, "change", t), r(e.value, "stepChange", t);
+    }), d(() => {
+      o(e.value, n);
+    }), (s, v) => (c(), u(i(h(p)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, {
-      default: C(() => [
-        h(a.$slots, "default")
+      default: g(() => [
+        C(s.$slots, "default")
       ]),
       _: 3
     }, 512));