@porsche-design-system/components-react 4.2.0-rc.4 → 4.2.0

package/esm/lib/components/button.wrapper.d.ts

@@ -2,114 +2,114 @@ import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, ButtonAriaAttribute, BreakpointCustomizable, ButtonIcon, ButtonType, ButtonVariant } from '../types';
 export type PButtonProps = BaseProps & {
     /**
-     * Sets ARIA attributes.
+     * Sets ARIA attributes on the button to improve accessibility for screen readers.
      */
     aria?: SelectedAriaAttributes<ButtonAriaAttribute>;
     /**
-     * Displays the button in compact mode.
+     * Reduces the button's height and padding for denser layouts. Supports responsive breakpoint values.
      * @default false
      */
     compact?: BreakpointCustomizable<boolean>;
     /**
-     * Disables the button. No events will be triggered while disabled state is active.
+     * Disables the button, preventing all interaction and blocking events.
      * @default false
      */
     disabled?: boolean;
     /**
-     * The id of a form element the button should be associated with.
+     * Associates the button with a form element by its ID, so it can submit or reset that form even when placed outside of it.
      */
     form?: string;
     /**
-     * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * Hides the visible label while keeping it accessible to screen readers. Supports responsive breakpoint values.
      * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
-     * The icon shown. By choosing 'none', no icon is displayed.
+     * Sets the icon displayed inside the button. Use `none` to show no icon.
      * @default 'none'
      */
     icon?: ButtonIcon;
     /**
-     * A URL path to a custom icon.
+     * Sets a path to a custom SVG icon, used instead of the built-in icon set.
      */
     iconSource?: string;
     /**
-     * Disables the button and shows a loading indicator. No events will be triggered while loading state is active.
+     * Disables the button and replaces its content with a loading spinner to indicate an ongoing operation.
      * @default false
      */
     loading?: boolean;
     /**
-     * The name of the button, submitted as a pair with the button's value as part of the form data, when that button is used to submit the form.
+     * Sets the name submitted with the form data when this button triggers form submission.
      */
     name?: string;
     /**
-     * Specifies the type of the button.
+     * Sets the button's HTML type — `submit` sends the form, `reset` clears it, `button` performs no default action.
      * @default 'submit'
      */
     type?: ButtonType;
     /**
-     * Defines the value associated with the button's name when it's submitted with the form data. This value is passed to the server in params when the form is submitted using this button.
+     * Sets the value submitted with the form data when this button triggers form submission, paired with `name`.
      */
     value?: string;
     /**
-     * The style variant of the button.
+     * Sets the visual style variant of the button (e.g. `primary`, `secondary`, `tertiary`).
      * @default 'primary'
      */
     variant?: ButtonVariant;
 };
 export declare const PButton: import("react").ForwardRefExoticComponent<Omit<import("react").DOMAttributes<{}>, "onChange" | "onInput" | "onToggle"> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "inert" | "inputMode" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
-     * Sets ARIA attributes.
+     * Sets ARIA attributes on the button to improve accessibility for screen readers.
      */
     aria?: SelectedAriaAttributes<ButtonAriaAttribute>;
     /**
-     * Displays the button in compact mode.
+     * Reduces the button's height and padding for denser layouts. Supports responsive breakpoint values.
      * @default false
      */
     compact?: BreakpointCustomizable<boolean>;
     /**
-     * Disables the button. No events will be triggered while disabled state is active.
+     * Disables the button, preventing all interaction and blocking events.
      * @default false
      */
     disabled?: boolean;
     /**
-     * The id of a form element the button should be associated with.
+     * Associates the button with a form element by its ID, so it can submit or reset that form even when placed outside of it.
      */
     form?: string;
     /**
-     * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * Hides the visible label while keeping it accessible to screen readers. Supports responsive breakpoint values.
      * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
-     * The icon shown. By choosing 'none', no icon is displayed.
+     * Sets the icon displayed inside the button. Use `none` to show no icon.
      * @default 'none'
      */
     icon?: ButtonIcon;
     /**
-     * A URL path to a custom icon.
+     * Sets a path to a custom SVG icon, used instead of the built-in icon set.
      */
     iconSource?: string;
     /**
-     * Disables the button and shows a loading indicator. No events will be triggered while loading state is active.
+     * Disables the button and replaces its content with a loading spinner to indicate an ongoing operation.
      * @default false
      */
     loading?: boolean;
     /**
-     * The name of the button, submitted as a pair with the button's value as part of the form data, when that button is used to submit the form.
+     * Sets the name submitted with the form data when this button triggers form submission.
      */
     name?: string;
     /**
-     * Specifies the type of the button.
+     * Sets the button's HTML type — `submit` sends the form, `reset` clears it, `button` performs no default action.
      * @default 'submit'
      */
     type?: ButtonType;
     /**
-     * Defines the value associated with the button's name when it's submitted with the form data. This value is passed to the server in params when the form is submitted using this button.
+     * Sets the value submitted with the form data when this button triggers form submission, paired with `name`.
      */
     value?: string;
     /**
-     * The style variant of the button.
+     * Sets the visual style variant of the button (e.g. `primary`, `secondary`, `tertiary`).
      * @default 'primary'
      */
     variant?: ButtonVariant;

