click-outside-vue3 4.1.0

on Node.js NPM

Bug fixes from the open issues of the original v-click-outside, TypeScript types, and a Vue 3 example.

Fixes

• Changing isActive, events, capture or detectIframe at runtime works, also when you mutate the same reactive config object (Vue 3.1.5+). A new handler or middleware is picked up without re-adding listeners.
• Selecting text inside an element and releasing the mouse outside no longer counts as an outside click. Keyboard clicks work as before.
• event.path is no longer read, which fixes errors in old Android WebViews.
• null, undefined, false or an options object without handler disable the directive instead of throwing, so v-click-outside="isOpen && close" and optional function props work.
• A component can have v-click-outside on its root and still get another one from its parent. Both work and both are cleaned up.
• Fixed a listener leak when the element updated right after mount.

TypeScript

Types are included: ClickOutsideOptions, ClickOutsideBinding, ClickOutsideHandler, ClickOutsideMiddleware and ClickOutsideDirective. On Vue 3.5+ the directive is typed in templates when registered with app.use. If you added your own vClickOutside entry to GlobalDirectives, remove it.

Upgrading from 4.0

• A non-function handler now throws when the directive is bound, not on the first click.
• vue is now a peer dependency (^3.0.0).
• Use a default import. Named imports like import { directive } work with bundlers but not in plain Node ESM.

See the README for the full list and recipes.