@momentum-design/components 0.122.1 → 0.122.2

package/dist/components/popover/popover.utils.js

@@ -124,7 +124,8 @@ export class PopoverUtils {
                 this.popover.ariaLabel =
                     ((_a = this.popover.triggerElement) === null || _a === void 0 ? void 0 : _a.ariaLabel) || ((_b = this.popover.triggerElement) === null || _b === void 0 ? void 0 : _b.textContent) || '';
             }
-            if (!this.popover.ariaLabelledby) {
+            if (!this.popover.ariaLabelledby && !this.popover.ariaLabel) {
+                // If no aria-label is provided, link the popover to the trigger element via aria-labelledby
                 this.popover.ariaLabelledby = ((_c = this.popover.triggerElement) === null || _c === void 0 ? void 0 : _c.id) || '';
             }
         }

package/dist/components/searchpopover/searchpopover.component.d.ts

@@ -7,8 +7,8 @@ import type { Placement } from './searchpopover.types';
  * in a popover below the search input field, where the search results hold individual actions like navigating to a
  * a different url etc.
  *
- * - Don't use this when search results are displayed inline on the page -> use Searchfield component instead.
- * - Don't use this when a list of options is filtered based on the search input -> use Combobox component instead.
+ * - Don't use this when search results are displayed inline on the page -\> use Searchfield component instead.
+ * - Don't use this when a list of options is filtered based on the search input -\> use Combobox component instead.
  *
  * It supports `mdc-inputchip` as filters.
  *
@@ -93,6 +93,11 @@ declare class Searchpopover extends Searchfield {
      * @default 1000
      */
     popoverZIndex: number;
+    /**
+     * The aria-label for the popover within Searchpopover.
+     * Use to provide an accessible name for the popover i.e. "Search results".
+     */
+    popoverAriaLabel?: string;
     protected renderInputElement(): import("lit-html").TemplateResult<1>;
     render(): import("lit-html").TemplateResult<1>;
     static styles: Array<CSSResult>;

package/dist/components/searchpopover/searchpopover.component.js

@@ -25,8 +25,8 @@ import { DEFAULTS, TRIGGER_ID, POPOVER_ID } from './searchpopover.constants';
  * in a popover below the search input field, where the search results hold individual actions like navigating to a
  * a different url etc.
  *
- * - Don't use this when search results are displayed inline on the page -> use Searchfield component instead.
- * - Don't use this when a list of options is filtered based on the search input -> use Combobox component instead.
+ * - Don't use this when search results are displayed inline on the page -\> use Searchfield component instead.
+ * - Don't use this when a list of options is filtered based on the search input -\> use Combobox component instead.
  *
  * It supports `mdc-inputchip` as filters.
  *
@@ -183,6 +183,7 @@ class Searchpopover extends Searchfield {
         focus-back-to-trigger
         size
         placement="${this.placement}"
+        aria-label="${ifDefined(this.popoverAriaLabel)}"
         disable-aria-expanded
         z-index="${ifDefined(this.popoverZIndex)}"
         exportparts="popover-content"
@@ -205,4 +206,8 @@ __decorate([
     property({ type: Number, reflect: true, attribute: 'popover-z-index' }),
     __metadata("design:type", Number)
 ], Searchpopover.prototype, "popoverZIndex", void 0);
+__decorate([
+    property({ type: String, reflect: true, attribute: 'popover-aria-label' }),
+    __metadata("design:type", String)
+], Searchpopover.prototype, "popoverAriaLabel", void 0);
 export default Searchpopover;