docs(toast): update

docs/content/3.components/modal.md

@@ -281,7 +281,7 @@ This allows you to move the trigger outside of the Modal or remove it entirely.
 You can use the `useModal` composable to open a Modal programatically.
 
 ::important
-Make sure to wrap your app with the [`App`](/components/app) component that instantiates the `ModalProvider` component.
+Make sure to wrap your app with the [`App`](/components/app) component which uses the [`ModalProvider`](https://github.com/benjamincanac/ui3/blob/dev/src/runtime/components/ModalProvider.vue) component.
 ::
 
 First, create a modal component that will be opened programatically:

docs/content/3.components/slideover.md

@@ -280,7 +280,7 @@ This allows you to move the trigger outside of the Slideover or remove it entire
 You can use the `useSlideover` composable to open a Slideover programatically.
 
 ::important
-Make sure to wrap your app with the [`App`](/components/app) component that instantiates the `SlideoverProvider` component.
+Make sure to wrap your app with the [`App`](/components/app) component which uses the [`SlideoverProvider`](https://github.com/benjamincanac/ui3/blob/dev/src/runtime/components/SlideoverProvider.vue) component.
 ::
 
 First, create a slideover component that will be opened programatically:

docs/content/3.components/toast.md

@@ -14,21 +14,72 @@ navigation:
 
 ## Usage
 
+Use the [useToast](/composables/use-toast) composable to display a toast in your application.
+
+::important
+Make sure to wrap your app with the [App](/components/app) component which uses our [Toaster](https://github.com/benjamincanac/ui3/blob/dev/src/runtime/components/Toaster.vue) component which uses the [ToastProvider](https://www.radix-vue.com/components/toast.html#provider) component from Radix Vue.
+::
+
+::tip{to="/components/app#props"}
+You can check the `App` component `toaster` prop to see how to configure the Toaster globally.
+::
+
+### Title
+
+### Description
+
+### Icon
+
+### Avatar
+
+### Color
+
+### Variant
+
+### Close
+
+### Actions
+
 ## Examples
 
 ## API
 
 ### Props
 
-:component-props
+::component-props
+---
+ignore:
+  - as
+  - open
+  - defaultOpen
+  - to
+  - target
+  - active
+  - activeClass
+  - inactiveClass
+  - exactActiveClass
+  - ariaCurrentValue
+  - href
+  - rel
+  - noRel
+  - prefetch
+  - noPrefetch
+  - prefetchedClass
+  - replace
+  - exact
+  - exactQuery
+  - exactHash
+  - external
+---
+::
 
-### Slots
+<!-- ### Slots
 
 :component-slots
 
 ### Emits
 
-:component-emits
+:component-emits -->
 
 ## Theme
 

docs/content/3.components/tooltip.md

@@ -14,7 +14,11 @@ links:
 Use a [Button](/components/button) or any other component in the default slot of the Tooltip.
 
 ::important
-Make sure to wrap your app with the [`App`](/components/app) component to make the Tooltip work properly.
+Make sure to wrap your app with the [`App`](/components/app) component which uses the [TooltipProvider](https://www.radix-vue.com/components/tooltip.html#provider) component from Radix Vue.
+::
+
+::tip{to="/components/app#props"}
+You can check the `App` component `tooltip` prop to see how to configure the Tooltip globally.
 ::
 
 ### Text

src/runtime/components/Toast.vue

@@ -15,7 +15,7 @@ type ToastVariants = VariantProps<typeof toast>
 export interface ToastProps extends Pick<ToastRootProps, 'defaultOpen' | 'open' | 'type' | 'duration'> {
   /**
    * The element or component this component should render as.
-   * @defaultValue 'div'
+   * @defaultValue 'li'
    */
   as?: any
   title?: string
@@ -70,7 +70,7 @@ const emits = defineEmits<ToastEmits>()
 const slots = defineSlots<ToastSlots>()
 
 const appConfig = useAppConfig()
-const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'defaultOpen', 'duration', 'open', 'type'), emits)
+const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'defaultOpen', 'open', 'duration', 'type'), emits)
 
 const multiline = computed(() => !!props.title && !!props.description)