@riverty/web-components 5.5.0 → 5.7.0

package/dist/types/components/label/label.d.ts

@@ -19,7 +19,7 @@ export declare class RLabel {
     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) */
+    * Change color of an icon that triggers tooltip to one of the Riverty color tokens */
     tooltipIconColor?: string;
     /** Text of an additional marker */
     fieldIndicator?: string;

package/dist/types/components/radio-group/radio-group.d.ts

@@ -29,7 +29,7 @@ export declare class RadioGroup {
     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)
+    * Change color of an icon that triggers tooltip to one of the Riverty color tokens
      * */
     tooltipIconColor?: string;
     /** Set custom message for `valueMissing` property of a ValidityState object (set by `required`) within Constrain Validation API */

package/dist/types/components/select/select.d.ts

@@ -6,7 +6,6 @@ import { ListboxPosition } from './exports';
  *
  * Overall behavior is based on native `<select>`
  *
- * [Docs](https://riverty.design/components/select)
  */
 export declare class Select {
     host: HTMLRSelectElement;
@@ -34,7 +33,7 @@ export declare class Select {
     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)
+     * Change color of an icon that triggers tooltip to one of the Riverty color tokens.
      * */
     tooltipIconColor?: string;
     /** Text that is presented until an option has been selected */

package/dist/types/components/textarea/textarea.d.ts

@@ -101,9 +101,9 @@ export declare class RTextarea {
      * providing a visual cue for additional information. */
     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;
     /** Custom validity state */
     validityState: string;

package/dist/types/components/toast/toast.d.ts

@@ -11,11 +11,9 @@ export declare class Toast {
      * Options are: "info", "success", "warning", or "error".
      * @default 'info' */
     status: ToastStatus;
-    /** 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;
     /** Specifies an optional icon for the trailing slot of the dialog.
-     * For options check [Riverty Icons](https://riverty.design/components/icon)
      * @default 'cross'
      * */
     trailingIcon: IconName;

package/dist/types/components/tooltip/tooltip.d.ts

@@ -15,6 +15,8 @@ export declare class Tooltip {
         element: HTMLRTooltipElement;
     }>;
     private uniqueId;
+    private tooltip;
+    private arrow;
     /**
      * Watch on position value change and update tooltip position if needed
      */
@@ -31,14 +33,14 @@ export declare class Tooltip {
      * Listen on window keydown and hide tooltip if needed
      */
     handleKeydown(event: any): void;
-    /**
-     * Tooltip element value
-     */
-    get tooltipValue(): HTMLElement;
     /**
      * Parent with non visible overflow
      */
     get overflowedParent(): HTMLElement;
+    get arrowWidth(): number;
+    get arrowHeight(): number;
+    get tooltipContainerWidth(): number;
+    get tooltipContainerHeight(): number;
     /**
      * Available space at the top
      */
@@ -47,6 +49,7 @@ export declare class Tooltip {
      * Available space on the left
      */
     get left(): number;
+    get isOnScreen(): boolean;
     /**
      * Available space at the bottom
      */
@@ -98,6 +101,10 @@ export declare class Tooltip {
      * First it checks the available space for a defined position and then sets the new one based on the available space.
      */
     private setCorrectPosition;
+    private getOffsetLeft;
+    private alignTooltipPosition;
+    private alignArrowPosition;
+    private alignPosition;
     /**
      * Adjusts arrow correct position.
      * For bottom & top tooltip positions there are 3 possible arrow.
@@ -114,5 +121,6 @@ export declare class Tooltip {
     private handleFocus;
     private showTooltip;
     private removeTooltip;
+    private handleScroll;
     render(): any;
 }

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;
         /**
@@ -1898,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;
         /**
@@ -1926,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 {
         /**
@@ -2107,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;
         /**
@@ -2445,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;
         /**
@@ -2512,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;
         /**
@@ -2539,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;
@@ -2668,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>
@@ -2778,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;
@@ -2813,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;
@@ -2900,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;
@@ -3324,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;
@@ -3577,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>
@@ -3806,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 {
         /**
@@ -3865,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 {
         /**
@@ -4120,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;
@@ -4158,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 {
         /**
@@ -4202,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).
          */
@@ -4642,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;
         /**
@@ -4778,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;
         /**
@@ -4900,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;
         /**
@@ -4935,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;
         /**
@@ -5436,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;
         /**
@@ -5464,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 {
         /**
@@ -5611,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;
         /**
@@ -5945,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;
         /**
@@ -6004,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;
         /**
@@ -6039,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;
@@ -6124,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>
@@ -6151,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>;
@@ -6178,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>;
@@ -6224,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>;
             /**