diff --git a/jslib b/jslib
index 0d658ba26df..2b647df001f 160000
--- a/jslib
+++ b/jslib
@@ -1 +1 @@
-Subproject commit 0d658ba26dfb539f15e33f396e597e6727070bc2
+Subproject commit 2b647df001f6bdfbeb6f272a0b7b56396ac9564d
diff --git a/src/app/components/organization-switcher.component.html b/src/app/components/organization-switcher.component.html
index 7975fd9e1b0..221985a6cff 100644
--- a/src/app/components/organization-switcher.component.html
+++ b/src/app/components/organization-switcher.component.html
@@ -46,7 +46,7 @@
   <bit-menu #orgPickerMenu>
     <ul aria-labelledby="pickerButton" class="tw-p-0 tw-m-0">
       <li *ngFor="let org of organizations" class="tw-list-none tw-flex tw-flex-col" role="none">
-        <a bit-menu-item [routerLink]="['/organizations', org.id]">
+        <a bitMenuItem [routerLink]="['/organizations', org.id]">
           <i
             class="bwi bwi-check mr-2"
             [ngClass]="org.id === activeOrganization.id ? 'visible' : 'invisible'"
@@ -58,7 +58,7 @@
       </li>
       <bit-menu-divider></bit-menu-divider>
       <li class="tw-list-none" role="none">
-        <a bit-menu-item routerLink="/create-organization">
+        <a bitMenuItem routerLink="/create-organization">
           <i class="bwi bwi-plus mr-2"></i>
           {{ "newOrganization" | i18n }}</a
         >
