Stimulus and Typescript

3

My current solution is making my own AbstractController which uses Generics and ignores that error:

import { Controller } from '@hotwired/stimulus';

export default abstract class AbstractController<StimulusElement extends Element> extends Controller {
    // @ts-ignore see https://discuss.hotwired.dev/t/stimulus-and-typescript/2458
    declare readonly element: StimulusElement;
}

import AbstractController from '../src/AbstractController';

export default class extends AbstractController<HTMLButtonElement> {
    static values = {
        code: String,
    };

    static targets = [
        'name'
    ];

    declare readonly codeValue: string;
    declare readonly nameTarget: HTMLInputElement
}

I hope this maybe helps someone else. If somebody know a better solution I’m happy to update the example.