habsi/authentik
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: fix form default submit handler (#7122)

Browse Source 
* web/elements: rename renderInlineForm to renderForm set submit handler to empty function

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

* fix all kinds of forms not using the form inheritance correctly

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

---------

Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens L
2023-10-12 15:12:46 +02:00
committed by GitHub
parent d1f2e7c0cd
commit b503379319
83 changed files with 199 additions and 317 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/admin/applications/ApplicationCheckAccessForm.ts
View File

@ -114,7 +114,7 @@ export class ApplicationCheckAccessForm extends Form<{ forUser: number }> {
`;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal
label=${msg("User")}
?required=${true}

6
web/src/admin/applications/ApplicationForm.ts
View File

@ -90,8 +90,7 @@ export class ApplicationForm extends ModelForm<Application, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -321,7 +320,6 @@ ${ifDefined(this.instance?.metaDescription)}</textarea
>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/blueprints/BlueprintForm.ts
View File

@ -68,8 +68,7 @@ export class BlueprintForm extends ModelForm<BlueprintInstance, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -193,7 +192,6 @@ export class BlueprintForm extends ModelForm<BlueprintInstance, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

2
web/src/admin/crypto/CertificateGenerateForm.ts
View File

@ -20,7 +20,7 @@ export class CertificateKeyPairForm extends Form<CertificateGenerationRequest> {
});
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal
label=${msg("Common Name")}
name="commonName"

6
web/src/admin/crypto/CertificateKeyPairForm.ts
View File

@ -40,8 +40,7 @@ export class CertificateKeyPairForm extends ModelForm<CertificateKeyPair, string
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} name="name" ?required=${true}>
return html` <ak-form-element-horizontal label=${msg("Name")} name="name" ?required=${true}>
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -69,7 +68,6 @@ export class CertificateKeyPairForm extends ModelForm<CertificateKeyPair, string
"Optional Private Key. If this is set, you can use this keypair for encryption.",
)}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

5
web/src/admin/enterprise/EnterpriseLicenseForm.ts
View File

