feat(onClickOutside): support options in component (#2391)

* fix(onClickOutside): missing options for component

It adds support for the options property when using onClickOutside via component

* docs: add example

Co-authored-by: sibbng <sibbngheid@gmail.com>

packages/core/onClickOutside/component.ts

@@ -1,16 +1,21 @@
 import { defineComponent, h, ref } from 'vue-demi'
 import { onClickOutside } from '@vueuse/core'
 import type { RenderableComponent } from '../types'
+import type { OnClickOutsideOptions } from '.'
 
-export const OnClickOutside = defineComponent<RenderableComponent>({
+export interface OnClickOutsideProps extends RenderableComponent {
+  options?: OnClickOutsideOptions
+}
+
+export const OnClickOutside = defineComponent<OnClickOutsideProps>({
   name: 'OnClickOutside',
-  props: ['as'] as unknown as undefined,
+  props: ['as', 'options'] as unknown as undefined,
   emits: ['trigger'],
   setup(props, { slots, emit }) {
     const target = ref()
     onClickOutside(target, (e) => {
       emit('trigger', e)
-    })
+    }, props.options)
 
     return () => {
       if (slots.default)

packages/core/onClickOutside/index.md

@@ -39,7 +39,7 @@ export default {
 ## Component Usage
 
 ```html
-<OnClickOutside @trigger="count++">
+<OnClickOutside @trigger="count++" :options="{ ignore: [/* ... */] }">
   <div>
     Click Outside of Me
   </div>