@porsche-design-system/components-vue 3.27.3 → 3.28.0-rc.0

package/CHANGELOG.md

@@ -14,6 +14,29 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0),
 
 ### [Unreleased]
 
+### [3.28.0-rc.0] - 2025-04-11
+
+#### Added
+
+- `Input Password`: ([#3763](https://github.com/porsche-design-system/porsche-design-system/pull/3763))
+- `Drilldown`, `Drilldown Item`: CSS variable `--p-drilldown-grid-template` and `--p-drilldown-gap` (experimental)
+  ([#3822](https://github.com/porsche-design-system/porsche-design-system/pull/3822))
+- `Drilldown Item`: named slot `button` and `header` (experimental)
+  ([#3822](https://github.com/porsche-design-system/porsche-design-system/pull/3822))
+- `Drilldown Link`: (experimental) ([#3822](https://github.com/porsche-design-system/porsche-design-system/pull/3822))
+
+#### Changed
+
+- **Breaking Change** `Flyout Multilevel`, `Flyout Multilevel Item`: renamed (experimental) component to `Drilldown` and
+  `Drilldown Item` ([#3822](https://github.com/porsche-design-system/porsche-design-system/pull/3822))
+- **Breaking Change** `Drilldown Item` doesn't style slotted `<a>` tags anymore, instead use `Drilldown Link` or a
+  custom link ([#3822](https://github.com/porsche-design-system/porsche-design-system/pull/3822))
+
+#### Fixed
+
+- `aria` prop now supports a colon inside a value, e.g. `aria="{ 'aria-label': 'Always remember: yes you can!' }"`
+  ([#3680](https://github.com/porsche-design-system/porsche-design-system/pull/3680))
+
 ### [3.27.3] - 2025-03-21
 
 ### [3.27.2] - 2025-03-20

package/cjs/lib/components/DrilldownItemWrapper.vue.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),t=require("../../utils.cjs"),l=e.defineComponent({__name:"DrilldownItemWrapper",props:{cascade:{type:Boolean,default:!1},identifier:{},label:{},primary:{type:Boolean,default:!1},secondary:{type:Boolean,default:!1}},setup(r){const s=t.usePrefix("p-drilldown-item"),a=r,o=e.ref(),n=()=>t.syncProperties(o,a);return e.onMounted(n),e.onUpdated(n),(p,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(s)),{ref_key:"pdsComponentRef",ref:o},{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},512))}});module.exports=l;

package/cjs/lib/components/DrilldownItemWrapper.vue2.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("./DrilldownItemWrapper.vue.cjs");module.exports=e;

package/cjs/lib/components/DrilldownLinkWrapper.vue.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),t=require("../../utils.cjs"),a=e.defineComponent({__name:"DrilldownLinkWrapper",props:{active:{type:Boolean,default:!1},aria:{},download:{},href:{},rel:{},target:{default:"_self"}},setup(r){const s=t.usePrefix("p-drilldown-link"),p=r,n=e.ref(),o=()=>t.syncProperties(n,p);return e.onMounted(o),e.onUpdated(o),(l,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(s)),{ref_key:"pdsComponentRef",ref:n},{default:e.withCtx(()=>[e.renderSlot(l.$slots,"default")]),_:3},512))}});module.exports=a;

package/cjs/lib/components/DrilldownLinkWrapper.vue2.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("./DrilldownLinkWrapper.vue.cjs");module.exports=e;

package/cjs/lib/components/DrilldownWrapper.vue.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),t=require("../../utils.cjs"),m=e.defineComponent({__name:"DrilldownWrapper",props:{activeIdentifier:{},aria:{},open:{type:Boolean,default:!1},theme:{}},emits:["dismiss","update"],setup(c,{emit:a}){const d=t.usePrefix("p-drilldown"),o=c,n=e.ref(),r=a,i=e.inject(t.themeInjectionKey),p=()=>t.syncProperties(n,{...o,theme:o.theme||i.value});return e.onMounted(()=>{p(),t.addEventListenerToElementRef(n,"dismiss",r),t.addEventListenerToElementRef(n,"update",r)}),e.onUpdated(p),e.watch(i,s=>{t.syncProperties(n,{theme:o.theme||s})}),(s,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(d)),{ref_key:"pdsComponentRef",ref:n},{default:e.withCtx(()=>[e.renderSlot(s.$slots,"default")]),_:3},512))}});module.exports=m;

package/cjs/lib/components/DrilldownWrapper.vue2.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("./DrilldownWrapper.vue.cjs");module.exports=e;

package/cjs/lib/components/InputPasswordWrapper.vue.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),t=require("../../utils.cjs"),p=e.defineComponent({__name:"InputPasswordWrapper",props:{autoComplete:{default:""},compact:{type:Boolean,default:!1},description:{default:""},disabled:{type:Boolean,default:!1},form:{},hideLabel:{default:!1},label:{default:""},maxLength:{},message:{default:""},minLength:{},name:{},placeholder:{default:""},readOnly:{type:Boolean,default:!1},required:{type:Boolean,default:!1},state:{default:"none"},theme:{},toggle:{type:Boolean,default:!1},value:{default:""}},emits:["blur","change","input"],setup(d,{emit:u}){const f=t.usePrefix("p-input-password"),o=d,n=e.ref(),a=u,s=e.inject(t.themeInjectionKey),r=()=>t.syncProperties(n,{...o,theme:o.theme||s.value});return e.onMounted(()=>{r(),t.addEventListenerToElementRef(n,"blur",a),t.addEventListenerToElementRef(n,"change",a),t.addEventListenerToElementRef(n,"input",a)}),e.onUpdated(r),e.watch(s,l=>{t.syncProperties(n,{theme:o.theme||l})}),(l,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(f)),{ref_key:"pdsComponentRef",ref:n},{default:e.withCtx(()=>[e.renderSlot(l.$slots,"default")]),_:3},512))}});module.exports=p;

package/cjs/lib/components/InputPasswordWrapper.vue2.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("./InputPasswordWrapper.vue.cjs");module.exports=e;

package/cjs/public-api.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@porsche-design-system/components-js"),_=require("./lib/components/AccordionWrapper.vue.cjs"),u=require("./lib/components/BannerWrapper.vue.cjs"),p=require("./lib/components/ButtonWrapper.vue.cjs"),s=require("./lib/components/ButtonGroupWrapper.vue.cjs"),i=require("./lib/components/ButtonPureWrapper.vue.cjs"),a=require("./lib/components/ButtonTileWrapper.vue.cjs"),n=require("./lib/components/CanvasWrapper.vue.cjs"),c=require("./lib/components/CarouselWrapper.vue.cjs"),o=require("./lib/components/CheckboxWrapper.vue.cjs"),l=require("./lib/components/CheckboxWrapperWrapper.vue.cjs"),v=require("./lib/components/ContentWrapperWrapper.vue.cjs"),g=require("./lib/components/CrestWrapper.vue.cjs"),y=require("./lib/components/DisplayWrapper.vue.cjs"),P=require("./lib/components/DividerWrapper.vue.cjs"),W=require("./lib/components/FieldsetWrapper.vue.cjs"),q=require("./lib/components/FieldsetWrapperWrapper.vue.cjs"),d=require("./lib/components/FlexWrapper.vue.cjs"),T=require("./lib/components/FlexItemWrapper.vue.cjs"),S=require("./lib/components/FlyoutWrapper.vue.cjs"),m=require("./lib/components/FlyoutMultilevelWrapper.vue.cjs"),b=require("./lib/components/FlyoutMultilevelItemWrapper.vue.cjs"),C=require("./lib/components/GridWrapper.vue.cjs"),x=require("./lib/components/GridItemWrapper.vue.cjs"),I=require("./lib/components/HeadingWrapper.vue.cjs"),M=require("./lib/components/HeadlineWrapper.vue.cjs"),k=require("./lib/components/IconWrapper.vue.cjs"),h=require("./lib/components/InlineNotificationWrapper.vue.cjs"),B=require("./lib/components/LinkWrapper.vue.cjs"),F=require("./lib/components/LinkPureWrapper.vue.cjs"),L=require("./lib/components/LinkSocialWrapper.vue.cjs"),H=require("./lib/components/LinkTileWrapper.vue.cjs"),D=require("./lib/components/LinkTileModelSignatureWrapper.vue.cjs"),O=require("./lib/components/LinkTileProductWrapper.vue.cjs"),R=require("./lib/components/MarqueWrapper.vue.cjs"),w=require("./lib/components/ModalWrapper.vue.cjs"),G=require("./lib/components/ModelSignatureWrapper.vue.cjs"),f=require("./lib/components/MultiSelectWrapper.vue.cjs"),j=require("./lib/components/MultiSelectOptionWrapper.vue.cjs"),z=require("./lib/components/OptgroupWrapper.vue.cjs"),A=require("./lib/components/PaginationWrapper.vue.cjs"),K=require("./lib/components/PinCodeWrapper.vue.cjs"),N=require("./lib/components/PopoverWrapper.vue.cjs"),J=require("./lib/components/RadioButtonWrapperWrapper.vue.cjs"),E=require("./lib/components/ScrollerWrapper.vue.cjs"),Q=require("./lib/components/SegmentedControlWrapper.vue.cjs"),U=require("./lib/components/SegmentedControlItemWrapper.vue.cjs"),V=require("./lib/components/SelectWrapper.vue.cjs"),X=require("./lib/components/SelectOptionWrapper.vue.cjs"),Y=require("./lib/components/SelectWrapperWrapper.vue.cjs"),Z=require("./lib/components/SheetWrapper.vue.cjs"),$=require("./lib/components/SpinnerWrapper.vue.cjs"),ee=require("./lib/components/StepperHorizontalWrapper.vue.cjs"),re=require("./lib/components/StepperHorizontalItemWrapper.vue.cjs"),te=require("./lib/components/SwitchWrapper.vue.cjs"),_e=require("./lib/components/TableWrapper.vue.cjs"),ue=require("./lib/components/TableBodyWrapper.vue.cjs"),pe=require("./lib/components/TableCellWrapper.vue.cjs"),se=require("./lib/components/TableHeadWrapper.vue.cjs"),ie=require("./lib/components/TableHeadCellWrapper.vue.cjs"),ae=require("./lib/components/TableHeadRowWrapper.vue.cjs"),ne=require("./lib/components/TableRowWrapper.vue.cjs"),ce=require("./lib/components/TabsWrapper.vue.cjs"),oe=require("./lib/components/TabsBarWrapper.vue.cjs"),le=require("./lib/components/TabsItemWrapper.vue.cjs"),ve=require("./lib/components/TagWrapper.vue.cjs"),ge=require("./lib/components/TagDismissibleWrapper.vue.cjs"),ye=require("./lib/components/TextWrapper.vue.cjs"),Pe=require("./lib/components/TextFieldWrapperWrapper.vue.cjs"),We=require("./lib/components/TextListWrapper.vue.cjs"),qe=require("./lib/components/TextListItemWrapper.vue.cjs"),de=require("./lib/components/TextareaWrapper.vue.cjs"),Te=require("./lib/components/TextareaWrapperWrapper.vue.cjs"),Se=require("./lib/components/ToastWrapper.vue.cjs"),me=require("./lib/components/WordmarkWrapper.vue.cjs"),e=require("./utils.cjs"),be=require("./PorscheDesignSystemProvider.vue.cjs"),r=require("./plugin.cjs");Object.defineProperty(exports,"componentsReady",{enumerable:!0,get:()=>t.componentsReady});exports.PAccordion=_;exports.PBanner=u;exports.PButton=p;exports.PButtonGroup=s;exports.PButtonPure=i;exports.PButtonTile=a;exports.PCanvas=n;exports.PCarousel=c;exports.PCheckbox=o;exports.PCheckboxWrapper=l;exports.PContentWrapper=v;exports.PCrest=g;exports.PDisplay=y;exports.PDivider=P;exports.PFieldset=W;exports.PFieldsetWrapper=q;exports.PFlex=d;exports.PFlexItem=T;exports.PFlyout=S;exports.PFlyoutMultilevel=m;exports.PFlyoutMultilevelItem=b;exports.PGrid=C;exports.PGridItem=x;exports.PHeading=I;exports.PHeadline=M;exports.PIcon=k;exports.PInlineNotification=h;exports.PLink=B;exports.PLinkPure=F;exports.PLinkSocial=L;exports.PLinkTile=H;exports.PLinkTileModelSignature=D;exports.PLinkTileProduct=O;exports.PMarque=R;exports.PModal=w;exports.PModelSignature=G;exports.PMultiSelect=f;exports.PMultiSelectOption=j;exports.POptgroup=z;exports.PPagination=A;exports.PPinCode=K;exports.PPopover=N;exports.PRadioButtonWrapper=J;exports.PScroller=E;exports.PSegmentedControl=Q;exports.PSegmentedControlItem=U;exports.PSelect=V;exports.PSelectOption=X;exports.PSelectWrapper=Y;exports.PSheet=Z;exports.PSpinner=$;exports.PStepperHorizontal=ee;exports.PStepperHorizontalItem=re;exports.PSwitch=te;exports.PTable=_e;exports.PTableBody=ue;exports.PTableCell=pe;exports.PTableHead=se;exports.PTableHeadCell=ie;exports.PTableHeadRow=ae;exports.PTableRow=ne;exports.PTabs=ce;exports.PTabsBar=oe;exports.PTabsItem=le;exports.PTag=ve;exports.PTagDismissible=ge;exports.PText=ye;exports.PTextFieldWrapper=Pe;exports.PTextList=We;exports.PTextListItem=qe;exports.PTextarea=de;exports.PTextareaWrapper=Te;exports.PToast=Se;exports.PWordmark=me;exports.themeInjectionKey=e.themeInjectionKey;exports.useToastManager=e.useToastManager;exports.PorscheDesignSystemProvider=be;exports.createPorscheDesignSystem=r.createPorscheDesignSystem;exports.usePorscheDesignSystemPlugin=r.usePorscheDesignSystemPlugin;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("@porsche-design-system/components-js"),t=require("./lib/components/AccordionWrapper.vue.cjs"),p=require("./lib/components/BannerWrapper.vue.cjs"),u=require("./lib/components/ButtonWrapper.vue.cjs"),s=require("./lib/components/ButtonGroupWrapper.vue.cjs"),i=require("./lib/components/ButtonPureWrapper.vue.cjs"),n=require("./lib/components/ButtonTileWrapper.vue.cjs"),a=require("./lib/components/CanvasWrapper.vue.cjs"),c=require("./lib/components/CarouselWrapper.vue.cjs"),o=require("./lib/components/CheckboxWrapper.vue.cjs"),l=require("./lib/components/CheckboxWrapperWrapper.vue.cjs"),v=require("./lib/components/ContentWrapperWrapper.vue.cjs"),g=require("./lib/components/CrestWrapper.vue.cjs"),P=require("./lib/components/DisplayWrapper.vue.cjs"),y=require("./lib/components/DividerWrapper.vue.cjs"),W=require("./lib/components/DrilldownWrapper.vue.cjs"),q=require("./lib/components/DrilldownItemWrapper.vue.cjs"),d=require("./lib/components/DrilldownLinkWrapper.vue.cjs"),T=require("./lib/components/FieldsetWrapper.vue.cjs"),S=require("./lib/components/FieldsetWrapperWrapper.vue.cjs"),m=require("./lib/components/FlexWrapper.vue.cjs"),b=require("./lib/components/FlexItemWrapper.vue.cjs"),C=require("./lib/components/FlyoutWrapper.vue.cjs"),I=require("./lib/components/GridWrapper.vue.cjs"),k=require("./lib/components/GridItemWrapper.vue.cjs"),x=require("./lib/components/HeadingWrapper.vue.cjs"),D=require("./lib/components/HeadlineWrapper.vue.cjs"),L=require("./lib/components/IconWrapper.vue.cjs"),h=require("./lib/components/InlineNotificationWrapper.vue.cjs"),B=require("./lib/components/InputPasswordWrapper.vue.cjs"),M=require("./lib/components/LinkWrapper.vue.cjs"),w=require("./lib/components/LinkPureWrapper.vue.cjs"),H=require("./lib/components/LinkSocialWrapper.vue.cjs"),F=require("./lib/components/LinkTileWrapper.vue.cjs"),O=require("./lib/components/LinkTileModelSignatureWrapper.vue.cjs"),R=require("./lib/components/LinkTileProductWrapper.vue.cjs"),G=require("./lib/components/MarqueWrapper.vue.cjs"),f=require("./lib/components/ModalWrapper.vue.cjs"),j=require("./lib/components/ModelSignatureWrapper.vue.cjs"),z=require("./lib/components/MultiSelectWrapper.vue.cjs"),A=require("./lib/components/MultiSelectOptionWrapper.vue.cjs"),K=require("./lib/components/OptgroupWrapper.vue.cjs"),N=require("./lib/components/PaginationWrapper.vue.cjs"),J=require("./lib/components/PinCodeWrapper.vue.cjs"),E=require("./lib/components/PopoverWrapper.vue.cjs"),Q=require("./lib/components/RadioButtonWrapperWrapper.vue.cjs"),U=require("./lib/components/ScrollerWrapper.vue.cjs"),V=require("./lib/components/SegmentedControlWrapper.vue.cjs"),X=require("./lib/components/SegmentedControlItemWrapper.vue.cjs"),Y=require("./lib/components/SelectWrapper.vue.cjs"),Z=require("./lib/components/SelectOptionWrapper.vue.cjs"),$=require("./lib/components/SelectWrapperWrapper.vue.cjs"),ee=require("./lib/components/SheetWrapper.vue.cjs"),re=require("./lib/components/SpinnerWrapper.vue.cjs"),_e=require("./lib/components/StepperHorizontalWrapper.vue.cjs"),te=require("./lib/components/StepperHorizontalItemWrapper.vue.cjs"),pe=require("./lib/components/SwitchWrapper.vue.cjs"),ue=require("./lib/components/TableWrapper.vue.cjs"),se=require("./lib/components/TableBodyWrapper.vue.cjs"),ie=require("./lib/components/TableCellWrapper.vue.cjs"),ne=require("./lib/components/TableHeadWrapper.vue.cjs"),ae=require("./lib/components/TableHeadCellWrapper.vue.cjs"),ce=require("./lib/components/TableHeadRowWrapper.vue.cjs"),oe=require("./lib/components/TableRowWrapper.vue.cjs"),le=require("./lib/components/TabsWrapper.vue.cjs"),ve=require("./lib/components/TabsBarWrapper.vue.cjs"),ge=require("./lib/components/TabsItemWrapper.vue.cjs"),Pe=require("./lib/components/TagWrapper.vue.cjs"),ye=require("./lib/components/TagDismissibleWrapper.vue.cjs"),We=require("./lib/components/TextWrapper.vue.cjs"),qe=require("./lib/components/TextFieldWrapperWrapper.vue.cjs"),de=require("./lib/components/TextListWrapper.vue.cjs"),Te=require("./lib/components/TextListItemWrapper.vue.cjs"),Se=require("./lib/components/TextareaWrapper.vue.cjs"),me=require("./lib/components/TextareaWrapperWrapper.vue.cjs"),be=require("./lib/components/ToastWrapper.vue.cjs"),Ce=require("./lib/components/WordmarkWrapper.vue.cjs"),e=require("./utils.cjs"),Ie=require("./PorscheDesignSystemProvider.vue.cjs"),r=require("./plugin.cjs");Object.defineProperty(exports,"componentsReady",{enumerable:!0,get:()=>_.componentsReady});exports.PAccordion=t;exports.PBanner=p;exports.PButton=u;exports.PButtonGroup=s;exports.PButtonPure=i;exports.PButtonTile=n;exports.PCanvas=a;exports.PCarousel=c;exports.PCheckbox=o;exports.PCheckboxWrapper=l;exports.PContentWrapper=v;exports.PCrest=g;exports.PDisplay=P;exports.PDivider=y;exports.PDrilldown=W;exports.PDrilldownItem=q;exports.PDrilldownLink=d;exports.PFieldset=T;exports.PFieldsetWrapper=S;exports.PFlex=m;exports.PFlexItem=b;exports.PFlyout=C;exports.PGrid=I;exports.PGridItem=k;exports.PHeading=x;exports.PHeadline=D;exports.PIcon=L;exports.PInlineNotification=h;exports.PInputPassword=B;exports.PLink=M;exports.PLinkPure=w;exports.PLinkSocial=H;exports.PLinkTile=F;exports.PLinkTileModelSignature=O;exports.PLinkTileProduct=R;exports.PMarque=G;exports.PModal=f;exports.PModelSignature=j;exports.PMultiSelect=z;exports.PMultiSelectOption=A;exports.POptgroup=K;exports.PPagination=N;exports.PPinCode=J;exports.PPopover=E;exports.PRadioButtonWrapper=Q;exports.PScroller=U;exports.PSegmentedControl=V;exports.PSegmentedControlItem=X;exports.PSelect=Y;exports.PSelectOption=Z;exports.PSelectWrapper=$;exports.PSheet=ee;exports.PSpinner=re;exports.PStepperHorizontal=_e;exports.PStepperHorizontalItem=te;exports.PSwitch=pe;exports.PTable=ue;exports.PTableBody=se;exports.PTableCell=ie;exports.PTableHead=ne;exports.PTableHeadCell=ae;exports.PTableHeadRow=ce;exports.PTableRow=oe;exports.PTabs=le;exports.PTabsBar=ve;exports.PTabsItem=ge;exports.PTag=Pe;exports.PTagDismissible=ye;exports.PText=We;exports.PTextFieldWrapper=qe;exports.PTextList=de;exports.PTextListItem=Te;exports.PTextarea=Se;exports.PTextareaWrapper=me;exports.PToast=be;exports.PWordmark=Ce;exports.themeInjectionKey=e.themeInjectionKey;exports.useToastManager=e.useToastManager;exports.PorscheDesignSystemProvider=Ie;exports.createPorscheDesignSystem=r.createPorscheDesignSystem;exports.usePorscheDesignSystemPlugin=r.usePorscheDesignSystemPlugin;

package/esm/lib/components/{FlyoutMultilevelItemWrapper.vue.d.ts → DrilldownItemWrapper.vue.d.ts}

@@ -1,14 +1,14 @@
-type PFlyoutMultilevelItemProps = {
+type PDrilldownItemProps = {
     /**
      * Private property set by the component itself.
      */
     cascade?: boolean;
     /**
-     * Unique identifier which controls if this item should be shown when the active-identifier on the flyout-multilevel is set to this value.
+     * Unique identifier which controls if this item should be shown when the active-identifier on the drilldown is set to this value.
      */
     identifier: string;
     /**
-     * Label of the item.
+     * Renders back button, header section on mobile view and cascade button to reach a deeper level of the navigation structure.
      */
     label?: string;
     /**
@@ -23,7 +23,7 @@ type PFlyoutMultilevelItemProps = {
 declare function __VLS_template(): {
     default?(_: {}): any;
 };
-declare const __VLS_component: import("vue").DefineComponent<PFlyoutMultilevelItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PFlyoutMultilevelItemProps> & Readonly<{}>, {
+declare const __VLS_component: import("vue").DefineComponent<PDrilldownItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PDrilldownItemProps> & Readonly<{}>, {
     primary: boolean;
     secondary: boolean;
     cascade: boolean;

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

@@ -0,0 +1,27 @@
+import { defineComponent as p, ref as s, onMounted as l, onUpdated as f, openBlock as d, createBlock as c, resolveDynamicComponent as i, unref as m, withCtx as u, renderSlot as y } from "vue";
+import { usePrefix as _, syncProperties as C } from "../../utils.mjs";
+const x = /* @__PURE__ */ p({
+  __name: "DrilldownItemWrapper",
+  props: {
+    cascade: { type: Boolean, default: !1 },
+    identifier: {},
+    label: {},
+    primary: { type: Boolean, default: !1 },
+    secondary: { type: Boolean, default: !1 }
+  },
+  setup(n) {
+    const t = _("p-drilldown-item"), r = n, e = s(), o = () => C(e, r);
+    return l(o), f(o), (a, B) => (d(), c(i(m(t)), {
+      ref_key: "pdsComponentRef",
+      ref: e
+    }, {
+      default: u(() => [
+        y(a.$slots, "default")
+      ]),
+      _: 3
+    }, 512));
+  }
+});
+export {
+  x as default
+};

package/esm/lib/components/DrilldownItemWrapper.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./DrilldownItemWrapper.vue.mjs";
+export {
+  f as default
+};

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

@@ -0,0 +1,41 @@
+import type { SelectedAriaAttributes, DrilldownLinkAriaAttribute, DrilldownLinkTarget } from '../types';
+type PDrilldownLinkProps = {
+    /**
+     * Display link in active state.
+     */
+    active?: boolean;
+    /**
+     * Add ARIA attributes (only has effect when `href` is defined and no slotted anchor is used).
+     */
+    aria?: SelectedAriaAttributes<DrilldownLinkAriaAttribute>;
+    /**
+     * Special download attribute to open native browser download dialog if target url points to a downloadable file (only has effect when `href` is defined and no slotted anchor is used).
+     */
+    download?: string;
+    /**
+     * When providing an url then the component will be rendered as `<a>` otherwise the component expects a slotted anchor.
+     */
+    href?: string;
+    /**
+     * Specifies the relationship of the target object to the link object (only has effect when `href` is defined and no slotted anchor is used).
+     */
+    rel?: string;
+    /**
+     * Target attribute where the link should be opened (only has effect when `href` is defined and no slotted anchor is used).
+     */
+    target?: DrilldownLinkTarget;
+};
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<PDrilldownLinkProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<PDrilldownLinkProps> & Readonly<{}>, {
+    active: boolean;
+    target: DrilldownLinkTarget;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,28 @@
+import { defineComponent as s, ref as a, onMounted as l, onUpdated as f, openBlock as d, createBlock as c, resolveDynamicComponent as i, unref as m, withCtx as u, renderSlot as _ } from "vue";
+import { usePrefix as C, syncProperties as k } from "../../utils.mjs";
+const x = /* @__PURE__ */ s({
+  __name: "DrilldownLinkWrapper",
+  props: {
+    active: { type: Boolean, default: !1 },
+    aria: {},
+    download: {},
+    href: {},
+    rel: {},
+    target: { default: "_self" }
+  },
+  setup(n) {
+    const t = C("p-drilldown-link"), r = n, e = a(), o = () => k(e, r);
+    return l(o), f(o), (p, w) => (d(), c(i(m(t)), {
+      ref_key: "pdsComponentRef",
+      ref: e
+    }, {
+      default: u(() => [
+        _(p.$slots, "default")
+      ]),
+      _: 3
+    }, 512));
+  }
+});
+export {
+  x as default
+};

package/esm/lib/components/DrilldownLinkWrapper.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./DrilldownLinkWrapper.vue.mjs";
+export {
+  f as default
+};

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

@@ -0,0 +1,32 @@
+import type { SelectedAriaAttributes, DrilldownAriaAttribute, Theme } from '../types';
+type PDrilldownProps = {
+    /**
+     * Defines which drilldown-item to be visualized as opened.
+     */
+    activeIdentifier?: string | undefined;
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<DrilldownAriaAttribute>;
+    /**
+     * If true, the drilldown is visualized as opened.
+     */
+    open?: boolean;
+    /**
+     * Adapts the drilldown color depending on the theme.
+     */
+    theme?: Theme;
+};
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<PDrilldownProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {
+    open: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,31 @@
+import { defineComponent as c, ref as f, inject as l, onMounted as u, onUpdated as h, watch as _, openBlock as y, createBlock as C, resolveDynamicComponent as w, unref as v, withCtx as R, renderSlot as k } from "vue";
+import { usePrefix as x, themeInjectionKey as B, addEventListenerToElementRef as p, syncProperties as m } from "../../utils.mjs";
+const E = /* @__PURE__ */ c({
+  __name: "DrilldownWrapper",
+  props: {
+    activeIdentifier: {},
+    aria: {},
+    open: { type: Boolean, default: !1 },
+    theme: {}
+  },
+  emits: ["dismiss", "update"],
+  setup(i, { emit: a }) {
+    const d = x("p-drilldown"), t = i, e = f(), o = a, s = l(B), r = () => m(e, { ...t, theme: t.theme || s.value });
+    return u(() => {
+      r(), p(e, "dismiss", o), p(e, "update", o);
+    }), h(r), _(s, (n) => {
+      m(e, { theme: t.theme || n });
+    }), (n, P) => (y(), C(w(v(d)), {
+      ref_key: "pdsComponentRef",
+      ref: e
+    }, {
+      default: R(() => [
+        k(n.$slots, "default")
+      ]),
+      _: 3
+    }, 512));
+  }
+});
+export {
+  E as default
+};

package/esm/lib/components/DrilldownWrapper.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./DrilldownWrapper.vue.mjs";
+export {
+  f as default
+};

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

@@ -0,0 +1,108 @@
+import type { InputPasswordAutoComplete, BreakpointCustomizable, InputPasswordState, Theme } from '../types';
+type PInputPasswordProps = {
+    /**
+     * Specifies whether the input can be autofilled by the browser
+     */
+    autoComplete?: InputPasswordAutoComplete;
+    /**
+     * Displays as compact version.
+     */
+    compact?: boolean;
+    /**
+     * The description text.
+     */
+    description?: string;
+    /**
+     * Marks the password input as disabled.
+     */
+    disabled?: boolean;
+    /**
+     * The id of a form element the password input should be associated with.
+     */
+    form?: string;
+    /**
+     * Show or hide label and description text. For better accessibility it is recommended to show the label.
+     */
+    hideLabel?: BreakpointCustomizable<boolean>;
+    /**
+     * The label text.
+     */
+    label?: string;
+    /**
+     * The max length of the password input.
+     */
+    maxLength?: number;
+    /**
+     * The message styled depending on validation state.
+     */
+    message?: string;
+    /**
+     * The min length of the password input.
+     */
+    minLength?: number;
+    /**
+     * The name of the password input.
+     */
+    name: string;
+    /**
+     * The placeholder text.
+     */
+    placeholder?: string;
+    /**
+     * Specifies whether the password input should be read-only.
+     */
+    readOnly?: boolean;
+    /**
+     * Marks the password input as required.
+     */
+    required?: boolean;
+    /**
+     * The validation state.
+     */
+    state?: InputPasswordState;
+    /**
+     * Adapts the color depending on the theme.
+     */
+    theme?: Theme;
+    /**
+     * Show or hide password toggle for `input type="password"`.
+     */
+    toggle?: boolean;
+    /**
+     * The password input value.
+     */
+    value?: string;
+};
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<PInputPasswordProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    blur: (value: Event) => void;
+    change: (value: Event) => void;
+    input: (value: InputEvent) => void;
+}, string, import("vue").PublicProps, Readonly<PInputPasswordProps> & Readonly<{
+    onBlur?: ((value: Event) => any) | undefined;
+    onChange?: ((value: Event) => any) | undefined;
+    onInput?: ((value: InputEvent) => any) | undefined;
+}>, {
+    toggle: boolean;
+    label: string;
+    description: string;
+    disabled: boolean;
+    compact: boolean;
+    state: InputPasswordState;
+    required: boolean;
+    hideLabel: BreakpointCustomizable<boolean>;
+    value: string;
+    message: string;
+    autoComplete: InputPasswordAutoComplete;
+    placeholder: string;
+    readOnly: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

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

@@ -0,0 +1,45 @@
+import { defineComponent as u, ref as m, inject as c, onMounted as i, onUpdated as h, watch as y, openBlock as g, createBlock as B, resolveDynamicComponent as C, unref as _, withCtx as b, renderSlot as w } from "vue";
+import { usePrefix as v, themeInjectionKey as x, addEventListenerToElementRef as a, syncProperties as f } from "../../utils.mjs";
+const k = /* @__PURE__ */ u({
+  __name: "InputPasswordWrapper",
+  props: {
+    autoComplete: { default: "" },
+    compact: { type: Boolean, default: !1 },
+    description: { default: "" },
+    disabled: { type: Boolean, default: !1 },
+    form: {},
+    hideLabel: { default: !1 },
+    label: { default: "" },
+    maxLength: {},
+    message: { default: "" },
+    minLength: {},
+    name: {},
+    placeholder: { default: "" },
+    readOnly: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    state: { default: "none" },
+    theme: {},
+    toggle: { type: Boolean, default: !1 },
+    value: { default: "" }
+  },
+  emits: ["blur", "change", "input"],
+  setup(p, { emit: r }) {
+    const d = v("p-input-password"), t = p, e = m(), o = r, l = c(x), s = () => f(e, { ...t, theme: t.theme || l.value });
+    return i(() => {
+      s(), a(e, "blur", o), a(e, "change", o), a(e, "input", o);
+    }), h(s), y(l, (n) => {
+      f(e, { theme: t.theme || n });
+    }), (n, L) => (g(), B(C(_(d)), {
+      ref_key: "pdsComponentRef",
+      ref: e
+    }, {
+      default: b(() => [
+        w(n.$slots, "default")
+      ]),
+      _: 3
+    }, 512));
+  }
+});
+export {
+  k as default
+};

package/esm/lib/components/InputPasswordWrapper.vue2.mjs

@@ -0,0 +1,4 @@
+import f from "./InputPasswordWrapper.vue.mjs";
+export {
+  f as default
+};

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

@@ -107,10 +107,10 @@ declare const __VLS_component: import("vue").DefineComponent<PTextareaProps, {},
     hideLabel: BreakpointCustomizable<boolean>;
     value: string;
     message: string;
-    showCounter: boolean;
     autoComplete: TextareaAutoComplete;
     placeholder: string;
     readOnly: boolean;
+    showCounter: boolean;
     rows: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;

package/esm/lib/components/index.d.ts

@@ -12,19 +12,21 @@ 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 PDrilldown } from './DrilldownWrapper.vue';
+export { default as PDrilldownItem } from './DrilldownItemWrapper.vue';
+export { default as PDrilldownLink } from './DrilldownLinkWrapper.vue';
 export { default as PFieldset } from './FieldsetWrapper.vue';
 export { default as PFieldsetWrapper } from './FieldsetWrapperWrapper.vue';
 export { default as PFlex } from './FlexWrapper.vue';
 export { default as PFlexItem } from './FlexItemWrapper.vue';
 export { default as PFlyout } from './FlyoutWrapper.vue';
-export { default as PFlyoutMultilevel } from './FlyoutMultilevelWrapper.vue';
-export { default as PFlyoutMultilevelItem } from './FlyoutMultilevelItemWrapper.vue';
 export { default as PGrid } from './GridWrapper.vue';
 export { default as PGridItem } from './GridItemWrapper.vue';
 export { default as PHeading } from './HeadingWrapper.vue';
 export { default as PHeadline } from './HeadlineWrapper.vue';
 export { default as PIcon } from './IconWrapper.vue';
 export { default as PInlineNotification } from './InlineNotificationWrapper.vue';
+export { default as PInputPassword } from './InputPasswordWrapper.vue';
 export { default as PLink } from './LinkWrapper.vue';
 export { default as PLinkPure } from './LinkPureWrapper.vue';
 export { default as PLinkSocial } from './LinkSocialWrapper.vue';

package/esm/lib/types.d.ts

@@ -859,6 +859,18 @@ declare const DIVIDER_DIRECTIONS: readonly [
 ];
 export type DividerDirection = (typeof DIVIDER_DIRECTIONS)[number];
 export type DividerOrientation = DividerDirection;
+declare const DRILLDOWN_ARIA_ATTRIBUTES: readonly [
+    "aria-label"
+];
+export type DrilldownAriaAttribute = (typeof DRILLDOWN_ARIA_ATTRIBUTES)[number];
+export type DrilldownUpdate = {
+    activeIdentifier: string | undefined;
+};
+/** @deprecated */
+export type DrilldownUpdateEvent = DrilldownUpdate;
+export type DrilldownUpdateEventDetail = DrilldownUpdateEvent;
+export type DrilldownLinkTarget = LinkTarget;
+export type DrilldownLinkAriaAttribute = LinkAriaAttribute;
 declare const FIELDSET_LABEL_SIZES: readonly [
     "small",
     "medium"
@@ -971,16 +983,6 @@ declare const FLYOUT_ARIA_ATTRIBUTES: readonly [
 export type FlyoutAriaAttribute = (typeof FLYOUT_ARIA_ATTRIBUTES)[number];
 export type FlyoutMotionVisibleEndEventDetail = TransitionEvent;
 export type FlyoutMotionHiddenEndEventDetail = TransitionEvent;
-declare const FLYOUT_MULTILEVEL_ARIA_ATTRIBUTES: readonly [
-    "aria-label"
-];
-export type FlyoutMultilevelAriaAttribute = (typeof FLYOUT_MULTILEVEL_ARIA_ATTRIBUTES)[number];
-export type FlyoutMultilevelUpdate = {
-    activeIdentifier: string | undefined;
-};
-/** @deprecated */
-export type FlyoutMultilevelUpdateEvent = FlyoutMultilevelUpdate;
-export type FlyoutMultilevelUpdateEventDetail = FlyoutMultilevelUpdateEvent;
 declare const GRID_DIRECTIONS: readonly [
     "row",
     "row-reverse",
@@ -1086,6 +1088,18 @@ declare const ICON_COLORS: readonly [
     "state-disabled"
 ];
 export type IconColor = (typeof ICON_COLORS)[number];
+export type InputPasswordState = FormState;
+declare const INPUT_PASSWORD_AUTO_COMPLETE: readonly [
+    "off",
+    "on",
+    "current-password",
+    "new-password",
+    ""
+];
+export type InputPasswordAutoComplete = (typeof INPUT_PASSWORD_AUTO_COMPLETE)[number];
+export type InputPasswordChangeEventDetail = Event;
+export type InputPasswordBlurEventDetail = Event;
+export type InputPasswordInputEventDetail = InputEvent;
 export type LinkIcon = LinkButtonIconName;
 export type LinkPureIcon = LinkButtonIconName;
 export type LinkPureAriaAttribute = LinkAriaAttribute;

package/esm/public-api.mjs

@@ -8,74 +8,76 @@ import { default as i } from "./lib/components/ButtonTileWrapper.vue.mjs";
 import { default as T } from "./lib/components/CanvasWrapper.vue.mjs";
 import { default as S } from "./lib/components/CarouselWrapper.vue.mjs";
 import { default as b } from "./lib/components/CheckboxWrapper.vue.mjs";
-import { default as y } from "./lib/components/CheckboxWrapperWrapper.vue.mjs";
-import { default as k } from "./lib/components/ContentWrapperWrapper.vue.mjs";
+import { default as I } from "./lib/components/CheckboxWrapperWrapper.vue.mjs";
+import { default as D } from "./lib/components/ContentWrapperWrapper.vue.mjs";
 import { default as h } from "./lib/components/CrestWrapper.vue.mjs";
-import { default as F } from "./lib/components/DisplayWrapper.vue.mjs";
-import { default as W } from "./lib/components/DividerWrapper.vue.mjs";
-import { default as v } from "./lib/components/FieldsetWrapper.vue.mjs";
-import { default as R } from "./lib/components/FieldsetWrapperWrapper.vue.mjs";
-import { default as G } from "./lib/components/FlexWrapper.vue.mjs";
-import { default as z } from "./lib/components/FlexItemWrapper.vue.mjs";
-import { default as q } from "./lib/components/FlyoutWrapper.vue.mjs";
-import { default as K } from "./lib/components/FlyoutMultilevelWrapper.vue.mjs";
-import { default as E } from "./lib/components/FlyoutMultilevelItemWrapper.vue.mjs";
-import { default as Q } from "./lib/components/GridWrapper.vue.mjs";
-import { default as V } from "./lib/components/GridItemWrapper.vue.mjs";
-import { default as Y } from "./lib/components/HeadingWrapper.vue.mjs";
-import { default as _ } from "./lib/components/HeadlineWrapper.vue.mjs";
-import { default as ee } from "./lib/components/IconWrapper.vue.mjs";
-import { default as oe } from "./lib/components/InlineNotificationWrapper.vue.mjs";
-import { default as ae } from "./lib/components/LinkWrapper.vue.mjs";
-import { default as le } from "./lib/components/LinkPureWrapper.vue.mjs";
-import { default as se } from "./lib/components/LinkSocialWrapper.vue.mjs";
-import { default as ue } from "./lib/components/LinkTileWrapper.vue.mjs";
-import { default as xe } from "./lib/components/LinkTileModelSignatureWrapper.vue.mjs";
-import { default as ie } from "./lib/components/LinkTileProductWrapper.vue.mjs";
-import { default as Te } from "./lib/components/MarqueWrapper.vue.mjs";
-import { default as Se } from "./lib/components/ModalWrapper.vue.mjs";
-import { default as be } from "./lib/components/ModelSignatureWrapper.vue.mjs";
-import { default as ye } from "./lib/components/MultiSelectWrapper.vue.mjs";
-import { default as ke } from "./lib/components/MultiSelectOptionWrapper.vue.mjs";
-import { default as he } from "./lib/components/OptgroupWrapper.vue.mjs";
-import { default as Fe } from "./lib/components/PaginationWrapper.vue.mjs";
-import { default as We } from "./lib/components/PinCodeWrapper.vue.mjs";
-import { default as ve } from "./lib/components/PopoverWrapper.vue.mjs";
-import { default as Re } from "./lib/components/RadioButtonWrapperWrapper.vue.mjs";
-import { default as Ge } from "./lib/components/ScrollerWrapper.vue.mjs";
-import { default as ze } from "./lib/components/SegmentedControlWrapper.vue.mjs";
-import { default as qe } from "./lib/components/SegmentedControlItemWrapper.vue.mjs";
-import { default as Ke } from "./lib/components/SelectWrapper.vue.mjs";
-import { default as Ee } from "./lib/components/SelectOptionWrapper.vue.mjs";
-import { default as Qe } from "./lib/components/SelectWrapperWrapper.vue.mjs";
-import { default as Ve } from "./lib/components/SheetWrapper.vue.mjs";
-import { default as Ye } from "./lib/components/SpinnerWrapper.vue.mjs";
-import { default as _e } from "./lib/components/StepperHorizontalWrapper.vue.mjs";
-import { default as et } from "./lib/components/StepperHorizontalItemWrapper.vue.mjs";
-import { default as ot } from "./lib/components/SwitchWrapper.vue.mjs";
-import { default as at } from "./lib/components/TableWrapper.vue.mjs";
-import { default as lt } from "./lib/components/TableBodyWrapper.vue.mjs";
-import { default as st } from "./lib/components/TableCellWrapper.vue.mjs";
-import { default as ut } from "./lib/components/TableHeadWrapper.vue.mjs";
-import { default as xt } from "./lib/components/TableHeadCellWrapper.vue.mjs";
-import { default as it } from "./lib/components/TableHeadRowWrapper.vue.mjs";
-import { default as Tt } from "./lib/components/TableRowWrapper.vue.mjs";
-import { default as St } from "./lib/components/TabsWrapper.vue.mjs";
-import { default as bt } from "./lib/components/TabsBarWrapper.vue.mjs";
-import { default as yt } from "./lib/components/TabsItemWrapper.vue.mjs";
-import { default as kt } from "./lib/components/TagWrapper.vue.mjs";
-import { default as ht } from "./lib/components/TagDismissibleWrapper.vue.mjs";
-import { default as Ft } from "./lib/components/TextWrapper.vue.mjs";
-import { default as Wt } from "./lib/components/TextFieldWrapperWrapper.vue.mjs";
-import { default as vt } from "./lib/components/TextListWrapper.vue.mjs";
-import { default as Rt } from "./lib/components/TextListItemWrapper.vue.mjs";
-import { default as Gt } from "./lib/components/TextareaWrapper.vue.mjs";
-import { default as zt } from "./lib/components/TextareaWrapperWrapper.vue.mjs";
-import { default as qt } from "./lib/components/ToastWrapper.vue.mjs";
-import { default as Kt } from "./lib/components/WordmarkWrapper.vue.mjs";
-import { themeInjectionKey as Et, useToastManager as Jt } from "./utils.mjs";
-import { default as Ut } from "./PorscheDesignSystemProvider.vue.mjs";
-import { createPorscheDesignSystem as Xt, usePorscheDesignSystemPlugin as Yt } from "./plugin.mjs";
+import { default as B } from "./lib/components/DisplayWrapper.vue.mjs";
+import { default as w } from "./lib/components/DividerWrapper.vue.mjs";
+import { default as M } from "./lib/components/DrilldownWrapper.vue.mjs";
+import { default as v } from "./lib/components/DrilldownItemWrapper.vue.mjs";
+import { default as G } from "./lib/components/DrilldownLinkWrapper.vue.mjs";
+import { default as z } from "./lib/components/FieldsetWrapper.vue.mjs";
+import { default as q } from "./lib/components/FieldsetWrapperWrapper.vue.mjs";
+import { default as K } from "./lib/components/FlexWrapper.vue.mjs";
+import { default as E } from "./lib/components/FlexItemWrapper.vue.mjs";
+import { default as Q } from "./lib/components/FlyoutWrapper.vue.mjs";
+import { default as V } from "./lib/components/GridWrapper.vue.mjs";
+import { default as Y } from "./lib/components/GridItemWrapper.vue.mjs";
+import { default as _ } from "./lib/components/HeadingWrapper.vue.mjs";
+import { default as ee } from "./lib/components/HeadlineWrapper.vue.mjs";
+import { default as oe } from "./lib/components/IconWrapper.vue.mjs";
+import { default as ae } from "./lib/components/InlineNotificationWrapper.vue.mjs";
+import { default as le } from "./lib/components/InputPasswordWrapper.vue.mjs";
+import { default as se } from "./lib/components/LinkWrapper.vue.mjs";
+import { default as ue } from "./lib/components/LinkPureWrapper.vue.mjs";
+import { default as xe } from "./lib/components/LinkSocialWrapper.vue.mjs";
+import { default as ie } from "./lib/components/LinkTileWrapper.vue.mjs";
+import { default as Te } from "./lib/components/LinkTileModelSignatureWrapper.vue.mjs";
+import { default as Se } from "./lib/components/LinkTileProductWrapper.vue.mjs";
+import { default as be } from "./lib/components/MarqueWrapper.vue.mjs";
+import { default as Ie } from "./lib/components/ModalWrapper.vue.mjs";
+import { default as De } from "./lib/components/ModelSignatureWrapper.vue.mjs";
+import { default as he } from "./lib/components/MultiSelectWrapper.vue.mjs";
+import { default as Be } from "./lib/components/MultiSelectOptionWrapper.vue.mjs";
+import { default as we } from "./lib/components/OptgroupWrapper.vue.mjs";
+import { default as Me } from "./lib/components/PaginationWrapper.vue.mjs";
+import { default as ve } from "./lib/components/PinCodeWrapper.vue.mjs";
+import { default as Ge } from "./lib/components/PopoverWrapper.vue.mjs";
+import { default as ze } from "./lib/components/RadioButtonWrapperWrapper.vue.mjs";
+import { default as qe } from "./lib/components/ScrollerWrapper.vue.mjs";
+import { default as Ke } from "./lib/components/SegmentedControlWrapper.vue.mjs";
+import { default as Ee } from "./lib/components/SegmentedControlItemWrapper.vue.mjs";
+import { default as Qe } from "./lib/components/SelectWrapper.vue.mjs";
+import { default as Ve } from "./lib/components/SelectOptionWrapper.vue.mjs";
+import { default as Ye } from "./lib/components/SelectWrapperWrapper.vue.mjs";
+import { default as _e } from "./lib/components/SheetWrapper.vue.mjs";
+import { default as et } from "./lib/components/SpinnerWrapper.vue.mjs";
+import { default as ot } from "./lib/components/StepperHorizontalWrapper.vue.mjs";
+import { default as at } from "./lib/components/StepperHorizontalItemWrapper.vue.mjs";
+import { default as lt } from "./lib/components/SwitchWrapper.vue.mjs";
+import { default as st } from "./lib/components/TableWrapper.vue.mjs";
+import { default as ut } from "./lib/components/TableBodyWrapper.vue.mjs";
+import { default as xt } from "./lib/components/TableCellWrapper.vue.mjs";
+import { default as it } from "./lib/components/TableHeadWrapper.vue.mjs";
+import { default as Tt } from "./lib/components/TableHeadCellWrapper.vue.mjs";
+import { default as St } from "./lib/components/TableHeadRowWrapper.vue.mjs";
+import { default as bt } from "./lib/components/TableRowWrapper.vue.mjs";
+import { default as It } from "./lib/components/TabsWrapper.vue.mjs";
+import { default as Dt } from "./lib/components/TabsBarWrapper.vue.mjs";
+import { default as ht } from "./lib/components/TabsItemWrapper.vue.mjs";
+import { default as Bt } from "./lib/components/TagWrapper.vue.mjs";
+import { default as wt } from "./lib/components/TagDismissibleWrapper.vue.mjs";
+import { default as Mt } from "./lib/components/TextWrapper.vue.mjs";
+import { default as vt } from "./lib/components/TextFieldWrapperWrapper.vue.mjs";
+import { default as Gt } from "./lib/components/TextListWrapper.vue.mjs";
+import { default as zt } from "./lib/components/TextListItemWrapper.vue.mjs";
+import { default as qt } from "./lib/components/TextareaWrapper.vue.mjs";
+import { default as Kt } from "./lib/components/TextareaWrapperWrapper.vue.mjs";
+import { default as Et } from "./lib/components/ToastWrapper.vue.mjs";
+import { default as Qt } from "./lib/components/WordmarkWrapper.vue.mjs";
+import { themeInjectionKey as Vt, useToastManager as Xt } from "./utils.mjs";
+import { default as Zt } from "./PorscheDesignSystemProvider.vue.mjs";
+import { createPorscheDesignSystem as $t, usePorscheDesignSystemPlugin as eo } from "./plugin.mjs";
 export {
   a as PAccordion,
   l as PBanner,
@@ -86,75 +88,77 @@ export {
   T as PCanvas,
   S as PCarousel,
   b as PCheckbox,
-  y as PCheckboxWrapper,
-  k as PContentWrapper,
+  I as PCheckboxWrapper,
+  D as PContentWrapper,
   h as PCrest,
-  F as PDisplay,
-  W as PDivider,
-  v as PFieldset,
-  R as PFieldsetWrapper,
-  G as PFlex,
-  z as PFlexItem,
-  q as PFlyout,
-  K as PFlyoutMultilevel,
-  E as PFlyoutMultilevelItem,
-  Q as PGrid,
-  V as PGridItem,
-  Y as PHeading,
-  _ as PHeadline,
-  ee as PIcon,
-  oe as PInlineNotification,
-  ae as PLink,
-  le as PLinkPure,
-  se as PLinkSocial,
-  ue as PLinkTile,
-  xe as PLinkTileModelSignature,
-  ie as PLinkTileProduct,
-  Te as PMarque,
-  Se as PModal,
-  be as PModelSignature,
-  ye as PMultiSelect,
-  ke as PMultiSelectOption,
-  he as POptgroup,
-  Fe as PPagination,
-  We as PPinCode,
-  ve as PPopover,
-  Re as PRadioButtonWrapper,
-  Ge as PScroller,
-  ze as PSegmentedControl,
-  qe as PSegmentedControlItem,
-  Ke as PSelect,
-  Ee as PSelectOption,
-  Qe as PSelectWrapper,
-  Ve as PSheet,
-  Ye as PSpinner,
-  _e as PStepperHorizontal,
-  et as PStepperHorizontalItem,
-  ot as PSwitch,
-  at as PTable,
-  lt as PTableBody,
-  st as PTableCell,
-  ut as PTableHead,
-  xt as PTableHeadCell,
-  it as PTableHeadRow,
-  Tt as PTableRow,
-  St as PTabs,
-  bt as PTabsBar,
-  yt as PTabsItem,
-  kt as PTag,
-  ht as PTagDismissible,
-  Ft as PText,
-  Wt as PTextFieldWrapper,
-  vt as PTextList,
-  Rt as PTextListItem,
-  Gt as PTextarea,
-  zt as PTextareaWrapper,
-  qt as PToast,
-  Kt as PWordmark,
-  Ut as PorscheDesignSystemProvider,
+  B as PDisplay,
+  w as PDivider,
+  M as PDrilldown,
+  v as PDrilldownItem,
+  G as PDrilldownLink,
+  z as PFieldset,
+  q as PFieldsetWrapper,
+  K as PFlex,
+  E as PFlexItem,
+  Q as PFlyout,
+  V as PGrid,
+  Y as PGridItem,
+  _ as PHeading,
+  ee as PHeadline,
+  oe as PIcon,
+  ae as PInlineNotification,
+  le as PInputPassword,
+  se as PLink,
+  ue as PLinkPure,
+  xe as PLinkSocial,
+  ie as PLinkTile,
+  Te as PLinkTileModelSignature,
+  Se as PLinkTileProduct,
+  be as PMarque,
+  Ie as PModal,
+  De as PModelSignature,
+  he as PMultiSelect,
+  Be as PMultiSelectOption,
+  we as POptgroup,
+  Me as PPagination,
+  ve as PPinCode,
+  Ge as PPopover,
+  ze as PRadioButtonWrapper,
+  qe as PScroller,
+  Ke as PSegmentedControl,
+  Ee as PSegmentedControlItem,
+  Qe as PSelect,
+  Ve as PSelectOption,
+  Ye as PSelectWrapper,
+  _e as PSheet,
+  et as PSpinner,
+  ot as PStepperHorizontal,
+  at as PStepperHorizontalItem,
+  lt as PSwitch,
+  st as PTable,
+  ut as PTableBody,
+  xt as PTableCell,
+  it as PTableHead,
+  Tt as PTableHeadCell,
+  St as PTableHeadRow,
+  bt as PTableRow,
+  It as PTabs,
+  Dt as PTabsBar,
+  ht as PTabsItem,
+  Bt as PTag,
+  wt as PTagDismissible,
+  Mt as PText,
+  vt as PTextFieldWrapper,
+  Gt as PTextList,
+  zt as PTextListItem,
+  qt as PTextarea,
+  Kt as PTextareaWrapper,
+  Et as PToast,
+  Qt as PWordmark,
+  Zt as PorscheDesignSystemProvider,
   o as componentsReady,
-  Xt as createPorscheDesignSystem,
-  Et as themeInjectionKey,
-  Yt as usePorscheDesignSystemPlugin,
-  Jt as useToastManager
+  $t as createPorscheDesignSystem,
+  Vt as themeInjectionKey,
+  eo as usePorscheDesignSystemPlugin,
+  Xt as useToastManager
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@porsche-design-system/components-vue",
-  "version": "3.27.3",
+  "version": "3.28.0-rc.0",
   "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.27.3"
+    "@porsche-design-system/components-js": "3.28.0-rc.0"
   },
   "peerDependencies": {
     "ag-grid-enterprise": ">= 33.0.0 <34.0.0",

package/cjs/lib/components/FlyoutMultilevelItemWrapper.vue.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("vue"),n=require("../../utils.cjs"),p=e.defineComponent({__name:"FlyoutMultilevelItemWrapper",props:{cascade:{type:Boolean,default:!1},identifier:{},label:{},primary:{type:Boolean,default:!1},secondary:{type:Boolean,default:!1}},setup(r){const s=n.usePrefix("p-flyout-multilevel-item"),l=r,t=e.ref(),o=()=>n.syncProperties(t,l);return e.onMounted(o),e.onUpdated(o),(a,c)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(s)),{ref_key:"pdsComponentRef",ref:t},{default:e.withCtx(()=>[e.renderSlot(a.$slots,"default")]),_:3},512))}});module.exports=p;

package/cjs/lib/components/FlyoutMultilevelItemWrapper.vue2.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("./FlyoutMultilevelItemWrapper.vue.cjs");module.exports=e;

package/cjs/lib/components/FlyoutMultilevelWrapper.vue.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("vue"),t=require("../../utils.cjs"),l=e.defineComponent({__name:"FlyoutMultilevelWrapper",props:{activeIdentifier:{},aria:{},open:{type:Boolean,default:!1},theme:{}},emits:["dismiss","update"],setup(c,{emit:m}){const a=t.usePrefix("p-flyout-multilevel"),o=c,n=e.ref(),r=m,i=e.inject(t.themeInjectionKey),p=()=>t.syncProperties(n,{...o,theme:o.theme||i.value});return e.onMounted(()=>{p(),t.addEventListenerToElementRef(n,"dismiss",r),t.addEventListenerToElementRef(n,"update",r)}),e.onUpdated(p),e.watch(i,s=>{t.syncProperties(n,{theme:o.theme||s})}),(s,u)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(a)),{ref_key:"pdsComponentRef",ref:n},{default:e.withCtx(()=>[e.renderSlot(s.$slots,"default")]),_:3},512))}});module.exports=l;

package/cjs/lib/components/FlyoutMultilevelWrapper.vue2.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("./FlyoutMultilevelWrapper.vue.cjs");module.exports=e;

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

@@ -1,27 +0,0 @@
-import { defineComponent as a, ref as p, onMounted as s, onUpdated as f, openBlock as c, createBlock as d, resolveDynamicComponent as m, unref as u, withCtx as i, renderSlot as y } from "vue";
-import { usePrefix as _, syncProperties as C } from "../../utils.mjs";
-const x = /* @__PURE__ */ a({
-  __name: "FlyoutMultilevelItemWrapper",
-  props: {
-    cascade: { type: Boolean, default: !1 },
-    identifier: {},
-    label: {},
-    primary: { type: Boolean, default: !1 },
-    secondary: { type: Boolean, default: !1 }
-  },
-  setup(t) {
-    const n = _("p-flyout-multilevel-item"), r = t, e = p(), o = () => C(e, r);
-    return s(o), f(o), (l, B) => (c(), d(m(u(n)), {
-      ref_key: "pdsComponentRef",
-      ref: e
-    }, {
-      default: i(() => [
-        y(l.$slots, "default")
-      ]),
-      _: 3
-    }, 512));
-  }
-});
-export {
-  x as default
-};

package/esm/lib/components/FlyoutMultilevelItemWrapper.vue2.mjs

@@ -1,4 +0,0 @@
-import f from "./FlyoutMultilevelItemWrapper.vue.mjs";
-export {
-  f as default
-};

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

@@ -1,32 +0,0 @@
-import type { SelectedAriaAttributes, FlyoutMultilevelAriaAttribute, Theme } from '../types';
-type PFlyoutMultilevelProps = {
-    /**
-     * Defines which flyout-multilevel-item to be visualized as opened.
-     */
-    activeIdentifier?: string | undefined;
-    /**
-     * Add ARIA attributes.
-     */
-    aria?: SelectedAriaAttributes<FlyoutMultilevelAriaAttribute>;
-    /**
-     * If true, the flyout-multilevel is visualized as opened.
-     */
-    open?: boolean;
-    /**
-     * Adapts the flyout-multilevel color depending on the theme.
-     */
-    theme?: Theme;
-};
-declare function __VLS_template(): {
-    default?(_: {}): any;
-};
-declare const __VLS_component: import("vue").DefineComponent<PFlyoutMultilevelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, any, string, import("vue").PublicProps, any, {
-    open: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

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

@@ -1,31 +0,0 @@
-import { defineComponent as c, ref as f, inject as d, onMounted as u, onUpdated as h, watch as y, openBlock as _, createBlock as v, resolveDynamicComponent as C, unref as R, withCtx as k, renderSlot as w } from "vue";
-import { usePrefix as x, themeInjectionKey as B, addEventListenerToElementRef as m, syncProperties as p } from "../../utils.mjs";
-const I = /* @__PURE__ */ c({
-  __name: "FlyoutMultilevelWrapper",
-  props: {
-    activeIdentifier: {},
-    aria: {},
-    open: { type: Boolean, default: !1 },
-    theme: {}
-  },
-  emits: ["dismiss", "update"],
-  setup(i, { emit: a }) {
-    const l = x("p-flyout-multilevel"), t = i, e = f(), n = a, s = d(B), r = () => p(e, { ...t, theme: t.theme || s.value });
-    return u(() => {
-      r(), m(e, "dismiss", n), m(e, "update", n);
-    }), h(r), y(s, (o) => {
-      p(e, { theme: t.theme || o });
-    }), (o, P) => (_(), v(C(R(l)), {
-      ref_key: "pdsComponentRef",
-      ref: e
-    }, {
-      default: k(() => [
-        w(o.$slots, "default")
-      ]),
-      _: 3
-    }, 512));
-  }
-});
-export {
-  I as default
-};

package/esm/lib/components/FlyoutMultilevelWrapper.vue2.mjs

@@ -1,4 +0,0 @@
-import f from "./FlyoutMultilevelWrapper.vue.mjs";
-export {
-  f as default
-};