@porsche-design-system/components-vue 3.8.0-rc.0 → 3.9.0-rc.0

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

@@ -1,113 +1,81 @@
-import type { SelectedAriaAttributes, BreakpointCustomizable } from '../types';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
-    download: {
-        type: import("vue").PropType<string>;
-    };
-    weight: {
-        type: import("vue").PropType<BreakpointCustomizable<"regular" | "semi-bold" | "semibold">>;
-        default: string;
-    };
-    label: {
-        type: import("vue").PropType<string>;
-        required: true;
-    };
-    compact: {
-        type: import("vue").PropType<BreakpointCustomizable<boolean>>;
-        default: boolean;
-    };
-    size: {
-        type: import("vue").PropType<BreakpointCustomizable<"default" | "inherit">>;
-        default: string;
-    };
-    description: {
-        type: import("vue").PropType<string>;
-        required: true;
-    };
-    aria: {
-        type: import("vue").PropType<SelectedAriaAttributes<"aria-label" | "aria-current">>;
-    };
-    align: {
-        type: import("vue").PropType<"top" | "bottom">;
-        default: string;
-    };
-    aspectRatio: {
-        type: import("vue").PropType<BreakpointCustomizable<"1:1" | "4:3" | "3:4" | "16:9" | "9:16">>;
-        default: string;
-    };
-    background: {
-        type: import("vue").PropType<"light" | "dark" | "auto">;
-        default: string;
-    };
-    gradient: {
-        type: import("vue").PropType<boolean>;
-        default: boolean;
-    };
-    href: {
-        type: import("vue").PropType<string>;
-        required: true;
-    };
-    target: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    rel: {
-        type: import("vue").PropType<string>;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    download: {
-        type: import("vue").PropType<string>;
-    };
-    weight: {
-        type: import("vue").PropType<BreakpointCustomizable<"regular" | "semi-bold" | "semibold">>;
-        default: string;
-    };
-    label: {
-        type: import("vue").PropType<string>;
-        required: true;
-    };
-    compact: {
-        type: import("vue").PropType<BreakpointCustomizable<boolean>>;
-        default: boolean;
-    };
-    size: {
-        type: import("vue").PropType<BreakpointCustomizable<"default" | "inherit">>;
-        default: string;
-    };
-    description: {
-        type: import("vue").PropType<string>;
-        required: true;
-    };
-    aria: {
-        type: import("vue").PropType<SelectedAriaAttributes<"aria-label" | "aria-current">>;
-    };
-    align: {
-        type: import("vue").PropType<"top" | "bottom">;
-        default: string;
-    };
-    aspectRatio: {
-        type: import("vue").PropType<BreakpointCustomizable<"1:1" | "4:3" | "3:4" | "16:9" | "9:16">>;
-        default: string;
-    };
-    background: {
-        type: import("vue").PropType<"light" | "dark" | "auto">;
-        default: string;
-    };
-    gradient: {
-        type: import("vue").PropType<boolean>;
-        default: boolean;
-    };
-    href: {
-        type: import("vue").PropType<string>;
-        required: true;
-    };
-    target: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    rel: {
-        type: import("vue").PropType<string>;
-    };
-}>>, {
+import type { LinkTileAlign, SelectedAriaAttributes, LinkTileAriaAttribute, BreakpointCustomizable, LinkTileAspectRatio, LinkTileBackground, LinkTileSize, LinkTileTarget, LinkTileWeight } from '../types';
+type PLinkTileProps = {
+    /**
+     * Alignment of link and description.
+     */
+    align?: LinkTileAlign;
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<LinkTileAriaAttribute>;
+    /**
+     * Aspect ratio of the link-tile.
+     */
+    aspectRatio?: BreakpointCustomizable<LinkTileAspectRatio>;
+    /**
+     * Adapts the description and link theme when used on light background image.
+     */
+    background?: LinkTileBackground;
+    /**
+     * Displays the link-tile as compact version with description and link icon only.
+     */
+    compact?: BreakpointCustomizable<boolean>;
+    /**
+     * Description text.
+     */
+    description: string;
+    /**
+     * Special download attribute to open native browser download dialog if target url points to a downloadable file.
+     */
+    download?: string;
+    /**
+     * Show gradient.
+     */
+    gradient?: boolean;
+    /**
+     * href of the `<a>`.
+     */
+    href: string;
+    /**
+     * Label of the <a />.
+     */
+    label: string;
+    /**
+     * Specifies the relationship of the target object to the link object.
+     */
+    rel?: string;
+    /**
+     * Font size of the description.
+     */
+    size?: BreakpointCustomizable<LinkTileSize>;
+    /**
+     * Target attribute where the link should be opened.
+     */
+    target?: LinkTileTarget;
+    /**
+     * Font weight of the description.
+     */
+    weight?: BreakpointCustomizable<LinkTileWeight>;
+};
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PLinkTileProps>, {
+    align: string;
+    aspectRatio: string;
+    background: string;
+    compact: boolean;
+    gradient: boolean;
+    size: string;
+    target: string;
+    weight: 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<PLinkTileProps>, {
+    align: string;
+    aspectRatio: string;
+    background: string;
+    compact: boolean;
+    gradient: boolean;
+    size: string;
+    target: string;
+    weight: string;
+}>>>, {
     weight: BreakpointCustomizable<"regular" | "semi-bold" | "semibold">;
     compact: BreakpointCustomizable<boolean>;
     size: BreakpointCustomizable<"default" | "inherit">;
@@ -120,6 +88,23 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     default?(_: {}): any;
 }>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -1,5 +1,5 @@
-import { defineComponent as l, ref as d, onMounted as f, onUpdated as p, openBlock as s, createBlock as i, resolveDynamicComponent as u, unref as c, withCtx as m, renderSlot as g } from "vue";
-import { getPrefixedTagName as _, syncProperties as o } from "../../utils.mjs";
+import { defineComponent as l, ref as d, onMounted as f, onUpdated as p, openBlock as s, createBlock as i, resolveDynamicComponent as u, unref as c, withCtx as m, renderSlot as _ } from "vue";
+import { usePrefix as k, syncProperties as g } from "../../utils.mjs";
 const h = /* @__PURE__ */ l({
   __name: "LinkTileWrapper",
   props: {
@@ -18,18 +18,14 @@ const h = /* @__PURE__ */ l({
     target: { default: "_self" },
     weight: { default: "semi-bold" }
   },
-  setup(a) {
-    const t = a, n = _("p-link-tile"), e = d();
-    return f(() => {
-      o(e.value, t);
-    }), p(() => {
-      o(e.value, t);
-    }), (r, k) => (s(), i(u(c(n)), {
+  setup(o) {
+    const n = k("p-link-tile"), a = o, e = d(), t = () => g(e, a);
+    return f(t), p(t), (r, C) => (s(), i(u(c(n)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, {
       default: m(() => [
-        g(r.$slots, "default")
+        _(r.$slots, "default")
       ]),
       _: 3
     }, 512));

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

@@ -1,78 +1,57 @@
-import type { SelectedAriaAttributes, BreakpointCustomizable } from '../types';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
-    download: {
-        type: import("vue").PropType<string>;
-    };
-    theme: {
-        type: import("vue").PropType<"light" | "dark" | "auto">;
-        default: string;
-    };
-    aria: {
-        type: import("vue").PropType<SelectedAriaAttributes<"aria-label" | "aria-current">>;
-    };
-    hideLabel: {
-        type: import("vue").PropType<BreakpointCustomizable<boolean>>;
-        default: boolean;
-    };
-    icon: {
-        type: import("vue").PropType<import("../types").LinkButtonIconName>;
-        default: string;
-    };
-    iconSource: {
-        type: import("vue").PropType<string>;
-    };
-    variant: {
-        type: import("vue").PropType<"primary" | "secondary" | "tertiary">;
-        default: string;
-    };
-    href: {
-        type: import("vue").PropType<string>;
-    };
-    target: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    rel: {
-        type: import("vue").PropType<string>;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    download: {
-        type: import("vue").PropType<string>;
-    };
-    theme: {
-        type: import("vue").PropType<"light" | "dark" | "auto">;
-        default: string;
-    };
-    aria: {
-        type: import("vue").PropType<SelectedAriaAttributes<"aria-label" | "aria-current">>;
-    };
-    hideLabel: {
-        type: import("vue").PropType<BreakpointCustomizable<boolean>>;
-        default: boolean;
-    };
-    icon: {
-        type: import("vue").PropType<import("../types").LinkButtonIconName>;
-        default: string;
-    };
-    iconSource: {
-        type: import("vue").PropType<string>;
-    };
-    variant: {
-        type: import("vue").PropType<"primary" | "secondary" | "tertiary">;
-        default: string;
-    };
-    href: {
-        type: import("vue").PropType<string>;
-    };
-    target: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    rel: {
-        type: import("vue").PropType<string>;
-    };
-}>>, {
-    theme: "light" | "dark" | "auto";
+import type { SelectedAriaAttributes, LinkAriaAttribute, BreakpointCustomizable, LinkIcon, LinkTarget, Theme, LinkVariant } from '../types';
+type PLinkProps = {
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<LinkAriaAttribute>;
+    /**
+     * Special download attribute to open native browser download dialog if target url points to a downloadable file.
+     */
+    download?: string;
+    /**
+     * Show or hide label. For better accessibility it is recommended to show the label.
+     */
+    hideLabel?: BreakpointCustomizable<boolean>;
+    /**
+     * When providing an url then the component will be rendered as `<a>`.
+     */
+    href?: string;
+    /**
+     * The icon shown. By choosing 'none', no icon is displayed.
+     */
+    icon?: LinkIcon;
+    /**
+     * A URL path to a custom icon.
+     */
+    iconSource?: string;
+    /**
+     * Specifies the relationship of the target object to the link object.
+     */
+    rel?: string;
+    /**
+     * Target attribute where the link should be opened.
+     */
+    target?: LinkTarget;
+    /**
+     * Adapts the link color when used on dark background.
+     */
+    theme?: Theme;
+    /**
+     * The style variant of the link.
+     */
+    variant?: LinkVariant;
+};
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PLinkProps>, {
+    hideLabel: boolean;
+    icon: string;
+    target: string;
+    variant: 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<PLinkProps>, {
+    hideLabel: boolean;
+    icon: string;
+    target: string;
+    variant: string;
+}>>>, {
     hideLabel: BreakpointCustomizable<boolean>;
     icon: import("../types").LinkButtonIconName;
     variant: "primary" | "secondary" | "tertiary";
@@ -81,6 +60,23 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     default?(_: {}): any;
 }>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;

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

@@ -1,6 +1,6 @@
-import { defineComponent as f, ref as l, onMounted as p, onUpdated as d, openBlock as s, createBlock as i, resolveDynamicComponent as u, unref as c, withCtx as m, renderSlot as _ } from "vue";
-import { getPrefixedTagName as h, syncProperties as t } from "../../utils.mjs";
-const v = /* @__PURE__ */ f({
+import { defineComponent as f, ref as c, inject as m, onMounted as l, onUpdated as i, watch as d, openBlock as u, createBlock as h, resolveDynamicComponent as _, unref as y, withCtx as C, renderSlot as k } from "vue";
+import { usePrefix as w, themeInjectionKey as v, syncProperties as a } from "../../utils.mjs";
+const b = /* @__PURE__ */ f({
   __name: "LinkWrapper",
   props: {
     aria: {},
@@ -11,26 +11,24 @@ const v = /* @__PURE__ */ f({
     iconSource: {},
     rel: {},
     target: { default: "_self" },
-    theme: { default: "light" },
+    theme: {},
     variant: { default: "primary" }
   },
-  setup(n) {
-    const o = n, r = h("p-link"), e = l();
-    return p(() => {
-      t(e.value, o);
-    }), d(() => {
-      t(e.value, o);
-    }), (a, C) => (s(), i(u(c(r)), {
+  setup(p) {
+    const s = w("p-link"), e = p, t = c(), o = m(v), r = () => a(t, { ...e, theme: e.theme || o.value });
+    return l(r), i(r), d(o, (n) => {
+      a(t, { theme: e.theme || n });
+    }), (n, x) => (u(), h(_(y(s)), {
       ref_key: "pdsComponentRef",
-      ref: e
+      ref: t
     }, {
-      default: m(() => [
-        _(a.$slots, "default")
+      default: C(() => [
+        k(n.$slots, "default")
       ]),
       _: 3
     }, 512));
   }
 });
 export {
-  v as default
+  b as default
 };

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

@@ -1,55 +1,62 @@
-import type { SelectedAriaAttributes } from '../types';
+import type { SelectedAriaAttributes, MarqueAriaAttribute, MarqueSize, MarqueTarget, MarqueVariant } from '../types';
+type PMarqueProps = {
+    /**
+     * Add ARIA attributes.
+     */
+    aria?: SelectedAriaAttributes<MarqueAriaAttribute>;
+    /**
+     * When providing an url then the component will be rendered as `<a>`.
+     */
+    href?: string;
+    /**
+     * Adapts sizing of marque.
+     */
+    size?: MarqueSize;
+    /**
+     * Target attribute where the link should be opened.
+     */
+    target?: MarqueTarget;
+    /**
+     * Show/hide trademark sign (only has effect when variant is set to default).
+     */
+    trademark?: boolean;
+    /**
+     * Shows marque in special editions
+     */
+    variant?: MarqueVariant;
+};
 /** @deprecated since v3.0.0, will be removed with next major release. Please use "p-wordmark" instead. */
-declare const _default: import("vue").DefineComponent<{
-    size: {
-        type: import("vue").PropType<"small" | "medium" | "responsive">;
-        default: string;
-    };
-    aria: {
-        type: import("vue").PropType<SelectedAriaAttributes<"aria-label" | "aria-current">>;
-    };
-    variant: {
-        type: import("vue").PropType<"default" | "75-years">;
-        default: string;
-    };
-    href: {
-        type: import("vue").PropType<string>;
-    };
-    target: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    trademark: {
-        type: import("vue").PropType<boolean>;
-        default: boolean;
-    };
-}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    size: {
-        type: import("vue").PropType<"small" | "medium" | "responsive">;
-        default: string;
-    };
-    aria: {
-        type: import("vue").PropType<SelectedAriaAttributes<"aria-label" | "aria-current">>;
-    };
-    variant: {
-        type: import("vue").PropType<"default" | "75-years">;
-        default: string;
-    };
-    href: {
-        type: import("vue").PropType<string>;
-    };
-    target: {
-        type: import("vue").PropType<string>;
-        default: string;
-    };
-    trademark: {
-        type: import("vue").PropType<boolean>;
-        default: boolean;
-    };
-}>>, {
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PMarqueProps>, {
+    size: string;
+    target: string;
+    trademark: boolean;
+    variant: 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<PMarqueProps>, {
+    size: string;
+    target: string;
+    trademark: boolean;
+    variant: string;
+}>>>, {
     size: "small" | "medium" | "responsive";
     variant: "default" | "75-years";
     target: string;
     trademark: boolean;
 }, {}>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

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

@@ -1,6 +1,6 @@
-import { defineComponent as a, ref as p, onMounted as f, onUpdated as s, openBlock as u, createBlock as l, resolveDynamicComponent as m, unref as d } from "vue";
-import { getPrefixedTagName as c, syncProperties as o } from "../../utils.mjs";
-const g = /* @__PURE__ */ a({
+import { defineComponent as a, ref as p, onMounted as s, onUpdated as f, openBlock as u, createBlock as c, resolveDynamicComponent as m, unref as d } from "vue";
+import { usePrefix as l, syncProperties as i } from "../../utils.mjs";
+const v = /* @__PURE__ */ a({
   __name: "MarqueWrapper",
   props: {
     aria: {},
@@ -11,17 +11,13 @@ const g = /* @__PURE__ */ a({
     variant: { default: "default" }
   },
   setup(r) {
-    const t = r, n = c("p-marque"), e = p();
-    return f(() => {
-      o(e.value, t);
-    }), s(() => {
-      o(e.value, t);
-    }), (i, _) => (u(), l(m(d(n)), {
+    const t = l("p-marque"), n = r, e = p(), o = () => i(e, n);
+    return s(o), f(o), (_, y) => (u(), c(m(d(t)), {
       ref_key: "pdsComponentRef",
       ref: e
     }, null, 512));
   }
 });
 export {
-  g as default
+  v as default
 };