@riverty/web-components 5.7.0 → 6.0.0

package/dist/collection/components/label/label.js

@@ -4,30 +4,10 @@ import { Host, h } from "@stencil/core";
  * for consistent presentation of text with optional associated tooltip.
  */
 export class RLabel {
-    constructor() {
-        /**
-         * _DEPRECATED_ (This property will be removed in November 2025 release.)
-         * Defines preferable position of the tooltip */
-        this.tooltipPosition = 'right';
-        /**
-         * _DEPRECATED_ (This property will be removed in November 2025 release.)
-         * Icon tooltip trigger by name from the set */
-        this.tooltipIcon = 'circled-question-mark';
-    }
     render() {
-        const { tooltip, tooltipPosition, tooltipIcon, tooltipIconColor, fieldIndicator } = this;
-        const tooltipAttrs = {
-            text: tooltip,
-            position: tooltipPosition
-        };
-        const tooltipIconAttrs = {
-            name: tooltipIcon,
-            size: 's',
-            color: tooltipIconColor
-        };
-        return (h(Host, { key: '2d7da94197a774e5b3399ff59dba01f946f0d8df' }, h("div", { key: '56baaf39a736e1f504502c9f49b4cf5fbff2f911', class: "r-label" }, h("span", { key: '5b0032c31e83b628d73a207eeaa915368edc7237', class: "r-label--slot" }, h("slot", { key: 'fbcd30c185b9eef55ea43c8ca8b082a0308953e2' }), fieldIndicator &&
-            h("span", { key: '0d355d5857e515e735dc543d3416540e0a0ffdba', class: "r-label--marker" }, fieldIndicator)), tooltip &&
-            h("span", { key: 'b450b3e7ee2b33dbdc02d9fce04bd2ef6a97713d', class: "r-label--tooltip-icon" }, h("r-tooltip", Object.assign({ key: 'a1b2a24a312b7eabd5acd43273658bce3199ef1b' }, tooltipAttrs), h("r-icon", Object.assign({ key: 'c22f6349b9c67a82b29f4a5758a77fb1b2910b75' }, tooltipIconAttrs)))))));
+        const { fieldIndicator } = this;
+        return (h(Host, { key: 'd823556813a282022aa18e138a3ac89d7f22af2a' }, h("div", { key: '1cea58412a4599e009080eb224d17324d5cad0b3', class: "r-label" }, h("span", { key: 'c0ade32425b07866b7a3096f203c7848eaa83e55', class: "r-label--slot" }, h("slot", { key: '9c782ed621889966189bba0d4c46de620315c9c4' }), fieldIndicator &&
+            h("span", { key: 'c4a4fcbed3e744bed679d8e9c6416a51407a686a', class: "r-label--marker" }, fieldIndicator)))));
     }
     static get is() { return "r-label"; }
     static get encapsulation() { return "shadow"; }
@@ -43,96 +23,6 @@ export class RLabel {
     }
     static get properties() {
         return {
-            "tooltip": {
-                "type": "string",
-                "attribute": "tooltip",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "_DEPRECATED_ (This property will be removed in November 2025 release.)\nTooltip represents additional description"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "tooltipPosition": {
-                "type": "string",
-                "attribute": "tooltip-position",
-                "mutable": false,
-                "complexType": {
-                    "original": "TooltipPosition",
-                    "resolved": "\"bottom\" | \"left\" | \"right\" | \"top\"",
-                    "references": {
-                        "TooltipPosition": {
-                            "location": "import",
-                            "path": "../tooltip/exports",
-                            "id": "src/components/tooltip/exports.ts::TooltipPosition"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "_DEPRECATED_ (This property will be removed in November 2025 release.)\nDefines preferable position of the tooltip"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "'right'"
-            },
-            "tooltipIcon": {
-                "type": "string",
-                "attribute": "tooltip-icon",
-                "mutable": false,
-                "complexType": {
-                    "original": "IconName",
-                    "resolved": "string",
-                    "references": {
-                        "IconName": {
-                            "location": "import",
-                            "path": "../icon/exports",
-                            "id": "src/components/icon/exports.ts::IconName"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "_DEPRECATED_ (This property will be removed in November 2025 release.)\nIcon tooltip trigger by name from the set"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "'circled-question-mark'"
-            },
-            "tooltipIconColor": {
-                "type": "string",
-                "attribute": "tooltip-icon-color",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "_DEPRECATED_ (This property will be removed in November 2025 release.)\nChange color of an icon that triggers tooltip to one of the Riverty color tokens"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
             "fieldIndicator": {
                 "type": "string",
                 "attribute": "field-indicator",

package/dist/collection/components/list-item/list-item/list-item.css

@@ -151,15 +151,15 @@
   line-height: var(--r-list-item--headline--line-height, 1.5);
   color: var(--r-list-item--headline--color, inherit);
 }
-.r-list-item--subtext, .r-list-item--description {
-  font-size: var(--r-list-item--description--font-size, var(--r-list-item--subtext--font-size, 1rem));
-  font-weight: var(--r-list-item--description--font-weight, var(--r-list-item--subtext--font-weight, 400));
-  line-height: var(--r-list-item--description--line-height, var(--r-list-item--subtext--line-height, 1.5));
-  color: var(--r-list-item--description--color, var(--r-list-item--subtext--color, var(--r-text-regular, #282828)));
+.r-list-item--description {
+  font-size: var(--r-list-item--description--font-size, 1rem);
+  font-weight: var(--r-list-item--description--font-weight, 400);
+  line-height: var(--r-list-item--description--line-height, 1.5);
+  color: var(--r-list-item--description--color, var(--r-text-regular, #282828));
   white-space: var(--r-list-item--description--white-space, normal);
   overflow: var(--r-list-item--description--overflow, hidden);
   text-overflow: var(--r-list-item--description--text-overflow, ellipsis);
 }
-.r-list-item--subtext ::slotted(a), .r-list-item--description ::slotted(a) {
-  color: var(--r-list-item--description--color, var(--r-list-item--subtext--slotted--color, inherit));
+.r-list-item--description ::slotted(a) {
+  color: var(--r-list-item--description--color, inherit);
 }

package/dist/collection/components/list-item/list-item/list-item.js

@@ -44,7 +44,7 @@ export class RListItem {
         return this.isEl('[slot="headline"]');
     }
     get isDescriptionSlot() {
-        return this.isEl('[slot="description"]') || this.isEl('[slot="subtext"]');
+        return this.isEl('[slot="description"]');
     }
     get hasSubitems() {
         return this.isEl('[variant="subitem"]');
@@ -77,15 +77,15 @@ export class RListItem {
         return this.href && !this.disabled ? 'a' : 'div';
     }
     render() {
-        const { leadingIcon, leadingIconSrc, trailingIcon, trailingIconSrc, headline, trailingText, subtext, description } = this;
+        const { leadingIcon, leadingIconSrc, trailingIcon, trailingIconSrc, headline, trailingText, description } = this;
         const TagName = this.tagName;
         const itemAttrs = Object.assign({ href: TagName === 'a' ? this.href : null }, (this.disabled ? { role: 'link', 'aria-disabled': 'true' } : null));
         const ListItemContent = (h(TagName, Object.assign({ class: "r-list-item" }, itemAttrs), this.isLeading &&
             h("span", { class: "r-list-item--leading" }, h("slot", { name: "leading" }, this.isLeadingIcon && !this.hideLeadingIcon &&
                 h("r-icon", { class: "r-list-item--leading-icon", name: leadingIcon, src: leadingIconSrc }))), h("span", { class: "r-list-item--text" }, !this.isTextSlot ?
             h(Fragment, null, (this.isHeadlineSlot || headline) &&
-                h("span", { class: "r-list-item--headline" }, h("slot", { name: "headline" }, headline)), (description || this.isDescriptionSlot || subtext) &&
-                h("span", { class: "r-list-item--description" }, h("slot", { name: "subtext" }, subtext), h("slot", { name: "description" }, description)))
+                h("span", { class: "r-list-item--headline" }, h("slot", { name: "headline" }, headline)), (description || this.isDescriptionSlot) &&
+                h("span", { class: "r-list-item--description" }, h("slot", { name: "description" }, description)))
             :
                 h("slot", { name: "text" })), this.isTrailing &&
             h("span", { class: "r-list-item--trailing" }, h("slot", { name: "trailing" }, this.isTrailingIcon && !trailingText &&
@@ -128,28 +128,6 @@ export class RListItem {
                 "setter": false,
                 "reflect": false
             },
-            "subtext": {
-                "type": "string",
-                "attribute": "subtext",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [{
-                            "name": "deprecated",
-                            "text": "Use `description` instead. Will be removed November 2025.\nSecondary text displayed below the headline (2nd slot), used for additional details or context."
-                        }],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
             "description": {
                 "type": "string",
                 "attribute": "description",

package/dist/collection/components/pagination/pagination.css

@@ -90,29 +90,6 @@
 .r-pagination--header label {
   font-size: var(--r-pagination--font-size);
 }
-.r-pagination--item {
-  --r-button--display: flex;
-  --r-button--width: var(--r-pagination--button--width);
-  --r-button--height: var(--r-pagination--button--height);
-  --r-button--color: var(--r-pagination--button--color);
-  --r-button--background-color: var(--r-pagination--button--background-color);
-  --r-button--border-width: var(--r-pagination--button--border-width);
-  --r-button--padding: var(--r-pagination--button--padding);
-  --r-button--icon--width: auto;
-  --r-button--icon--height: auto;
-  align-items: var(--r-pagination--item--align-items);
-  background-color: var(--r-pagination--item--background-color);
-  color: var(--r-pagination--item--color);
-  display: var(--r-pagination--item--display);
-  font-family: var(--r-pagination--item--font-family);
-  height: var(--r-pagination--item--height);
-  justify-content: var(--r-pagination--item--justify-content);
-  margin-left: var(--r-pagination--item--margin-left);
-  margin-right: var(--r-pagination--item--margin-right);
-  opacity: var(--r-pagination--item--opacity);
-  width: var(--r-pagination--item--width);
-  z-index: var(--r-pagination--item--z-index);
-}
 .r-pagination--item:hover {
   --r-pagination--item--background-color: var(--r-background-interactive-hovered);
 }
@@ -155,3 +132,26 @@
 .r-pagination--item.number {
   --r-button--font-size: 0.813rem;
 }
+.r-pagination--item {
+  --r-button--display: flex;
+  --r-button--width: var(--r-pagination--button--width);
+  --r-button--height: var(--r-pagination--button--height);
+  --r-button--color: var(--r-pagination--button--color);
+  --r-button--background-color: var(--r-pagination--button--background-color);
+  --r-button--border-width: var(--r-pagination--button--border-width);
+  --r-button--padding: var(--r-pagination--button--padding);
+  --r-button--icon--width: auto;
+  --r-button--icon--height: auto;
+  align-items: var(--r-pagination--item--align-items);
+  background-color: var(--r-pagination--item--background-color);
+  color: var(--r-pagination--item--color);
+  display: var(--r-pagination--item--display);
+  font-family: var(--r-pagination--item--font-family);
+  height: var(--r-pagination--item--height);
+  justify-content: var(--r-pagination--item--justify-content);
+  margin-left: var(--r-pagination--item--margin-left);
+  margin-right: var(--r-pagination--item--margin-right);
+  opacity: var(--r-pagination--item--opacity);
+  width: var(--r-pagination--item--width);
+  z-index: var(--r-pagination--item--z-index);
+}

package/dist/collection/components/panel/panel.js

@@ -161,10 +161,10 @@ export class Panel {
         }
     }
     render() {
-        return (h(Host, { key: 'f57ca21d8a782d736984c091af8ad7bede50f81b', collapsed: this.isCollapsed }, h("div", { key: '138a6e18232630123667ad328c393c93e4908cf6', class: "r-panel" }, h("div", { key: '377662f16e8fca37a557adaf4fd8329e47828303', class: "r-panel--header" }, this.hasHeader && (h("a", { key: 'f183b59e3dff6ca76905b2b52902d2e6ec6f2709', class: "logo-wrapper", href: this.logoLink }, this.isCollapsed ?
+        return (h(Host, { key: '4898806bfe378b36f5fc784a6a4ea4477f164d86', collapsed: this.isCollapsed }, h("div", { key: 'f0acaedbc5e440b20a49791d5a3544955bdcd1f7', class: "r-panel" }, h("div", { key: '390898c282414aecd4cfd75e4da80fb6b04e8ffa', class: "r-panel--header" }, this.hasHeader && (h("a", { key: '9358558193e8c7ec82d8bf40240b9fb8d00d902d', class: "logo-wrapper", href: this.logoLink }, this.isCollapsed ?
             h("slot", { name: "logo-collapsed" })
             :
-                h("slot", { name: "logo-expanded" }))), this.variant === 'modal' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: `${this.labelCollapse}`, icon: "cross", "r-aria-label": `${this.labelCollapse}`, onClick: this.handleFullyCollapsedButtonClick })) : this.variant === 'drawer' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, icon: "angle-left", "r-aria-label": this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, onClick: this.handleSemiCollapsedButtonClick })) : this.variant === 'visible' ? (null) : null), h("div", { key: '0f239dc288b9c73f348341e99a06cce9e4499a0e', class: "r-panel--body" }, h("slot", { key: '6fd883065b4db924b1c245e7ea5bcf71229f0840' })), this.hasFooter && !this.isCollapsed && (h("div", { key: 'ce6a1f84358a505940d3ef04c5c218caa972b090', class: "r-panel--footer" }, h("slot", { key: 'e4422d8955e7e64babab3b3f04cfa06f32dad74a', name: "footer" }))))));
+                h("slot", { name: "logo-expanded" }))), this.variant === 'modal' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: `${this.labelCollapse}`, icon: "cross", "r-aria-label": `${this.labelCollapse}`, onClick: this.handleFullyCollapsedButtonClick })) : this.variant === 'drawer' ? (h("r-button", { class: "r-panel--trigger", variant: "blank", title: this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, icon: "angle-left", "r-aria-label": this.isCollapsed ? `${this.labelExpand}` : `${this.labelCollapse}`, onClick: this.handleSemiCollapsedButtonClick })) : this.variant === 'visible' ? (null) : null), h("div", { key: '070e63b95136c2cab2bf7a1a84390568c1341c47', class: "r-panel--body" }, h("slot", { key: 'e595b40da67e61bb23638d5ea1a615005d705a41' })), this.hasFooter && !this.isCollapsed && (h("div", { key: '7adb855c7aa805299abba58795aacb27ce4e6ba5', class: "r-panel--footer" }, h("slot", { key: '6e438b003d443bf62b2faad2bf180a4466190e77', name: "footer" }))))));
     }
     static get is() { return "r-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover/exports.js

@@ -1,4 +1,3 @@
 export const popoverDismissModeArray = ['auto', 'manual'];
-export const popoverSizeArray = ['s', 'l'];
 export const popoverHorizontalArray = ['left', 'center', 'right', 'cover'];
 export const popoverVerticalArray = ['top', 'middle', 'bottom', 'cover'];

package/dist/collection/components/popover/popover.css

@@ -6,6 +6,11 @@
   font-weight: var(--r-font-weight-regular, 400);
   font-size: var(--r-font-size-400, 1rem);
   text-align: left;
+}
+:host slot {
+  display: contents;
+}
+:host {
   --board--shift: 1rem;
   --board--min-width: 304px;
   --board--max-width: 504px;
@@ -14,17 +19,6 @@
   --pointer--height: 0.5rem;
   --pointer--spacer: 0.25rem;
 }
-:host slot {
-  display: contents;
-}
-
-:host([size=s]) {
-  --r-popover--board--max-width: 375px;
-}
-
-:host([size=l]) {
-  --r-popover--board--max-width: 500px;
-}
 
 :host([data-open=true]) {
   --r-popover--pointer--display: block;
@@ -187,6 +181,12 @@
   right: var(--r-popover--dismiss--right, 20px);
   color: var(--r-text-inverse);
 }
+.r-popover--dismiss:hover {
+  --r-icon-button--background-color: var(--r-background-interactive-hovered-inverse, rgba(243, 241, 240, 0.04));
+}
+.r-popover--dismiss:active {
+  --r-icon-button--background-color: var(--r-background-interactive-pressed-inverse, rgba(243, 241, 240, 0.12));
+}
 .r-popover--trigger {
   border: var(--r-popover--trigger--border, none);
   background: var(--r-popover--trigger--background, none);
@@ -211,8 +211,8 @@
   left: var(--r-popover--board--left, -1000em);
   visibility: var(--r-popover--board--visibility, hidden);
   width: var(--r-popover--board--width, 100%);
-  min-width: var(--r-popover--board--max-width, var(--board--min-width));
-  max-width: var(--r-popover--board--max-width, var(--board--max-width));
+  min-width: var(--board--min-width);
+  max-width: var(--board--max-width);
   height: var(--r-popover--board--height, auto);
   max-height: var(--r-popover--board--max-height, var(--board--max-height));
   background-color: var(--r-popover--board--background-color, var(--r-background-inverse));

package/dist/collection/components/popover/popover.js

@@ -280,8 +280,8 @@ export class Popover {
         this.open ? this.show() : this.hide();
     }
     render() {
-        return (h(Host, { key: 'da45eae6a21cc01596344d33afc5def4da57967f', id: this.uniqueId, "data-position": this.positionState, "data-open": `${this.isOpen}`, open: this.isOpen }, h("div", { key: 'ad832de894e0af250cc93bdf3158032bc252740f', class: "r-popover" }, h("button", { key: '28c4938bb02cb7c4eaed074178dda00c2c39a0b7', class: "r-popover--trigger", "aria-label": this.triggerAriaLabel, ref: el => this.triggerElement = el, popoverTarget: `${this.uniqueId}-board`, popoverTargetAction: this.triggerAction }, h("slot", { key: '0a74ac9d6a7ecdba54771e733f8db5af1709e7fb', name: "trigger" })), h("div", { key: 'dbdb43df6a9823f5d8c954146347f40438bbf053', class: "r-popover--board", id: `${this.uniqueId}-board`, popover: this.dismissMode, ref: el => this.boardElement = el, onToggle: this.onToggle, onKeyDown: this.onKeyDown }, this.hasDismiss &&
-            h("r-icon-button", { key: '99cb4c1c050cdf197346ef84f7c610f5f6ed0b4c', ref: el => this.dismissElement = el, class: "r-popover--dismiss", name: "cross", onClick: this.onClickDismiss, label: this.dismissAriaLabel }), h("div", { key: 'fe7e18bd38a4f3879aada14169bfa50f84cd2eac', class: "r-popover--board-content" }, h("slot", { key: 'b5674f8f2f72340cf5af712f513a20bda9e04b47', name: "headline" }), h("slot", { key: '024ce9cc17f041df172d853176d09f4ec493df20', name: "content" }), h("slot", { key: '437ca7707856b7c6db59240d7b4378c74dc8fda8', name: "action" })), h("div", { key: '93184bd493520dbea03c7c63bbfe8c4ae788cde3', class: "r-popover--board-pointer", "aria-hidden": "true" }, h("svg", { key: '779d8b7df8f92ea14517ce9ce5099a73a4fdeac8', width: "16", height: "8", viewBox: "0 0 16 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '53b9fee3e6a34cf184d8818ac272122f04193ff6', d: "M8 8L0 0L16 0L8 8Z", fill: "currentColor" })))))));
+        return (h(Host, { key: '13318df823b3f54e05823c9fc9821839f56583b2', id: this.uniqueId, "data-position": this.positionState, "data-open": `${this.isOpen}`, open: this.isOpen }, h("div", { key: '3f750ac2a82236f6a4074fa419b44f0c42f2b7e6', class: "r-popover" }, h("button", { key: '46e4bb247c2eda0e0cc0c4774acac6daf8801bc4', class: "r-popover--trigger", "aria-label": this.triggerAriaLabel, ref: el => this.triggerElement = el, popoverTarget: `${this.uniqueId}-board`, popoverTargetAction: this.triggerAction }, h("slot", { key: 'fac2e6d0ee9ac8830df16d379a0ec5e873becd58', name: "trigger" })), h("div", { key: '636c2ee45476903dc8b812924081f3b45499b18a', class: "r-popover--board", id: `${this.uniqueId}-board`, popover: this.dismissMode, ref: el => this.boardElement = el, onToggle: this.onToggle, onKeyDown: this.onKeyDown }, this.hasDismiss &&
+            h("r-icon-button", { key: '4f6a1168587faf500cddb85981f0dd7209af4020', ref: el => this.dismissElement = el, class: "r-popover--dismiss", name: "cross", onClick: this.onClickDismiss, label: this.dismissAriaLabel }), h("div", { key: 'bfa17c2df8022a01192550c315ba32e3a5247e3f', class: "r-popover--board-content" }, h("slot", { key: '001d74737028aee0d413e9ed679ff853070d5559', name: "headline" }), h("slot", { key: '9a33119f2e2f6bf10f0005f83283a1e964332583', name: "content" }), h("slot", { key: '2ff477aed3ef83d6bfff4fb3fdaeb3501dfba7c7', name: "action" })), h("div", { key: '6c0b891bc2e9def0892f65fe8882deef565b2037', class: "r-popover--board-pointer", "aria-hidden": "true" }, h("svg", { key: 'e9da72e80bb395041f4a9cc269cf835b643a335c', width: "16", height: "8", viewBox: "0 0 16 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '44eb8e0fa2c3d294074787595097fcdf82311052', d: "M8 8L0 0L16 0L8 8Z", fill: "currentColor" })))))));
     }
     static get is() { return "r-popover"; }
     static get encapsulation() { return "shadow"; }
@@ -319,37 +319,6 @@ export class Popover {
                 "setter": false,
                 "reflect": true
             },
-            "size": {
-                "type": "string",
-                "attribute": "size",
-                "mutable": false,
-                "complexType": {
-                    "original": "PopoverSize",
-                    "resolved": "\"l\" | \"s\"",
-                    "references": {
-                        "PopoverSize": {
-                            "location": "import",
-                            "path": "./exports",
-                            "id": "src/components/popover/exports.ts::PopoverSize"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [{
-                            "name": "default",
-                            "text": "\"s\""
-                        }, {
-                            "name": "deprecated",
-                            "text": "This property will be removed in November 2025 release."
-                        }],
-                    "text": "_DEPRECATED_ (This property will be removed in November 2025 release.)\nSize of the Popover: `s` | `l`."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
             "dismissMode": {
                 "type": "string",
                 "attribute": "dismiss-mode",
@@ -446,28 +415,6 @@ export class Popover {
                 "setter": false,
                 "reflect": false
             },
-            "containerAriaLabel": {
-                "type": "string",
-                "attribute": "container-aria-label",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [{
-                            "name": "deprecated",
-                            "text": "This property will be removed in December 2025 release."
-                        }],
-                    "text": "Defines `aria-label` content for the popover container.\nUsed for accessibility to describe the popover content area."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
             "vertical": {
                 "type": "string",
                 "attribute": "vertical",

package/dist/collection/components/popover-action/popover-action.css

@@ -4,20 +4,18 @@
 
 ::slotted(r-button) {
   --r-button--color: var(--r-text-regular);
-  --r-button--border-color: rgba(0,0,0,0);
+  --r-button--border-width: 0;
   --r-button--background-color: rgba(0,0,0,0);
   --r-button--slot--position: relative;
   --r-button--slot--text-decoration: underline;
-  --r-button--padding: 12px 0.125rem 19px 0.125rem;
-  --r-button--slot--text-underline-offset: 12px;
+  --r-button--padding: 10px 2px 18px 2px;
+  --r-button--slot--text-underline-offset: 9px;
 }
 
 ::slotted(r-button:hover:not([disabled]):not([disabled=false])) {
-  --r-button--border-color: var(--r-border-soft);
   --r-button--background-color: var(--r-background-interactive-hovered);
 }
 
 ::slotted(r-button:active:not([disabled]):not([disabled=false])) {
   --r-button--background-color: var(--r-background-interactive-pressed);
-  --r-button--border-color: var(--r-border-soft);
 }

package/dist/collection/components/popover-action/popover-action.js

@@ -64,7 +64,7 @@ export class PopoverAction {
         return focusableElements(this.host);
     }
     render() {
-        return (h(Host, { key: '573250bc4f9a1a8725e8808885854ca320b203bc', slot: "action" }, h("slot", { key: 'd753af20723fb9e2ae49f9977cda81fa1c3df8c6', onSlotchange: this.handleSlotChange })));
+        return (h(Host, { key: '898d4a649622403956b34ea5065ca5135e67c595', slot: "action" }, h("slot", { key: 'f61e085a1797778c33f07eaf3987cd743d56a662', onSlotchange: this.handleSlotChange })));
     }
     static get is() { return "r-popover-action"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover-content/popover-content.js

@@ -44,7 +44,7 @@ export class PopoverContent {
         return focusableElements(this.host);
     }
     render() {
-        return (h(Host, { key: 'ec778d5e0a294bcbe389039abc6f0b620b7bc69c', slot: "content", class: "r-typography" }, h("slot", { key: '40c27d279a1093be8a98731881ad83da147f5bbc' })));
+        return (h(Host, { key: 'b85780e40b627c6d859af763113bc88e21768f88', slot: "content", class: "r-typography" }, h("slot", { key: '7bd5e6152e29a4e20d837c21e1df7bff68a673da' })));
     }
     static get is() { return "r-popover-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover-headline/popover-headline.js

@@ -10,7 +10,7 @@ export class PopoverHeadline {
         stopInverseThemeAwareness(this.host, themeContextElement);
     }
     render() {
-        return (h(Host, { key: 'f878fb9ca3ffe1df00088bbd2fe1b6321130228a', slot: "headline" }, h("slot", { key: '1a477943ab993f8960f3e77dd90a72a276bf4200' })));
+        return (h(Host, { key: '6b604401e4e82c17a300f00d6af33902b38f493c', slot: "headline" }, h("slot", { key: '64c8c6ff661e0317ba3ae0d4f32f6424d91fccbe' })));
     }
     static get is() { return "r-popover-headline"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover-trigger/popover-trigger.js

@@ -53,7 +53,7 @@ export class PopoverTrigger {
         (_a = this.activeElement) === null || _a === void 0 ? void 0 : _a.blur();
     }
     render() {
-        return (h(Host, { key: '78536189423d25a1cf3ee3630512ad44b2dbd444', slot: "trigger", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("slot", { key: 'e634da1b6053eb1c0df7f08f5486f9492c2bd4d0' })));
+        return (h(Host, { key: 'fe285ee3a91600ee0e0cebeb9f5818eb30d89f06', slot: "trigger", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("slot", { key: '3782871f7aac634d3c1ccef2f516cdf00916b4f6' })));
     }
     static get is() { return "r-popover-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/progress-bar/progress-bar.js

@@ -11,7 +11,7 @@ export class ProgressBar {
             max: '100',
             'aria-label': rAriaLabel
         };
-        return (h(Host, { key: '81203123d2df8fb029855f39dc359b98991630ee' }, h("progress", Object.assign({ key: 'f766b44c2c4088ab67d69b57de074fee15be166c' }, progressBarAttrs, { class: "r-progress-bar" }))));
+        return (h(Host, { key: 'f79c73155a42eef63910abde1fc2cebd147b7129' }, h("progress", Object.assign({ key: 'ce94e9a20124fa8cd1561612e2797e17f0ebe19f' }, progressBarAttrs, { class: "r-progress-bar" }))));
     }
     static get is() { return "r-progress-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/radio-button/radio-button.js

@@ -6,6 +6,8 @@ export class RadioButton {
     constructor() {
         /** Value of element data within a form */
         this.value = this.slotTextValue;
+        /** Automatically focus the radio button when the component is mounted. Note: Only one element per page should have autofocus set to true, following browser standard behavior. */
+        this.autofocus = false;
         /** Unique id */
         this.uniqueId = `r-radio-button-${Date.now().toString(32)}${Math.random().toString(32)}`.replace(/\./g, '');
         this.onClick = (event) => {
@@ -26,18 +28,25 @@ export class RadioButton {
         this.onBlur = () => {
             this.host.classList.remove('focused');
         };
+        this.applyAutofocus = () => {
+            queueMicrotask(() => {
+                this.setFocus();
+            });
+        };
     }
     /** Sets focus on the radio button element */
     async setFocus() {
-        this.nativeEl.focus();
+        var _a;
+        (_a = this.nativeEl) === null || _a === void 0 ? void 0 : _a.focus();
     }
     /** Blurs the radio button element */
     async setBlur() {
-        this.nativeEl.blur();
+        var _a;
+        (_a = this.nativeEl) === null || _a === void 0 ? void 0 : _a.blur();
     }
     /** Selects the radio button element */
     async select() {
-        var _a;
+        var _a, _b, _c;
         if (this.checked)
             return;
         if (this.disabled)
@@ -47,8 +56,8 @@ export class RadioButton {
             radio.shadowRoot.querySelector('.r-radio-button--input').setAttribute('tabindex', '-1');
         });
         this.checked = true;
-        this.nativeEl.setAttribute('tabindex', '0');
-        this.nativeEl.focus();
+        (_b = this.nativeEl) === null || _b === void 0 ? void 0 : _b.setAttribute('tabindex', '0');
+        (_c = this.nativeEl) === null || _c === void 0 ? void 0 : _c.focus();
         const { host, value, checked } = this;
         this.rChange.emit({ element: host, value, checked });
     }
@@ -82,6 +91,9 @@ export class RadioButton {
     get isTrailing() {
         return this.host.querySelector('[slot="trailing"]') !== null || this.host.querySelector('r-radio-button-trailing') !== null;
     }
+    get shouldAutofocus() {
+        return this.autofocus && (!this.groupEl || !this.groupEl.autofocus);
+    }
     componentWillLoad() {
         if (!this.initialState)
             this.initialState = this.checked;
@@ -89,8 +101,12 @@ export class RadioButton {
             this.name = this.groupEl.name;
         }
     }
+    componentDidLoad() {
+        if (this.shouldAutofocus)
+            this.applyAutofocus();
+    }
     render() {
-        const { name, value, checked, disabled, hint, uniqueId, required, invalid, error } = this;
+        const { name, value, checked, disabled, hint, uniqueId, required, invalid, error, autofocus } = this;
         const inputAttrs = {
             type: 'radio',
             tabindex: '-1',
@@ -98,13 +114,14 @@ export class RadioButton {
             value,
             disabled,
             checked,
-            required
+            required,
+            autofocus
         };
-        return (h(Host, { key: '862574a20e04e55e3e7e0b8cb48131652f029030' }, h("label", { key: 'b916e9d5740605bad9a1f88c6bb07d0564b63f16', class: "r-radio-button", onClick: this.onClick, onKeyDown: this.onKeydown }, h("input", Object.assign({ key: 'd0ca90e85e619d8c5b9a8c71ae1582db65562036' }, inputAttrs, { id: `${uniqueId}-input`, class: "r-radio-button--input", ref: el => this.nativeEl = el, onFocus: this.onFocus, onBlur: this.onBlur })), h("span", { key: 'f77f3e56e88c5e3ad1f3e36e5f96715edb7e91cc', class: "r-radio-button--box" }), this.isLeading &&
-            h("div", { key: '60d6a15880fafd8007d20a80137b30f19d4f641e', class: "r-radio-button--leading" }, h("slot", { key: '9329c56d97e5e357ea70d165ee11ac171c605519', name: "leading" }, this.icon && h("r-icon", { key: 'ace86d3b61cd39f05ca3146e54d3ae4820d7b66d', name: this.icon, size: "m" }))), h("div", { key: '7773e0c5b2348245e4b4dafc06a6b10a6dc245c3', class: "r-radio-button--text" }, h("slot", { key: 'f060b0853a7a6ed0108d0182669807fd0236da33', name: "title" }, h("div", { key: '1ca5059e718a0bda9a53e2e0f630a617d0252638', style: { display: 'contents' } }, h("slot", { key: 'cb9128b915d2a71cff7e8960d5bd86973c615232' }))), h("slot", { key: 'f07a62e2caa36ceb27bc547cf86c7dfcdce1c5b4', name: "description" }, this.description)), this.isTrailing &&
-            h("div", { key: 'cc5e6dff1c324fdce239f8d4e553e154bdb73eac', class: "r-radio-button--trailing" }, h("slot", { key: '3d5e862c5830adb7a480fbb71ff92fef054bf1f7', name: "trailing" }))), invalid && error &&
-            h("r-hint", { key: '997b440b69a23cb432b8376b0351a947ec3b162e', role: "alert", variant: "error", id: `${uniqueId}-hint` }, this.error), hint &&
-            h("r-hint", { key: 'd3c41065b4924f42a2971d1cb91154e8e3041238', role: "note", variant: "information", id: `${uniqueId}-hint` }, hint)));
+        return (h(Host, { key: '718b29840798212b4a31a2250fe79620554a9fb5' }, h("label", { key: 'ab86d4ca9bb300628a5b7f4bf10ba2ce88656d6d', class: "r-radio-button", onClick: this.onClick, onKeyDown: this.onKeydown }, h("input", Object.assign({ key: '529324a5ae32238b56ab9443a9ba3dd67b9b76bd' }, inputAttrs, { id: `${uniqueId}-input`, class: "r-radio-button--input", ref: el => this.nativeEl = el, onFocus: this.onFocus, onBlur: this.onBlur })), h("span", { key: 'a90a3704b4fc2d431482cca0c4064241001e09d2', class: "r-radio-button--box" }), this.isLeading &&
+            h("div", { key: '8a067dc10dc0f764c507be6610a8bf6f80565f8b', class: "r-radio-button--leading" }, h("slot", { key: 'db99a204cdf0932b203a65698f6167ede11309c4', name: "leading" }, this.icon && h("r-icon", { key: '8f6b1c585e0dcfcee9bb471e59f4d911ff72e7bc', name: this.icon, size: "m" }))), h("div", { key: 'b2ec0c20df6bffa599c5331016f3c52ce5661a17', class: "r-radio-button--text" }, h("slot", { key: '82ed5be7758c72ece18d4df27c0dbeb7e00ab1fc', name: "title" }, h("div", { key: '9c839853016eb5e7a3940bea0f9c5c755933ae55', style: { display: 'contents' } }, h("slot", { key: '78875045c000e5dcd0375fe2143e3032bf3a5226' }))), h("slot", { key: 'd75f2511dc33c734eb34c0d8953ed5be2f4cb7ea', name: "description" }, this.description)), this.isTrailing &&
+            h("div", { key: 'fd204a1c99ac54d60fc4479de3ca650d8ecf6508', class: "r-radio-button--trailing" }, h("slot", { key: '9a82590bc860567d1a60f9125622b1e63471ad94', name: "trailing" }))), invalid && error &&
+            h("r-hint", { key: '1fc760af1aff4ca5aaa595270c294b492fdb14e3', role: "alert", variant: "error", id: `${uniqueId}-hint` }, this.error), hint &&
+            h("r-hint", { key: '079a060908d285505f7093820933c173194f2348', role: "note", variant: "information", id: `${uniqueId}-hint` }, hint)));
     }
     static get is() { return "r-radio-button"; }
     static get encapsulation() { return "shadow"; }
@@ -254,6 +271,26 @@ export class RadioButton {
                 "setter": false,
                 "reflect": true
             },
+            "autofocus": {
+                "type": "boolean",
+                "attribute": "autofocus",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Automatically focus the radio button when the component is mounted. Note: Only one element per page should have autofocus set to true, following browser standard behavior."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
+            },
             "checked": {
                 "type": "boolean",
                 "attribute": "checked",