@zag-js/tooltip 0.2.13 → 0.3.0

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.
@@ -20,7 +20,6 @@ function connect(state, send, normalize) {
20
20
  const contentId = dom.getContentId(state.context);
21
21
  const isDisabled = state.context.disabled;
22
22
  const popperStyles = getPlacementStyles({
23
- measured: !!state.context.isPlacementComplete,
24
23
  placement: state.context.currentPlacement
25
24
  });
26
25
  return {
@@ -49,6 +48,12 @@ function connect(state, send, normalize) {
49
48
  exit: store.id === null
50
49
  };
51
50
  },
51
+ /**
52
+ * Function to reposition the popover
53
+ */
54
+ setPositioning(options) {
55
+ send({ type: "SET_POSITIONING", options });
56
+ },
52
57
  triggerProps: normalize.button({
53
58
  ...parts.trigger.attrs,
54
59
  id: triggerId,
@@ -79,7 +79,7 @@ function machine(userContext) {
79
79
  "trackDisabledTriggerOnSafari",
80
80
  "trackScroll",
81
81
  "trackPointerlockChange",
82
- "computePlacement"
82
+ "trackPositioning"
83
83
  ],
84
84
  entry: ["setGlobalId", "invokeOnOpen"],
85
85
  on: {
@@ -102,12 +102,15 @@ function machine(userContext) {
102
102
  guard: "closeOnPointerDown",
103
103
  target: "closed"
104
104
  },
105
- CLICK: "closed"
105
+ CLICK: "closed",
106
+ SET_POSITIONING: {
107
+ actions: "setPositioning"
108
+ }
106
109
  }
107
110
  },
108
111
  closing: {
109
112
  tags: ["open"],
110
- activities: ["trackStore", "computePlacement"],
113
+ activities: ["trackStore", "trackPositioning"],
111
114
  after: {
112
115
  CLOSE_DELAY: "closed"
113
116
  },
@@ -124,7 +127,7 @@ function machine(userContext) {
124
127
  },
125
128
  {
126
129
  activities: {
127
- computePlacement(ctx2) {
130
+ trackPositioning(ctx2) {
128
131
  ctx2.currentPlacement = ctx2.positioning.placement;
129
132
  let cleanup;
130
133
  raf(() => {
@@ -132,15 +135,13 @@ function machine(userContext) {
132
135
  ...ctx2.positioning,
133
136
  onComplete(data) {
134
137
  ctx2.currentPlacement = data.placement;
135
- ctx2.isPlacementComplete = true;
136
138
  },
137
139
  onCleanup() {
138
140
  ctx2.currentPlacement = void 0;
139
- ctx2.isPlacementComplete = false;
140
141
  }
141
142
  });
142
143
  });
143
- return cleanup;
144
+ return () => cleanup?.();
144
145
  },
145
146
  trackPointerlockChange(ctx2, _evt, { send }) {
146
147
  const onChange = () => send("POINTER_LOCK_CHANGE");
@@ -209,6 +210,15 @@ function machine(userContext) {
209
210
  if (ctx2.disabled) {
210
211
  send("CLOSE");
211
212
  }
213
+ },
214
+ setPositioning(ctx2, evt) {
215
+ raf(() => {
216
+ getPlacement(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
217
+ ...ctx2.positioning,
218
+ ...evt.options,
219
+ listeners: false
220
+ });
221
+ });
212
222
  }
213
223
  },
214
224
  guards: {
package/dist/index.d.ts CHANGED
@@ -3,6 +3,6 @@ export { connect } from './tooltip.connect.js';
3
3
  export { machine } from './tooltip.machine.js';
4
4
  export { UserDefinedContext as Context } from './tooltip.types.js';
5
5
  import '@zag-js/anatomy';
6
+ import '@zag-js/popper';
6
7
  import '@zag-js/types';
7
8
  import '@zag-js/core';
8
- import '@zag-js/popper';
package/dist/index.js CHANGED
@@ -70,7 +70,6 @@ function connect(state, send, normalize) {
70
70
  const contentId = dom.getContentId(state.context);
71
71
  const isDisabled = state.context.disabled;
72
72
  const popperStyles = (0, import_popper.getPlacementStyles)({
73
- measured: !!state.context.isPlacementComplete,
74
73
  placement: state.context.currentPlacement
75
74
  });
76
75
  return {
@@ -99,6 +98,12 @@ function connect(state, send, normalize) {
99
98
  exit: store.id === null
100
99
  };
101
100
  },
101
+ /**
102
+ * Function to reposition the popover
103
+ */
104
+ setPositioning(options) {
105
+ send({ type: "SET_POSITIONING", options });
106
+ },
102
107
  triggerProps: normalize.button({
103
108
  ...parts.trigger.attrs,
104
109
  id: triggerId,
@@ -252,7 +257,7 @@ function machine(userContext) {
252
257
  "trackDisabledTriggerOnSafari",
253
258
  "trackScroll",
254
259
  "trackPointerlockChange",
255
- "computePlacement"
260
+ "trackPositioning"
256
261
  ],
257
262
  entry: ["setGlobalId", "invokeOnOpen"],
258
263
  on: {
@@ -275,12 +280,15 @@ function machine(userContext) {
275
280
  guard: "closeOnPointerDown",
276
281
  target: "closed"
277
282
  },
278
- CLICK: "closed"
283
+ CLICK: "closed",
284
+ SET_POSITIONING: {
285
+ actions: "setPositioning"
286
+ }
279
287
  }
280
288
  },
281
289
  closing: {
282
290
  tags: ["open"],
283
- activities: ["trackStore", "computePlacement"],
291
+ activities: ["trackStore", "trackPositioning"],
284
292
  after: {
285
293
  CLOSE_DELAY: "closed"
286
294
  },
@@ -297,7 +305,7 @@ function machine(userContext) {
297
305
  },
298
306
  {
299
307
  activities: {
300
- computePlacement(ctx2) {
308
+ trackPositioning(ctx2) {
301
309
  ctx2.currentPlacement = ctx2.positioning.placement;
302
310
  let cleanup;
303
311
  (0, import_dom_query3.raf)(() => {
@@ -305,15 +313,13 @@ function machine(userContext) {
305
313
  ...ctx2.positioning,
306
314
  onComplete(data) {
307
315
  ctx2.currentPlacement = data.placement;
308
- ctx2.isPlacementComplete = true;
309
316
  },
310
317
  onCleanup() {
311
318
  ctx2.currentPlacement = void 0;
312
- ctx2.isPlacementComplete = false;
313
319
  }
314
320
  });
315
321
  });
316
- return cleanup;
322
+ return () => cleanup?.();
317
323
  },
318
324
  trackPointerlockChange(ctx2, _evt, { send }) {
319
325
  const onChange = () => send("POINTER_LOCK_CHANGE");
@@ -382,6 +388,15 @@ function machine(userContext) {
382
388
  if (ctx2.disabled) {
383
389
  send("CLOSE");
384
390
  }
391
+ },
392
+ setPositioning(ctx2, evt) {
393
+ (0, import_dom_query3.raf)(() => {
394
+ (0, import_popper2.getPlacement)(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
395
+ ...ctx2.positioning,
396
+ ...evt.options,
397
+ listeners: false
398
+ });
399
+ });
385
400
  }
386
401
  },
387
402
  guards: {
package/dist/index.mjs CHANGED
@@ -1,12 +1,12 @@
1
1
  import {
2
2
  connect
3
- } from "./chunk-W3OSVXCZ.mjs";
3
+ } from "./chunk-CTBIJ67E.mjs";
4
4
  import {
5
5
  anatomy
6
6
  } from "./chunk-RRQRIZBA.mjs";
7
7
  import {
8
8
  machine
9
- } from "./chunk-463EFHFN.mjs";
9
+ } from "./chunk-SAHH7E72.mjs";
10
10
  import "./chunk-3LXHM7BW.mjs";
11
11
  import "./chunk-GQYNO326.mjs";
12
12
  export {
@@ -1,7 +1,7 @@
1
+ import { PositioningOptions } from '@zag-js/popper';
1
2
  import { PropTypes, NormalizeProps } from '@zag-js/types';
2
3
  import { State, Send } from './tooltip.types.js';
3
4
  import '@zag-js/core';
4
- import '@zag-js/popper';
5
5
 
6
6
  declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
7
7
  /**
@@ -23,6 +23,10 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
23
23
  enter: boolean;
24
24
  exit: boolean;
25
25
  };
26
+ /**
27
+ * Function to reposition the popover
28
+ */
29
+ setPositioning(options: Partial<PositioningOptions>): void;
26
30
  triggerProps: T["button"];
27
31
  arrowProps: T["element"];
28
32
  arrowTipProps: T["element"];
@@ -66,7 +66,6 @@ function connect(state, send, normalize) {
66
66
  const contentId = dom.getContentId(state.context);
67
67
  const isDisabled = state.context.disabled;
68
68
  const popperStyles = (0, import_popper.getPlacementStyles)({
69
- measured: !!state.context.isPlacementComplete,
70
69
  placement: state.context.currentPlacement
71
70
  });
72
71
  return {
@@ -95,6 +94,12 @@ function connect(state, send, normalize) {
95
94
  exit: store.id === null
96
95
  };
97
96
  },
97
+ /**
98
+ * Function to reposition the popover
99
+ */
100
+ setPositioning(options) {
101
+ send({ type: "SET_POSITIONING", options });
102
+ },
98
103
  triggerProps: normalize.button({
99
104
  ...parts.trigger.attrs,
100
105
  id: triggerId,
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  connect
3
- } from "./chunk-W3OSVXCZ.mjs";
3
+ } from "./chunk-CTBIJ67E.mjs";
4
4
  import "./chunk-RRQRIZBA.mjs";
5
5
  import "./chunk-3LXHM7BW.mjs";
6
6
  import "./chunk-GQYNO326.mjs";
@@ -123,7 +123,7 @@ function machine(userContext) {
123
123
  "trackDisabledTriggerOnSafari",
124
124
  "trackScroll",
125
125
  "trackPointerlockChange",
126
- "computePlacement"
126
+ "trackPositioning"
127
127
  ],
128
128
  entry: ["setGlobalId", "invokeOnOpen"],
129
129
  on: {
@@ -146,12 +146,15 @@ function machine(userContext) {
146
146
  guard: "closeOnPointerDown",
147
147
  target: "closed"
148
148
  },
149
- CLICK: "closed"
149
+ CLICK: "closed",
150
+ SET_POSITIONING: {
151
+ actions: "setPositioning"
152
+ }
150
153
  }
151
154
  },
152
155
  closing: {
153
156
  tags: ["open"],
154
- activities: ["trackStore", "computePlacement"],
157
+ activities: ["trackStore", "trackPositioning"],
155
158
  after: {
156
159
  CLOSE_DELAY: "closed"
157
160
  },
@@ -168,7 +171,7 @@ function machine(userContext) {
168
171
  },
169
172
  {
170
173
  activities: {
171
- computePlacement(ctx2) {
174
+ trackPositioning(ctx2) {
172
175
  ctx2.currentPlacement = ctx2.positioning.placement;
173
176
  let cleanup;
174
177
  (0, import_dom_query2.raf)(() => {
@@ -176,15 +179,13 @@ function machine(userContext) {
176
179
  ...ctx2.positioning,
177
180
  onComplete(data) {
178
181
  ctx2.currentPlacement = data.placement;
179
- ctx2.isPlacementComplete = true;
180
182
  },
181
183
  onCleanup() {
182
184
  ctx2.currentPlacement = void 0;
183
- ctx2.isPlacementComplete = false;
184
185
  }
185
186
  });
186
187
  });
187
- return cleanup;
188
+ return () => cleanup?.();
188
189
  },
189
190
  trackPointerlockChange(ctx2, _evt, { send }) {
190
191
  const onChange = () => send("POINTER_LOCK_CHANGE");
@@ -253,6 +254,15 @@ function machine(userContext) {
253
254
  if (ctx2.disabled) {
254
255
  send("CLOSE");
255
256
  }
257
+ },
258
+ setPositioning(ctx2, evt) {
259
+ (0, import_dom_query2.raf)(() => {
260
+ (0, import_popper.getPlacement)(dom.getTriggerEl(ctx2), dom.getPositionerEl(ctx2), {
261
+ ...ctx2.positioning,
262
+ ...evt.options,
263
+ listeners: false
264
+ });
265
+ });
256
266
  }
257
267
  },
258
268
  guards: {
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  machine
3
- } from "./chunk-463EFHFN.mjs";
3
+ } from "./chunk-SAHH7E72.mjs";
4
4
  import "./chunk-3LXHM7BW.mjs";
5
5
  import "./chunk-GQYNO326.mjs";
6
6
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/tooltip",
3
- "version": "0.2.13",
3
+ "version": "0.3.0",
4
4
  "description": "Core logic for the tooltip widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -26,14 +26,14 @@
26
26
  "url": "https://github.com/chakra-ui/zag/issues"
27
27
  },
28
28
  "dependencies": {
29
+ "@zag-js/core": "0.2.12",
30
+ "@zag-js/utils": "0.3.4",
29
31
  "@zag-js/anatomy": "0.1.4",
30
- "@zag-js/core": "0.2.10",
31
- "@zag-js/popper": "0.2.5",
32
- "@zag-js/dom-query": "0.1.4",
32
+ "@zag-js/popper": "0.2.7",
33
33
  "@zag-js/dom-event": "0.0.1",
34
- "@zag-js/utils": "0.3.3",
35
34
  "@zag-js/visually-hidden": "0.0.1",
36
- "@zag-js/types": "0.3.4"
35
+ "@zag-js/types": "0.3.4",
36
+ "@zag-js/dom-query": "0.1.4"
37
37
  },
38
38
  "devDependencies": {
39
39
  "clean-package": "2.2.0"