Skip to content

Commit f5653c9

Browse files
authored
Enhance TypeScript support section in use.mdx
Added information on extending the Directives interface for TypeScript support.
1 parent 1706c38 commit f5653c9

1 file changed

Lines changed: 13 additions & 1 deletion

File tree

  • src/routes/reference/jsx-attributes

src/routes/reference/jsx-attributes/use.mdx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ const [name, setName] = createSignal("");
3333

3434
## TypeScript Support
3535

36-
To type custom directives, extend the `DirectiveFunctions` interface:
36+
To type custom directives, extend the `DirectiveFunctions` interface
3737

3838
```ts
3939
declare module "solid-js" {
@@ -45,6 +45,18 @@ declare module "solid-js" {
4545
}
4646
```
4747

48+
If you just want to constrain the second argument to the directive function, you can extend the older `Directives` interface
49+
50+
```tsx
51+
declare module "solid-js" {
52+
namespace JSX {
53+
interface Directives {
54+
model: Signal<string>;
55+
}
56+
}
57+
}
58+
```
59+
4860
## Avoiding Tree-Shaking
4961

5062
When importing a directive `d` from another module and using it only as `use:d`, TypeScript (via [babel-preset-typescript](https://babeljs.io/docs/babel-preset-typescript)) may remove the import, as it doesn’t recognize `use:d` as a reference to `d`.

0 commit comments

Comments
 (0)