package/esm/lib/components/canvas.wrapper.d.ts

@@ -2,50 +2,50 @@ import type { BaseProps } from '../../BaseProps';
 import type { CanvasBackground, CanvasSidebarStartUpdateEventDetail } from '../types';
 export type PCanvasProps = BaseProps & {
     /**
-     * Defines the background color of the main section and auto adjust it for the sidebar
+     * Sets the background color of the main content area and automatically applies a matching color to the sidebar.
      * @default 'canvas'
      */
     background?: CanvasBackground;
     /**
-     * Emitted when the sidebar end requests to be dismissed.
+     * Emitted when the user dismisses the end sidebar via the close button.
      */
     onSidebarEndDismiss?: (event: CustomEvent<void>) => void;
     /**
-     * Emitted when the sidebar start requests to be opened or dismissed.
+     * Emitted when the user toggles the start sidebar, with the new open state in the event detail.
      */
     onSidebarStartUpdate?: (event: CustomEvent<CanvasSidebarStartUpdateEventDetail>) => void;
     /**
-     * Open the sidebar on the end side
+     * Controls whether the utility sidebar on the end side (right in LTR) is open or collapsed.
      * @default false
      */
     sidebarEndOpen?: boolean;
     /**
-     * Open the sidebar on the start side
+     * Controls whether the navigation sidebar on the start side (left in LTR) is open or collapsed.
      * @default false
      */
     sidebarStartOpen?: boolean;
 };
 export declare const PCanvas: import("react").ForwardRefExoticComponent<Omit<import("react").DOMAttributes<{}>, "onChange" | "onInput" | "onToggle"> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "inert" | "inputMode" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
-     * Defines the background color of the main section and auto adjust it for the sidebar
+     * Sets the background color of the main content area and automatically applies a matching color to the sidebar.
      * @default 'canvas'
      */
     background?: CanvasBackground;
     /**
-     * Emitted when the sidebar end requests to be dismissed.
+     * Emitted when the user dismisses the end sidebar via the close button.
      */
     onSidebarEndDismiss?: (event: CustomEvent<void>) => void;
     /**
-     * Emitted when the sidebar start requests to be opened or dismissed.
+     * Emitted when the user toggles the start sidebar, with the new open state in the event detail.
      */
     onSidebarStartUpdate?: (event: CustomEvent<CanvasSidebarStartUpdateEventDetail>) => void;
     /**
-     * Open the sidebar on the end side
+     * Controls whether the utility sidebar on the end side (right in LTR) is open or collapsed.
      * @default false
      */
     sidebarEndOpen?: boolean;
     /**
-     * Open the sidebar on the start side
+     * Controls whether the navigation sidebar on the start side (left in LTR) is open or collapsed.
      * @default false
      */
     sidebarStartOpen?: boolean;

package/esm/lib/components/carousel.wrapper.d.ts