diff --git a/src/app/components/premium-badge.component.ts b/src/app/components/premium-badge.component.ts
index 86a88d51066..0628621f17a 100644
--- a/src/app/components/premium-badge.component.ts
+++ b/src/app/components/premium-badge.component.ts
@@ -5,7 +5,7 @@ import { MessagingService } from "jslib-common/abstractions/messaging.service";
 @Component({
   selector: "app-premium-badge",
   template: `
-    <button *appNotPremium bit-badge badgeType="success" (click)="premiumRequired()">
+    <button *appNotPremium bitBadge badgeType="success" (click)="premiumRequired()">
       {{ "premium" | i18n }}
     </button>
   `,
diff --git a/src/app/layouts/navbar.component.html b/src/app/layouts/navbar.component.html
index 9bbd8d2ece8..edc5d34d69a 100644
--- a/src/app/layouts/navbar.component.html
+++ b/src/app/layouts/navbar.component.html
@@ -65,24 +65,24 @@
               </div>
             </div>
             <bit-menu-divider></bit-menu-divider>
-            <a bit-menu-item routerLink="/settings/account">
+            <a bitMenuItem routerLink="/settings/account">
               <i class="bwi bwi-fw bwi-user" aria-hidden="true"></i>
               {{ "accountSettings" | i18n }}
             </a>
-            <a bit-menu-item href="https://bitwarden.com/help/" target="_blank" rel="noopener">
+            <a bitMenuItem href="https://bitwarden.com/help/" target="_blank" rel="noopener">
               <i class="bwi bwi-fw bwi-question-circle" aria-hidden="true"></i>
               {{ "getHelp" | i18n }}
             </a>
-            <a bit-menu-item href="https://bitwarden.com/download/" target="_blank" rel="noopener">
+            <a bitMenuItem href="https://bitwarden.com/download/" target="_blank" rel="noopener">
               <i class="bwi bwi-fw bwi-download" aria-hidden="true"></i>
               {{ "getApps" | i18n }}
             </a>
             <bit-menu-divider></bit-menu-divider>
-            <button bit-menu-item type="button" (click)="lock()">
+            <button bitMenuItem type="button" (click)="lock()">
               <i class="bwi bwi-fw bwi-lock" aria-hidden="true"></i>
               {{ "lockNow" | i18n }}
             </button>
-            <button bit-menu-item type="button" (click)="logOut()">
+            <button bitMenuItem type="button" (click)="logOut()">
               <i class="bwi bwi-fw bwi-sign-out" aria-hidden="true"></i>
               {{ "logOut" | i18n }}
             </button>
diff --git a/src/app/modules/organizations/users/enroll-master-password-reset.component.html b/src/app/modules/organizations/users/enroll-master-password-reset.component.html
index e1e389caa56..c8d15a39560 100644
--- a/src/app/modules/organizations/users/enroll-master-password-reset.component.html
+++ b/src/app/modules/organizations/users/enroll-master-password-reset.component.html
@@ -32,7 +32,7 @@
         <app-user-verification [(ngModel)]="verification" name="secret"> </app-user-verification>
       </div>
       <div class="modal-footer">
-        <button bit-button buttonType="primary" type="submit" [disabled]="form.loading">
+        <button bitButton buttonType="primary" type="submit" [disabled]="form.loading">
           <i
             class="bwi bwi-spinner bwi-spin"
             title="{{ 'loading' | i18n }}"
@@ -43,7 +43,7 @@
           </span>
         </button>
         <button
-          bit-button
+          bitButton
           buttonType="secondary"
           type="button"
           data-dismiss="modal"
diff --git a/src/app/modules/vault/modules/organization-badge/organization-name-badge.component.html b/src/app/modules/vault/modules/organization-badge/organization-name-badge.component.html
index 1a2f9936893..de4711d6174 100644
--- a/src/app/modules/vault/modules/organization-badge/organization-name-badge.component.html
+++ b/src/app/modules/vault/modules/organization-badge/organization-name-badge.component.html
@@ -1,5 +1,5 @@
 <button
-  bit-badge
+  bitBadge
   [style.color]="textColor"
   [style.background-color]="color"
   appA11yTitle="{{ organizationName }}"
diff --git a/src/app/reports/breach-report.component.html b/src/app/reports/breach-report.component.html
index b6195bfd591..6d7c0401f05 100644
--- a/src/app/reports/breach-report.component.html
+++ b/src/app/reports/breach-report.component.html
@@ -17,13 +17,7 @@
       <small class="form-text text-muted">{{ "breachCheckUsernameEmail" | i18n }}</small>
     </div>
   </div>
-  <button
-    bit-button
-    buttonType="primary"
-    class="btn-submit"
-    type="submit"
-    [disabled]="form.loading"
-  >
+  <button bitButton buttonType="primary" class="btn-submit" type="submit" [disabled]="form.loading">
     <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
     <span>{{ "checkBreaches" | i18n }}</span>
   </button>
diff --git a/src/app/reports/exposed-passwords-report.component.html b/src/app/reports/exposed-passwords-report.component.html
index 496cd108bf6..f0a882f793c 100644
--- a/src/app/reports/exposed-passwords-report.component.html
+++ b/src/app/reports/exposed-passwords-report.component.html
@@ -3,7 +3,7 @@
 </div>
 <p>{{ "exposedPasswordsReportDesc" | i18n }}</p>
 <button
-  bit-button
+  bitButton
   buttonType="primary"
   type="button"
   class="btn-submit"
diff --git a/src/app/reports/report-card.component.html b/src/app/reports/report-card.component.html
index 1816f11ccd9..7882e27906a 100644
--- a/src/app/reports/report-card.component.html
+++ b/src/app/reports/report-card.component.html
@@ -15,7 +15,7 @@
       <p class="tw-mb-0">{{ report.description | i18n }}</p>
     </div>
     <span
-      bit-badge
+      bitBadge
       badgeType="success"
       class="tw-absolute tw-left-2 tw-top-2 tw-leading-none"
       *ngIf="premium"
diff --git a/src/app/reports/reports.component.html b/src/app/reports/reports.component.html
index 2978a9e6ee1..3c6bd313c4f 100644
--- a/src/app/reports/reports.component.html
+++ b/src/app/reports/reports.component.html
@@ -3,7 +3,7 @@
 
   <div class="row mt-4">
     <div class="col">
-      <a bit-button routerLink="./" *ngIf="!homepage">
+      <a bitButton routerLink="./" *ngIf="!homepage">
         <i class="bwi bwi-angle-left" aria-hidden="true"></i>
         {{ "backToReports" | i18n }}
       </a>
diff --git a/src/app/send/send.component.html b/src/app/send/send.component.html
index db38850c79c..eed3cdfa568 100644
--- a/src/app/send/send.component.html
+++ b/src/app/send/send.component.html
@@ -23,7 +23,7 @@
             <ul class="filter-options">
               <li class="filter-option" [ngClass]="{ active: selectedAll }">
                 <span class="filter-buttons">
-                  <button bit-button class="filter-button" appStopClick (click)="selectAll()">
+                  <button bitButton class="filter-button" appStopClick (click)="selectAll()">
                     <i class="bwi bwi-fw bwi-filter"></i>{{ "allSends" | i18n }}
                   </button>
                 </span>
@@ -38,7 +38,7 @@
               <li class="filter-option" [ngClass]="{ active: selectedType === sendType.Text }">
                 <span class="filter-buttons">
                   <button
-                    bit-button
+                    bitButton
                     class="filter-button"
                     appStopClick
                     (click)="selectType(sendType.Text)"
@@ -50,7 +50,7 @@
               <li class="filter-option" [ngClass]="{ active: selectedType === sendType.File }">
                 <span class="filter-buttons">
                   <button
-                    bit-button
+                    bitButton
                     class="filter-button"
                     appStopClick
                     (click)="selectType(sendType.File)"
@@ -160,19 +160,15 @@
                 <i class="bwi bwi-ellipsis-v bwi-lg" aria-hidden="true"></i>
               </button>
               <bit-menu #sendOptions>
-                <button bit-menu-item (click)="copy(s)">
+                <button bitMenuItem (click)="copy(s)">
                   <i class="bwi bwi-fw bwi-clone" aria-hidden="true"></i>
                   {{ "copySendLink" | i18n }}
                 </button>
-                <button
-                  bit-menu-item
-                  (click)="removePassword(s)"
-                  *ngIf="s.password && !disableSend"
-                >
+                <button bitMenuItem (click)="removePassword(s)" *ngIf="s.password && !disableSend">
                   <i class="bwi bwi-fw bwi-close" aria-hidden="true"></i>
                   {{ "removePassword" | i18n }}
                 </button>
-                <button bit-menu-item (click)="delete(s)">
+                <button bitMenuItem (click)="delete(s)">
                   <span class="tw-text-danger">
                     <i class="bwi bwi-fw bwi-trash" aria-hidden="true"></i>
                     {{ "delete" | i18n }}
diff --git a/src/app/settings/account.component.html b/src/app/settings/account.component.html
index 1881498373a..c88fc1ece05 100644
--- a/src/app/settings/account.component.html
+++ b/src/app/settings/account.component.html
@@ -14,13 +14,13 @@
 <div class="card border-danger">
   <div class="card-body">
     <p>{{ "dangerZoneDesc" | i18n }}</p>
-    <button bit-button buttonType="danger" (click)="deauthorizeSessions()">
+    <button bitButton buttonType="danger" (click)="deauthorizeSessions()">
       {{ "deauthorizeSessions" | i18n }}
     </button>
-    <button bit-button buttonType="danger" (click)="purgeVault()">
+    <button bitButton buttonType="danger" (click)="purgeVault()">
       {{ "purgeVault" | i18n }}
     </button>
-    <button bit-button buttonType="danger" (click)="deleteAccount()">
+    <button bitButton buttonType="danger" (click)="deleteAccount()">
       {{ "deleteAccount" | i18n }}
     </button>
   </div>
diff --git a/src/app/settings/change-kdf.component.html b/src/app/settings/change-kdf.component.html
index e3899586438..f5eae39be4d 100644
--- a/src/app/settings/change-kdf.component.html
+++ b/src/app/settings/change-kdf.component.html
@@ -71,7 +71,7 @@
       </div>
     </div>
   </div>
-  <button bit-button buttonType="primary" class="btn-submit" [disabled]="form.loading">
+  <button bitButton buttonType="primary" class="btn-submit" [disabled]="form.loading">
     <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
     <span>{{ "changeKdf" | i18n }}</span>
   </button>
diff --git a/src/app/settings/change-password.component.html b/src/app/settings/change-password.component.html
index f8a4dd4c582..990d950604d 100644
--- a/src/app/settings/change-password.component.html
+++ b/src/app/settings/change-password.component.html
@@ -87,7 +87,7 @@
       </a>
     </div>
   </div>
-  <button bit-button buttonType="primary" class="btn-submit" [disabled]="form.loading">
+  <button bitButton buttonType="primary" class="btn-submit" [disabled]="form.loading">
     <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
     <span>{{ "changeMasterPassword" | i18n }}</span>
   </button>
diff --git a/src/app/settings/payment-method.component.html b/src/app/settings/payment-method.component.html
index aca7b11568d..bae22bf4cf0 100644
--- a/src/app/settings/payment-method.component.html
+++ b/src/app/settings/payment-method.component.html
@@ -3,7 +3,7 @@
     {{ "paymentMethod" | i18n }}
   </h1>
   <button
-    bit-button
+    bitButton
     buttonType="secondary"
     (click)="load()"
     class="tw-ml-auto"
@@ -28,7 +28,7 @@
     <strong>{{ creditOrBalance | currency: "$" }}</strong>
   </p>
   <p>{{ "creditAppliedDesc" | i18n }}</p>
-  <button bit-button buttonType="secondary" (click)="addCredit()" *ngIf="!showAddCredit">
+  <button bitButton buttonType="secondary" (click)="addCredit()" *ngIf="!showAddCredit">
     {{ "addCredit" | i18n }}
   </button>
   <app-add-credit
@@ -56,7 +56,7 @@
       {{ paymentSource.description }}
     </p>
   </ng-container>
-  <button bit-button buttonType="secondary" (click)="changePayment()" *ngIf="!showAdjustPayment">
+  <button bitButton buttonType="secondary" (click)="changePayment()" *ngIf="!showAdjustPayment">
     {{ (paymentSource ? "changePaymentMethod" : "addPaymentMethod") | i18n }}
   </button>
   <app-adjust-payment
diff --git a/src/app/settings/premium.component.html b/src/app/settings/premium.component.html
index 3ac17228806..4d6613aa1ef 100644
--- a/src/app/settings/premium.component.html
+++ b/src/app/settings/premium.component.html
@@ -48,7 +48,7 @@
     {{ "premiumPrice" | i18n: (premiumPrice | currency: "$") }}
   </p>
   <a
-    bit-button
+    bitButton
     href="https://vault.bitwarden.com/#/settings/premium"
     target="_blank"
     rel="noopener"
@@ -69,7 +69,7 @@
       }}</small>
     </div>
     <button
