index.js 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var core = require('@vueuse/core');
  5. require('../../utils/index.js');
  6. var shared = require('@vue/shared');
  7. function useFocusController(target, { afterFocus, beforeBlur, afterBlur } = {}) {
  8. const instance = vue.getCurrentInstance();
  9. const { emit } = instance;
  10. const wrapperRef = vue.shallowRef();
  11. const isFocused = vue.ref(false);
  12. const handleFocus = (event) => {
  13. if (isFocused.value)
  14. return;
  15. isFocused.value = true;
  16. emit("focus", event);
  17. afterFocus == null ? void 0 : afterFocus();
  18. };
  19. const handleBlur = (event) => {
  20. var _a;
  21. const cancelBlur = shared.isFunction(beforeBlur) ? beforeBlur(event) : false;
  22. if (cancelBlur || event.relatedTarget && ((_a = wrapperRef.value) == null ? void 0 : _a.contains(event.relatedTarget)))
  23. return;
  24. isFocused.value = false;
  25. emit("blur", event);
  26. afterBlur == null ? void 0 : afterBlur();
  27. };
  28. const handleClick = () => {
  29. var _a;
  30. (_a = target.value) == null ? void 0 : _a.focus();
  31. };
  32. vue.watch(wrapperRef, (el) => {
  33. if (el) {
  34. el.setAttribute("tabindex", "-1");
  35. }
  36. });
  37. core.useEventListener(wrapperRef, "click", handleClick);
  38. return {
  39. wrapperRef,
  40. isFocused,
  41. handleFocus,
  42. handleBlur
  43. };
  44. }
  45. exports.useFocusController = useFocusController;
  46. //# sourceMappingURL=index.js.map