@zag-js/tooltip - npm Package Compare versions

Comparing version 0.60.0 to 0.61.0

dist/index.d.ts

@@ -54,2 +54,7 @@ import * as _zag_js_anatomy from '@zag-js/anatomy';
     /**
+     * Whether the tooltip should close on click
+     * @default true
+     */
+    closeOnClick?: boolean;
+    /**
      * Whether the tooltip's content is interactive.
@@ -129,5 +134,5 @@ * In this mode, the tooltip will remain open when user hovers over the content.
 
-declare const props: ("dir" | "id" | "getRootNode" | "open" | "disabled" | "aria-label" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "interactive" | "onOpenChange" | "positioning" | "open.controlled")[];
-declare const splitProps: <Props extends Partial<UserDefinedContext>>(props: Props) => [Partial<UserDefinedContext>, Omit<Props, "dir" | "id" | "getRootNode" | "open" | "disabled" | "aria-label" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "interactive" | "onOpenChange" | "positioning" | "open.controlled">];
+declare const props: ("dir" | "id" | "getRootNode" | "open" | "disabled" | "aria-label" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled")[];
+declare const splitProps: <Props extends Partial<UserDefinedContext>>(props: Props) => [Partial<UserDefinedContext>, Omit<Props, "dir" | "id" | "getRootNode" | "open" | "disabled" | "aria-label" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled">];
 
 export { type MachineApi as Api, type UserDefinedContext as Context, type ElementIds, type OpenChangeDetails, type Service, anatomy, connect, machine, props, splitProps };

dist/index.js

@@ -93,24 +93,33 @@ "use strict";
         "aria-describedby": open ? contentId : void 0,
-        onClick() {
+        onClick(event) {
+          if (event.defaultPrevented) return;
           if (disabled) return;
-          send("CLOSE");
+          if (!state.context.closeOnClick) return;
+          send({ type: "CLOSE", src: "trigger.click" });
         },
-        onFocus() {
-          if (disabled || state.event.type === "POINTER_DOWN") return;
-          send("OPEN");
+        onFocus(event) {
+          if (event.defaultPrevented) return;
+          if (disabled) return;
+          if (state.event.src === "trigger.pointerdown") return;
+          send({ type: "OPEN", src: "trigger.focus" });
         },
-        onBlur() {
+        onBlur(event) {
+          if (event.defaultPrevented) return;
           if (disabled) return;
           if (id === store.id) {
-            send("CLOSE");
+            send({ type: "CLOSE", src: "trigger.blur" });
           }
         },
-        onPointerDown() {
-          if (disabled || !state.context.closeOnPointerDown) return;
+        onPointerDown(event) {
+          if (event.defaultPrevented) return;
+          if (disabled) return;
+          if (!state.context.closeOnPointerDown) return;
           if (id === store.id) {
-            send("CLOSE");
+            send({ type: "CLOSE", src: "trigger.pointerdown" });
           }
         },
         onPointerMove(event) {
-          if (disabled || event.pointerType === "touch") return;
+          if (event.defaultPrevented) return;
+          if (disabled) return;
+          if (event.pointerType === "touch") return;
           send("POINTER_MOVE");
@@ -194,2 +203,3 @@ },
         closeOnScroll: true,
+        closeOnClick: true,
         ...ctx,
@@ -478,2 +488,3 @@ currentPlacement: void 0,
   "closeOnScroll",
+  "closeOnClick",
   "dir",
@@ -480,0 +491,0 @@ "disabled",

package.json

 {
   "name": "@zag-js/tooltip",
-  "version": "0.60.0",
+  "version": "0.61.0",
   "description": "Core logic for the tooltip widget implemented as a state machine",
@@ -30,9 +30,9 @@ "keywords": [
   "dependencies": {
-    "@zag-js/anatomy": "0.60.0",
-    "@zag-js/core": "0.60.0",
-    "@zag-js/popper": "0.60.0",
-    "@zag-js/dom-query": "0.60.0",
-    "@zag-js/dom-event": "0.60.0",
-    "@zag-js/utils": "0.60.0",
-    "@zag-js/types": "0.60.0"
+    "@zag-js/anatomy": "0.61.0",
+    "@zag-js/core": "0.61.0",
+    "@zag-js/popper": "0.61.0",
+    "@zag-js/dom-query": "0.61.0",
+    "@zag-js/dom-event": "0.61.0",
+    "@zag-js/utils": "0.61.0",
+    "@zag-js/types": "0.61.0"
   },
@@ -39,0 +39,0 @@ "devDependencies": {

src/tooltip.connect.ts

@@ -43,24 +43,33 @@ import { dataAttr } from "@zag-js/dom-query"
         "aria-describedby": open ? contentId : undefined,
-        onClick() {
+        onClick(event) {
+          if (event.defaultPrevented) return
           if (disabled) return
-          send("CLOSE")
+          if (!state.context.closeOnClick) return
+          send({ type: "CLOSE", src: "trigger.click" })
         },
-        onFocus() {
-          if (disabled || state.event.type === "POINTER_DOWN") return
-          send("OPEN")
+        onFocus(event) {
+          if (event.defaultPrevented) return
+          if (disabled) return
+          if (state.event.src === "trigger.pointerdown") return
+          send({ type: "OPEN", src: "trigger.focus" })
         },
-        onBlur() {
+        onBlur(event) {
+          if (event.defaultPrevented) return
           if (disabled) return
           if (id === store.id) {
-            send("CLOSE")
+            send({ type: "CLOSE", src: "trigger.blur" })
           }
         },
-        onPointerDown() {
-          if (disabled || !state.context.closeOnPointerDown) return
+        onPointerDown(event) {
+          if (event.defaultPrevented) return
+          if (disabled) return
+          if (!state.context.closeOnPointerDown) return
           if (id === store.id) {
-            send("CLOSE")
+            send({ type: "CLOSE", src: "trigger.pointerdown" })
           }
         },
         onPointerMove(event) {
-          if (disabled || event.pointerType === "touch") return
+          if (event.defaultPrevented) return
+          if (disabled) return
+          if (event.pointerType === "touch") return
           send("POINTER_MOVE")
@@ -67,0 +76,0 @@ },

src/tooltip.machine.ts

@@ -26,2 +26,3 @@ import { createMachine, guards, subscribe } from "@zag-js/core"
         closeOnScroll: true,
+        closeOnClick: true,
         ...ctx,
@@ -28,0 +29,0 @@ currentPlacement: undefined,

src/tooltip.props.ts

@@ -11,2 +11,3 @@ import { createProps } from "@zag-js/types"
   "closeOnScroll",
+  "closeOnClick",
   "dir",
@@ -13,0 +14,0 @@ "disabled",

src/tooltip.types.ts

@@ -59,2 +59,7 @@ import type { Machine, StateMachine as S } from "@zag-js/core"
   /**
+   * Whether the tooltip should close on click
+   * @default true
+   */
+  closeOnClick?: boolean
+  /**
    * Whether the tooltip's content is interactive.
@@ -61,0 +66,0 @@ * In this mode, the tooltip will remain open when user hovers over the content.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

113391

increased by3.47%

Lines of code

1728

increased by2.55%

Dependency changes

• + Added@zag-js/anatomy@0.61.0(transitive)

• + Added@zag-js/core@0.61.0(transitive)

• + Added@zag-js/dom-event@0.61.0(transitive)

• + Added@zag-js/dom-query@0.61.0(transitive)

• + Added@zag-js/popper@0.61.0(transitive)

• + Added@zag-js/store@0.61.0(transitive)

• + Added@zag-js/text-selection@0.61.0(transitive)

• + Added@zag-js/types@0.61.0(transitive)

• + Added@zag-js/utils@0.61.0(transitive)

• - Removed@zag-js/anatomy@0.60.0(transitive)

• - Removed@zag-js/core@0.60.0(transitive)

• - Removed@zag-js/dom-event@0.60.0(transitive)

• - Removed@zag-js/dom-query@0.60.0(transitive)

• - Removed@zag-js/popper@0.60.0(transitive)

• - Removed@zag-js/store@0.60.0(transitive)

• - Removed@zag-js/text-selection@0.60.0(transitive)

• - Removed@zag-js/types@0.60.0(transitive)

• - Removed@zag-js/utils@0.60.0(transitive)

• Updated@zag-js/anatomy@0.61.0

• Updated@zag-js/core@0.61.0

• Updated@zag-js/dom-event@0.61.0

• Updated@zag-js/dom-query@0.61.0

• Updated@zag-js/popper@0.61.0

• Updated@zag-js/types@0.61.0

• Updated@zag-js/utils@0.61.0