-      bit-button
+      bitButton
       buttonType="primary"
       type="submit"
       class="btn-submit"
@@ -125,13 +125,7 @@
     </p>
   </div>
   <small class="text-muted font-italic">{{ "paymentChargedAnnually" | i18n }}</small>
-  <button
-    bit-button
-    buttonType="primary"
-    type="submit"
-    class="btn-submit"
-    [disabled]="form.loading"
-  >
+  <button bitButton buttonType="primary" type="submit" class="btn-submit" [disabled]="form.loading">
     <i class="bwi bwi-spinner bwi-spin" title="{{ 'loading' | i18n }}" aria-hidden="true"></i>
     <span>{{ "submit" | i18n }}</span>
   </button>
diff --git a/src/app/settings/security-keys.component.html b/src/app/settings/security-keys.component.html
index 9c9b8df5e08..58201014bed 100644
--- a/src/app/settings/security-keys.component.html
+++ b/src/app/settings/security-keys.component.html
@@ -8,10 +8,10 @@
 <p>
   {{ "userApiKeyDesc" | i18n }}
 </p>
-<button bit-button buttonType="secondary" (click)="viewUserApiKey()">
+<button bitButton buttonType="secondary" (click)="viewUserApiKey()">
   {{ "viewApiKey" | i18n }}
 </button>
