@zag-js/focus-visible 0.0.0-dev-20220616113129 → 0.0.0-dev-20220626181040

package/dist/index.d.ts

@@ -1,3 +1,7 @@
+declare type Modality = "keyboard" | "pointer" | "virtual";
 declare type FocusVisibleCallback = (isFocusVisible: boolean) => void;
 export declare function trackFocusVisible(fn: FocusVisibleCallback): () => void;
+export declare function trackInteractionModality(fn: (value: Modality | null) => void): () => void;
+export declare function setInteractionModality(value: Modality): void;
+export declare function getInteractionModality(): Modality;
 export {};

package/dist/index.js

@@ -20,20 +20,24 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  trackFocusVisible: () => trackFocusVisible
+  getInteractionModality: () => getInteractionModality,
+  setInteractionModality: () => setInteractionModality,
+  trackFocusVisible: () => trackFocusVisible,
+  trackInteractionModality: () => trackInteractionModality
 });
 module.exports = __toCommonJS(src_exports);
 var hasSetup = false;
 var modality = null;
 var hasEventBeforeFocus = false;
+var hasBlurredWindowRecently = false;
 var handlers = /* @__PURE__ */ new Set();
-var isMac = typeof window !== "undefined" && window.navigator != null ? /^Mac/.test(window.navigator.platform) : false;
-function isValidKey(event) {
-  return !(event.metaKey || !isMac && event.altKey || event.ctrlKey);
-}
 function trigger(modality2, event) {
   handlers.forEach((handler) => handler(modality2, event));
 }
