style(sso-login): (Auth) [PM-26535] Make SSO Button Primary if ssoRequired (#16757)

When SSO is required:
- Make the SSO button primary
- Add a tooltip to the disabled buttons

When SSO is not required:
- SSO button remains secondary
- No tooltip on the buttons

Feature Flags enabled: pm-22110-disable-alternate-login-methods

libs/auth/src/angular/login/login.component.html

@@ -44,6 +44,8 @@
         block
         buttonType="primary"
         (click)="continuePressed()"
+        [bitTooltip]="ssoRequired ? ('yourOrganizationRequiresSingleSignOn' | i18n) : ''"
+        [addTooltipToDescribedby]="ssoRequired"
         [disabled]="ssoRequired"
       >
         {{ "continue" | i18n }}
@@ -59,6 +61,8 @@
           block
           buttonType="secondary"
           (click)="handleLoginWithPasskeyClick()"
+          [bitTooltip]="ssoRequired ? ('yourOrganizationRequiresSingleSignOn' | i18n) : ''"
+          [addTooltipToDescribedby]="ssoRequired"
           [disabled]="ssoRequired"
         >
           <i class="bwi bwi-passkey tw-mr-1" aria-hidden="true"></i>
@@ -67,7 +71,13 @@
       </ng-container>
 
       <!-- Button to Login with SSO -->
-      <button type="button" bitButton block buttonType="secondary" (click)="handleSsoClick()">
+      <button
+        type="button"
+        bitButton
+        block
+        [buttonType]="ssoRequired ? 'primary' : 'secondary'"
+        (click)="handleSsoClick()"
+      >
         <i class="bwi bwi-provider tw-mr-1" aria-hidden="true"></i>
         {{ "useSingleSignOn" | i18n }}
       </button>

libs/auth/src/angular/login/login.component.ts

@@ -54,6 +54,7 @@ import {
   IconButtonModule,
   LinkModule,
   ToastService,
+  TooltipDirective,
 } from "@bitwarden/components";
 
 import { LoginComponentService, PasswordPolicies } from "./login-component.service";
@@ -82,6 +83,7 @@ export enum LoginUiState {
     JslibModule,
     ReactiveFormsModule,
     RouterModule,
+    TooltipDirective,
   ],
 })
 export class LoginComponent implements OnInit, OnDestroy {