fix(ts_web): resolve TypeScript nullability and event typing issues across web components

This commit is contained in:
2026-04-01 05:00:21 +00:00
parent b1c8a7446e
commit af1f660486
78 changed files with 429 additions and 399 deletions

View File

@@ -30,7 +30,7 @@ export class DeesFormSubmit extends DeesElement {
accessor disabled = false;
@property({ type: String })
accessor text: string;
accessor text!: string;
@property({ type: String })
accessor status: 'normal' | 'pending' | 'success' | 'error' = 'normal';
@@ -42,7 +42,7 @@ export class DeesFormSubmit extends DeesElement {
accessor size: 'sm' | 'default' | 'lg' | 'icon' | 'small' | 'normal' | 'large' = 'default';
@property({ type: String })
accessor icon: string;
accessor icon!: string;
@property({ type: String })
accessor iconPosition: 'left' | 'right' = 'left';

View File

@@ -57,10 +57,10 @@ export const demoFunc = () => html`
const outputDiv = elementArg.querySelector('.form-output');
if (form && outputDiv) {
form.addEventListener('formData', async (eventArg: CustomEvent) => {
form.addEventListener('formData', (async (eventArg: CustomEvent) => {
const data = eventArg.detail.data;
console.log('Form submitted with data:', data);
// Show processing state
form.setStatus('pending', 'Processing your registration...');
outputDiv.innerHTML = `<strong>Submitted Data:</strong>\n${JSON.stringify(data, null, 2)}`;
@@ -75,7 +75,7 @@ export const demoFunc = () => html`
await domtools.plugins.smartdelay.delayFor(2000);
form.reset();
outputDiv.innerHTML = '<em>Form has been reset</em>';
});
}) as unknown as EventListener);
// Track individual field changes
const inputs = form.querySelectorAll('dees-input-text, dees-input-dropdown, dees-input-checkbox');
@@ -158,14 +158,14 @@ export const demoFunc = () => html`
console.log('Horizontal form layout active');
// Monitor filter changes
form.addEventListener('formData', (event: CustomEvent) => {
form.addEventListener('formData', ((event: CustomEvent) => {
const filters = event.detail.data;
console.log('Filter applied:', filters);
// Simulate search
const resultsCount = Math.floor(Math.random() * 100) + 1;
console.log(`Found ${resultsCount} results with filters:`, filters);
});
}) as unknown as EventListener);
// Setup real-time filter updates
const inputs = form.querySelectorAll('[key]');
@@ -224,7 +224,7 @@ export const demoFunc = () => html`
const statusDiv = elementArg.querySelector('#status-display');
if (form) {
form.addEventListener('formData', async (eventArg: CustomEvent) => {
form.addEventListener('formData', (async (eventArg: CustomEvent) => {
const data = eventArg.detail.data;
console.log('Advanced form data:', data);
@@ -252,7 +252,7 @@ export const demoFunc = () => html`
}
console.log('Form data logged:', data);
});
}) as unknown as EventListener);
// Monitor file uploads
const fileUpload = form.querySelector('dees-input-fileupload');

View File

@@ -156,8 +156,9 @@ export class DeesForm extends DeesElement {
requiredOK = false;
}
}
if (this.getSubmitButton()) {
this.getSubmitButton().disabled = !requiredOK;
const submitButton = this.getSubmitButton();
if (submitButton) {
submitButton.disabled = !requiredOK;
}
}
@@ -200,6 +201,7 @@ export class DeesForm extends DeesElement {
) {
const inputChildren = this.getFormElements();
const submitButton = this.getSubmitButton();
if (!submitButton) return;
switch (visualStateArg) {
case 'normal':
@@ -240,7 +242,6 @@ export class DeesForm extends DeesElement {
*/
reset() {
const inputChildren = this.getFormElements();
const submitButton = this.getSubmitButton();
for (const inputChild of inputChildren) {
inputChild.value = null;