Describe the bug
Encountering the following TypeScript error with the latest Preact 10.11.1 that supports SignalLike<T> type:
error TS2430: Interface 'HTMLAttributes<RefType>' incorrectly extends interface 'ClassAttributes<RefType>'.
Types of property 'default' are incompatible.
Type 'boolean | SignalLike<boolean> | undefined' is not assignable to type 'boolean | undefined'.
Type 'SignalLike<boolean>' is not assignable to type 'boolean | undefined'.
671 export interface HTMLAttributes<RefType extends EventTarget = EventTarget>
~~~~~~~~~~~~~~
Found 1 error in node_modules/preact/src/jsx.d.ts:671
Upon investigation, the error was caused by RoutableProps which is documented here in preact-router when skipLibCheck: true in tsconfig.json.
To Reproduce
Pre-requisites:
- dependencies:
preact@10.11.1, preact-router@4.1.0
- devDependencies:
typescript@4.8.4
Steps to reproduce the behavior:
- Run
npm create vite@latest my-vue-app -- --template preact-ts
- Run
npm i preact@10.11.1 preact-router@4.1.0
- Run
npm i -D typescript@4.8.4
- Set
skipLibCheck: false in tsconfig.json
- Add the following code in
app.tsx:
<Router>
<div />
</Router>
- See error
Expected behavior
RoutableProps which is documented here should be updated to follow the same typing as HTMLAttributes['default'] which supports Preact signals.
Possible solution(s)
- Update the type of
RoutableProps['default'] to support SignalLike because it is a prop of Router that can possibly accept a signal value:
export interface RoutableProps extends Pick<HTMLAttributes<HTMLElement>, 'default'> {
path?: string;
}
- Introduce new prop to avoid type conflict with HTML default attribute, such as
defaultRoute
Describe the bug
Encountering the following TypeScript error with the latest Preact 10.11.1 that supports
SignalLike<T>type:Upon investigation, the error was caused by RoutableProps which is documented here in
preact-routerwhenskipLibCheck: trueintsconfig.json.To Reproduce
Pre-requisites:
preact@10.11.1,preact-router@4.1.0typescript@4.8.4Steps to reproduce the behavior:
npm create vite@latest my-vue-app -- --template preact-tsnpm i preact@10.11.1 preact-router@4.1.0npm i -D typescript@4.8.4skipLibCheck: falseintsconfig.jsonapp.tsx:Expected behavior
RoutableProps which is documented here should be updated to follow the same typing as
HTMLAttributes['default']which supports Preact signals.Possible solution(s)
RoutableProps['default']to supportSignalLikebecause it is a prop ofRouterthat can possibly accept a signal value:defaultRoute