@@ -2,162 +2,162 @@ import type { BaseProps } from '../../BaseProps';
 import type { CarouselAlignControls, CarouselAlignHeader, SelectedAriaAttributes, CarouselAriaAttribute, CarouselHeadingSize, CarouselInternationalization, CarouselUpdateEventDetail, BreakpointCustomizable, CarouselSlidesPerPage, CarouselWidth } from '../types';
 export type PCarouselProps = BaseProps & {
     /**
-     * Defines which slide is active (zero-based numbering).
+     * Sets the zero-based index of the currently visible slide. Update this to navigate programmatically.
      * @default 0
      */
     activeSlideIndex?: number;
     /**
-     * Aligns the slotted controls.
+     * Controls the alignment of custom slotted controls within the header area.
      * @default 'auto'
      */
     alignControls?: CarouselAlignControls;
     /**
-     * Aligns the heading and description.
+     * Controls the horizontal alignment of the heading and description.
      * @default 'start'
      */
     alignHeader?: CarouselAlignHeader;
     /**
-     * Sets ARIA attributes.
+     * Sets ARIA attributes on the carousel region element for improved accessibility.
      */
     aria?: SelectedAriaAttributes<CarouselAriaAttribute>;
     /**
-     * Defines the description used in the carousel.
+     * Sets the description text displayed below the heading for additional context.
      */
     description?: string;
     /**
-     * Indicates whether focus should be set on the center slide. If true, the carousel loops by individual slide; otherwise, it loops by page.
+     * When enabled, each slide is individually focusable and the carousel navigates one slide at a time instead of one page.
      * @default false
      */
     focusOnCenterSlide?: boolean;
     /**
-     * Fades the slides out.
+     * Shows a gradient fade at the start and end edges to visually indicate more slides beyond the viewport.
      * @default false
      */
     gradient?: boolean;
     /**
-     * Defines the heading used in the carousel.
+     * Sets the heading text displayed above the carousel. Also used as the accessible label when no `aria` prop is set.
      */
     heading?: string;
     /**
-     * Defines the heading size used in the carousel.
+     * Sets the font size of the carousel heading.
      * @default 'x-large'
      */
     headingSize?: CarouselHeadingSize;
     /**
-     * Override the default wordings that are used for aria-labels on the next/prev buttons and pagination.
+     * Overrides the default label strings used for the previous, next, and page indicators — useful for localization.
      */
     intl?: CarouselInternationalization;
     /**
-     * Emitted when carousel's content slides.
+     * Emitted when the carousel navigates to a new slide, with the active and previous slide indexes in the event detail.
      */
     onUpdate?: (event: CustomEvent<CarouselUpdateEventDetail>) => void;
     /**
-     * If false, the carousel will not show pagination bullets at the bottom.
+     * Shows pagination dot indicators below the carousel. Supports responsive breakpoint values.
      * @default false
      */
     pagination?: BreakpointCustomizable<boolean>;
     /**
-     * Whether the slides should rewind from last to first slide and vice versa.
+     * Enables infinite looping — navigating past the last slide wraps back to the first, and vice versa.
      * @default false
      */
     rewind?: boolean;
     /**
-     * Defines the skip link target used to skip carousel entries.
+     * Sets the `href` of an in-page skip link that lets keyboard users jump past the carousel slides.
      */
     skipLinkTarget?: string;
     /**
-     * Sets the amount of slides visible at the same time. Can be set to `auto` if you want to define different widths per slide via CSS.
+     * Sets how many slides are visible at once. Use `auto` to control each slide's width via CSS. Supports responsive breakpoint values.
      * @default 1
      */
     slidesPerPage?: BreakpointCustomizable<CarouselSlidesPerPage>;
     /**
-     * Determines whether to trim spaces before/after the carousel if `focusOnCenterSlide` option is true.
+     * Removes whitespace before the first and after the last slide when `focusOnCenterSlide` is enabled.
      * @default false
      */
     trimSpace?: boolean;
     /**
-     * Defines the outer spacings between the carousel and the left and right screen sides.
+     * Sets the maximum width and outer spacing of the carousel, aligned to PDS grid widths.
      * @default 'basic'
      */
     width?: CarouselWidth;
 };
 export declare const PCarousel: import("react").ForwardRefExoticComponent<Omit<import("react").DOMAttributes<{}>, "onChange" | "onInput" | "onToggle"> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "inert" | "inputMode" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
