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

feat(form-inputs): Improve form input consistency and auto spacing across inputs and buttons

Browse Source
This commit is contained in:
Juergen Kunz
2025-06-22 20:32:59 +00:00
parent 024d8af40d
commit 4de835474b
11 changed files with 524 additions and 482 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
ts_web/elements/dees-input-radio.ts
View File

@ -17,6 +17,8 @@ export class DeesInputRadio extends DeesInputBase<DeesInputRadio> {
@property()
public value: boolean = false;
@property({ type: String })
public name: string = '';
constructor() {
super();
@ -95,7 +97,27 @@ export class DeesInputRadio extends DeesInputBase<DeesInputRadio> {
}
public async toggleSelected () {
this.value = !this.value;
// Radio buttons can only be selected, not deselected by clicking
if (this.value) {
return;
}
// If this radio has a name, find and deselect other radios in the same group
if (this.name) {
// Try to find a form container first, then fall back to document
const container = this.closest('dees-form') ||
this.closest('dees-demowrapper') ||
this.closest('.radio-group')?.parentElement ||
document;
const allRadios = container.querySelectorAll(`dees-input-radio[name="${this.name}"]`);
allRadios.forEach((radio: DeesInputRadio) => {
if (radio !== this && radio.value) {
radio.value = false;
}
});
}
this.value = true;
this.dispatchEvent(new CustomEvent('newValue', {
detail: this.value,
bubbles: true