Issue with typescript support

[Kieran]

JSX element class does not support attributes because it does not have a 'props' property.ts(2607)

<Collapsible open={expand} transitionTime={0}>
    <div className="p-px">
      <form onSubmit={handleSubmit}>
        <textarea
          id="emailInput"
          className="w-full resize-none shadow rounded-lg mb-2 p-2"
          rows={7}
          onChange={(v) => setValue(v.target.value)}
          placeholder="Add email addresses separated by commas"
        ></textarea>
        <br />
        <br />
        <button className="bg-merch-orange w-5/6 shadow float-left" onClick={onSubmit} >Save</button>
        <button className="text-merch-orange float-right shadow py-3 px-3 rounded-lg"><RiDeleteBin5Line /></button>
      </form>
    </div>
</Collapsible>

https://i.imgur.com/1kPT7P6.png
https://imgur.com/lC4K8tg

Its strange because TS sees the class but for some reason is not working. Any assistance would be much appreciated. Thanks!

[Karl]

Please can you provide a reproducible example? Also, some version numbers would benefit this issue a lot.

I have created a fresh typescript react app using yarn create react-app my-app --template typescript and it's working ok for me so without any other info I can only assume it's something other than the types being incorrect

Following your example, trigger is actually a required prop.

In a default setup this works fine:

import Collapsible from "react-collapsible";

function App() {
  return (
    <div className="App">
      <Collapsible trigger="Trigger" transitionTime={0}>
        <div>My content</div>
      </Collapsible>
    </div>
  );
}

However, without a trigger prop, I have the following error which is correct

[Karl]

Closing due to inactivity