Remove whitespace from ids

Author: jantoun-scottlogic

src/app/tab/tab-item/tab-item.component.html

@@ -2,7 +2,7 @@
   role="tabpanel"
   aria-live="off"
   [hidden]="!active()"
-  [id]="title() + '-tabpanel'"
-  [attr.aria-labelledby]="title() + '-tab'">
+  [id]="title().replaceAll(' ', '-') + '-tabpanel'"
+  [attr.aria-labelledby]="title().replaceAll(' ', '-') + '-tab'">
   <ng-content></ng-content>
 </div>

src/app/tab/tabs/tabs.component.html

@@ -3,8 +3,8 @@
     <button
       #tabButton
       role="tab"
-      [id]="tab.title() + '-tab'"
-      [attr.aria-controls]="tab.title() + '-tabpanel'"
+      [id]="tab.title().replaceAll(' ', '-') + '-tab'"
+      [attr.aria-controls]="tab.title().replaceAll(' ', '-') + '-tabpanel'"
       [class.tce-active-tab]="tab.active()"
       [tabindex]="tab.active() ? 0 : -1"
       [attr.aria-selected]="tab.active() ? true : false"