@ -46,13 +46,12 @@ export class EnterpriseLicenseForm extends ModelForm<License, string> {
renderForm(): TemplateResult {
// prettier-ignore
return html`<form class="pf-c-form pf-m-horizontal">
return html`
<ak-form-element-horizontal label=${msg("Install ID")}>
<input class="pf-c-form-control" readonly type="text" value="${ifDefined(this.installID)}" />
</ak-form-element-horizontal>
<ak-form-element-horizontal name="key" ?writeOnly=${this.instance !== undefined} label=${msg("License key")}>
<textarea class="pf-c-form-control"></textarea>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/events/RuleForm.ts
View File

@ -58,8 +58,7 @@ export class RuleForm extends ModelForm<NotificationRule, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -141,7 +140,6 @@ export class RuleForm extends ModelForm<NotificationRule, string> {
.value=${this.instance?.severity}
>
</ak-radio>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/events/TransportForm.ts
View File

@ -68,8 +68,7 @@ export class TransportForm extends ModelForm<NotificationTransport, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -169,7 +168,6 @@ export class TransportForm extends ModelForm<NotificationTransport, string> {
"Only send notification once, for example when sending a webhook into a chat channel.",
)}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/flows/FlowForm.ts
View File

@ -78,8 +78,7 @@ export class FlowForm extends ModelForm<Flow, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -400,7 +399,6 @@ export class FlowForm extends ModelForm<Flow, string> {
</p>
</ak-form-element-horizontal>`}
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

2
web/src/admin/flows/FlowImportForm.ts
View File

@ -86,7 +86,7 @@ export class FlowImportForm extends Form<Flow> {
`;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal label=${msg("Flow")} name="flow">
<input type="file" value="" class="pf-c-form-control" />
<p class="pf-c-form__helper-text">

6
web/src/admin/flows/StageBindingForm.ts
View File

@ -92,8 +92,7 @@ export class StageBindingForm extends ModelForm<FlowStageBinding, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
${this.renderTarget()}
return html` ${this.renderTarget()}
<ak-form-element-horizontal label=${msg("Stage")} ?required=${true} name="stage">
<ak-search-select
.fetchObjects=${async (query?: string): Promise<Stage[]> => {
@ -224,7 +223,6 @@ export class StageBindingForm extends ModelForm<FlowStageBinding, string> {
.value=${this.instance?.policyEngineMode}
>
</ak-radio>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/groups/GroupForm.ts
View File

@ -58,8 +58,7 @@ export class GroupForm extends ModelForm<Group, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -126,7 +125,6 @@ export class GroupForm extends ModelForm<Group, string> {
<p class="pf-c-form__helper-text">
${msg("Set custom attributes using YAML or JSON.")}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

2
web/src/admin/groups/RelatedGroupList.ts
View File

@ -46,7 +46,7 @@ export class RelatedGroupAdd extends Form<{ groups: string[] }> {
return data;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal label=${msg("Groups to add")} name="groups">
<div class="pf-c-input-group">
<ak-user-group-select-table

6
web/src/admin/outposts/OutpostForm.ts
View File

@ -99,8 +99,7 @@ export class OutpostForm extends ModelForm<Outpost, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -226,7 +225,6 @@ export class OutpostForm extends ModelForm<Outpost, string> {
>${msg("Documentation")}</a
>
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/outposts/ServiceConnectionDockerForm.ts
View File

@ -42,8 +42,7 @@ export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnecti
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -112,7 +111,6 @@ export class ServiceConnectionDockerForm extends ModelForm<DockerServiceConnecti
<p class="pf-c-form__helper-text">
${msg("When connecting via SSH, this keypair is used for authentication.")}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/outposts/ServiceConnectionKubernetesForm.ts
View File

@ -45,8 +45,7 @@ export class ServiceConnectionKubernetesForm extends ModelForm<
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -100,7 +99,6 @@ export class ServiceConnectionKubernetesForm extends ModelForm<
>${msg("Verify Kubernetes API SSL Certificate")}</span
>
</label>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/policies/PolicyBindingForm.ts
View File

@ -133,8 +133,7 @@ export class PolicyBindingForm extends ModelForm<PolicyBinding, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<div class="pf-c-card pf-m-selectable pf-m-selected">
return html` <div class="pf-c-card pf-m-selectable pf-m-selected">
<div class="pf-c-card__body">${this.renderModeSelector()}</div>
<div class="pf-c-card__footer">
<ak-form-element-horizontal
@ -318,7 +317,6 @@ export class PolicyBindingForm extends ModelForm<PolicyBinding, string> {
<p class="pf-c-form__helper-text">
${msg("Result used when policy execution fails.")}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

2
web/src/admin/policies/PolicyTestForm.ts
View File

@ -115,7 +115,7 @@ export class PolicyTestForm extends Form<PolicyTestRequest> {
`;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal label=${msg("User")} ?required=${true} name="user">
<ak-search-select
.fetchObjects=${async (query?: string): Promise<User[]> => {

6
web/src/admin/policies/dummy/DummyPolicyForm.ts
View File

@ -41,8 +41,7 @@ export class DummyPolicyForm extends ModelForm<DummyPolicy, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"A policy used for testing. Always returns the same result as specified below after waiting a random duration.",
)}
@ -123,7 +122,6 @@ export class DummyPolicyForm extends ModelForm<DummyPolicy, string> {
/>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/policies/event_matcher/EventMatcherPolicyForm.ts
View File

@ -53,8 +53,7 @@ export class EventMatcherPolicyForm extends ModelForm<EventMatcherPolicy, string
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Matches an event against a set of criteria. If any of the configured values match, the policy passes.",
)}
@ -187,7 +186,6 @@ export class EventMatcherPolicyForm extends ModelForm<EventMatcherPolicy, string
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/policies/expiry/ExpiryPolicyForm.ts
View File

@ -41,8 +41,7 @@ export class PasswordExpiryPolicyForm extends ModelForm<PasswordExpiryPolicy, st
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Checks if the request's user's password has been changed in the last x days, and denys based on settings.",
)}
@ -110,7 +109,6 @@ export class PasswordExpiryPolicyForm extends ModelForm<PasswordExpiryPolicy, st
</label>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/policies/expression/ExpressionPolicyForm.ts
View File

@ -43,8 +43,7 @@ export class ExpressionPolicyForm extends ModelForm<ExpressionPolicy, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Executes the python snippet to determine whether to allow or deny a request.",
)}
@ -101,7 +100,6 @@ export class ExpressionPolicyForm extends ModelForm<ExpressionPolicy, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/policies/password/PasswordPolicyForm.ts
View File

@ -229,8 +229,7 @@ export class PasswordPolicyForm extends ModelForm<PasswordPolicy, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Checks the value from the policy request against several rules, mostly used to ensure password strength.",
)}
@ -348,7 +347,6 @@ export class PasswordPolicyForm extends ModelForm<PasswordPolicy, string> {
</ak-form-element-horizontal>
${this.showStatic ? this.renderStaticRules() : html``}
${this.showHIBP ? this.renderHIBP() : html``}
${this.showZxcvbn ? this.renderZxcvbn() : html``}
</form>`;
${this.showZxcvbn ? this.renderZxcvbn() : html``}`;
}
}

6
web/src/admin/policies/reputation/ReputationPolicyForm.ts
View File

@ -41,8 +41,7 @@ export class ReputationPolicyForm extends ModelForm<ReputationPolicy, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg("Allows/denys requests based on the users and/or the IPs reputation.")}
</span>
<span>
@ -131,7 +130,6 @@ doesn't pass when either or both of the selected options are equal or above the
/>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/property-mappings/PropertyMappingLDAPForm.ts
View File

@ -41,8 +41,7 @@ export class PropertyMappingLDAPForm extends ModelForm<LDAPPropertyMapping, stri
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -81,7 +80,6 @@ export class PropertyMappingLDAPForm extends ModelForm<LDAPPropertyMapping, stri
${msg("See documentation for a list of all variables.")}
</a>
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/property-mappings/PropertyMappingNotification.ts
View File

@ -41,8 +41,7 @@ export class PropertyMappingNotification extends ModelForm<NotificationWebhookMa
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -66,7 +65,6 @@ export class PropertyMappingNotification extends ModelForm<NotificationWebhookMa
${msg("See documentation for a list of all variables.")}
</a>
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/property-mappings/PropertyMappingSAMLForm.ts
View File

@ -41,8 +41,7 @@ export class PropertyMappingSAMLForm extends ModelForm<SAMLPropertyMapping, stri
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -93,7 +92,6 @@ export class PropertyMappingSAMLForm extends ModelForm<SAMLPropertyMapping, stri
${msg("See documentation for a list of all variables.")}
</a>
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/property-mappings/PropertyMappingSCIMForm.ts
View File

@ -41,8 +41,7 @@ export class PropertyMappingSCIMForm extends ModelForm<SCIMMapping, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -66,7 +65,6 @@ export class PropertyMappingSCIMForm extends ModelForm<SCIMMapping, string> {
${msg("See documentation for a list of all variables.")}
</a>
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/property-mappings/PropertyMappingScopeForm.ts
View File

@ -41,8 +41,7 @@ export class PropertyMappingScopeForm extends ModelForm<ScopeMapping, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -93,7 +92,6 @@ export class PropertyMappingScopeForm extends ModelForm<ScopeMapping, string> {
${msg("See documentation for a list of all variables.")}
</a>
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

2
web/src/admin/property-mappings/PropertyMappingTestForm.ts
View File

@ -118,7 +118,7 @@ export class PolicyTestForm extends Form<PolicyTestRequest> {
`;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal label=${msg("User")} ?required=${true} name="user">
<ak-search-select
.fetchObjects=${async (query?: string): Promise<User[]> => {

6
web/src/admin/providers/ldap/LDAPProviderForm.ts
View File

@ -60,8 +60,7 @@ export class LDAPProviderFormPage extends ModelForm<LDAPProvider, number> {
// weird-- we're looking up Authentication flows, but we're storing them in the Authorization
// field of the target Provider.
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -266,7 +265,6 @@ export class LDAPProviderFormPage extends ModelForm<LDAPProvider, number> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/providers/oauth2/OAuth2ProviderForm.ts
View File

@ -167,8 +167,7 @@ export class OAuth2ProviderFormPage extends ModelForm<OAuth2Provider, number> {
renderForm(): TemplateResult {
const provider = this.instance;
return html`<form class="pf-c-form pf-m-horizontal">
<ak-text-input
return html` <ak-text-input
name="name"
label=${msg("Name")}
value=${ifDefined(provider?.name)}
@ -383,7 +382,6 @@ export class OAuth2ProviderFormPage extends ModelForm<OAuth2Provider, number> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/providers/proxy/ProxyProviderForm.ts
View File

@ -266,8 +266,7 @@ export class ProxyProviderFormPage extends ModelForm<ProxyProvider, number> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -457,7 +456,6 @@ ${this.instance?.skipPathRegex}</textarea
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/providers/radius/RadiusProviderForm.ts
View File

@ -49,8 +49,7 @@ export class RadiusProviderFormPage extends ModelForm<RadiusProvider, number> {
// weird-- we're looking up Authentication flows, but we're storing them in the Authorization
// field of the target Provider.
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -108,7 +107,6 @@ export class RadiusProviderFormPage extends ModelForm<RadiusProvider, number> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/providers/saml/SAMLProviderForm.ts
View File

@ -66,8 +66,7 @@ export class SAMLProviderFormPage extends ModelForm<SAMLProvider, number> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -400,7 +399,6 @@ export class SAMLProviderFormPage extends ModelForm<SAMLProvider, number> {
</ak-radio>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

2
web/src/admin/providers/saml/SAMLProviderImportForm.ts
View File

@ -29,7 +29,7 @@ export class SAMLProviderImportForm extends Form<SAMLProvider> {
});
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input type="text" class="pf-c-form-control" required />
</ak-form-element-horizontal>

6
web/src/admin/providers/scim/SCIMProviderForm.ts
View File

@ -61,8 +61,7 @@ export class SCIMProviderFormPage extends ModelForm<SCIMProvider, number> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -226,7 +225,6 @@ export class SCIMProviderFormPage extends ModelForm<SCIMProvider, number> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/sources/ldap/LDAPSourceForm.ts
View File

@ -63,8 +63,7 @@ export class LDAPSourceForm extends ModelForm<LDAPSource, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -468,7 +467,6 @@ export class LDAPSourceForm extends ModelForm<LDAPSource, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/sources/oauth/OAuthSourceForm.ts
View File

@ -231,8 +231,7 @@ export class OAuthSourceForm extends ModelForm<OAuthSource, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -436,7 +435,6 @@ export class OAuthSourceForm extends ModelForm<OAuthSource, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/sources/plex/PlexSourceForm.ts
View File

@ -178,8 +178,7 @@ export class PlexSourceForm extends ModelForm<PlexSource, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -362,7 +361,6 @@ export class PlexSourceForm extends ModelForm<PlexSource, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/sources/saml/SAMLSourceForm.ts
View File

@ -83,8 +83,7 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -507,7 +506,6 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/authenticator_duo/AuthenticatorDuoStageForm.ts
View File

@ -50,8 +50,7 @@ export class AuthenticatorDuoStageForm extends ModelForm<AuthenticatorDuoStage,
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Stage used to configure a duo-based authenticator. This stage should be used for configuration flows.",
)}
@ -189,7 +188,6 @@ export class AuthenticatorDuoStageForm extends ModelForm<AuthenticatorDuoStage,
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

8
web/src/admin/stages/authenticator_duo/DuoDeviceImportForm.ts
View File

@ -42,10 +42,10 @@ export class DuoDeviceImportForm extends ModelForm<AuthenticatorDuoStage, string
}
renderForm(): TemplateResult {
return html` <form class="pf-c-form pf-m-horizontal">
${this.instance?.adminIntegrationKey !== "" ? this.renderFormAutomatic() : html``}
${this.renderFormManual()}
</form>`;
return html` ${this.instance?.adminIntegrationKey !== ""
? this.renderFormAutomatic()
: html``}
${this.renderFormManual()}`;
}
renderFormManual(): TemplateResult {

8
web/src/admin/stages/authenticator_sms/AuthenticatorSMSStageForm.ts
View File

@ -207,8 +207,9 @@ export class AuthenticatorSMSStageForm extends ModelForm<AuthenticatorSMSStage,
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span> ${msg("Stage used to configure an SMS-based TOTP authenticator.")} </span>
return html` <span>
${msg("Stage used to configure an SMS-based TOTP authenticator.")}
</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
@ -341,7 +342,6 @@ export class AuthenticatorSMSStageForm extends ModelForm<AuthenticatorSMSStage,
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/authenticator_static/AuthenticatorStaticStageForm.ts
View File

@ -48,8 +48,7 @@ export class AuthenticatorStaticStageForm extends ModelForm<AuthenticatorStaticS
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Stage used to configure a static authenticator (i.e. static tokens). This stage should be used for configuration flows.",
)}
@ -156,7 +155,6 @@ export class AuthenticatorStaticStageForm extends ModelForm<AuthenticatorStaticS
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/authenticator_totp/AuthenticatorTOTPStageForm.ts
View File

@ -50,8 +50,7 @@ export class AuthenticatorTOTPStageForm extends ModelForm<AuthenticatorTOTPStage
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Stage used to configure a TOTP authenticator (i.e. Authy/Google Authenticator).",
)}
@ -146,7 +145,6 @@ export class AuthenticatorTOTPStageForm extends ModelForm<AuthenticatorTOTPStage
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/authenticator_validate/AuthenticatorValidateStageForm.ts
View File

@ -71,8 +71,7 @@ export class AuthenticatorValidateStageForm extends ModelForm<AuthenticatorValid
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Stage used to validate any authenticator. This stage should be used during authentication or authorization flows.",
)}
@ -254,7 +253,6 @@ export class AuthenticatorValidateStageForm extends ModelForm<AuthenticatorValid
`
: html``}
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

8
web/src/admin/stages/authenticator_webauthn/AuthenticateWebAuthnStageForm.ts
View File

@ -55,10 +55,9 @@ export class AuthenticateWebAuthnStageForm extends ModelForm<AuthenticateWebAuth
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).",
"Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).",
)}
</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
@ -214,7 +213,6 @@ export class AuthenticateWebAuthnStageForm extends ModelForm<AuthenticateWebAuth
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/captcha/CaptchaStageForm.ts
View File

@ -40,8 +40,7 @@ export class CaptchaStageForm extends ModelForm<CaptchaStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"This stage checks the user's current session against the Google reCaptcha (or compatible) service.",
)}
@ -133,7 +132,6 @@ export class CaptchaStageForm extends ModelForm<CaptchaStage, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/consent/ConsentStageForm.ts
View File

@ -49,8 +49,7 @@ export class ConsentStageForm extends ModelForm<ConsentStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Prompt for the user's consent. The consent can either be permanent or expire in a defined amount of time.",
)}
@ -120,7 +119,6 @@ export class ConsentStageForm extends ModelForm<ConsentStage, string> {
<ak-utils-time-delta-help></ak-utils-time-delta-help>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/deny/DenyStageForm.ts
View File

@ -39,8 +39,7 @@ export class DenyStageForm extends ModelForm<DenyStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Statically deny the flow. To use this stage effectively, disable *Evaluate when flow is planned* on the respective binding.",
)}
@ -52,7 +51,6 @@ export class DenyStageForm extends ModelForm<DenyStage, string> {
class="pf-c-form-control"
required
/>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/stages/dummy/DummyStageForm.ts
View File

@ -40,8 +40,7 @@ export class DummyStageForm extends ModelForm<DummyStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Dummy stage used for testing. Shows a simple continue button and always passes.",
)}
@ -68,7 +67,6 @@ export class DummyStageForm extends ModelForm<DummyStage, string> {
</span>
<span class="pf-c-switch__label">${msg("Throw error?")}</span>
</label>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/stages/email/EmailStageForm.ts
View File

@ -147,8 +147,7 @@ export class EmailStageForm extends ModelForm<EmailStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Verify the user's email address by sending them a one-time-link. Can also be used for recovery to verify the user's authenticity.",
)}
@ -256,7 +255,6 @@ export class EmailStageForm extends ModelForm<EmailStage, string> {
</ak-form-element-horizontal>
</div>
</ak-form-group>
${this.renderConnectionSettings()}
</form>`;
${this.renderConnectionSettings()}`;
}
}

