From 8bdfbecc3688769e0864c6d8880ae0c089a94105 Mon Sep 17 00:00:00 2001
From: Bjarne Fyrstenborg <bjarne_fyrstenborg@hotmail.com>
Date: Sun, 15 Oct 2023 00:39:54 +0200
Subject: [PATCH] Set aria-hidden if no label has been set

---
 packages/uui-icon/lib/uui-icon.element.ts | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/packages/uui-icon/lib/uui-icon.element.ts b/packages/uui-icon/lib/uui-icon.element.ts
index 1179cab53..b916f31e6 100644
--- a/packages/uui-icon/lib/uui-icon.element.ts
+++ b/packages/uui-icon/lib/uui-icon.element.ts
@@ -43,6 +43,15 @@ export class UUIIconElement extends LitElement {
   @state()
   private _nameSvg: string | null = null;
 
+  /**
+   * An alternate description to use for assistive devices.
+   * If omitted, the icon will be considered presentational and ignored by assistive devices.
+   * @type {string}
+   * @attr
+   * @default
+   */
+  @property() label = '';
+
   /**
    * Icon name is used to retrieve the icon from a parent Icon Registry.
    * If no Icon Registry responds to the given name, the fallback svg will be used.
@@ -60,6 +69,7 @@ export class UUIIconElement extends LitElement {
       this.requestIcon();
     }
   }
+
   private requestIcon() {
     if (this._name !== '' && this._name !== null) {
       const event = new UUIIconRequestEvent(UUIIconRequestEvent.ICON_REQUEST, {
@@ -116,6 +126,19 @@ export class UUIIconElement extends LitElement {
     if (this._retrievedNameIcon === false) {
       this.requestIcon();
     }
+
+    const hasLabel = typeof this.label === 'string' && this.label.length > 0;
+
+    if (hasLabel) {
+      this.setAttribute('role', 'img');
+      this.setAttribute('aria-label', this.label);
+      this.removeAttribute('aria-hidden');
+    } else {
+      this.removeAttribute('role');
+      this.removeAttribute('aria-label');
+      this.setAttribute('aria-hidden', 'true');
+    }
+    
   }
 
   render() {