---
title: One-Tap prompt
---

# One-Tap prompt

The One-Tap prompt is a floating UI element that appears in the top-right corner of your page when a visitor has an active Little X Little session in another tab. They tap once and they're signed in — no redirects, no popups, no typing.

When [FedCM](https://developer.mozilla.org/en-US/docs/Web/API/FedCM_API) is supported (Chrome 120+), the SDK uses the **browser-native** dialog instead of a custom iframe. Same code, better UX.

## Minimum integration

```html
<script src="https://id.littlexlittle.org/sdk.js" async defer></script>
<div data-lxl-id="YOUR_CLIENT_ID" data-callback="onSignIn"></div>

<script>
  function onSignIn(response) {
    fetch('/auth/lxl', {
      method: 'POST',
      body: JSON.stringify({ credential: response.credential }),
    });
  }
</script>
```

## Programmatic prompt

```js
lxl.accounts.id.initialize({
  client_id: 'YOUR_CLIENT_ID',
  callback: onSignIn,
  use_fedcm_for_prompt: true,
});

lxl.accounts.id.prompt((notification) => {
  if (notification.isNotDisplayed()) {
    console.log('not displayed:', notification.getNotDisplayedReason());
    // Reasons: browser_not_supported, invalid_client, missing_client_id,
    //          opt_out_or_no_session, secure_http_required,
    //          suppressed_by_user, unregistered_origin, unknown_reason
  } else if (notification.isSkippedMoment()) {
    console.log('skipped:', notification.getSkippedReason());
  }
});
```

## Auto-select returning users

Set `auto_select: true` to bypass the prompt entirely if the user previously consented to the same scopes:

```js
lxl.accounts.id.initialize({
  client_id: 'YOUR_CLIENT_ID',
  callback: onSignIn,
  auto_select: true,
});
```

The user can opt out by visiting their LXL profile and disabling auto sign-in for your client — `disableAutoSelect()` from your code does the same client-side.

## Cooldown & exponential back-off

If the user dismisses One-Tap three times in a session, the SDK applies a cooldown (24h, 7d, 30d). This matches Google's behavior. Use the developer portal to inspect cooldown stats per client.

## Styling the parent container

```html
<div id="signin-area" style="height: 0; position: relative;"></div>
```

```js
lxl.accounts.id.initialize({
  client_id: 'YOUR_CLIENT_ID',
  callback: onSignIn,
  prompt_parent_id: 'signin-area',  // anchor the prompt here instead of top-right
});
```

## Caveats

- One-Tap requires HTTPS in production. `http://localhost` works for development.
- Third-party cookies must be allowed for the iframe fallback. FedCM removes that requirement.
- The prompt only shows for users who have a session at `id.littlexlittle.org`. New visitors see your fallback button.