+var isMac = typeof window !== "undefined" && window.navigator != null ? /^Mac/.test(window.navigator.platform) : false;
+function isValidKey(e) {
+  return !(e.metaKey || !isMac && e.altKey || e.ctrlKey || e.key === "Control" || e.key === "Shift" || e.key === "Meta");
+}
 function onKeyboardEvent(event) {
   hasEventBeforeFocus = true;
   if (isValidKey(event)) {
@@ -51,21 +55,34 @@ function onPointerEvent(event) {
     trigger("pointer", event);
   }
 }
+function isVirtualClick(event) {
+  if (event.mozInputSource === 0 && event.isTrusted)
+    return true;
+  return event.detail === 0 && !event.pointerType;
+}
+function onClickEvent(e) {
+  if (isVirtualClick(e)) {
+    hasEventBeforeFocus = true;
+    modality = "virtual";
+  }
+}
 function onWindowFocus(event) {
   if (event.target === window || event.target === document) {
     return;
   }
-  if (!hasEventBeforeFocus) {
-    modality = "keyboard";
-    trigger("keyboard", event);
+  if (!hasEventBeforeFocus && !hasBlurredWindowRecently) {
+    modality = "virtual";
+    trigger("virtual", event);
   }
   hasEventBeforeFocus = false;
+  hasBlurredWindowRecently = false;
 }
 function onWindowBlur() {
   hasEventBeforeFocus = false;
+  hasBlurredWindowRecently = true;
 }
 function isFocusVisible() {
-  return modality === "keyboard";
+  return modality !== "pointer";
 }
 function setupGlobalFocusEvents() {
   if (typeof window === "undefined" || hasSetup) {
@@ -78,6 +95,7 @@ function setupGlobalFocusEvents() {
   };
   document.addEventListener("keydown", onKeyboardEvent, true);
   document.addEventListener("keyup", onKeyboardEvent, true);
+  document.addEventListener("click", onClickEvent, true);
   window.addEventListener("focus", onWindowFocus, true);
   window.addEventListener("blur", onWindowBlur, false);
   if (typeof PointerEvent !== "undefined") {
@@ -100,3 +118,19 @@ function trackFocusVisible(fn) {
     handlers.delete(handler);
   };
 }
+function trackInteractionModality(fn) {
+  setupGlobalFocusEvents();
+  fn(modality);
+  const handler = () => fn(modality);
+  handlers.add(handler);
+  return () => {
+    handlers.delete(handler);
+  };
+}
+function setInteractionModality(value) {
+  modality = value;
+  trigger(value, null);
+}
+function getInteractionModality() {
+  return modality;
+}

package/dist/index.mjs

@@ -4,14 +4,15 @@
 var hasSetup = false;
 var modality = null;
 var hasEventBeforeFocus = false;
+var hasBlurredWindowRecently = false;
 var handlers = /* @__PURE__ */ new Set();
-var isMac = typeof window !== "undefined" && window.navigator != null ? /^Mac/.test(window.navigator.platform) : false;
-function isValidKey(event) {
-  return !(event.metaKey || !isMac && event.altKey || event.ctrlKey);
-}
 function trigger(modality2, event) {
   handlers.forEach((handler) => handler(modality2, event));
 }
+var isMac = typeof window !== "undefined" && window.navigator != null ? /^Mac/.test(window.navigator.platform) : false;
+function isValidKey(e) {
+  return !(e.metaKey || !isMac && e.altKey || e.ctrlKey || e.key === "Control" || e.key === "Shift" || e.key === "Meta");
+}
 function onKeyboardEvent(event) {
   hasEventBeforeFocus = true;
   if (isValidKey(event)) {
@@ -29,21 +30,34 @@ function onPointerEvent(event) {
     trigger("pointer", event);
   }
 }
+function isVirtualClick(event) {
+  if (event.mozInputSource === 0 && event.isTrusted)
+    return true;
+  return event.detail === 0 && !event.pointerType;
+}
+function onClickEvent(e) {
+  if (isVirtualClick(e)) {
+    hasEventBeforeFocus = true;
+    modality = "virtual";
+  }
+}
 function onWindowFocus(event) {
   if (event.target === window || event.target === document) {
     return;
   }
-  if (!hasEventBeforeFocus) {
-    modality = "keyboard";
-    trigger("keyboard", event);
+  if (!hasEventBeforeFocus && !hasBlurredWindowRecently) {
+    modality = "virtual";
+    trigger("virtual", event);
   }
   hasEventBeforeFocus = false;
+  hasBlurredWindowRecently = false;
 }
 function onWindowBlur() {
   hasEventBeforeFocus = false;
+  hasBlurredWindowRecently = true;
 }
 function isFocusVisible() {
-  return modality === "keyboard";
+  return modality !== "pointer";
 }
 function setupGlobalFocusEvents() {
   if (typeof window === "undefined" || hasSetup) {
@@ -56,6 +70,7 @@ function setupGlobalFocusEvents() {
   };
   document.addEventListener("keydown", onKeyboardEvent, true);
   document.addEventListener("keyup", onKeyboardEvent, true);
+  document.addEventListener("click", onClickEvent, true);
   window.addEventListener("focus", onWindowFocus, true);
   window.addEventListener("blur", onWindowBlur, false);
   if (typeof PointerEvent !== "undefined") {
@@ -78,6 +93,25 @@ function trackFocusVisible(fn) {
     handlers.delete(handler);
   };
 }
+function trackInteractionModality(fn) {
+  setupGlobalFocusEvents();
+  fn(modality);
+  const handler = () => fn(modality);
+  handlers.add(handler);
+  return () => {
+    handlers.delete(handler);
+  };
+}
+function setInteractionModality(value) {
+  modality = value;
+  trigger(value, null);
+}
+function getInteractionModality() {
+  return modality;
+}
 export {
-  trackFocusVisible
+  getInteractionModality,
+  setInteractionModality,
+  trackFocusVisible,
+  trackInteractionModality
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/focus-visible",
-  "version": "0.0.0-dev-20220616113129",
+  "version": "0.0.0-dev-20220626181040",
   "description": "Focus visible polyfill utility based on WICG",
   "keywords": [
     "js",