-     * Defines which slide is active (zero-based numbering).
+     * Sets the zero-based index of the currently visible slide. Update this to navigate programmatically.
      * @default 0
      */
     activeSlideIndex?: number;
     /**
-     * Aligns the slotted controls.
+     * Controls the alignment of custom slotted controls within the header area.
      * @default 'auto'
      */
     alignControls?: CarouselAlignControls;
     /**
-     * Aligns the heading and description.
+     * Controls the horizontal alignment of the heading and description.
      * @default 'start'
      */
     alignHeader?: CarouselAlignHeader;
     /**
-     * Sets ARIA attributes.
+     * Sets ARIA attributes on the carousel region element for improved accessibility.
      */
     aria?: SelectedAriaAttributes<CarouselAriaAttribute>;
     /**
-     * Defines the description used in the carousel.
+     * Sets the description text displayed below the heading for additional context.
      */
     description?: string;
     /**
-     * Indicates whether focus should be set on the center slide. If true, the carousel loops by individual slide; otherwise, it loops by page.
+     * When enabled, each slide is individually focusable and the carousel navigates one slide at a time instead of one page.
      * @default false
      */
     focusOnCenterSlide?: boolean;
     /**
-     * Fades the slides out.
+     * Shows a gradient fade at the start and end edges to visually indicate more slides beyond the viewport.
      * @default false
      */
     gradient?: boolean;
     /**
-     * Defines the heading used in the carousel.
+     * Sets the heading text displayed above the carousel. Also used as the accessible label when no `aria` prop is set.
      */
     heading?: string;
     /**
-     * Defines the heading size used in the carousel.
+     * Sets the font size of the carousel heading.
      * @default 'x-large'
      */
     headingSize?: CarouselHeadingSize;
     /**
-     * Override the default wordings that are used for aria-labels on the next/prev buttons and pagination.
+     * Overrides the default label strings used for the previous, next, and page indicators — useful for localization.
      */
     intl?: CarouselInternationalization;
     /**
-     * Emitted when carousel's content slides.
+     * Emitted when the carousel navigates to a new slide, with the active and previous slide indexes in the event detail.
      */
     onUpdate?: (event: CustomEvent<CarouselUpdateEventDetail>) => void;
     /**
-     * If false, the carousel will not show pagination bullets at the bottom.
+     * Shows pagination dot indicators below the carousel. Supports responsive breakpoint values.
      * @default false
      */
     pagination?: BreakpointCustomizable<boolean>;
     /**
-     * Whether the slides should rewind from last to first slide and vice versa.
+     * Enables infinite looping — navigating past the last slide wraps back to the first, and vice versa.
      * @default false
      */
     rewind?: boolean;
     /**
-     * Defines the skip link target used to skip carousel entries.
+     * Sets the `href` of an in-page skip link that lets keyboard users jump past the carousel slides.
      */
     skipLinkTarget?: string;
     /**
-     * Sets the amount of slides visible at the same time. Can be set to `auto` if you want to define different widths per slide via CSS.
+     * Sets how many slides are visible at once. Use `auto` to control each slide's width via CSS. Supports responsive breakpoint values.
      * @default 1
      */
     slidesPerPage?: BreakpointCustomizable<CarouselSlidesPerPage>;
     /**
-     * Determines whether to trim spaces before/after the carousel if `focusOnCenterSlide` option is true.
+     * Removes whitespace before the first and after the last slide when `focusOnCenterSlide` is enabled.
      * @default false
      */
     trimSpace?: boolean;
     /**
-     * Defines the outer spacings between the carousel and the left and right screen sides.
+     * Sets the maximum width and outer spacing of the carousel, aligned to PDS grid widths.
      * @default 'basic'
      */
     width?: CarouselWidth;

package/esm/lib/components/checkbox.wrapper.d.ts

