fix(components/errors): set ariaLabelledBy for error modals to satisfy accessibility rules (#819)

Author: Blackbaud-SteveBrush

libs/components/errors/src/lib/modules/error/error-modal-form.component.html

@@ -1,7 +1,9 @@
-<sky-modal>
+<sky-modal [ariaLabelledBy]="title.id">
   <sky-modal-content>
     <div class="sky-error-modal-container">
-      <span class="sky-error-modal-title">{{ context.errorTitle }}</span>
+      <span class="sky-error-modal-title" skyId #title="skyId">{{
+        context.errorTitle
+      }}</span>
       <span class="sky-error-modal-description">{{
         context.errorDescription
       }}</span>

libs/components/errors/src/lib/modules/error/error.module.ts

@@ -1,5 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
+import { SkyIdModule } from '@skyux/core';
 import { SkyModalModule } from '@skyux/modals';
 
 import { SkyErrorsResourcesModule } from '../shared/sky-errors-resources.module';
@@ -20,7 +21,12 @@ import { SkyErrorComponent } from './error.component';
     SkyErrorActionComponent,
     SkyErrorModalFormComponent,
   ],
-  imports: [CommonModule, SkyErrorsResourcesModule, SkyModalModule],
+  imports: [
+    CommonModule,
+    SkyErrorsResourcesModule,
+    SkyIdModule,
+    SkyModalModule,
+  ],
   exports: [
     SkyErrorComponent,
     SkyErrorImageComponent,

libs/components/modals/src/lib/modules/modal/modal.component.ts

@@ -67,6 +67,10 @@ export class SkyModalComponent implements AfterViewInit, OnDestroy {
 
   public ariaDescribedBy: string;
 
+  /**
+   * @internal
+   */
+  @Input()
   public ariaLabelledBy: string;
 
   public helpKey: string | undefined;