@porsche-design-system/components-vue 3.16.0-rc.1 → 3.16.0

package/esm/plugin.d.ts

@@ -0,0 +1,14 @@
+import type { App, InjectionKey } from 'vue';
+export type PorscheDesignSystemPluginOptions = {
+    prefix?: string;
+    extends?: Record<string, unknown>;
+};
+export type PorscheDesignSystemPlugin = {
+    [key: string]: any;
+    install: (app: App, options?: PorscheDesignSystemPluginOptions) => void;
+};
+export declare const porscheDesignSystemSymbol: InjectionKey<PorscheDesignSystemPlugin>;
+export declare function usePorscheDesignSystemPlugin(): PorscheDesignSystemPlugin;
+export declare function createPorscheDesignSystem(options?: {
+    prefix: string;
+}): PorscheDesignSystemPlugin;

package/esm/public-api.d.ts

@@ -0,0 +1,6 @@
+export { componentsReady } from '@porsche-design-system/components-js';
+export * from './lib/components';
+export * from './lib/types';
+export { useToastManager } from './utils';
+export { default as PorscheDesignSystemProvider } from './PorscheDesignSystemProvider.vue';
+export { createPorscheDesignSystem, usePorscheDesignSystemPlugin } from './plugin';

package/esm/public-api.mjs

@@ -9,16 +9,16 @@ 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/CheckboxWrapperWrapper.vue.mjs";
 import { default as y } from "./lib/components/ContentWrapperWrapper.vue.mjs";
-import { default as k } 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 M } from "./lib/components/FieldsetWrapper.vue.mjs";
+import { default as M } from "./lib/components/CrestWrapper.vue.mjs";
+import { default as B } from "./lib/components/DisplayWrapper.vue.mjs";
+import { default as L } from "./lib/components/DividerWrapper.vue.mjs";
+import { default as H } from "./lib/components/FieldsetWrapper.vue.mjs";
 import { default as D } from "./lib/components/FieldsetWrapperWrapper.vue.mjs";
 import { default as R } from "./lib/components/FlexWrapper.vue.mjs";
 import { default as G } from "./lib/components/FlexItemWrapper.vue.mjs";
-import { default as z } from "./lib/components/FlyoutWrapper.vue.mjs";
-import { default as q } from "./lib/components/FlyoutNavigationWrapper.vue.mjs";
-import { default as j } from "./lib/components/FlyoutNavigationItemWrapper.vue.mjs";
+import { default as O } from "./lib/components/FlyoutWrapper.vue.mjs";
+import { default as A } from "./lib/components/FlyoutMultilevelWrapper.vue.mjs";
+import { default as j } from "./lib/components/FlyoutMultilevelItemWrapper.vue.mjs";
 import { default as J } from "./lib/components/GridWrapper.vue.mjs";
 import { default as Q } from "./lib/components/GridItemWrapper.vue.mjs";
 import { default as V } from "./lib/components/HeadingWrapper.vue.mjs";
@@ -36,15 +36,15 @@ import { default as Te } from "./lib/components/ModalWrapper.vue.mjs";
 import { default as Se } from "./lib/components/ModelSignatureWrapper.vue.mjs";
 import { default as be } from "./lib/components/MultiSelectWrapper.vue.mjs";
 import { default as ye } from "./lib/components/MultiSelectOptionWrapper.vue.mjs";
-import { default as ke } from "./lib/components/PaginationWrapper.vue.mjs";
-import { default as Fe } from "./lib/components/PinCodeWrapper.vue.mjs";
-import { default as We } from "./lib/components/PopoverWrapper.vue.mjs";
-import { default as Me } from "./lib/components/RadioButtonWrapperWrapper.vue.mjs";
+import { default as Me } from "./lib/components/PaginationWrapper.vue.mjs";
+import { default as Be } from "./lib/components/PinCodeWrapper.vue.mjs";
+import { default as Le } from "./lib/components/PopoverWrapper.vue.mjs";
+import { default as He } from "./lib/components/RadioButtonWrapperWrapper.vue.mjs";
 import { default as De } from "./lib/components/ScrollerWrapper.vue.mjs";
 import { default as Re } from "./lib/components/SegmentedControlWrapper.vue.mjs";
 import { default as Ge } from "./lib/components/SegmentedControlItemWrapper.vue.mjs";
-import { default as ze } from "./lib/components/SelectWrapper.vue.mjs";
-import { default as qe } from "./lib/components/SelectOptionWrapper.vue.mjs";
+import { default as Oe } from "./lib/components/SelectWrapper.vue.mjs";
+import { default as Ae } from "./lib/components/SelectOptionWrapper.vue.mjs";
 import { default as je } from "./lib/components/SelectWrapperWrapper.vue.mjs";
 import { default as Je } from "./lib/components/SpinnerWrapper.vue.mjs";
 import { default as Qe } from "./lib/components/StepperHorizontalWrapper.vue.mjs";
@@ -63,15 +63,15 @@ import { default as Tt } from "./lib/components/TabsItemWrapper.vue.mjs";
 import { default as St } from "./lib/components/TagWrapper.vue.mjs";
 import { default as bt } from "./lib/components/TagDismissibleWrapper.vue.mjs";
 import { default as yt } from "./lib/components/TextWrapper.vue.mjs";