@@ -2,148 +2,148 @@ import type { BaseProps } from '../../BaseProps';
 import type { BreakpointCustomizable, CheckboxBlurEventDetail, CheckboxChangeEventDetail, CheckboxState } from '../types';
 export type PCheckboxProps = BaseProps & {
     /**
-     * Reflects the checkbox current checked state and allows setting the initial checked state.
+     * Reflects the checkbox's current checked state and allows setting the initial checked value on load.
      * @default false
      */
     checked?: boolean;
     /**
-     * Displays the checkbox in compact mode.
+     * Reduces the checkbox size and spacing for a more compact layout.
      * @default false
      */
     compact?: boolean;
     /**
-     * Marks the checkbox as disabled.
+     * Disables the checkbox, preventing all interaction. The value is not submitted with the form.
      * @default false
      */
     disabled?: boolean;
     /**
-     * The id of a form element the checkbox should be associated with.
+     * Associates the checkbox with a form element by its ID when not directly nested inside it.
      */
     form?: string;
     /**
-     * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * Hides the visible label while keeping it accessible to screen readers. Supports responsive breakpoint values.
      * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
-     * Marks the checkbox as indeterminate.
+     * Puts the checkbox into an indeterminate state, indicating that a group of child items is only partially selected.
      * @default false
      */
     indeterminate?: boolean;
     /**
-     * Text content for a user-facing label.
+     * Sets the visible label text displayed next to the checkbox.
      * @default ''
      */
     label?: string;
     /**
-     * @experimental Disables the checkbox and shows a loading indicator.
+     * @experimental Disables the checkbox and displays a loading spinner to indicate an ongoing operation.
      * @default false
      */
     loading?: boolean;
     /**
-     * The message styled depending on validation state.
+     * Sets the validation feedback message displayed below the checkbox when `state` is `success` or `error`.
      * @default ''
      */
     message?: string;
     /**
-     * The name of the checkbox.
+     * Sets the name submitted with the form data to identify this checkbox's value on the server.
      * @default ''
      */
     name?: string;
     /**
-     * Emitted when the checkbox has lost focus.
+     * Emitted when the checkbox loses focus.
      */
     onBlur?: (event: CustomEvent<CheckboxBlurEventDetail>) => void;
     /**
-     * Emitted when checkbox checked property is changed.
+     * Emitted when the user changes the checked state of the checkbox.
      */
     onChange?: (event: CustomEvent<CheckboxChangeEventDetail>) => void;
     /**
-     * Marks the checkbox as required.
+     * Marks the checkbox as required — form submission is blocked unless the checkbox is checked.
      * @default false
      */
     required?: boolean;
     /**
-     * The validation state.
+     * Sets the validation state, controlling the visual appearance and style of the feedback message (`none`, `success`, `error`).
      * @default 'none'
      */
     state?: CheckboxState;
     /**
-     * The checkbox value. When a form is submitted, only a checkbox which is currently checked is included in the submission.
+     * Sets the value submitted with the form data when the checkbox is checked. Unchecked checkboxes are excluded from form submissions.
      * @default 'on'
      */
     value?: string;
 };
 export declare const PCheckbox: import("react").ForwardRefExoticComponent<Omit<import("react").DOMAttributes<{}>, "onChange" | "onInput" | "onToggle"> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "inert" | "inputMode" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
