# Interface

## Common UI

Instead of directly proceeding with login, it is possible to open the modal for users to see the selectable social login list.

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><h4>Login/Signup modal</h4></td><td><img src="/files/2LwRWhAN72eDDTJgo6dm" alt=""></td><td></td></tr><tr><td>When it's used ?</td><td><ul><li><code>sdk.login({isModal: true}) is called.</code></li></ul><p>This modal is not activated as default</p></td><td><ul><li>If you hide modal, you may want to put Terms of Service and its link on your application.</li><li>It's not possible to remove [View more options] dropdown.</li><li><p>The order of icons is arranged based on the order of the values in <code>loginProvider</code> array except Google, Email Password and Email Passwordless.</p><ul><li>For example, <code>loginProvider: ["google", "apple", "line"]</code> allocates the order from Google on the top followed by Apple and LINE underneath.</li></ul></li></ul></td></tr></tbody></table>

### Expected Parameters and Result with example case of google & line

<table><thead><tr><th width="175">withModal</th><th>[’google’]</th><th>[’google’,’line’]</th><th>undefined</th></tr></thead><tbody><tr><td>true</td><td>Modal: <code>google</code></td><td>Modal: <code>google</code>, <code>line</code></td><td>Modal: ALL</td></tr><tr><td>false</td><td>Direct Login without modal</td><td><code>Google</code> Login without modal</td><td><code>Google</code> Login without modal</td></tr><tr><td>undefined</td><td>Direct Login without modal</td><td>Modal: <code>google</code>, <code>line</code></td><td>Modal: ALL</td></tr></tbody></table>

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><h4>Signature Modal</h4></td><td><img src="/files/vzrJ4uRg2XzN9vkWyL4r" alt=""></td><td></td></tr><tr><td></td><td>When it's used ?</td><td><ul><li><code>sdk.signMessage is called</code></li></ul><p>As default, <code>signMessage() is executed with an arbitrary string prepended to the message under the hood of Web3Auth library.</code></p><p><code>This enables skipping the signature modal popup and user consent process. The drawback of this is to require additional backend development. See more details.</code></p><p><a href="/pages/WXoze0Z6oXZIhSs0o8ih">Required implementation on clients’ backend</a><br><br>Web3Auth</p><p><a href="https://docs.tor.us/wallet/api-reference/installation">Installation | Documentation</a></p></td></tr></tbody></table>

### UI Samples with combination of parameters

<table data-view="cards" data-full-width="true"><thead><tr><th></th><th></th><th></th></tr></thead><tbody><tr><td><img src="/files/huNJ0EgNlLJJxapMfbeg" alt=""></td><td>{<code>loginProvider: ['email_password'], authAction: { login: true, signup: false }, withModal: true}</code></td><td></td></tr><tr><td><img src="/files/DBG9NKG14eZbzMbw6Vr5" alt=""></td><td>{<code>loginProvider: ['email_password'], authAction: { login: false, signup: true }, withModal: true}</code></td><td></td></tr><tr><td><img src="/files/z0QM8zchJVkiEbMBkiQ3" alt=""></td><td><code>{</code>authAction: { login: false, signup: true },<code>loginProvider: ['google', 'email_password'],</code>withModal: true<code>}</code></td><td></td></tr><tr><td><img src="/files/QjXS8hUj11aMwuc2FqIA" alt=""></td><td><code>{</code>authAction: { login: true, signup: falsse },<code>loginProvider: ['google', 'email_password'],</code>withModal: true<code>}</code></td><td></td></tr><tr><td><img src="/files/DvIujKaOFfSdM7NTcZWv" alt=""></td><td><code>{customUI: { words: { ja: { modal: { termsConditions: 'アカウント登録に伴い、Startbahn Port のプライバシーポリシーを含む、利用規約に同意します', termsConditionsLinkUrl: '</code><a href="https://google.com/"><code>https://google.com</code></a><code>' } }, withModal: true,</code>authAction: { login: true, signup: false },<code>loginProvider: [ 'google']}</code></td><td></td></tr><tr><td><img src="/files/fXJDD1f98Xu9R6rlgPrB" alt=""></td><td>{<code>loginProvider: ['google', 'line', 'twitter', 'email_passwordless'], authAction: { login: true, signup: false }, withModal: true}</code></td><td></td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.startrail.io/startrail-sdk-js/login-providers/startrail-powered-by-web3auth-torus.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.