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

package/lib/components/index.d.ts

@@ -7,6 +7,7 @@ export { default as PButtonTile } from './ButtonTileWrapper.vue';
 export { default as PCarousel } from './CarouselWrapper.vue';
 export { default as PCheckboxWrapper } from './CheckboxWrapperWrapper.vue';
 export { default as PContentWrapper } from './ContentWrapperWrapper.vue';
+export { default as PCrest } from './CrestWrapper.vue';
 export { default as PDisplay } from './DisplayWrapper.vue';
 export { default as PDivider } from './DividerWrapper.vue';
 export { default as PFieldset } from './FieldsetWrapper.vue';
@@ -56,3 +57,4 @@ export { default as PTextList } from './TextListWrapper.vue';
 export { default as PTextListItem } from './TextListItemWrapper.vue';
 export { default as PTextareaWrapper } from './TextareaWrapperWrapper.vue';
 export { default as PToast } from './ToastWrapper.vue';
+export { default as PWordmark } from './WordmarkWrapper.vue';

package/lib/types.d.ts

@@ -194,17 +194,18 @@ declare const BUTTON_ARIA_ATTRIBUTES: readonly [
     "aria-haspopup"
 ];
 export declare type ButtonAriaAttribute = typeof BUTTON_ARIA_ATTRIBUTES[number];