-import { default as kt } from "./lib/components/TextFieldWrapperWrapper.vue.mjs";
-import { default as Ft } from "./lib/components/TextListWrapper.vue.mjs";
-import { default as Wt } from "./lib/components/TextListItemWrapper.vue.mjs";
-import { default as Mt } from "./lib/components/TextareaWrapperWrapper.vue.mjs";
+import { default as Mt } from "./lib/components/TextFieldWrapperWrapper.vue.mjs";
+import { default as Bt } from "./lib/components/TextListWrapper.vue.mjs";
+import { default as Lt } from "./lib/components/TextListItemWrapper.vue.mjs";
+import { default as Ht } from "./lib/components/TextareaWrapperWrapper.vue.mjs";
 import { default as Dt } from "./lib/components/ToastWrapper.vue.mjs";
 import { default as Rt } from "./lib/components/WordmarkWrapper.vue.mjs";
 import { useToastManager as Gt } from "./utils.mjs";
-import { default as zt } from "./PorscheDesignSystemProvider.vue.mjs";
-import { createPorscheDesignSystem as qt, usePorscheDesignSystemPlugin as At } from "./plugin.mjs";
+import { default as Ot } from "./PorscheDesignSystemProvider.vue.mjs";
+import { createPorscheDesignSystem as At, usePorscheDesignSystemPlugin as Nt } from "./plugin.mjs";
 export {
   a as PAccordion,
   l as PBanner,
@@ -83,16 +83,16 @@ export {
   S as PCarousel,
   b as PCheckboxWrapper,
   y as PContentWrapper,
-  k as PCrest,
-  F as PDisplay,
-  W as PDivider,
-  M as PFieldset,
+  M as PCrest,
+  B as PDisplay,
+  L as PDivider,
+  H as PFieldset,
   D as PFieldsetWrapper,
   R as PFlex,
   G as PFlexItem,
-  z as PFlyout,
-  q as PFlyoutNavigation,
-  j as PFlyoutNavigationItem,
+  O as PFlyout,
+  A as PFlyoutMultilevel,
+  j as PFlyoutMultilevelItem,
   J as PGrid,
   Q as PGridItem,
   V as PHeading,
@@ -110,15 +110,15 @@ export {
   Se as PModelSignature,
   be as PMultiSelect,
   ye as PMultiSelectOption,
-  ke as PPagination,
-  Fe as PPinCode,
-  We as PPopover,
-  Me as PRadioButtonWrapper,
+  Me as PPagination,
+  Be as PPinCode,
+  Le as PPopover,
+  He as PRadioButtonWrapper,
   De as PScroller,
   Re as PSegmentedControl,
   Ge as PSegmentedControlItem,
-  ze as PSelect,
-  qe as PSelectOption,
+  Oe as PSelect,
+  Ae as PSelectOption,
   je as PSelectWrapper,
   Je as PSpinner,
   Qe as PStepperHorizontal,
@@ -137,15 +137,15 @@ export {
   St as PTag,
   bt as PTagDismissible,
   yt as PText,
-  kt as PTextFieldWrapper,
-  Ft as PTextList,
-  Wt as PTextListItem,
-  Mt as PTextareaWrapper,
+  Mt as PTextFieldWrapper,
+  Bt as PTextList,
+  Lt as PTextListItem,
+  Ht as PTextareaWrapper,
   Dt as PToast,
   Rt as PWordmark,
-  zt as PorscheDesignSystemProvider,
+  Ot as PorscheDesignSystemProvider,
   o as componentsReady,
-  qt as createPorscheDesignSystem,
-  At as usePorscheDesignSystemPlugin,
+  At as createPorscheDesignSystem,
+  Nt as usePorscheDesignSystemPlugin,
   Gt as useToastManager
 };

package/esm/utils.d.ts

@@ -0,0 +1,10 @@
+import type { InjectionKey, Ref } from 'vue';
+import type { ToastMessage } from './lib/types';
+export declare const prefixInjectionKey: InjectionKey<string>;
+export declare const themeInjectionKey: InjectionKey<Ref<"light" | "dark" | "auto">>;
+export declare const usePrefix: (tagName: string) => string;
+export declare const syncProperties: <T extends HTMLElement>(elementRef: Ref<T | undefined>, props: Partial<T>) => void;
+export declare const addEventListenerToElementRef: <T extends HTMLElement, E extends string>(elementRef: Ref<T | undefined>, eventName: E, emit: (eventName: E, detail: any) => void) => void;
+export declare const useToastManager: () => {
+    addMessage: (message: ToastMessage) => void;
+};

package/package.json

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

package/cjs/lib/components/FlyoutNavigationItemWrapper.vue.cjs

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

package/cjs/lib/components/FlyoutNavigationItemWrapper.vue2.cjs

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

package/cjs/lib/components/FlyoutNavigationWrapper.vue.cjs

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

package/cjs/lib/components/FlyoutNavigationWrapper.vue2.cjs

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

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

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

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

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

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

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

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

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