6
web/src/admin/stages/identification/IdentificationStageForm.ts
View File

@ -68,8 +68,7 @@ export class IdentificationStageForm extends ModelForm<IdentificationStage, stri
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg("Let the user identify themselves with their username or Email address.")}
</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
@ -299,7 +298,6 @@ export class IdentificationStageForm extends ModelForm<IdentificationStage, stri
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/invitation/InvitationForm.ts
View File

@ -43,8 +43,7 @@ export class InvitationForm extends ModelForm<Invitation, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal
return html` <ak-form-element-horizontal
?slugMode=${true}
label=${msg("Name")}
?required=${true}
@ -107,7 +106,6 @@ export class InvitationForm extends ModelForm<Invitation, string> {
<p class="pf-c-form__helper-text">
${msg("When enabled, the invitation will be deleted after usage.")}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/stages/invitation/InvitationStageForm.ts
View File

@ -40,8 +40,7 @@ export class InvitationStageForm extends ModelForm<InvitationStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg("This stage can be included in enrollment flows to accept invitations.")}
</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
@ -81,7 +80,6 @@ export class InvitationStageForm extends ModelForm<InvitationStage, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

8
web/src/admin/stages/password/PasswordStageForm.ts
View File

@ -62,8 +62,9 @@ export class PasswordStageForm extends ModelForm<PasswordStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span> ${msg("Validate the user's password against the selected backend(s).")} </span>
return html` <span>
${msg("Validate the user's password against the selected backend(s).")}
</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
@ -180,7 +181,6 @@ export class PasswordStageForm extends ModelForm<PasswordStage, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/prompt/PromptForm.ts
View File

