@zag-js/popover 2.0.0-next.1 → 2.0.0-next.2

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.
@@ -36,12 +36,16 @@ module.exports = __toCommonJS(popover_connect_exports);
36
36
  var import_dismissable = require("@zag-js/dismissable");
37
37
  var import_dom_query = require("@zag-js/dom-query");
38
38
  var import_popper = require("@zag-js/popper");
39
+ var import_utils = require("@zag-js/utils");
39
40
  var import_popover = require("./popover.anatomy.js");
40
41
  var dom = __toESM(require("./popover.dom.js"));
42
+ var defaultTranslations = {
43
+ closeTriggerLabel: "close"
44
+ };
41
45
  function connect(service, normalize) {
42
46
  const { state, context, send, prop, scope } = service;
43
47
  const layer = context.get("layer");
44
- const translations = prop("translations");
48
+ const translations = (0, import_utils.mergeWithDefault)(defaultTranslations, prop("translations"));
45
49
  const open = state.matches("open");
46
50
  const currentPlacement = context.get("currentPlacement");
47
51
  const currentPlacementSide = currentPlacement ? (0, import_popper.getPlacementSide)(currentPlacement) : void 0;
@@ -2,12 +2,16 @@
2
2
  import { getDismissableLayerAttrs, getDismissableLayerStyle } from "@zag-js/dismissable";
3
3
  import { ariaAttr, dataAttr, isLeftClick, isSafari } from "@zag-js/dom-query";
4
4
  import { getPlacementSide, getPlacementStyles } from "@zag-js/popper";
5
+ import { mergeWithDefault } from "@zag-js/utils";
5
6
  import { parts } from "./popover.anatomy.mjs";
6
7
  import * as dom from "./popover.dom.mjs";
8
+ var defaultTranslations = {
9
+ closeTriggerLabel: "close"
10
+ };
7
11
  function connect(service, normalize) {
8
12
  const { state, context, send, prop, scope } = service;
9
13
  const layer = context.get("layer");
10
- const translations = prop("translations");
14
+ const translations = mergeWithDefault(defaultTranslations, prop("translations"));
11
15
  const open = state.matches("open");
12
16
  const currentPlacement = context.get("currentPlacement");
13
17
  const currentPlacementSide = currentPlacement ? getPlacementSide(currentPlacement) : void 0;
@@ -50,10 +50,6 @@ var machine = (0, import_core.createMachine)({
50
50
  modal: false,
51
51
  restoreFocus: true,
52
52
  ...props,
53
- translations: {
54
- closeTriggerLabel: "close",
55
- ...props.translations
56
- },
57
53
  positioning: {
58
54
  placement: "bottom",
59
55
  ...props.positioning
@@ -185,93 +181,107 @@ var machine = (0, import_core.createMachine)({
185
181
  }
186
182
  });
187
183
  },
188
- trackDismissableElement({ send, prop, scope, context }) {
189
- const getContentEl2 = () => dom.getContentEl(scope);
190
- let restoreFocus = true;
191
- return (0, import_dismissable.trackDismissableElement)(getContentEl2, {
192
- type: "popover",
193
- pointerBlocking: prop("modal"),
194
- onLayerChange(layer) {
195
- context.set("layer", layer);
196
- },
197
- exclude: dom.getTriggerEls(scope),
198
- defer: true,
199
- onEscapeKeyDown(event) {
200
- prop("onEscapeKeyDown")?.(event);
201
- if (prop("closeOnEscape")) return;
202
- event.preventDefault();
203
- },
204
- onInteractOutside(event) {
205
- prop("onInteractOutside")?.(event);
206
- if (event.defaultPrevented) return;
207
- restoreFocus = !(event.detail.focusable || event.detail.contextmenu);
208
- if (!prop("closeOnInteractOutside")) {
184
+ trackDismissableElement({ send, prop, scope, context, watchEffect }) {
185
+ return watchEffect([() => prop("modal")], () => {
186
+ const getContentEl2 = () => dom.getContentEl(scope);
187
+ let restoreFocus = true;
188
+ return (0, import_dismissable.trackDismissableElement)(getContentEl2, {
189
+ type: "popover",
190
+ pointerBlocking: prop("modal"),
191
+ onLayerChange(layer) {
192
+ context.set("layer", layer);
193
+ },
194
+ exclude: dom.getTriggerEls(scope),
195
+ defer: true,
196
+ onEscapeKeyDown(event) {
197
+ prop("onEscapeKeyDown")?.(event);
198
+ if (prop("closeOnEscape")) return;
209
199
  event.preventDefault();
200
+ },
201
+ onInteractOutside(event) {
202
+ prop("onInteractOutside")?.(event);
203
+ if (event.defaultPrevented) return;
204
+ restoreFocus = !(event.detail.focusable || event.detail.contextmenu);
205
+ if (!prop("closeOnInteractOutside")) {
206
+ event.preventDefault();
207
+ }
208
+ },
209
+ onPointerDownOutside: prop("onPointerDownOutside"),
210
+ onFocusOutside: prop("onFocusOutside"),
211
+ persistentElements: prop("persistentElements"),
212
+ onRequestDismiss: prop("onRequestDismiss"),
213
+ onDismiss() {
214
+ send({ type: "CLOSE", src: "interact-outside", restoreFocus });
210
215
  }
211
- },
212
- onPointerDownOutside: prop("onPointerDownOutside"),
213
- onFocusOutside: prop("onFocusOutside"),
214
- persistentElements: prop("persistentElements"),
215
- onRequestDismiss: prop("onRequestDismiss"),
216
- onDismiss() {
217
- send({ type: "CLOSE", src: "interact-outside", restoreFocus });
218
- }
216
+ });
219
217
  });
220
218
  },
221
- proxyTabFocus({ prop, scope, context }) {
222
- if (prop("modal")) return;
223
- const getContentEl2 = () => dom.getContentEl(scope);
224
- let cleanup;
225
- const rafCleanup = (0, import_dom_query.raf)(() => {
226
- const triggerEl = dom.getActiveTriggerEl(scope, context.get("triggerValue"));
227
- const contentEl = getContentEl2();
228
- if (!triggerEl || !contentEl || (0, import_dom_query.contains)(triggerEl.parentElement, contentEl)) return;
229
- cleanup = (0, import_dom_query.proxyTabFocus)(getContentEl2, {
230
- triggerElement: triggerEl,
231
- getShadowRoot: true,
232
- onFocus(el) {
233
- el.focus({ preventScroll: true });
234
- }
219
+ proxyTabFocus({ prop, scope, context, watchEffect }) {
220
+ return watchEffect([() => prop("modal")], () => {
221
+ if (prop("modal")) return;
222
+ const getContentEl2 = () => dom.getContentEl(scope);
223
+ let cleanup;
224
+ const rafCleanup = (0, import_dom_query.raf)(() => {
225
+ const triggerEl = dom.getActiveTriggerEl(scope, context.get("triggerValue"));
226
+ const contentEl = getContentEl2();
227
+ if (!triggerEl || !contentEl || (0, import_dom_query.contains)(triggerEl.parentElement, contentEl)) return;
228
+ cleanup = (0, import_dom_query.proxyTabFocus)(getContentEl2, {
229
+ triggerElement: triggerEl,
230
+ getShadowRoot: true,
231
+ onFocus(el) {
232
+ el.focus({ preventScroll: true });
233
+ }
234
+ });
235
235
  });
236
+ return () => {
237
+ rafCleanup();
238
+ cleanup?.();
239
+ };
236
240
  });
237
- return () => {
238
- rafCleanup();
239
- cleanup?.();
240
- };
241
241
  },
242
- hideContentBelow({ prop, scope, context }) {
243
- if (!prop("modal")) return;
244
- const getElements = () => [dom.getContentEl(scope), dom.getActiveTriggerEl(scope, context.get("triggerValue"))];
245
- return (0, import_aria_hidden.ariaHidden)(getElements, { defer: true });
242
+ hideContentBelow({ prop, scope, context, watchEffect }) {
243
+ return watchEffect([() => prop("modal")], () => {
244
+ if (!prop("modal")) return;
245
+ const getElements = () => [
246
+ dom.getContentEl(scope),
247
+ dom.getActiveTriggerEl(scope, context.get("triggerValue"))
248
+ ];
249
+ return (0, import_aria_hidden.ariaHidden)(getElements, { defer: true });
250
+ });
246
251
  },
247
- preventScroll({ prop, scope }) {
248
- if (!prop("modal")) return;
249
- return (0, import_remove_scroll.preventBodyScroll)(scope.getDoc());
252
+ preventScroll({ prop, scope, watchEffect }) {
253
+ return watchEffect([() => prop("modal")], () => {
254
+ if (!prop("modal")) return;
255
+ return (0, import_remove_scroll.preventBodyScroll)(scope.getDoc());
256
+ });
250
257
  },
251
- trapFocus({ prop, scope, context }) {
252
- if (!prop("modal")) return;
253
- const contentEl = () => dom.getContentEl(scope);
254
- return (0, import_focus_trap.trapFocus)(contentEl, {
255
- preventScroll: true,
256
- returnFocusOnDeactivate: !!prop("restoreFocus"),
257
- initialFocus: () => (0, import_dom_query.getInitialFocus)({
258
- root: dom.getContentEl(scope),
259
- getInitialEl: prop("initialFocusEl"),
260
- enabled: prop("autoFocus")
261
- }),
262
- setReturnFocus: (el) => {
263
- const finalFocusEl = prop("finalFocusEl")?.();
264
- if (finalFocusEl) return finalFocusEl;
265
- const triggerValue = context.get("triggerValue");
266
- if (triggerValue) {
267
- const activeTriggerEl = dom.getActiveTriggerEl(scope, triggerValue);
268
- if (activeTriggerEl) return activeTriggerEl;
269
- }
270
- const fallbackTrigger = dom.getTriggerEls(scope)[0];
271
- if (fallbackTrigger) return fallbackTrigger;
272
- return el;
273
- },
274
- getShadowRoot: true
258
+ trapFocus({ prop, scope, context, watchEffect }) {
259
+ return watchEffect([() => prop("modal")], () => {
260
+ if (!prop("modal")) return;
261
+ const contentEl = () => dom.getContentEl(scope);
262
+ const destroy = (0, import_focus_trap.trapFocus)(contentEl, {
263
+ preventScroll: true,
264
+ returnFocusOnDeactivate: !!prop("restoreFocus"),
265
+ initialFocus: () => (0, import_dom_query.getInitialFocus)({
266
+ root: dom.getContentEl(scope),
267
+ getInitialEl: prop("initialFocusEl"),
268
+ enabled: prop("autoFocus")
269
+ }),
270
+ setReturnFocus: (el) => {
271
+ const finalFocusEl = prop("finalFocusEl")?.();
272
+ if (finalFocusEl) return finalFocusEl;
273
+ const triggerValue = context.get("triggerValue");
274
+ if (triggerValue) {
275
+ const activeTriggerEl = dom.getActiveTriggerEl(scope, triggerValue);
276
+ if (activeTriggerEl) return activeTriggerEl;
277
+ }
278
+ const fallbackTrigger = dom.getTriggerEls(scope)[0];
279
+ if (fallbackTrigger) return fallbackTrigger;
280
+ return el;
281
+ },
282
+ getShadowRoot: true
283
+ });
284
+ return () => destroy({ returnFocus: !!prop("restoreFocus") && !!prop("modal") });
275
285
  });
276
286
  }
277
287
  },
@@ -16,10 +16,6 @@ var machine = createMachine({
16
16
  modal: false,
17
17
  restoreFocus: true,
18
18
  ...props,
19
- translations: {
20
- closeTriggerLabel: "close",
21
- ...props.translations
22
- },
23
19
  positioning: {
24
20
  placement: "bottom",
25
21
  ...props.positioning
@@ -151,93 +147,107 @@ var machine = createMachine({
151
147
  }
152
148
  });
153
149
  },
154
- trackDismissableElement({ send, prop, scope, context }) {
155
- const getContentEl2 = () => dom.getContentEl(scope);
156
- let restoreFocus = true;
157
- return trackDismissableElement(getContentEl2, {
158
- type: "popover",
159
- pointerBlocking: prop("modal"),
160
- onLayerChange(layer) {
161
- context.set("layer", layer);
162
- },
163
- exclude: dom.getTriggerEls(scope),
164
- defer: true,
165
- onEscapeKeyDown(event) {
166
- prop("onEscapeKeyDown")?.(event);
167
- if (prop("closeOnEscape")) return;
168
- event.preventDefault();
169
- },
170
- onInteractOutside(event) {
171
- prop("onInteractOutside")?.(event);
172
- if (event.defaultPrevented) return;
173
- restoreFocus = !(event.detail.focusable || event.detail.contextmenu);
174
- if (!prop("closeOnInteractOutside")) {
150
+ trackDismissableElement({ send, prop, scope, context, watchEffect }) {
151
+ return watchEffect([() => prop("modal")], () => {
152
+ const getContentEl2 = () => dom.getContentEl(scope);
153
+ let restoreFocus = true;
154
+ return trackDismissableElement(getContentEl2, {
155
+ type: "popover",
156
+ pointerBlocking: prop("modal"),
157
+ onLayerChange(layer) {
158
+ context.set("layer", layer);
159
+ },
160
+ exclude: dom.getTriggerEls(scope),
161
+ defer: true,
162
+ onEscapeKeyDown(event) {
163
+ prop("onEscapeKeyDown")?.(event);
164
+ if (prop("closeOnEscape")) return;
175
165
  event.preventDefault();
166
+ },
167
+ onInteractOutside(event) {
168
+ prop("onInteractOutside")?.(event);
169
+ if (event.defaultPrevented) return;
170
+ restoreFocus = !(event.detail.focusable || event.detail.contextmenu);
171
+ if (!prop("closeOnInteractOutside")) {
172
+ event.preventDefault();
173
+ }
174
+ },
175
+ onPointerDownOutside: prop("onPointerDownOutside"),
176
+ onFocusOutside: prop("onFocusOutside"),
177
+ persistentElements: prop("persistentElements"),
178
+ onRequestDismiss: prop("onRequestDismiss"),
179
+ onDismiss() {
180
+ send({ type: "CLOSE", src: "interact-outside", restoreFocus });
176
181
  }
177
- },
178
- onPointerDownOutside: prop("onPointerDownOutside"),
179
- onFocusOutside: prop("onFocusOutside"),
180
- persistentElements: prop("persistentElements"),
181
- onRequestDismiss: prop("onRequestDismiss"),
182
- onDismiss() {
183
- send({ type: "CLOSE", src: "interact-outside", restoreFocus });
184
- }
182
+ });
185
183
  });
186
184
  },
187
- proxyTabFocus({ prop, scope, context }) {
188
- if (prop("modal")) return;
189
- const getContentEl2 = () => dom.getContentEl(scope);
190
- let cleanup;
191
- const rafCleanup = raf(() => {
192
- const triggerEl = dom.getActiveTriggerEl(scope, context.get("triggerValue"));
193
- const contentEl = getContentEl2();
194
- if (!triggerEl || !contentEl || contains(triggerEl.parentElement, contentEl)) return;
195
- cleanup = proxyTabFocus(getContentEl2, {
196
- triggerElement: triggerEl,
197
- getShadowRoot: true,
198
- onFocus(el) {
199
- el.focus({ preventScroll: true });
200
- }
185
+ proxyTabFocus({ prop, scope, context, watchEffect }) {
186
+ return watchEffect([() => prop("modal")], () => {
187
+ if (prop("modal")) return;
188
+ const getContentEl2 = () => dom.getContentEl(scope);
189
+ let cleanup;
190
+ const rafCleanup = raf(() => {
191
+ const triggerEl = dom.getActiveTriggerEl(scope, context.get("triggerValue"));
192
+ const contentEl = getContentEl2();
193
+ if (!triggerEl || !contentEl || contains(triggerEl.parentElement, contentEl)) return;
194
+ cleanup = proxyTabFocus(getContentEl2, {
195
+ triggerElement: triggerEl,
196
+ getShadowRoot: true,
197
+ onFocus(el) {
198
+ el.focus({ preventScroll: true });
199
+ }
200
+ });
201
201
  });
202
+ return () => {
203
+ rafCleanup();
204
+ cleanup?.();
205
+ };
202
206
  });
203
- return () => {
204
- rafCleanup();
205
- cleanup?.();
206
- };
207
207
  },
208
- hideContentBelow({ prop, scope, context }) {
209
- if (!prop("modal")) return;
210
- const getElements = () => [dom.getContentEl(scope), dom.getActiveTriggerEl(scope, context.get("triggerValue"))];
211
- return ariaHidden(getElements, { defer: true });
208
+ hideContentBelow({ prop, scope, context, watchEffect }) {
209
+ return watchEffect([() => prop("modal")], () => {
210
+ if (!prop("modal")) return;
211
+ const getElements = () => [
212
+ dom.getContentEl(scope),
213
+ dom.getActiveTriggerEl(scope, context.get("triggerValue"))
214
+ ];
215
+ return ariaHidden(getElements, { defer: true });
216
+ });
212
217
  },
213
- preventScroll({ prop, scope }) {
214
- if (!prop("modal")) return;
215
- return preventBodyScroll(scope.getDoc());
218
+ preventScroll({ prop, scope, watchEffect }) {
219
+ return watchEffect([() => prop("modal")], () => {
220
+ if (!prop("modal")) return;
221
+ return preventBodyScroll(scope.getDoc());
222
+ });
216
223
  },
217
- trapFocus({ prop, scope, context }) {
218
- if (!prop("modal")) return;
219
- const contentEl = () => dom.getContentEl(scope);
220
- return trapFocus(contentEl, {
221
- preventScroll: true,
222
- returnFocusOnDeactivate: !!prop("restoreFocus"),
223
- initialFocus: () => getInitialFocus({
224
- root: dom.getContentEl(scope),
225
- getInitialEl: prop("initialFocusEl"),
226
- enabled: prop("autoFocus")
227
- }),
228
- setReturnFocus: (el) => {
229
- const finalFocusEl = prop("finalFocusEl")?.();
230
- if (finalFocusEl) return finalFocusEl;
231
- const triggerValue = context.get("triggerValue");
232
- if (triggerValue) {
233
- const activeTriggerEl = dom.getActiveTriggerEl(scope, triggerValue);
234
- if (activeTriggerEl) return activeTriggerEl;
235
- }
236
- const fallbackTrigger = dom.getTriggerEls(scope)[0];
237
- if (fallbackTrigger) return fallbackTrigger;
238
- return el;
239
- },
240
- getShadowRoot: true
224
+ trapFocus({ prop, scope, context, watchEffect }) {
225
+ return watchEffect([() => prop("modal")], () => {
226
+ if (!prop("modal")) return;
227
+ const contentEl = () => dom.getContentEl(scope);
228
+ const destroy = trapFocus(contentEl, {
229
+ preventScroll: true,
230
+ returnFocusOnDeactivate: !!prop("restoreFocus"),
231
+ initialFocus: () => getInitialFocus({
232
+ root: dom.getContentEl(scope),
233
+ getInitialEl: prop("initialFocusEl"),
234
+ enabled: prop("autoFocus")
235
+ }),
236
+ setReturnFocus: (el) => {
237
+ const finalFocusEl = prop("finalFocusEl")?.();
238
+ if (finalFocusEl) return finalFocusEl;
239
+ const triggerValue = context.get("triggerValue");
240
+ if (triggerValue) {
241
+ const activeTriggerEl = dom.getActiveTriggerEl(scope, triggerValue);
242
+ if (activeTriggerEl) return activeTriggerEl;
243
+ }
244
+ const fallbackTrigger = dom.getTriggerEls(scope)[0];
245
+ if (fallbackTrigger) return fallbackTrigger;
246
+ return el;
247
+ },
248
+ getShadowRoot: true
249
+ });
250
+ return () => destroy({ returnFocus: !!prop("restoreFocus") && !!prop("modal") });
241
251
  });
242
252
  }
243
253
  },
@@ -2,7 +2,7 @@ import { Machine, EventObject, Service } from '@zag-js/core';
2
2
  import { DismissableElementHandlers, PersistentElementOptions, LayerSnapshot } from '@zag-js/dismissable';
3
3
  import { PositioningOptions, Placement, PlacementSide } from '@zag-js/popper';
4
4
  export { Placement, PositioningOptions } from '@zag-js/popper';
5
- import { PropTypes, RequiredBy, CommonProperties, DirectionProperty, MaybeElement } from '@zag-js/types';
5
+ import { PropTypes, CommonProperties, DirectionProperty, MaybeElement } from '@zag-js/types';
6
6
 
7
7
  interface OpenChangeDetails {
8
8
  open: boolean;
@@ -20,16 +20,16 @@ interface TriggerValueChangeDetails {
20
20
  interface IntlTranslations {
21
21
  closeTriggerLabel?: string | undefined;
22
22
  }
23
- type ElementIds = Partial<{
24
- anchor: string;
25
- trigger: string | ((value?: string) => string);
26
- content: string;
27
- title: string;
28
- description: string;
29
- closeTrigger: string;
30
- positioner: string;
31
- arrow: string;
32
- }>;
23
+ interface ElementIds {
24
+ anchor?: string | undefined;
25
+ trigger?: (string | ((value?: string) => string)) | undefined;
26
+ content?: string | undefined;
27
+ title?: string | undefined;
28
+ description?: string | undefined;
29
+ closeTrigger?: string | undefined;
30
+ positioner?: string | undefined;
31
+ arrow?: string | undefined;
32
+ }
33
33
  interface PopoverProps extends CommonProperties, DirectionProperty, DismissableElementHandlers, PersistentElementOptions {
34
34
  /**
35
35
  * Specifies the localized strings that identifies the accessibility elements and their states
@@ -59,7 +59,7 @@ interface PopoverProps extends CommonProperties, DirectionProperty, DismissableE
59
59
  /**
60
60
  * The element to focus on when the popover is opened.
61
61
  */
62
- initialFocusEl?: (() => HTMLElement | null) | undefined;
62
+ initialFocusEl?: (() => HTMLElement | null) | null | undefined;
63
63
  /**
64
64
  * Element to receive focus when the popover is closed.
65
65
  */
@@ -134,7 +134,8 @@ interface PrivateContext {
134
134
  triggerValue: string | null;
135
135
  }
136
136
  interface PopoverSchema {
137
- props: RequiredBy<PopoverProps, PropsWithDefault>;
137
+ props: PopoverProps;
138
+ defaultPropKey: PropsWithDefault;
138
139
  state: "open" | "closed";
139
140
  context: PrivateContext;
140
141
  computed: {};
@@ -149,7 +150,7 @@ interface TriggerProps {
149
150
  /**
150
151
  * The value that identifies this specific trigger
151
152
  */
152
- value?: string;
153
+ value?: string | undefined;
153
154
  }
154
155
  interface TriggerState {
155
156
  /**
@@ -2,7 +2,7 @@ import { Machine, EventObject, Service } from '@zag-js/core';
2
2
  import { DismissableElementHandlers, PersistentElementOptions, LayerSnapshot } from '@zag-js/dismissable';
3
3
  import { PositioningOptions, Placement, PlacementSide } from '@zag-js/popper';
4
4
  export { Placement, PositioningOptions } from '@zag-js/popper';
5
- import { PropTypes, RequiredBy, CommonProperties, DirectionProperty, MaybeElement } from '@zag-js/types';
5
+ import { PropTypes, CommonProperties, DirectionProperty, MaybeElement } from '@zag-js/types';
6
6
 
7
7
  interface OpenChangeDetails {
8
8
  open: boolean;
@@ -20,16 +20,16 @@ interface TriggerValueChangeDetails {
20
20
  interface IntlTranslations {
21
21
  closeTriggerLabel?: string | undefined;
22
22
  }
23
- type ElementIds = Partial<{
24
- anchor: string;
25
- trigger: string | ((value?: string) => string);
26
- content: string;
27
- title: string;
28
- description: string;
29
- closeTrigger: string;
30
- positioner: string;
31
- arrow: string;
32
- }>;
23
+ interface ElementIds {
24
+ anchor?: string | undefined;
25
+ trigger?: (string | ((value?: string) => string)) | undefined;
26
+ content?: string | undefined;
27
+ title?: string | undefined;
28
+ description?: string | undefined;
29
+ closeTrigger?: string | undefined;
30
+ positioner?: string | undefined;
31
+ arrow?: string | undefined;
32
+ }
33
33
  interface PopoverProps extends CommonProperties, DirectionProperty, DismissableElementHandlers, PersistentElementOptions {
34
34
  /**
35
35
  * Specifies the localized strings that identifies the accessibility elements and their states
@@ -59,7 +59,7 @@ interface PopoverProps extends CommonProperties, DirectionProperty, DismissableE
59
59
  /**
60
60
  * The element to focus on when the popover is opened.
61
61
  */
62
- initialFocusEl?: (() => HTMLElement | null) | undefined;
62
+ initialFocusEl?: (() => HTMLElement | null) | null | undefined;
63
63
  /**
64
64
  * Element to receive focus when the popover is closed.
65
65
  */
@@ -134,7 +134,8 @@ interface PrivateContext {
134
134
  triggerValue: string | null;
135
135
  }
136
136
  interface PopoverSchema {
137
- props: RequiredBy<PopoverProps, PropsWithDefault>;
137
+ props: PopoverProps;
138
+ defaultPropKey: PropsWithDefault;
138
139
  state: "open" | "closed";
139
140
  context: PrivateContext;
140
141
  computed: {};
@@ -149,7 +150,7 @@ interface TriggerProps {
149
150
  /**
150
151
  * The value that identifies this specific trigger
151
152
  */
152
- value?: string;
153
+ value?: string | undefined;
153
154
  }
154
155
  interface TriggerState {
155
156
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zag-js/popover",
3
- "version": "2.0.0-next.1",
3
+ "version": "2.0.0-next.2",
4
4
  "description": "Core logic for the popover widget implemented as a state machine",
5
5
  "keywords": [
6
6
  "js",
@@ -29,16 +29,16 @@
29
29
  "url": "https://github.com/chakra-ui/zag/issues"
30
30
  },
31
31
  "dependencies": {
32
- "@zag-js/anatomy": "2.0.0-next.1",
33
- "@zag-js/aria-hidden": "2.0.0-next.1",
34
- "@zag-js/core": "2.0.0-next.1",
35
- "@zag-js/dom-query": "2.0.0-next.1",
36
- "@zag-js/utils": "2.0.0-next.1",
37
- "@zag-js/dismissable": "2.0.0-next.1",
38
- "@zag-js/popper": "2.0.0-next.1",
39
- "@zag-js/remove-scroll": "2.0.0-next.1",
40
- "@zag-js/types": "2.0.0-next.1",
41
- "@zag-js/focus-trap": "2.0.0-next.1"
32
+ "@zag-js/anatomy": "2.0.0-next.2",
33
+ "@zag-js/aria-hidden": "2.0.0-next.2",
34
+ "@zag-js/core": "2.0.0-next.2",
35
+ "@zag-js/dom-query": "2.0.0-next.2",
36
+ "@zag-js/utils": "2.0.0-next.2",
37
+ "@zag-js/dismissable": "2.0.0-next.2",
38
+ "@zag-js/popper": "2.0.0-next.2",
39
+ "@zag-js/remove-scroll": "2.0.0-next.2",
40
+ "@zag-js/types": "2.0.0-next.2",
41
+ "@zag-js/focus-trap": "2.0.0-next.2"
42
42
  },
43
43
  "devDependencies": {
44
44
  "clean-package": "2.2.0"
@@ -72,7 +72,7 @@
72
72
  },
73
73
  "scripts": {
74
74
  "build": "tsup",
75
- "lint": "eslint src",
75
+ "lint": "oxlint src",
76
76
  "typecheck": "tsc --noEmit"
77
77
  }
78
78
  }