design.estate/dees-catalog
3
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(input-text): add validated success state and text editing context menu to text inputs

Browse Source
This commit is contained in:
Jürgen Kunz
2026-04-12 16:58:39 +00:00
parent a0b17132ad
commit 653ef109be
5 changed files with 133 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
ts_web/elements/00group-input/dees-input-iban/dees-input-iban.ts
View File

@@ -50,6 +50,16 @@ export class DeesInputIban extends DeesInputBase<DeesInputIban> {
.disabled=${this.disabled}
.required=${this.required}
.placeholder=${'DE89 3704 0044 0532 0130 00'}
.validationFunction=${(value: string) => {
const normalized = value.replace(/ /g, '');
if (normalized.length === 0) {
return { valid: true, message: '' };
}
const isValid = ibantools.isValidIBAN(normalized);
return isValid
? { valid: true, message: 'IBAN is valid' }
: { valid: false, message: 'Please enter a valid IBAN' };
}}
@input=${(eventArg: InputEvent) => {
this.validateIban(eventArg);
}}
@@ -81,19 +91,6 @@ export class DeesInputIban extends DeesInputBase<DeesInputIban> {
}
}
this.enteredIbanIsValid = ibantools.isValidIBAN(this.enteredString.replace(/ /g, ''));
const deesInputText = this.shadowRoot!.querySelector('dees-input-text') as any;
if (deesInputText) {
if (this.enteredIbanIsValid) {
deesInputText.validationState = 'valid';
deesInputText.validationText = 'IBAN is valid';
} else if (this.enteredString.length > 0) {
deesInputText.validationState = 'invalid';
deesInputText.validationText = 'Please enter a valid IBAN';
} else {
deesInputText.validationState = undefined;
deesInputText.validationText = '';
}
}
}
public getValue(): string {