-     * Reflects the checkbox current checked state and allows setting the initial checked state.
+     * Reflects the checkbox's current checked state and allows setting the initial checked value on load.
      * @default false
      */
     checked?: boolean;
     /**
-     * Displays the checkbox in compact mode.
+     * Reduces the checkbox size and spacing for a more compact layout.
      * @default false
      */
     compact?: boolean;
     /**
-     * Marks the checkbox as disabled.
+     * Disables the checkbox, preventing all interaction. The value is not submitted with the form.
      * @default false
      */
     disabled?: boolean;
     /**
-     * The id of a form element the checkbox should be associated with.
+     * Associates the checkbox with a form element by its ID when not directly nested inside it.
      */
     form?: string;
     /**
-     * Shows or hides the label. For better accessibility, it is recommended to show the label.
+     * Hides the visible label while keeping it accessible to screen readers. Supports responsive breakpoint values.
      * @default false
      */
     hideLabel?: BreakpointCustomizable<boolean>;
     /**
-     * Marks the checkbox as indeterminate.
+     * Puts the checkbox into an indeterminate state, indicating that a group of child items is only partially selected.
      * @default false
      */
     indeterminate?: boolean;
     /**
-     * Text content for a user-facing label.
+     * Sets the visible label text displayed next to the checkbox.
      * @default ''
      */
     label?: string;
     /**
-     * @experimental Disables the checkbox and shows a loading indicator.
+     * @experimental Disables the checkbox and displays a loading spinner to indicate an ongoing operation.
      * @default false
      */
     loading?: boolean;
     /**
-     * The message styled depending on validation state.
+     * Sets the validation feedback message displayed below the checkbox when `state` is `success` or `error`.
      * @default ''
      */
     message?: string;
     /**
-     * The name of the checkbox.
+     * Sets the name submitted with the form data to identify this checkbox's value on the server.
      * @default ''
      */
     name?: string;
     /**
-     * Emitted when the checkbox has lost focus.
+     * Emitted when the checkbox loses focus.
      */
     onBlur?: (event: CustomEvent<CheckboxBlurEventDetail>) => void;
     /**
-     * Emitted when checkbox checked property is changed.
+     * Emitted when the user changes the checked state of the checkbox.
      */
     onChange?: (event: CustomEvent<CheckboxChangeEventDetail>) => void;
     /**
-     * Marks the checkbox as required.
+     * Marks the checkbox as required — form submission is blocked unless the checkbox is checked.
      * @default false
      */
     required?: boolean;
     /**
-     * The validation state.
+     * Sets the validation state, controlling the visual appearance and style of the feedback message (`none`, `success`, `error`).
      * @default 'none'
      */
     state?: CheckboxState;
     /**
-     * The checkbox value. When a form is submitted, only a checkbox which is currently checked is included in the submission.
+     * Sets the value submitted with the form data when the checkbox is checked. Unchecked checkboxes are excluded from form submissions.
      * @default 'on'
      */
     value?: string;

package/esm/lib/components/crest.wrapper.d.ts

@@ -2,30 +2,30 @@ import type { BaseProps } from '../../BaseProps';
 import type { SelectedAriaAttributes, CrestAriaAttribute, CrestTarget } from '../types';
 export type PCrestProps = BaseProps & {
     /**
-     * Sets ARIA attributes.
+     * Sets ARIA attributes on the anchor element to improve accessibility when the crest is used as a link.
      */
     aria?: SelectedAriaAttributes<CrestAriaAttribute>;
     /**
-     * When `href` is provided, the component renders as an `<a>` element.
+     * When set, renders the crest as an anchor element navigating to this URL when clicked.
      */
     href?: string;
     /**
-     * Specifies where to open the linked document.
+     * Specifies where to open the linked URL (e.g. `_self`, `_blank`). Only applies when `href` is set.
      * @default '_self'
      */
     target?: CrestTarget;
 };
 export declare const PCrest: import("react").ForwardRefExoticComponent<Omit<import("react").DOMAttributes<{}>, "onChange" | "onInput" | "onToggle"> & Pick<import("react").HTMLAttributes<{}>, "suppressHydrationWarning" | "autoFocus" | "className" | "dir" | "hidden" | "id" | "inert" | "inputMode" | "lang" | "slot" | "style" | "tabIndex" | "title" | "translate" | "role"> & {
     /**
-     * Sets ARIA attributes.
+     * Sets ARIA attributes on the anchor element to improve accessibility when the crest is used as a link.
      */
     aria?: SelectedAriaAttributes<CrestAriaAttribute>;
     /**
-     * When `href` is provided, the component renders as an `<a>` element.
+     * When set, renders the crest as an anchor element navigating to this URL when clicked.
      */
     href?: string;
     /**
-     * Specifies where to open the linked document.
+     * Specifies where to open the linked URL (e.g. `_self`, `_blank`). Only applies when `href` is set.
      * @default '_self'
      */
     target?: CrestTarget;