@riverty/web-components 5.4.0 → 5.6.0

package/dist/types/components.d.ts

@@ -50,7 +50,6 @@ export namespace Components {
      * An accordion represents a list of expandable/collapsable content sections with corresponding headers.
      * By default, only one section can be expanded, which can be changed by setting the `multiple` attribute. Use accordions when a limited, additional amount of information needs to be shown within a page, or if there is a small space to show content.
      * Each content section must be wrapped in a `<r-accordion-item>` elements.
-     * [Docs](https://riverty.design/components/accordion)
      * Example:
      * ```
      * <r-accordion>
@@ -252,7 +251,6 @@ export namespace Components {
     /**
      * A button can be used by a user to trigger an action. Corresponds to, and is rendered as a,
      * [native button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button).
-     * [Docs](https://riverty.design/components/button)
      */
     interface RButton {
         /**
@@ -319,7 +317,6 @@ export namespace Components {
     /**
      * Checkboxes allow users to select none, one, or multiple items from a list.
      * Overall behavior is based on native `<input type="checkbox">`
-     * [Docs](https://riverty.design/components/checkbox)
      */
     interface RCheckbox {
         /**
@@ -597,7 +594,7 @@ export namespace Components {
     }
     interface RIcon {
         /**
-          * Quick way to set display color to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * Quick way to set display color to one of the Riverty color tokens
           * @default null
          */
         "color": string;
@@ -635,7 +632,6 @@ export namespace Components {
     }
     /**
      * An icon button is a button that contains only an icon and is used to trigger an action.
-     * [Docs](https://riverty.design/components/icon-button)
      */
     interface RIconButton {
         /**
@@ -687,6 +683,10 @@ export namespace Components {
           * Native `autocomplete` hint for browsers / password managers.
          */
         "autocomplete"?: InputAutocomplete;
+        /**
+          * Automatically focus the input when it is first rendered. Mirrors native `autofocus` attribute behavior. Avoid using multiple times per page.
+         */
+        "autofocus"?: boolean;
         /**
           * Custom message for `badInput` (conversion / parsing failure).
          */
@@ -1111,7 +1111,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -1239,7 +1239,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -1349,7 +1349,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -1384,7 +1384,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -1419,6 +1419,10 @@ export namespace Components {
           * The main text or headline displayed in the text slot (2nd slot) of the list item.
          */
         "headline"?: string;
+        /**
+          * Defines if the leading icon shall become hidden.
+         */
+        "hideLeadingIcon"?: boolean;
         /**
           * If provided, renders the list item as a link using the <a> tag with the given href attribute.
          */
@@ -1451,6 +1455,10 @@ export namespace Components {
           * Text displayed in the trailing slot (3rd slot), as an alternative to an icon.
          */
         "trailingText"?: string;
+        /**
+          * When enabled, the description is limited to a single line and truncated with an ellipsis if it overflows.
+         */
+        "truncateDescription"?: boolean;
         /**
           * Controls the style variation of the list item, such as regular or subitem.
           * @default 'list-item'
@@ -1890,7 +1898,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -1918,7 +1926,6 @@ export namespace Components {
     /**
      * A select allows the user to choose between a set of options.
      * Overall behavior is based on native `<select>`
-     * [Docs](https://riverty.design/components/select)
      */
     interface RSelect {
         /**
@@ -2099,7 +2106,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens.
          */
         "tooltipIconColor"?: string;
         /**
@@ -2437,7 +2444,7 @@ export namespace Components {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)   * Specifies the color of the tooltip icon from [Riverty color tokens](https://riverty.design/tokens/#colors)  displayed alongside the label.
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Specifies the color of the tooltip icon from Riverty color tokens. Displayed alongside the label.
          */
         "tooltipIconColor"?: string;
         /**
@@ -2504,7 +2511,7 @@ export namespace Components {
          */
         "href"?: string;
         /**
-          * Specifies an optional icon for the leading slot of the dialog. For options check [Riverty Icons](https://riverty.design/components/icon)
+          * Specifies an optional icon for the leading slot of the dialog.
          */
         "leadingIcon"?: IconName;
         /**
@@ -2531,7 +2538,7 @@ export namespace Components {
          */
         "toggle": () => Promise<void>;
         /**
-          * Specifies an optional icon for the trailing slot of the dialog. For options check [Riverty Icons](https://riverty.design/components/icon)
+          * Specifies an optional icon for the trailing slot of the dialog.
           * @default 'cross'
          */
         "trailingIcon": IconName;
@@ -2575,6 +2582,10 @@ export interface RCheckboxGroupCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLRCheckboxGroupElement;
 }
+export interface RDialogCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLRDialogElement;
+}
 export interface RIconButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLRIconButtonElement;
@@ -2656,7 +2667,6 @@ declare global {
      * An accordion represents a list of expandable/collapsable content sections with corresponding headers.
      * By default, only one section can be expanded, which can be changed by setting the `multiple` attribute. Use accordions when a limited, additional amount of information needs to be shown within a page, or if there is a small space to show content.
      * Each content section must be wrapped in a `<r-accordion-item>` elements.
-     * [Docs](https://riverty.design/components/accordion)
      * Example:
      * ```
      * <r-accordion>
@@ -2766,7 +2776,6 @@ declare global {
     /**
      * A button can be used by a user to trigger an action. Corresponds to, and is rendered as a,
      * [native button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button).
-     * [Docs](https://riverty.design/components/button)
      */
     interface HTMLRButtonElement extends Components.RButton, HTMLStencilElement {
         addEventListener<K extends keyof HTMLRButtonElementEventMap>(type: K, listener: (this: HTMLRButtonElement, ev: RButtonCustomEvent<HTMLRButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2801,7 +2810,6 @@ declare global {
     /**
      * Checkboxes allow users to select none, one, or multiple items from a list.
      * Overall behavior is based on native `<input type="checkbox">`
-     * [Docs](https://riverty.design/components/checkbox)
      */
     interface HTMLRCheckboxElement extends Components.RCheckbox, HTMLStencilElement {
         addEventListener<K extends keyof HTMLRCheckboxElementEventMap>(type: K, listener: (this: HTMLRCheckboxElement, ev: RCheckboxCustomEvent<HTMLRCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2850,7 +2858,18 @@ declare global {
         prototype: HTMLRDesignSystemDevtoolsElement;
         new (): HTMLRDesignSystemDevtoolsElement;
     };
+    interface HTMLRDialogElementEventMap {
+        "close": any;
+    }
     interface HTMLRDialogElement extends Components.RDialog, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLRDialogElementEventMap>(type: K, listener: (this: HTMLRDialogElement, ev: RDialogCustomEvent<HTMLRDialogElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLRDialogElementEventMap>(type: K, listener: (this: HTMLRDialogElement, ev: RDialogCustomEvent<HTMLRDialogElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
     var HTMLRDialogElement: {
         prototype: HTMLRDialogElement;
@@ -2877,7 +2896,6 @@ declare global {
     }
     /**
      * An icon button is a button that contains only an icon and is used to trigger an action.
-     * [Docs](https://riverty.design/components/icon-button)
      */
     interface HTMLRIconButtonElement extends Components.RIconButton, HTMLStencilElement {
         addEventListener<K extends keyof HTMLRIconButtonElementEventMap>(type: K, listener: (this: HTMLRIconButtonElement, ev: RIconButtonCustomEvent<HTMLRIconButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3301,7 +3319,6 @@ declare global {
     /**
      * A select allows the user to choose between a set of options.
      * Overall behavior is based on native `<select>`
-     * [Docs](https://riverty.design/components/select)
      */
     interface HTMLRSelectElement extends Components.RSelect, HTMLStencilElement {
         addEventListener<K extends keyof HTMLRSelectElementEventMap>(type: K, listener: (this: HTMLRSelectElement, ev: RSelectCustomEvent<HTMLRSelectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3554,7 +3571,6 @@ declare namespace LocalJSX {
      * An accordion represents a list of expandable/collapsable content sections with corresponding headers.
      * By default, only one section can be expanded, which can be changed by setting the `multiple` attribute. Use accordions when a limited, additional amount of information needs to be shown within a page, or if there is a small space to show content.
      * Each content section must be wrapped in a `<r-accordion-item>` elements.
-     * [Docs](https://riverty.design/components/accordion)
      * Example:
      * ```
      * <r-accordion>
@@ -3783,7 +3799,6 @@ declare namespace LocalJSX {
     /**
      * A button can be used by a user to trigger an action. Corresponds to, and is rendered as a,
      * [native button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button).
-     * [Docs](https://riverty.design/components/button)
      */
     interface RButton {
         /**
@@ -3842,7 +3857,6 @@ declare namespace LocalJSX {
     /**
      * Checkboxes allow users to select none, one, or multiple items from a list.
      * Overall behavior is based on native `<input type="checkbox">`
-     * [Docs](https://riverty.design/components/checkbox)
      */
     interface RCheckbox {
         /**
@@ -4058,6 +4072,10 @@ declare namespace LocalJSX {
           * Allows to provide headline text to the dialog header section.
          */
         "headline"?: string;
+        /**
+          * Emitted when the dialog is closed. Fired by close(), and by the close button.
+         */
+        "onClose"?: (event: RDialogCustomEvent<any>) => void;
         /**
           * Define if dialog either shown or hidden.
           * @default false
@@ -4093,7 +4111,7 @@ declare namespace LocalJSX {
     }
     interface RIcon {
         /**
-          * Quick way to set display color to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * Quick way to set display color to one of the Riverty color tokens
           * @default null
          */
         "color"?: string;
@@ -4131,7 +4149,6 @@ declare namespace LocalJSX {
     }
     /**
      * An icon button is a button that contains only an icon and is used to trigger an action.
-     * [Docs](https://riverty.design/components/icon-button)
      */
     interface RIconButton {
         /**
@@ -4175,6 +4192,10 @@ declare namespace LocalJSX {
           * Native `autocomplete` hint for browsers / password managers.
          */
         "autocomplete"?: InputAutocomplete;
+        /**
+          * Automatically focus the input when it is first rendered. Mirrors native `autofocus` attribute behavior. Avoid using multiple times per page.
+         */
+        "autofocus"?: boolean;
         /**
           * Custom message for `badInput` (conversion / parsing failure).
          */
@@ -4615,7 +4636,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -4751,7 +4772,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -4873,7 +4894,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -4908,7 +4929,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -4943,6 +4964,10 @@ declare namespace LocalJSX {
           * The main text or headline displayed in the text slot (2nd slot) of the list item.
          */
         "headline"?: string;
+        /**
+          * Defines if the leading icon shall become hidden.
+         */
+        "hideLeadingIcon"?: boolean;
         /**
           * If provided, renders the list item as a link using the <a> tag with the given href attribute.
          */
@@ -4971,6 +4996,10 @@ declare namespace LocalJSX {
           * Text displayed in the trailing slot (3rd slot), as an alternative to an icon.
          */
         "trailingText"?: string;
+        /**
+          * When enabled, the description is limited to a single line and truncated with an ellipsis if it overflows.
+         */
+        "truncateDescription"?: boolean;
         /**
           * Controls the style variation of the list item, such as regular or subitem.
           * @default 'list-item'
@@ -5401,7 +5430,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens
          */
         "tooltipIconColor"?: string;
         /**
@@ -5429,7 +5458,6 @@ declare namespace LocalJSX {
     /**
      * A select allows the user to choose between a set of options.
      * Overall behavior is based on native `<select>`
-     * [Docs](https://riverty.design/components/select)
      */
     interface RSelect {
         /**
@@ -5576,7 +5604,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the [Riverty color tokens](https://riverty.design/tokens/#colors)
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Change color of an icon that triggers tooltip to one of the Riverty color tokens.
          */
         "tooltipIconColor"?: string;
         /**
@@ -5910,7 +5938,7 @@ declare namespace LocalJSX {
          */
         "tooltipIcon"?: IconName;
         /**
-          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)   * Specifies the color of the tooltip icon from [Riverty color tokens](https://riverty.design/tokens/#colors)  displayed alongside the label.
+          * _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.) Specifies the color of the tooltip icon from Riverty color tokens. Displayed alongside the label.
          */
         "tooltipIconColor"?: string;
         /**
@@ -5969,7 +5997,7 @@ declare namespace LocalJSX {
          */
         "href"?: string;
         /**
-          * Specifies an optional icon for the leading slot of the dialog. For options check [Riverty Icons](https://riverty.design/components/icon)
+          * Specifies an optional icon for the leading slot of the dialog.
          */
         "leadingIcon"?: IconName;
         /**
@@ -6004,7 +6032,7 @@ declare namespace LocalJSX {
          */
         "target"?: ToastActionTarget;
         /**
-          * Specifies an optional icon for the trailing slot of the dialog. For options check [Riverty Icons](https://riverty.design/components/icon)
+          * Specifies an optional icon for the trailing slot of the dialog.
           * @default 'cross'
          */
         "trailingIcon"?: IconName;
@@ -6089,7 +6117,6 @@ declare module "@stencil/core" {
              * An accordion represents a list of expandable/collapsable content sections with corresponding headers.
              * By default, only one section can be expanded, which can be changed by setting the `multiple` attribute. Use accordions when a limited, additional amount of information needs to be shown within a page, or if there is a small space to show content.
              * Each content section must be wrapped in a `<r-accordion-item>` elements.
-             * [Docs](https://riverty.design/components/accordion)
              * Example:
              * ```
              * <r-accordion>
@@ -6116,13 +6143,11 @@ declare module "@stencil/core" {
             /**
              * A button can be used by a user to trigger an action. Corresponds to, and is rendered as a,
              * [native button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button).
-             * [Docs](https://riverty.design/components/button)
              */
             "r-button": LocalJSX.RButton & JSXBase.HTMLAttributes<HTMLRButtonElement>;
             /**
              * Checkboxes allow users to select none, one, or multiple items from a list.
              * Overall behavior is based on native `<input type="checkbox">`
-             * [Docs](https://riverty.design/components/checkbox)
              */
             "r-checkbox": LocalJSX.RCheckbox & JSXBase.HTMLAttributes<HTMLRCheckboxElement>;
             "r-checkbox-group": LocalJSX.RCheckboxGroup & JSXBase.HTMLAttributes<HTMLRCheckboxGroupElement>;
@@ -6143,7 +6168,6 @@ declare module "@stencil/core" {
             "r-icon": LocalJSX.RIcon & JSXBase.HTMLAttributes<HTMLRIconElement>;
             /**
              * An icon button is a button that contains only an icon and is used to trigger an action.
-             * [Docs](https://riverty.design/components/icon-button)
              */
             "r-icon-button": LocalJSX.RIconButton & JSXBase.HTMLAttributes<HTMLRIconButtonElement>;
             "r-input": LocalJSX.RInput & JSXBase.HTMLAttributes<HTMLRInputElement>;
@@ -6189,7 +6213,6 @@ declare module "@stencil/core" {
             /**
              * A select allows the user to choose between a set of options.
              * Overall behavior is based on native `<select>`
-             * [Docs](https://riverty.design/components/select)
              */
             "r-select": LocalJSX.RSelect & JSXBase.HTMLAttributes<HTMLRSelectElement>;
             /**