Fixes for dynamic modal a11y (#1237)

* Remove tabindex from modal component templates

* Remove tabindex from modal component templates

* Update jslib

bitwarden_license/src/app/providers/clients/add-organization.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="addTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="addTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <div class="modal-content">
             <div class="modal-header">

bitwarden_license/src/app/providers/manage/user-add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

jslib

@@ -1 +1 @@
-Subproject commit 815b436f7ce9f8825575f288b1ae98c1dc54f1d2
+Subproject commit 24fe836032354d4ec39435776e54dd0995e1b389

src/app/accounts/two-factor-options.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="twoStepOptionsTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="twoStepOptionsTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/components/password-reprompt.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()">
             <div class="modal-header">

src/app/organizations/manage/bulk/bulk-confirm.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/organizations/manage/bulk/bulk-remove.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/organizations/manage/bulk/bulk-status.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="bulkTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/organizations/manage/collection-add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="collectionAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="collectionAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/organizations/manage/entity-events.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="eventLogsTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="eventLogsTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/organizations/manage/entity-users.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAccessTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAccessTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/organizations/manage/group-add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="groupAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="groupAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/organizations/manage/policy-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="policiesEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="policiesEditTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/organizations/manage/reset-password.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="resetPasswordTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="resetPasswordTitle">
     <div class="modal-dialog" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/organizations/manage/user-add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/organizations/manage/user-confirm.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/organizations/manage/user-groups.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="groupAccessTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="groupAccessTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/organizations/settings/delete-organization.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deleteOrganizationTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deleteOrganizationTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/send/add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="sendAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="sendAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate
             autocomplete="off">

src/app/settings/api-key.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="apiKeyTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="apiKeyTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/settings/deauthorize-sessions.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deAuthTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deAuthTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/settings/delete-account.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deleteAccountTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deleteAccountTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/settings/emergency-access-add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/settings/emergency-access-confirm.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/settings/emergency-access-takeover.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="userAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/settings/purge-vault.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="purgeVaultTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="purgeVaultTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/settings/two-factor-authenticator.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faAuthenticatorTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faAuthenticatorTitle">
     <div class="modal-dialog" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/settings/two-factor-duo.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faDuoTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faDuoTitle">
     <div class="modal-dialog" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/settings/two-factor-email.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faEmailTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faEmailTitle">
     <div class="modal-dialog" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/settings/two-factor-recovery.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faRecoveryTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faRecoveryTitle">
     <div class="modal-dialog" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/settings/two-factor-webauthn.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faU2fTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faU2fTitle">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/settings/two-factor-yubikey.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="2faYubiKeyTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="2faYubiKeyTitle">
     <div class="modal-dialog modal-lg" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/settings/update-key.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="updateEncKeyTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="updateEncKeyTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/tools/password-generator-history.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="passHistoryTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="passHistoryTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <div class="modal-content">
             <div class="modal-header">

src/app/vault/add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="cipherAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="cipherAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate
             autocomplete="off">

src/app/vault/attachments.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="attachmentsTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="attachmentsTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/vault/bulk-delete.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="deleteSelectedTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="deleteSelectedTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-sm" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/vault/bulk-move.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="moveSelectedTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="moveSelectedTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-sm" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/vault/bulk-restore.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="restoreSelectedTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="restoreSelectedTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-sm" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/vault/bulk-share.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="moveSelectedToOrgTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="moveSelectedToOrgTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/vault/collections.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="collectionsTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="collectionsTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">

src/app/vault/folder-add-edit.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="folderAddEditTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="folderAddEditTitle">
     <div class="modal-dialog modal-dialog-scrollable modal-sm" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise" ngNativeValidate>
             <div class="modal-header">

src/app/vault/share.component.html

@@ -1,4 +1,4 @@
-<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="shareTitle">
+<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="shareTitle">
     <div class="modal-dialog modal-dialog-scrollable" role="document">
         <form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
             <div class="modal-header">