-<button bit-button buttonType="secondary" (click)="rotateUserApiKey()">
+<button bitButton buttonType="secondary" (click)="rotateUserApiKey()">
   {{ "rotateApiKey" | i18n }}
 </button>
 <ng-template #viewUserApiKeyTemplate></ng-template>
diff --git a/src/app/settings/two-factor-setup.component.html b/src/app/settings/two-factor-setup.component.html
index 549636f8420..27fc2990e60 100644
--- a/src/app/settings/two-factor-setup.component.html
+++ b/src/app/settings/two-factor-setup.component.html
@@ -5,7 +5,7 @@
 <p *ngIf="organizationId">{{ "twoStepLoginOrganizationDesc" | i18n }}</p>
 <bit-callout type="warning" *ngIf="!organizationId">
   <p>{{ "twoStepLoginRecoveryWarning" | i18n }}</p>
-  <button bit-button buttonType="secondary" (click)="recoveryCode()">
+  <button bitButton buttonType="secondary" (click)="recoveryCode()">
     {{ "viewRecoveryCode" | i18n }}
   </button>
 </bit-callout>
@@ -45,7 +45,7 @@
     </div>
     <div class="ml-auto">
       <button
-        bit-button
+        bitButton
         buttonType="secondary"
         [disabled]="!canAccessPremium && p.premium"
         (click)="manage(p.type)"