-declare const BREAKPOINTS: readonly [
+declare const breakpoints: readonly [
     "base",
     "xs",
     "s",
     "m",
     "l",
-    "xl"
+    "xl",
+    "xxl"
 ];
-export declare type BreakpointKey = typeof BREAKPOINTS[number];
+export type Breakpoint = (typeof breakpoints)[number];
 export declare type BreakpointValues<T> = {
-    [key in BreakpointKey]?: T;
+    [key in Breakpoint]?: T;
 } & {
     base: T;
 };
@@ -529,8 +530,8 @@ declare const ACCORDION_SIZES: readonly [
     "small",
     "medium"
 ];
-export declare type AccordionSize = typeof ACCORDION_SIZES[number];
-export declare type AccordionChangeEvent = {
+export declare type AccordionSize = (typeof ACCORDION_SIZES)[number];
+export declare type AccordionUpdateEvent = {
     open: boolean;
 };
 export declare type AccordionTag = HeadingTag;
@@ -579,7 +580,7 @@ declare const CAROUSEL_ALIGN_HEADERS: readonly [
 ];
 export declare type CarouselAlignHeader = (typeof CAROUSEL_ALIGN_HEADERS)[number];
 export declare type CarouselInternationalization = Partial<Record<"prev" | "next" | "first" | "last" | "slideLabel" | "slide", string>>;
-export declare type CarouselChangeEvent = {
+export declare type CarouselUpdateEvent = {
     activeIndex: number;
     previousIndex: number;
 };
@@ -597,6 +598,11 @@ declare const CONTENT_WRAPPER_WIDTHS: readonly [
     "full"
 ];
 export declare type ContentWrapperWidth = typeof CONTENT_WRAPPER_WIDTHS[number];
+export declare type CrestTarget = LinkTarget;
+declare const CREST_ARIA_ATTRIBUTES: readonly [
+    "aria-label"
+];
+export declare type CrestAriaAttribute = (typeof CREST_ARIA_ATTRIBUTES)[number];
 declare const DISPLAY_TAGS: readonly [
     "h1",
     "h2",
@@ -932,8 +938,8 @@ declare const PAGINATION_NUMBER_OF_PAGE_LINKS: readonly [
     5,
     7
 ];
-export declare type PaginationMaxNumberOfPageLinks = typeof PAGINATION_NUMBER_OF_PAGE_LINKS[number];
-export declare type PaginationChangeEvent = {
+export declare type PaginationMaxNumberOfPageLinks = (typeof PAGINATION_NUMBER_OF_PAGE_LINKS)[number];
+export declare type PaginationUpdateEvent = {
     page: number;
     previousPage: number;
 };
@@ -954,8 +960,8 @@ declare const SEGMENTED_CONTROL_BACKGROUND_COLORS: readonly [
     "background-surface",
     "background-default"
 ];
-export declare type SegmentedControlBackgroundColor = typeof SEGMENTED_CONTROL_BACKGROUND_COLORS[number];
-export declare type SegmentedControlChangeEvent = {
+export declare type SegmentedControlBackgroundColor = (typeof SEGMENTED_CONTROL_BACKGROUND_COLORS)[number];
+export declare type SegmentedControlUpdateEvent = {
     value: string | number;
 };
 export declare type SegmentedControlItemIcon = LinkButtonIconName;
@@ -981,8 +987,8 @@ declare const STEPPER_HORIZONTAL_SIZES: readonly [
     "small",
     "medium"
 ];
-export declare type StepperHorizontalSize = typeof STEPPER_HORIZONTAL_SIZES[number];
-export declare type StepperHorizontalChangeEvent = {
+export declare type StepperHorizontalSize = (typeof STEPPER_HORIZONTAL_SIZES)[number];
+export declare type StepperHorizontalUpdateEvent = {
     activeStepIndex: number;
 };
 declare const STEPPER_ITEM_STATES: readonly [
@@ -992,7 +998,7 @@ declare const STEPPER_ITEM_STATES: readonly [
 ];
 export declare type StepperHorizontalItemState = typeof STEPPER_ITEM_STATES[number];
 export declare type SwitchAlignLabel = AlignLabel;
-export declare type SwitchChangeEvent = {
+export declare type SwitchUpdateEvent = {
     checked: boolean;
 };
 export declare type Direction = "asc" | "desc";
@@ -1001,19 +1007,19 @@ export declare type TableHeadCellSort = {
     active?: boolean;
     direction?: Direction;
 };
-export declare type TableChangeEvent = TableHeadCellSort;
+export declare type TableUpdateEvent = TableHeadCellSort;
 declare const TABS_BAR_SIZES: readonly [
     "small",
     "medium"
 ];
-export declare type TabsBarSize = typeof TABS_BAR_SIZES[number];
+export declare type TabsBarSize = (typeof TABS_BAR_SIZES)[number];
 declare const TABS_BAR_WEIGHTS: readonly [
     "regular",
     "semi-bold",
     "semibold"
 ];
-export declare type TabsBarWeight = typeof TABS_BAR_WEIGHTS[number];
-export declare type TabsBarChangeEvent = {
+export declare type TabsBarWeight = (typeof TABS_BAR_WEIGHTS)[number];
+export declare type TabsBarUpdateEvent = {
     activeTabIndex: number;
 };
 /** @deprecated */
@@ -1024,7 +1030,7 @@ export declare type TabsWeight = TabsBarWeight;
 /** @deprecated */
 export declare type TabsGradientColorScheme = TabsBarGradientColorScheme;
 export declare type TabsGradientColor = TabsBarGradientColor;
-export declare type TabsChangeEvent = TabsBarChangeEvent;
+export declare type TabsUpdateEvent = TabsBarUpdateEvent;
 declare const TAG_DISMISSIBLE_COLORS: readonly [
     "background-base",
     "background-surface",
@@ -1100,4 +1106,14 @@ export declare type ToastMessage = {
     text: string;
     state?: ToastState;
 };
+declare const WORDMARK_SIZES: readonly [
+    "small",
+    "inherit"
+];
+export declare type WordmarkSize = (typeof WORDMARK_SIZES)[number];
+export declare type WordmarkTarget = LinkTarget;
+declare const WORDMARK_ARIA_ATTRIBUTES: readonly [
+    "aria-label"
+];
+export declare type WordmarkAriaAttribute = (typeof WORDMARK_ARIA_ATTRIBUTES)[number];
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@porsche-design-system/components-vue",
-  "version": "3.0.0-alpha.4",
+  "version": "3.0.0-alpha.6",
   "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.0.0-alpha.4"
+    "@porsche-design-system/components-js": "3.0.0-alpha.6"
   },
   "peerDependencies": {
     "vue": ">=3.0.0 <4.0.0"

package/public-api.js

@@ -1,127 +1,131 @@
-import { componentsReady as r } from "@porsche-design-system/components-js";
+import { componentsReady as t } from "@porsche-design-system/components-js";
 import { default as a } from "./lib/components/AccordionWrapper.vue.js";
 import { default as l } from "./lib/components/BannerWrapper.vue.js";
-import { default as s } from "./lib/components/ButtonWrapper.vue.js";
+import { default as p } from "./lib/components/ButtonWrapper.vue.js";
 import { default as m } from "./lib/components/ButtonGroupWrapper.vue.js";
 import { default as x } from "./lib/components/ButtonPureWrapper.vue.js";
 import { default as i } from "./lib/components/ButtonTileWrapper.vue.js";
 import { default as T } from "./lib/components/CarouselWrapper.vue.js";
 import { default as S } from "./lib/components/CheckboxWrapperWrapper.vue.js";
 import { default as b } from "./lib/components/ContentWrapperWrapper.vue.js";
-import { default as I } from "./lib/components/DisplayWrapper.vue.js";
+import { default as C } from "./lib/components/CrestWrapper.vue.js";
+import { default as W } from "./lib/components/DisplayWrapper.vue.js";
 import { default as H } from "./lib/components/DividerWrapper.vue.js";
-import { default as W } from "./lib/components/FieldsetWrapper.vue.js";
-import { default as y } from "./lib/components/FieldsetWrapperWrapper.vue.js";
-import { default as h } from "./lib/components/FlexWrapper.vue.js";
-import { default as M } from "./lib/components/FlexItemWrapper.vue.js";
-import { default as v } from "./lib/components/GridWrapper.vue.js";
-import { default as G } from "./lib/components/GridItemWrapper.vue.js";
-import { default as q } from "./lib/components/HeadingWrapper.vue.js";
-import { default as N } from "./lib/components/HeadlineWrapper.vue.js";
-import { default as E } from "./lib/components/IconWrapper.vue.js";
-import { default as K } from "./lib/components/InlineNotificationWrapper.vue.js";
-import { default as Q } from "./lib/components/LinkWrapper.vue.js";
-import { default as V } from "./lib/components/LinkPureWrapper.vue.js";
-import { default as Y } from "./lib/components/LinkSocialWrapper.vue.js";
-import { default as _ } from "./lib/components/LinkTileWrapper.vue.js";
-import { default as ee } from "./lib/components/LinkTileModelSignatureWrapper.vue.js";
-import { default as re } from "./lib/components/MarqueWrapper.vue.js";
-import { default as ae } from "./lib/components/ModalWrapper.vue.js";
-import { default as le } from "./lib/components/ModelSignatureWrapper.vue.js";
-import { default as se } from "./lib/components/PaginationWrapper.vue.js";
-import { default as me } from "./lib/components/PopoverWrapper.vue.js";
-import { default as xe } from "./lib/components/RadioButtonWrapperWrapper.vue.js";
-import { default as ie } from "./lib/components/ScrollerWrapper.vue.js";
-import { default as Te } from "./lib/components/SegmentedControlWrapper.vue.js";
-import { default as Se } from "./lib/components/SegmentedControlItemWrapper.vue.js";
-import { default as be } from "./lib/components/SelectWrapperWrapper.vue.js";
-import { default as Ie } from "./lib/components/SpinnerWrapper.vue.js";
+import { default as y } from "./lib/components/FieldsetWrapper.vue.js";
+import { default as h } from "./lib/components/FieldsetWrapperWrapper.vue.js";
+import { default as M } from "./lib/components/FlexWrapper.vue.js";
+import { default as v } from "./lib/components/FlexItemWrapper.vue.js";
+import { default as G } from "./lib/components/GridWrapper.vue.js";
+import { default as q } from "./lib/components/GridItemWrapper.vue.js";
+import { default as N } from "./lib/components/HeadingWrapper.vue.js";
+import { default as E } from "./lib/components/HeadlineWrapper.vue.js";
+import { default as K } from "./lib/components/IconWrapper.vue.js";
+import { default as Q } from "./lib/components/InlineNotificationWrapper.vue.js";
+import { default as V } from "./lib/components/LinkWrapper.vue.js";
+import { default as Y } from "./lib/components/LinkPureWrapper.vue.js";
+import { default as _ } from "./lib/components/LinkSocialWrapper.vue.js";
+import { default as ee } from "./lib/components/LinkTileWrapper.vue.js";
+import { default as te } from "./lib/components/LinkTileModelSignatureWrapper.vue.js";
+import { default as ae } from "./lib/components/MarqueWrapper.vue.js";
+import { default as le } from "./lib/components/ModalWrapper.vue.js";
+import { default as pe } from "./lib/components/ModelSignatureWrapper.vue.js";
+import { default as me } from "./lib/components/PaginationWrapper.vue.js";
+import { default as xe } from "./lib/components/PopoverWrapper.vue.js";
+import { default as ie } from "./lib/components/RadioButtonWrapperWrapper.vue.js";
+import { default as Te } from "./lib/components/ScrollerWrapper.vue.js";
+import { default as Se } from "./lib/components/SegmentedControlWrapper.vue.js";
+import { default as be } from "./lib/components/SegmentedControlItemWrapper.vue.js";
+import { default as Ce } from "./lib/components/SelectWrapperWrapper.vue.js";
+import { default as We } from "./lib/components/SpinnerWrapper.vue.js";
 import { default as He } from "./lib/components/StepperHorizontalWrapper.vue.js";
-import { default as We } from "./lib/components/StepperHorizontalItemWrapper.vue.js";
-import { default as ye } from "./lib/components/SwitchWrapper.vue.js";
-import { default as he } from "./lib/components/TableWrapper.vue.js";
-import { default as Me } from "./lib/components/TableBodyWrapper.vue.js";
-import { default as ve } from "./lib/components/TableCellWrapper.vue.js";
-import { default as Ge } from "./lib/components/TableHeadWrapper.vue.js";
-import { default as qe } from "./lib/components/TableHeadCellWrapper.vue.js";
-import { default as Ne } from "./lib/components/TableHeadRowWrapper.vue.js";
-import { default as Ee } from "./lib/components/TableRowWrapper.vue.js";
-import { default as Ke } from "./lib/components/TabsWrapper.vue.js";
-import { default as Qe } from "./lib/components/TabsBarWrapper.vue.js";
-import { default as Ve } from "./lib/components/TabsItemWrapper.vue.js";
-import { default as Ye } from "./lib/components/TagWrapper.vue.js";
-import { default as _e } from "./lib/components/TagDismissibleWrapper.vue.js";
-import { default as et } from "./lib/components/TextWrapper.vue.js";
-import { default as rt } from "./lib/components/TextFieldWrapperWrapper.vue.js";
-import { default as at } from "./lib/components/TextListWrapper.vue.js";
-import { default as lt } from "./lib/components/TextListItemWrapper.vue.js";
-import { default as st } from "./lib/components/TextareaWrapperWrapper.vue.js";
-import { default as mt } from "./lib/components/ToastWrapper.vue.js";
-import { useToastManager as xt } from "./utils.js";
-import { default as it } from "./PorscheDesignSystemProvider.vue.js";
-import { createPorscheDesignSystem as Tt, usePorscheDesignSystemPlugin as ct } from "./plugin.js";
+import { default as ye } from "./lib/components/StepperHorizontalItemWrapper.vue.js";
+import { default as he } from "./lib/components/SwitchWrapper.vue.js";
+import { default as Me } from "./lib/components/TableWrapper.vue.js";
+import { default as ve } from "./lib/components/TableBodyWrapper.vue.js";
+import { default as Ge } from "./lib/components/TableCellWrapper.vue.js";
+import { default as qe } from "./lib/components/TableHeadWrapper.vue.js";
+import { default as Ne } from "./lib/components/TableHeadCellWrapper.vue.js";
+import { default as Ee } from "./lib/components/TableHeadRowWrapper.vue.js";
+import { default as Ke } from "./lib/components/TableRowWrapper.vue.js";
+import { default as Qe } from "./lib/components/TabsWrapper.vue.js";
+import { default as Ve } from "./lib/components/TabsBarWrapper.vue.js";
+import { default as Ye } from "./lib/components/TabsItemWrapper.vue.js";
+import { default as _e } from "./lib/components/TagWrapper.vue.js";
+import { default as er } from "./lib/components/TagDismissibleWrapper.vue.js";
+import { default as tr } from "./lib/components/TextWrapper.vue.js";
+import { default as ar } from "./lib/components/TextFieldWrapperWrapper.vue.js";
+import { default as lr } from "./lib/components/TextListWrapper.vue.js";
+import { default as pr } from "./lib/components/TextListItemWrapper.vue.js";
+import { default as mr } from "./lib/components/TextareaWrapperWrapper.vue.js";
+import { default as xr } from "./lib/components/ToastWrapper.vue.js";
+import { default as ir } from "./lib/components/WordmarkWrapper.vue.js";
+import { useToastManager as Tr } from "./utils.js";
+import { default as Sr } from "./PorscheDesignSystemProvider.vue.js";
+import { createPorscheDesignSystem as br, usePorscheDesignSystemPlugin as Br } from "./plugin.js";
 export {
   a as PAccordion,
   l as PBanner,
-  s as PButton,
+  p as PButton,
   m as PButtonGroup,
   x as PButtonPure,
   i as PButtonTile,
   T as PCarousel,
   S as PCheckboxWrapper,
   b as PContentWrapper,
-  I as PDisplay,
+  C as PCrest,
+  W as PDisplay,
   H as PDivider,
-  W as PFieldset,
-  y as PFieldsetWrapper,
-  h as PFlex,
-  M as PFlexItem,
-  v as PGrid,
-  G as PGridItem,
-  q as PHeading,
-  N as PHeadline,
-  E as PIcon,
-  K as PInlineNotification,
-  Q as PLink,
-  V as PLinkPure,
-  Y as PLinkSocial,
-  _ as PLinkTile,
-  ee as PLinkTileModelSignature,
-  re as PMarque,
-  ae as PModal,
-  le as PModelSignature,
-  se as PPagination,
-  me as PPopover,
-  xe as PRadioButtonWrapper,
-  ie as PScroller,
-  Te as PSegmentedControl,
-  Se as PSegmentedControlItem,
-  be as PSelectWrapper,
-  Ie as PSpinner,
+  y as PFieldset,
+  h as PFieldsetWrapper,
+  M as PFlex,
+  v as PFlexItem,
+  G as PGrid,
+  q as PGridItem,
+  N as PHeading,
+  E as PHeadline,
+  K as PIcon,
+  Q as PInlineNotification,
+  V as PLink,
+  Y as PLinkPure,
+  _ as PLinkSocial,
+  ee as PLinkTile,
+  te as PLinkTileModelSignature,
+  ae as PMarque,
+  le as PModal,
+  pe as PModelSignature,
+  me as PPagination,
+  xe as PPopover,
+  ie as PRadioButtonWrapper,
+  Te as PScroller,
+  Se as PSegmentedControl,
+  be as PSegmentedControlItem,
+  Ce as PSelectWrapper,
+  We as PSpinner,
   He as PStepperHorizontal,
-  We as PStepperHorizontalItem,
-  ye as PSwitch,
-  he as PTable,
-  Me as PTableBody,
-  ve as PTableCell,
-  Ge as PTableHead,
-  qe as PTableHeadCell,
-  Ne as PTableHeadRow,
-  Ee as PTableRow,
-  Ke as PTabs,
-  Qe as PTabsBar,
-  Ve as PTabsItem,
-  Ye as PTag,
-  _e as PTagDismissible,
-  et as PText,
-  rt as PTextFieldWrapper,
-  at as PTextList,
-  lt as PTextListItem,
-  st as PTextareaWrapper,
-  mt as PToast,
-  it as PorscheDesignSystemProvider,
-  r as componentsReady,
-  Tt as createPorscheDesignSystem,
-  ct as usePorscheDesignSystemPlugin,
-  xt as useToastManager
+  ye as PStepperHorizontalItem,
+  he as PSwitch,
+  Me as PTable,
+  ve as PTableBody,
+  Ge as PTableCell,
+  qe as PTableHead,
+  Ne as PTableHeadCell,
+  Ee as PTableHeadRow,
+  Ke as PTableRow,
+  Qe as PTabs,
+  Ve as PTabsBar,
+  Ye as PTabsItem,
+  _e as PTag,
+  er as PTagDismissible,
+  tr as PText,
+  ar as PTextFieldWrapper,
+  lr as PTextList,
+  pr as PTextListItem,
+  mr as PTextareaWrapper,
+  xr as PToast,
+  ir as PWordmark,
+  Sr as PorscheDesignSystemProvider,
+  t as componentsReady,
+  br as createPorscheDesignSystem,
+  Br as usePorscheDesignSystemPlugin,
+  Tr as useToastManager
 };