…
|
||
---|---|---|
.. | ||
README.mdx | ||
chart.xstate.js | ||
index.hbs | ||
index.js |
README.mdx
# AuthDialog A component to help orchestrate a login/logout flow. ```hbs preview-template <AuthDialog @src={{uri 'settings://consul:token'}} @sink={{uri 'settings://consul:token'}} @onchange={{action (noop)}} > <:unauthorized as |api|> <AuthForm @onsubmit={{action api.login value="data"}} /> </:unauthorized> <:authorized as |api|> <AuthProfile @item={{api.token}} /> <button {{on 'click' (fn api.logout)}} > Logout </button> </:authorized> </AuthDialog> ``` ## Arguments | Argument | Type | Default | Description | | --- | --- | --- | --- | | `onchange` | `Function` | | An action to fire when the users token has changed (logged in/logged out/token changed) | | `src` | `URI` | | DataSource URI used to retrive/watch for changes on the users token | | `sink` | `URI` | | DataSink URI used to save the users token to | ## Exports | Name | Type | Description | | --- | --- | --- | | `login` | `Function` | Login with a specified token | | `logout` | `Function` | Logout (delete token) | | `token` | `Token` | The current token itself | ## Slots | Name | Description | | --- | --- | | `unauthorized` | This slot is only rendered when the user doesn't have a token | | `authorized` | This slot is only rendered when the user has a token.| ## See - [Component Source Code](./index.js) - [Template Source Code](./index.hbs) ---