index.js 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
  2. const require_runtime = require('../../_virtual/_rolldown/runtime.js');
  3. const require_aria = require('../../utils/dom/aria.js');
  4. const require_types = require('../../utils/types.js');
  5. let _vueuse_core = require("@vueuse/core");
  6. let vue = require("vue");
  7. let _vue_shared = require("@vue/shared");
  8. //#region ../../packages/hooks/use-focus-controller/index.ts
  9. function useFocusController(target, { disabled, beforeFocus, afterFocus, beforeBlur, afterBlur } = {}) {
  10. const { emit } = (0, vue.getCurrentInstance)();
  11. const wrapperRef = (0, vue.shallowRef)();
  12. const isFocused = (0, vue.ref)(false);
  13. const handleFocus = (event) => {
  14. const cancelFocus = (0, _vue_shared.isFunction)(beforeFocus) ? beforeFocus(event) : false;
  15. if ((0, vue.unref)(disabled) || isFocused.value || cancelFocus) return;
  16. isFocused.value = true;
  17. emit("focus", event);
  18. afterFocus?.();
  19. };
  20. const handleBlur = (event) => {
  21. const cancelBlur = (0, _vue_shared.isFunction)(beforeBlur) ? beforeBlur(event) : false;
  22. if ((0, vue.unref)(disabled) || event.relatedTarget && wrapperRef.value?.contains(event.relatedTarget) || cancelBlur) return;
  23. isFocused.value = false;
  24. emit("blur", event);
  25. afterBlur?.();
  26. };
  27. const handleClick = (event) => {
  28. if ((0, vue.unref)(disabled) || require_aria.isFocusable(event.target) || wrapperRef.value?.contains(document.activeElement) && wrapperRef.value !== document.activeElement) return;
  29. target.value?.focus();
  30. };
  31. (0, vue.watch)([wrapperRef, () => (0, vue.unref)(disabled)], ([el, disabled]) => {
  32. if (!el) return;
  33. if (disabled) el.removeAttribute("tabindex");
  34. else el.setAttribute("tabindex", "-1");
  35. });
  36. (0, _vueuse_core.useEventListener)(wrapperRef, "focus", handleFocus, true);
  37. (0, _vueuse_core.useEventListener)(wrapperRef, "blur", handleBlur, true);
  38. (0, _vueuse_core.useEventListener)(wrapperRef, "click", handleClick, true);
  39. if (process.env.NODE_ENV === "test") (0, vue.onMounted)(() => {
  40. const targetEl = require_types.isElement(target.value) ? target.value : document.querySelector("input,textarea");
  41. if (targetEl) {
  42. (0, _vueuse_core.useEventListener)(targetEl, "focus", handleFocus, true);
  43. (0, _vueuse_core.useEventListener)(targetEl, "blur", handleBlur, true);
  44. }
  45. });
  46. return {
  47. isFocused,
  48. wrapperRef,
  49. handleFocus,
  50. handleBlur
  51. };
  52. }
  53. //#endregion
  54. exports.useFocusController = useFocusController;
  55. //# sourceMappingURL=index.js.map