How to create component that has HTMLAttributes as props

Question

I am using Typescript and Preact. I want to create a component that exposes all the props that a <span/> can have:

import { h, Component } from "preact";

export class MySpan extends Component<any, void> {
    render(props) {
        return <span {...props}></span>;

    }
}

However, the above example uses any, which is not really typesafe. Rather I want to expose the properties span has.

Answer 1

In react I would do it this way:

export class MySpan extends React.Component<React.HTMLProps<HTMLDivElement>, void>
{
    public render()
    {
        return <span {...this.props}/>;
    }
}

I do not have real experience with preact but taking into account their preact.d.ts, it should be something similar to:

import { h, Component } from "preact";

export class MySpan extends Component<JSX.HTMLAttributes, void> {
    render(props) {
        return <span {...props}></span>;

    }
}

Note that this will not be specific properties for span element but rather generic ones.