diff --git a/src/app/settings/user-billing-history.component.html b/src/app/settings/user-billing-history.component.html
index 1fb24af2ba2..804830c84ed 100644
--- a/src/app/settings/user-billing-history.component.html
+++ b/src/app/settings/user-billing-history.component.html
@@ -3,7 +3,7 @@
     {{ "billingHistory" | i18n }}
   </h1>
   <button
-    bit-button
+    bitButton
     buttonType="secondary"
     (click)="load()"
     class="tw-ml-auto"
diff --git a/src/app/settings/user-subscription.component.html b/src/app/settings/user-subscription.component.html
index c0fa56d0350..64d6f93602e 100644
--- a/src/app/settings/user-subscription.component.html
+++ b/src/app/settings/user-subscription.component.html
@@ -39,7 +39,7 @@
   >
     <p>{{ "subscriptionPendingCanceled" | i18n }}</p>
     <button
-      bit-button
+      bitButton
       type="button"
       buttonType="secondary"
       #reinstateBtn
@@ -63,7 +63,7 @@
         <dt>{{ "status" | i18n }}</dt>
         <dd>
           <span class="text-capitalize">{{ (subscription && subscription.status) || "-" }}</span>
-          <span bit-badge badgeType="warning" *ngIf="subscriptionMarkedForCancel">{{
+          <span bitBadge badgeType="warning" *ngIf="subscriptionMarkedForCancel">{{
             "pendingCancellation" | i18n
           }}</span>
         </dd>
@@ -96,11 +96,11 @@
   </div>
   <ng-container *ngIf="selfHosted">
     <div>
-      <button type="button" bit-button buttonType="secondary" (click)="updateLicense()">
+      <button type="button" bitButton buttonType="secondary" (click)="updateLicense()">
         {{ "updateLicense" | i18n }}
       </button>
       <a
-        bit-button
+        bitButton
         buttonType="secondary"
         href="https://vault.bitwarden.com/#/settings/subscription"
         target="_blank"
@@ -131,7 +131,7 @@
   <ng-container *ngIf="!selfHosted">
     <div class="d-flex">
       <button
-        bit-button
+        bitButton
         type="button"
         buttonType="secondary"
         (click)="downloadLicense()"
@@ -140,7 +140,7 @@
         {{ "downloadLicense" | i18n }}
       </button>
       <button
-        bit-button
+        bitButton
         #cancelBtn
         type="button"
         buttonType="danger"
@@ -171,11 +171,11 @@
     <ng-container *ngIf="subscription && !subscription.cancelled && !subscriptionMarkedForCancel">
       <div class="mt-3">
         <div class="d-flex" *ngIf="!showAdjustStorage">
-          <button bit-button type="button" buttonType="secondary" (click)="adjustStorage(true)">
+          <button bitButton type="button" buttonType="secondary" (click)="adjustStorage(true)">
             {{ "addStorage" | i18n }}
           </button>
           <button
-            bit-button
+            bitButton
             type="button"
             buttonType="secondary"
             class="tw-ml-1"
diff --git a/src/app/vault/ciphers.component.html b/src/app/vault/ciphers.component.html
index 305fe9240a1..096a0833ff2 100644
--- a/src/app/vault/ciphers.component.html
+++ b/src/app/vault/ciphers.component.html
@@ -64,12 +64,12 @@
           </button>
           <bit-menu #cipherOptions>
             <ng-container *ngIf="c.type === cipherType.Login && !c.isDeleted">
-              <button bit-menu-item (click)="copy(c, c.login.username, 'username', 'Username')">
+              <button bitMenuItem (click)="copy(c, c.login.username, 'username', 'Username')">
                 <i class="bwi bwi-fw bwi-clone" aria-hidden="true"></i>
                 {{ "copyUsername" | i18n }}
               </button>
               <button
-                bit-menu-item
+                bitMenuItem
                 (click)="copy(c, c.login.password, 'password', 'Password')"
                 *ngIf="c.viewPassword"
               >
@@ -77,24 +77,24 @@
                 {{ "copyPassword" | i18n }}
               </button>
               <button
-                bit-menu-item
+                bitMenuItem
                 (click)="copy(c, c.login.totp, 'verificationCodeTotp', 'TOTP')"
                 *ngIf="displayTotpCopyButton(c)"
               >
                 <i class="bwi bwi-fw bwi-clone" aria-hidden="true"></i>
                 {{ "copyVerificationCode" | i18n }}
               </button>
-              <button bit-menu-item *ngIf="c.login.canLaunch" (click)="launch(c.login.launchUri)">
+              <button bitMenuItem *ngIf="c.login.canLaunch" (click)="launch(c.login.launchUri)">
                 <i class="bwi bwi-fw bwi-share-square" aria-hidden="true"></i>
                 {{ "launch" | i18n }}
               </button>
             </ng-container>
-            <button bit-menu-item (click)="attachments(c)">
+            <button bitMenuItem (click)="attachments(c)">
               <i class="bwi bwi-fw bwi-paperclip" aria-hidden="true"></i>
               {{ "attachments" | i18n }}
             </button>
             <button
-              bit-menu-item
+              bitMenuItem
               *ngIf="((!organization && !c.organizationId) || organization) && !c.isDeleted"
               (click)="clone(c)"
             >
@@ -102,26 +102,26 @@
               {{ "clone" | i18n }}
             </button>
             <button
-              bit-menu-item
+              bitMenuItem
               *ngIf="!organization && !c.organizationId && !c.isDeleted"
               (click)="share(c)"
             >
               <i class="bwi bwi-fw bwi-arrow-circle-right" aria-hidden="true"></i>
               {{ "moveToOrganization" | i18n }}
             </button>
-            <button bit-menu-item *ngIf="c.organizationId && !c.isDeleted" (click)="collections(c)">
+            <button bitMenuItem *ngIf="c.organizationId && !c.isDeleted" (click)="collections(c)">
               <i class="bwi bwi-fw bwi-collection" aria-hidden="true"></i>
               {{ "collections" | i18n }}
             </button>
-            <button bit-menu-item *ngIf="c.organizationId && accessEvents" (click)="events(c)">
+            <button bitMenuItem *ngIf="c.organizationId && accessEvents" (click)="events(c)">
               <i class="bwi bwi-fw bwi-file-text" aria-hidden="true"></i>
               {{ "eventLogs" | i18n }}
             </button>
-            <button bit-menu-item (click)="restore(c)" *ngIf="c.isDeleted">
+            <button bitMenuItem (click)="restore(c)" *ngIf="c.isDeleted">
               <i class="bwi bwi-fw bwi-undo" aria-hidden="true"></i>
               {{ "restore" | i18n }}
             </button>
-            <button bit-menu-item (click)="delete(c)">
+            <button bitMenuItem (click)="delete(c)">
               <span class="tw-text-danger">
                 <i class="bwi bwi-fw bwi-trash" aria-hidden="true"></i>
                 {{ (c.isDeleted ? "permanentlyDelete" : "delete") | i18n }}