@ -283,8 +283,7 @@ export class PromptForm extends ModelForm<Prompt, string> {
}
renderEditForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
@ -454,7 +453,6 @@ export class PromptForm extends ModelForm<Prompt, string> {
class="pf-c-form-control"
required
/>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/stages/prompt/PromptStageForm.ts
View File

@ -60,8 +60,7 @@ export class PromptStageForm extends ModelForm<PromptStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Show arbitrary input fields to the user, for example during enrollment. Data is saved in the flow context under the 'prompt_data' variable.",
)}
@ -146,7 +145,6 @@ export class PromptStageForm extends ModelForm<PromptStage, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/user_delete/UserDeleteStageForm.ts
View File

@ -39,8 +39,7 @@ export class UserDeleteStageForm extends ModelForm<UserDeleteStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
"Delete the currently pending user. CAUTION, this stage does not ask for confirmation. Use a consent stage to ensure the user is aware of their actions.",
)}
@ -52,7 +51,6 @@ export class UserDeleteStageForm extends ModelForm<UserDeleteStage, string> {
class="pf-c-form-control"
required
/>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/stages/user_login/UserLoginStageForm.ts
View File

@ -42,8 +42,7 @@ export class UserLoginStageForm extends ModelForm<UserLoginStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>${msg("Log the currently pending user in.")}</span>
return html` <span>${msg("Log the currently pending user in.")}</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
@ -125,7 +124,6 @@ export class UserLoginStageForm extends ModelForm<UserLoginStage, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/stages/user_logout/UserLogoutStageForm.ts
View File

@ -39,8 +39,7 @@ export class UserLogoutStageForm extends ModelForm<UserLogoutStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>${msg("Remove the user from the current session.")}</span>
return html` <span>${msg("Remove the user from the current session.")}</span>
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
@ -48,7 +47,6 @@ export class UserLogoutStageForm extends ModelForm<UserLogoutStage, string> {
class="pf-c-form-control"
required
/>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/admin/stages/user_write/UserWriteStageForm.ts
View File

@ -44,8 +44,7 @@ export class UserWriteStageForm extends ModelForm<UserWriteStage, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<span>
return html` <span>
${msg(
`Write any data from the flow's context's 'prompt_data' to the currently pending user. If no user
is pending, a new user is created, and data is written to them.`,
@ -161,7 +160,6 @@ export class UserWriteStageForm extends ModelForm<UserWriteStage, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

10
web/src/admin/tenants/TenantForm.ts
View File

@ -46,8 +46,11 @@ export class TenantForm extends ModelForm<Tenant, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Domain")} ?required=${true} name="domain">
return html` <ak-form-element-horizontal
label=${msg("Domain")}
?required=${true}
name="domain"
>
<input
type="text"
value="${first(this.instance?.domain, window.location.host)}"
@ -275,7 +278,6 @@ export class TenantForm extends ModelForm<Tenant, string> {
</p>
</ak-form-element-horizontal>
</div>
</ak-form-group>
</form>`;
</ak-form-group>`;
}
}

6
web/src/admin/tokens/TokenForm.ts
View File

@ -58,8 +58,7 @@ export class TokenForm extends ModelForm<Token, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal
return html` <ak-form-element-horizontal
label=${msg("Identifier")}
name="identifier"
?required=${true}
@ -151,7 +150,6 @@ export class TokenForm extends ModelForm<Token, string> {
)}
</p>
</ak-form-element-horizontal>
${this.showExpiry ? this.renderExpiry() : html``}
</form>`;
${this.showExpiry ? this.renderExpiry() : html``}`;
}
}

2
web/src/admin/users/RelatedUserList.ts
View File

@ -68,7 +68,7 @@ export class RelatedUserAdd extends Form<{ users: number[] }> {
return data;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`${this.group?.isSuperuser ? html`` : html``}
<ak-form-element-horizontal label=${msg("Users to add")} name="users">
<div class="pf-c-input-group">

6
web/src/admin/users/ServiceAccountForm.ts
View File

@ -34,7 +34,7 @@ export class ServiceAccountForm extends Form<UserServiceAccountRequest> {
this.result = undefined;
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal
label=${msg("Username")}
?required=${true}
@ -118,10 +118,10 @@ export class ServiceAccountForm extends Form<UserServiceAccountRequest> {
</form>`;
}
renderForm(): TemplateResult {
renderFormWrapper(): TemplateResult {
if (this.result) {
return this.renderResponseForm();
}
return super.renderForm();
return super.renderFormWrapper();
}
}

10
web/src/admin/users/UserForm.ts
View File

@ -64,8 +64,11 @@ export class UserForm extends ModelForm<User, number> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Username")} ?required=${true} name="username">
return html` <ak-form-element-horizontal
label=${msg("Username")}
?required=${true}
name="username"
>
<input
type="text"
value="${ifDefined(this.instance?.username)}"
@ -165,7 +168,6 @@ export class UserForm extends ModelForm<User, number> {
<p class="pf-c-form__helper-text">
${msg("Set custom attributes using YAML or JSON.")}
</p>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

2
web/src/admin/users/UserPasswordForm.ts
View File

@ -25,7 +25,7 @@ export class UserPasswordForm extends Form<UserPasswordSetRequest> {
});
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal
label=${msg("Password")}
?required=${true}

2
web/src/admin/users/UserResetEmailForm.ts
View File

@ -31,7 +31,7 @@ export class UserResetEmailForm extends Form<CoreUsersRecoveryEmailRetrieveReque
return new CoreApi(DEFAULT_CONFIG).coreUsersRecoveryEmailRetrieve(data);
}
renderInlineForm(): TemplateResult {
renderForm(): TemplateResult {
return html`<ak-form-element-horizontal
label=${msg("Email stage")}
?required=${true}

25
web/src/elements/forms/Form.ts
View File

@ -36,13 +36,13 @@ export interface KeyUnknown {
*
* The base form element for interacting with user inputs.
*
* All forms either[1] inherit from this class and implement the `renderInlineForm()` method to
* All forms either[1] inherit from this class and implement the `renderForm()` method to
* produce the actual form, or include the form in-line as a slotted element. Bizarrely, this form
* will not render at all if it's not actually in the viewport?[2]
*
* @element ak-form
*
* @slot - Where the form goes if `renderInlineForm()` returns undefined.
* @slot - Where the form goes if `renderForm()` returns undefined.
* @fires eventname - description
*
* @csspart partname - description
@ -52,7 +52,7 @@ export interface KeyUnknown {
*
* 1. Specialization: Separate this component into three different classes:
* - The base class
* - The "use `renderInlineForm` class
* - The "use `renderForm` class
* - The slotted class.
* 2. There is already specialization-by-type throughout all of our code.
* Consider refactoring serializeForm() so that the conversions are on
@ -343,21 +343,22 @@ export abstract class Form<T> extends AKElement {
}
}
renderForm(): TemplateResult {
const inline = this.renderInlineForm();
renderFormWrapper(): TemplateResult {
const inline = this.renderForm();
if (inline) {
return html`<form class="pf-c-form pf-m-horizontal" @submit=${this.submit}>
return html`<form
class="pf-c-form pf-m-horizontal"
@submit=${(ev: Event) => {
ev.preventDefault();
}}
>
${inline}
</form>`;
}
return html`<slot></slot>`;
}
/**
* Inline form render callback when inheriting this class, should be overwritten
* instead of `this.renderForm`
*/
renderInlineForm(): TemplateResult | undefined {
renderForm(): TemplateResult | undefined {
return undefined;
}
@ -378,7 +379,7 @@ export abstract class Form<T> extends AKElement {
}
renderVisible(): TemplateResult {
return html` ${this.renderNonFieldErrors()} ${this.renderForm()}`;
return html` ${this.renderNonFieldErrors()} ${this.renderFormWrapper()}`;
}
render(): TemplateResult {

6
web/src/user/user-settings/mfa/MFADeviceForm.ts
View File

@ -64,15 +64,13 @@ export class MFADeviceForm extends ModelForm<Device, number> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
return html` <ak-form-element-horizontal label=${msg("Name")} ?required=${true} name="name">
<input
type="text"
value="${ifDefined(this.instance?.name)}"
class="pf-c-form-control"
required
/>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

6
web/src/user/user-settings/tokens/UserTokenForm.ts
View File

@ -43,8 +43,7 @@ export class UserTokenForm extends ModelForm<Token, string> {
}
renderForm(): TemplateResult {
return html`<form class="pf-c-form pf-m-horizontal">
<ak-form-element-horizontal
return html` <ak-form-element-horizontal
label=${msg("Identifier")}
?required=${true}
name="identifier"
@ -62,7 +61,6 @@ export class UserTokenForm extends ModelForm<Token, string> {
value="${ifDefined(this.instance?.description)}"
class="pf-c-form-control"
/>
</ak-form-element-horizontal>
</form>`;
</ak-form-element-horizontal>`;
}
}

7
web/xliff/de.xlf
View File

@ -4021,10 +4021,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>Wenn mehrere Stufen ausgewählt sind, kann der Benutzer wählen, welche er registrieren möchte.</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>Phase zum Konfigurieren eines WebAutnn-Authentifikators (z. B. Yubikey, FaceID/Windows Hello).</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>Benutzerüberprüfung</target>
@ -5933,6 +5929,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/en.xlf
View File

@ -4245,10 +4245,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>When multiple stages are selected, the user can choose which one they want to enroll.</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>User verification</target>
@ -6247,6 +6243,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/es.xlf
View File

@ -3948,10 +3948,6 @@ doesn't pass when either or both of the selected options are equal or above the
<trans-unit id="s7e5af9c6ba6f5cc6">
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>Etapa utilizada para configurar un autenticador WebAutnn (es decir, Yubikey, FaceID/Windows Hello).</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>Verificación del usuario</target>
@ -5841,6 +5837,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

8
web/xliff/fr.xlf
View File

@ -5303,11 +5303,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>Lorsque plusieurs étapes sont sélectionnées, les utilisateurs peuvent choisir celle qu’ils souhaient utiliser pour s’enrôler.</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>Étape de configuration d'un authentificateur WebAuthn (Yubikey, FaceID/Windows Hello).</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
@ -7823,6 +7818,9 @@ Les liaisons avec les groupes/utilisateurs sont vérifiées par rapport à l'uti
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/pl.xlf
View File

@ -4118,10 +4118,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>W przypadku wybrania wielu etapów użytkownik może wybrać, na który chce się zapisać.</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>Etap używany do konfiguracji tokena uwierzytelniającego WebAuthn (tj. Yubikey, FaceID/Windows Hello).</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>Weryfikacja użytkownika</target>
@ -6080,6 +6076,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/pseudo-LOCALE.xlf
View File

@ -4208,10 +4208,6 @@ doesn't pass when either or both of the selected options are equal or above the
<trans-unit id="s7e5af9c6ba6f5cc6">
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
@ -6182,6 +6178,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/tr.xlf
View File

@ -3947,10 +3947,6 @@ doesn't pass when either or both of the selected options are equal or above the
<trans-unit id="s7e5af9c6ba6f5cc6">
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>Aşama bir WebAutnn kimlik doğrulayıcısını (örn. Yubikey, FaceID/Windows Hello) yapılandırmak için kullanılır.</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>Kullanıcı doğrulaması</target>
@ -5834,6 +5830,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

8
web/xliff/zh-Hans.xlf
View File

@ -5305,11 +5305,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>选中多个阶段时，用户可以选择要注册哪个。</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>用来配置 WebAuthn 身份验证器（即 Yubikey、FaceID/Windows Hello）的阶段。</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
@ -7828,6 +7823,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/zh-Hant.xlf
View File

@ -3984,10 +3984,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>选中多个阶段时，用户可以选择要注册哪个。</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>用于配置 Webautnn 身份验证器（即 Yubikey、FaceID/Windows Hello）的阶段。</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>用户验证</target>
@ -5886,6 +5882,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>

7
web/xliff/zh_TW.xlf
View File

@ -3984,10 +3984,6 @@ doesn't pass when either or both of the selected options are equal or above the
<source>When multiple stages are selected, the user can choose which one they want to enroll.</source>
<target>选中多个阶段时，用户可以选择要注册哪个。</target>
</trans-unit>
<trans-unit id="s9a823993c07e5d64">
<source>Stage used to configure a WebAutnn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
<target>用于配置 Webautnn 身份验证器（即 Yubikey、FaceID/Windows Hello）的阶段。</target>
</trans-unit>
<trans-unit id="s34b23ebbac9f6ab9">
<source>User verification</source>
<target>用户验证</target>
@ -5885,6 +5881,9 @@ Bindings to groups/users are checked against the user of the event.</source>
</trans-unit>
<trans-unit id="s01794c0ee3629c1b">
<source>Flow Info</source>
</trans-unit>
<trans-unit id="s24bce955914b1f0a">
<source>Stage used to configure a WebAuthn authenticator (i.e. Yubikey, FaceID/Windows Hello).</source>
</trans-unit>
</body>
</file>