# AuthenticationComponent

> **Information**
>
> The `AuthenticationComponent` is only available for [Remember Me](https://www.checkout.com/docs/payments/accept-payments/accept-a-payment-on-your-website/extend-your-flow-integration/enable-remember-me.md) integrations.

## Methods

### isValid()

Checks if the `AuthenticationComponent` has captured all details from the customer.

```javascript
function isValid() {
  return boolean;
}
```

---

### isAvailable()

Checks if the `AuthenticationComponent` can be rendered. Call this before mounting the `AuthenticationComponent`.

```javascript
function isAvailable() {
  return Promise<boolean>;
}
```

---

### mount('#element')

Mounts an `AuthenticationComponent` to a page. You can either provide:

- A [DOM Element Object](https://developer.mozilla.org/en-US/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors)
- An [Element Selector](https://developer.mozilla.org/en-US/docs/Web/API/Element)

| Parameter | Type | Description |
| --- | --- | --- |
| `#elem` | `object` | The Element Selector or DOM Element object to mount to |

```javascript
function mount('#element') {
  return AuthenticationComponent;
}
```

---

### unmount()

Unmounts an `AuthenticationComponent` from the page.

This stops rendering the component, and removes all life-cycles from the browser.

```javascript
function unmount() {
  return AuthenticationComponent;
}
```

---

## Events

### onReady(AuthenticationComponent)

Raised when an `AuthenticationComponent` is initialized and ready for the customer to interact.

```javascript
const AuthenticationComponent = checkout.create('authentication', {
  onReady: (_self) => {

  },
});
AuthenticationComponent.mount('#authentication-container');
```

---

### onChange(AuthenticationComponent)

Raised when an `AuthenticationComponent` changes after a customer interaction.

```javascript
const AuthenticationComponent = checkout.create('authentication', {
  onChange: (_self) => {

  },
});
AuthenticationComponent.mount('#authentication-container');
```