diff --git a/documentation/docs/07-misc/03-typescript.md b/documentation/docs/07-misc/03-typescript.md index a083f2b591..525ba51d2f 100644 --- a/documentation/docs/07-misc/03-typescript.md +++ b/documentation/docs/07-misc/03-typescript.md @@ -130,6 +130,22 @@ Components can declare a generic relationship between their properties. One exam The content of `generics` is what you would put between the `<...>` tags of a generic function. In other words, you can use multiple generics, `extends` and fallback types. +## Typing wrapper components + +In case you're writing a component that wraps a native element, you may want to expose all the attributes of underlying element to the user. In that case, use (or extend from) one of the interfaces provided by `svelte/elements`. Here's an example for a `Button` component: + +```svelte + + + +``` + ## Typing `$state` You can type `$state` like any other variable. @@ -159,9 +175,9 @@ class Counter { ## The `Component` type -Svelte components or of type `Component`. You can use it and its related types to express a variety of constraints. +Svelte components are of type `Component`. You can use it and its related types to express a variety of constraints. -Using it together with `` to restrict what kinds of component can be passed to it: +Using it together with dynamic components to restrict what kinds of component can be passed to it: ```svelte - + ``` Closely related to the `Component` type is the `ComponentProps` type which extracts the properties a component expects.