@zag-js/tooltip 0.80.0 → 0.81.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.d.mts +2 -2
  2. package/dist/index.d.ts +2 -2
  3. package/dist/index.js +42 -19
  4. package/dist/index.mjs +40 -17
  5. package/package.json +8 -9
package/dist/index.d.mts CHANGED
@@ -130,7 +130,7 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
130
130
 
131
131
  declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
132
132
 
133
- declare const props: ("dir" | "id" | "getRootNode" | "open" | "disabled" | "aria-label" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled")[];
134
- 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">];
133
+ declare const props: ("open" | "disabled" | "dir" | "id" | "aria-label" | "getRootNode" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled")[];
134
+ declare const splitProps: <Props extends Partial<UserDefinedContext>>(props: Props) => [Partial<UserDefinedContext>, Omit<Props, "open" | "disabled" | "dir" | "id" | "aria-label" | "getRootNode" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled">];
135
135
 
136
136
  export { type MachineApi as Api, type UserDefinedContext as Context, type ElementIds, type OpenChangeDetails, type Service, anatomy, connect, machine, props, splitProps };
package/dist/index.d.ts CHANGED
@@ -130,7 +130,7 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
130
130
 
131
131
  declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
132
132
 
133
- declare const props: ("dir" | "id" | "getRootNode" | "open" | "disabled" | "aria-label" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled")[];
134
- 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">];
133
+ declare const props: ("open" | "disabled" | "dir" | "id" | "aria-label" | "getRootNode" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled")[];
134
+ declare const splitProps: <Props extends Partial<UserDefinedContext>>(props: Props) => [Partial<UserDefinedContext>, Omit<Props, "open" | "disabled" | "dir" | "id" | "aria-label" | "getRootNode" | "ids" | "openDelay" | "closeDelay" | "closeOnPointerDown" | "closeOnEscape" | "closeOnScroll" | "closeOnClick" | "interactive" | "onOpenChange" | "positioning" | "open.controlled">];
135
135
 
136
136
  export { type MachineApi as Api, type UserDefinedContext as Context, type ElementIds, type OpenChangeDetails, type Service, anatomy, connect, machine, props, splitProps };
package/dist/index.js CHANGED
@@ -5,7 +5,6 @@ var domQuery = require('@zag-js/dom-query');
5
5
  var focusVisible = require('@zag-js/focus-visible');
6
6
  var popper = require('@zag-js/popper');
7
7
  var core = require('@zag-js/core');
8
- var domEvent = require('@zag-js/dom-event');
9
8
  var utils = require('@zag-js/utils');
10
9
  var types = require('@zag-js/types');
11
10
 
@@ -165,6 +164,7 @@ function machine(userContext) {
165
164
  interactive: false,
166
165
  closeOnScroll: true,
167
166
  closeOnClick: true,
167
+ disabled: false,
168
168
  ...ctx,
169
169
  currentPlacement: void 0,
170
170
  hasPointerMoveOpened: false,
@@ -186,10 +186,16 @@ function machine(userContext) {
186
186
  entry: ["clearGlobalId"],
187
187
  on: {
188
188
  "CONTROLLED.OPEN": "open",
189
- OPEN: {
190
- target: "open",
191
- actions: ["invokeOnOpen"]
192
- },
189
+ OPEN: [
190
+ {
191
+ guard: "isOpenControlled",
192
+ actions: ["invokeOnOpen"]
193
+ },
194
+ {
195
+ target: "open",
196
+ actions: ["invokeOnOpen"]
197
+ }
198
+ ],
193
199
  POINTER_LEAVE: {
194
200
  actions: ["clearPointerMoveOpened"]
195
201
  },
@@ -237,17 +243,25 @@ function machine(userContext) {
237
243
  POINTER_LEAVE: [
238
244
  {
239
245
  guard: "isOpenControlled",
240
- actions: ["clearPointerMoveOpened", "invokeOnClose"]
246
+ // We trigger toggleVisibility manually since the `ctx.open` has not changed yet (at this point)
247
+ actions: ["clearPointerMoveOpened", "invokeOnClose", "toggleVisibility"]
241
248
  },
242
249
  {
243
250
  target: "closed",
244
251
  actions: ["clearPointerMoveOpened", "invokeOnClose"]
245
252
  }
246
253
  ],
247
- CLOSE: {
248
- target: "closed",
249
- actions: ["invokeOnClose"]
250
- }
254
+ CLOSE: [
255
+ {
256
+ guard: "isOpenControlled",
257
+ // We trigger toggleVisibility manually since the `ctx.open` has not changed yet (at this point)
258
+ actions: ["invokeOnClose", "toggleVisibility"]
259
+ },
260
+ {
261
+ target: "closed",
262
+ actions: ["invokeOnClose"]
263
+ }
264
+ ]
251
265
  }
252
266
  },
253
267
  open: {
@@ -256,10 +270,16 @@ function machine(userContext) {
256
270
  entry: ["setGlobalId"],
257
271
  on: {
258
272
  "CONTROLLED.CLOSE": "closed",
259
- CLOSE: {
260
- target: "closed",
261
- actions: ["invokeOnClose"]
262
- },
273
+ CLOSE: [
274
+ {
275
+ guard: "isOpenControlled",
276
+ actions: ["invokeOnClose"]
277
+ },
278
+ {
279
+ target: "closed",
280
+ actions: ["invokeOnClose"]
281
+ }
282
+ ],
263
283
  POINTER_LEAVE: [
264
284
  {
265
285
  guard: "isVisible",
@@ -316,7 +336,8 @@ function machine(userContext) {
316
336
  POINTER_MOVE: [
317
337
  {
318
338
  guard: "isOpenControlled",
319
- actions: ["setPointerMoveOpened", "invokeOnOpen"]
339
+ // We trigger toggleVisibility manually since the `ctx.open` has not changed yet (at this point)
340
+ actions: ["setPointerMoveOpened", "invokeOnOpen", "toggleVisibility"]
320
341
  },
321
342
  {
322
343
  target: "open",
@@ -352,7 +373,7 @@ function machine(userContext) {
352
373
  },
353
374
  trackPointerlockChange(ctx2, _evt, { send }) {
354
375
  const onChange = () => send({ type: "CLOSE", src: "pointerlock:change" });
355
- return domEvent.addDomEvent(dom.getDoc(ctx2), "pointerlockchange", onChange, false);
376
+ return domQuery.addDomEvent(dom.getDoc(ctx2), "pointerlockchange", onChange, false);
356
377
  },
357
378
  trackScroll(ctx2, _evt, { send }) {
358
379
  if (!ctx2.closeOnScroll) return;
@@ -363,7 +384,7 @@ function machine(userContext) {
363
384
  const onScroll = () => {
364
385
  send({ type: "CLOSE", src: "scroll" });
365
386
  };
366
- return domEvent.addDomEvent(overflowParent, "scroll", onScroll, { passive: true, capture: true });
387
+ return domQuery.addDomEvent(overflowParent, "scroll", onScroll, { passive: true, capture: true });
367
388
  });
368
389
  return () => {
369
390
  cleanups.forEach((fn) => fn?.());
@@ -384,7 +405,7 @@ function machine(userContext) {
384
405
  event.stopPropagation();
385
406
  send({ type: "CLOSE", src: "keydown.escape" });
386
407
  };
387
- return domEvent.addDomEvent(dom.getDoc(ctx2), "keydown", onKeyDown, true);
408
+ return domQuery.addDomEvent(dom.getDoc(ctx2), "keydown", onKeyDown, true);
388
409
  }
389
410
  },
390
411
  actions: {
@@ -419,7 +440,9 @@ function machine(userContext) {
419
440
  });
420
441
  },
421
442
  toggleVisibility(ctx2, evt, { send }) {
422
- send({ type: ctx2.open ? "CONTROLLED.OPEN" : "CONTROLLED.CLOSE", previousEvent: evt });
443
+ queueMicrotask(() => {
444
+ send({ type: ctx2.open ? "CONTROLLED.OPEN" : "CONTROLLED.CLOSE", previousEvent: evt });
445
+ });
423
446
  },
424
447
  setPointerMoveOpened(ctx2) {
425
448
  ctx2.hasPointerMoveOpened = true;
package/dist/index.mjs CHANGED
@@ -1,9 +1,8 @@
1
1
  import { createAnatomy } from '@zag-js/anatomy';
2
- import { createScope, dataAttr, getOverflowAncestors, isComposingEvent } from '@zag-js/dom-query';
2
+ import { createScope, dataAttr, addDomEvent, getOverflowAncestors, isComposingEvent } from '@zag-js/dom-query';
3
3
  import { isFocusVisible, trackFocusVisible } from '@zag-js/focus-visible';
4
4
  import { getPlacementStyles, getPlacement } from '@zag-js/popper';
5
5
  import { proxy, createMachine, subscribe, guards } from '@zag-js/core';
6
- import { addDomEvent } from '@zag-js/dom-event';
7
6
  import { createSplitProps, compact } from '@zag-js/utils';
8
7
  import { createProps } from '@zag-js/types';
9
8
 
@@ -163,6 +162,7 @@ function machine(userContext) {
163
162
  interactive: false,
164
163
  closeOnScroll: true,
165
164
  closeOnClick: true,
165
+ disabled: false,
166
166
  ...ctx,
167
167
  currentPlacement: void 0,
168
168
  hasPointerMoveOpened: false,
@@ -184,10 +184,16 @@ function machine(userContext) {
184
184
  entry: ["clearGlobalId"],
185
185
  on: {
186
186
  "CONTROLLED.OPEN": "open",
187
- OPEN: {
188
- target: "open",
189
- actions: ["invokeOnOpen"]
190
- },
187
+ OPEN: [
188
+ {
189
+ guard: "isOpenControlled",
190
+ actions: ["invokeOnOpen"]
191
+ },
192
+ {
193
+ target: "open",
194
+ actions: ["invokeOnOpen"]
195
+ }
196
+ ],
191
197
  POINTER_LEAVE: {
192
198
  actions: ["clearPointerMoveOpened"]
193
199
  },
@@ -235,17 +241,25 @@ function machine(userContext) {
235
241
  POINTER_LEAVE: [
236
242
  {
237
243
  guard: "isOpenControlled",
238
- actions: ["clearPointerMoveOpened", "invokeOnClose"]
244
+ // We trigger toggleVisibility manually since the `ctx.open` has not changed yet (at this point)
245
+ actions: ["clearPointerMoveOpened", "invokeOnClose", "toggleVisibility"]
239
246
  },
240
247
  {
241
248
  target: "closed",
242
249
  actions: ["clearPointerMoveOpened", "invokeOnClose"]
243
250
  }
244
251
  ],
245
- CLOSE: {
246
- target: "closed",
247
- actions: ["invokeOnClose"]
248
- }
252
+ CLOSE: [
253
+ {
254
+ guard: "isOpenControlled",
255
+ // We trigger toggleVisibility manually since the `ctx.open` has not changed yet (at this point)
256
+ actions: ["invokeOnClose", "toggleVisibility"]
257
+ },
258
+ {
259
+ target: "closed",
260
+ actions: ["invokeOnClose"]
261
+ }
262
+ ]
249
263
  }
250
264
  },
251
265
  open: {
@@ -254,10 +268,16 @@ function machine(userContext) {
254
268
  entry: ["setGlobalId"],
255
269
  on: {
256
270
  "CONTROLLED.CLOSE": "closed",
257
- CLOSE: {
258
- target: "closed",
259
- actions: ["invokeOnClose"]
260
- },
271
+ CLOSE: [
272
+ {
273
+ guard: "isOpenControlled",
274
+ actions: ["invokeOnClose"]
275
+ },
276
+ {
277
+ target: "closed",
278
+ actions: ["invokeOnClose"]
279
+ }
280
+ ],
261
281
  POINTER_LEAVE: [
262
282
  {
263
283
  guard: "isVisible",
@@ -314,7 +334,8 @@ function machine(userContext) {
314
334
  POINTER_MOVE: [
315
335
  {
316
336
  guard: "isOpenControlled",
317
- actions: ["setPointerMoveOpened", "invokeOnOpen"]
337
+ // We trigger toggleVisibility manually since the `ctx.open` has not changed yet (at this point)
338
+ actions: ["setPointerMoveOpened", "invokeOnOpen", "toggleVisibility"]
318
339
  },
319
340
  {
320
341
  target: "open",
@@ -417,7 +438,9 @@ function machine(userContext) {
417
438
  });
418
439
  },
419
440
  toggleVisibility(ctx2, evt, { send }) {
420
- send({ type: ctx2.open ? "CONTROLLED.OPEN" : "CONTROLLED.CLOSE", previousEvent: evt });
441
+ queueMicrotask(() => {
442
+ send({ type: ctx2.open ? "CONTROLLED.OPEN" : "CONTROLLED.CLOSE", previousEvent: evt });
443
+ });
421
444
  },
422
445
  setPointerMoveOpened(ctx2) {
423
446
  ctx2.hasPointerMoveOpened = true;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/tooltip",
3
- "version": "0.80.0",
3
+ "version": "0.81.1",
4
4
  "description": "Core logic for the tooltip widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -26,14 +26,13 @@
26
26
  "url": "https://github.com/chakra-ui/zag/issues"
27
27
  },
28
28
  "dependencies": {
29
- "@zag-js/anatomy": "0.80.0",
30
- "@zag-js/core": "0.80.0",
31
- "@zag-js/popper": "0.80.0",
32
- "@zag-js/focus-visible": "0.80.0",
33
- "@zag-js/dom-query": "0.80.0",
34
- "@zag-js/dom-event": "0.80.0",
35
- "@zag-js/types": "0.80.0",
36
- "@zag-js/utils": "0.80.0"
29
+ "@zag-js/anatomy": "0.81.1",
30
+ "@zag-js/core": "0.81.1",
31
+ "@zag-js/popper": "0.81.1",
32
+ "@zag-js/focus-visible": "0.81.1",
33
+ "@zag-js/dom-query": "0.81.1",
34
+ "@zag-js/utils": "0.81.1",
35
+ "@zag-js/types": "0.81.1"
37
36
  },
38
37
  "devDependencies": {
39
38
  "clean-package": "2.2.0"