idp.global/app
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): Update dependencies and refactor registration process

Browse Source
This commit is contained in:
Philipp Kunz
2024-10-04 15:43:36 +02:00
parent 629bf19845
commit 4deaafc3a2
18 changed files with 676 additions and 597 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ts_web/elements/idp-loginprompt.ts
+51 -31
View File
@@ -17,16 +17,17 @@ import '@uptime.link/webwidget';
import '@design.estate/dees-catalog';
import { DeesForm, DeesFormSubmit, DeesInputText } from '@design.estate/dees-catalog';
import { IdpState } from '../idp.state.js';
declare global {
interface HTMLElementTagNameMap {
'idp-login': IdpLogin;
'idp-loginprompt': IdpLoginPrompt;
}
}
@customElement('idp-login')
export class IdpLogin extends DeesElement {
public static demo = () => html`<idp-login></idp-login>`;
@customElement('idp-loginprompt')
export class IdpLoginPrompt extends DeesElement {
public static demo = () => html`<idp-loginprompt></idp-loginprompt>`;
@property()
public productOfInterest: string;
@@ -68,32 +69,37 @@ export class IdpLogin extends DeesElement {
public render(): TemplateResult {
return html`
<div class="boxcontent">
<dees-form
id="loginForm"
@formData="${(eventArg) => {
this.login({
emailAddress: eventArg.detail.data.emailAddress,
passwordArg: eventArg.detail.data.password,
});
}}"
>
<dees-input-text
id="loginEmailInput"
.required=${true}
key="emailAddress"
label="Email-Address or Username"
></dees-input-text>
<dees-input-text
.id=${'loginPasswordInput'}
.key=${'password'}
.label=${'Password'}
.isPasswordBool=${true}
></dees-input-text>
<dees-form-submit id="loginSubmitButton"></dees-form-submit>
</dees-form>
<dees-button type="discreet" class="registerButton">Register instead</dees-button>
</div>
<idp-centercontainer>
<div class="boxcontent">
<dees-form
id="loginForm"
@formData="${(eventArg) => {
this.login({
emailAddress: eventArg.detail.data.emailAddress,
passwordArg: eventArg.detail.data.password,
});
}}"
>
<dees-input-text
id="loginEmailInput"
.required=${true}
key="emailAddress"
label="Email-Address or Username"
></dees-input-text>
<dees-input-text
.id=${'loginPasswordInput'}
.key=${'password'}
.label=${'Password'}
.isPasswordBool=${true}
></dees-input-text>
<dees-form-submit id="loginSubmitButton"></dees-form-submit>
</dees-form>
<dees-button type="discreet" class="registerButton" @click=${async () => {
const idpState = await IdpState.getSingletonInstance();
idpState.domtools.router.pushUrl('/register');
}}>Register instead</dees-button>
</div>
</idp-centercontainer>
`;
}
@@ -206,6 +212,20 @@ export class IdpLogin extends DeesElement {
}
public async focus() {
(this.shadowRoot.querySelector('#loginEmailInput') as plugins.deesCatalog.DeesInputText).focus();
(
this.shadowRoot.querySelector('#loginEmailInput') as plugins.deesCatalog.DeesInputText
).focus();
}
public async show() {
await this.updateComplete;
const centerContainer = this.shadowRoot.querySelector('idp-centercontainer');
await centerContainer.show();
}
public async hide() {
await this.updateComplete;
const centerContainer = this.shadowRoot.querySelector('idp-centercontainer');
await centerContainer.hide();
}
}