make conditional autofill optional

lib/webauthn_components/authentication_component.ex

@@ -29,6 +29,7 @@ defmodule WebauthnComponents.AuthenticationComponent do
   - `@class` (Optional) CSS classes for overriding the default button style.
   - `@disabled` (Optional) Set to `true` when the `SupportHook` indicates WebAuthn is not supported or enabled by the browser. Defaults to `false`.
   - `@id` (Optional) An HTML element ID.
+  - `@skip_conditional_ui_check` (Optional) Set to `true` to skip the conditional UI check for Passkey autofill. Defaults to `false`.
 
   ## Events
 
@@ -62,6 +63,7 @@ defmodule WebauthnComponents.AuthenticationComponent do
       |> assign_new(:display_text, fn -> "Sign In" end)
       |> assign_new(:show_icon?, fn -> true end)
       |> assign_new(:relying_party, fn -> nil end)
+      |> assign_new(:skip_conditional_ui_check, fn -> false end)
     }
   end
 
@@ -77,6 +79,7 @@ defmodule WebauthnComponents.AuthenticationComponent do
         class={@class}
         title="Use an existing account"
         disabled={@disabled}
+        data-skip-conditional-ui-check={@skip_conditional_ui_check}
       >
         <span :if={@show_icon?} class="w-4 aspect-square opacity-70"><.icon_key /></span>
         <span><%= @display_text %></span>

priv/static/authentication_hook.js

@@ -6,7 +6,9 @@ export const AuthenticationHook = {
   mounted() {
     console.info(`AuthenticationHook mounted`);
 
-    this.checkConditionalUIAvailable(this);
+    if (!this.el.dataset.skipConditionalUiCheck) {
+      this.checkConditionalUIAvailable(this);
+    }
 
     this.handleEvent("authentication-challenge", (event) =>
       this.handlePasskeyAuthentication(event, this, "optional")