@serendie/ui 3.5.1-dev.202605201240 → 3.5.1-dev.202606091509

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 (39) hide show
  1. package/dist/components/BottomNavigation/BottomNavigation.d.ts +1 -1
  2. package/dist/components/DataTable/DataTableComponent.d.ts +1 -1
  3. package/dist/components/DataTable/table/BodyCheckbox.d.ts +1 -1
  4. package/dist/components/Divider/Divider.d.ts +1 -1
  5. package/dist/components/List/List.d.ts +1 -1
  6. package/dist/components/ProgressIndicator/ProgressIndicator.d.ts +1 -1
  7. package/dist/components/ProgressIndicator/ProgressIndicatorIndeterminate.d.ts +1 -1
  8. package/dist/components/Tabs/TabItem.d.ts +1 -1
  9. package/dist/components/Tabs/Tabs.d.ts +1 -1
  10. package/dist/i18n/provider.d.ts +1 -1
  11. package/dist/node_modules/@zag-js/accordion/dist/accordion.connect.js +49 -50
  12. package/dist/node_modules/@zag-js/combobox/dist/combobox.connect.js +70 -68
  13. package/dist/node_modules/@zag-js/combobox/dist/combobox.machine.js +1 -1
  14. package/dist/node_modules/@zag-js/date-picker/dist/date-picker.connect.js +322 -308
  15. package/dist/node_modules/@zag-js/date-picker/dist/date-picker.machine.js +93 -79
  16. package/dist/node_modules/@zag-js/date-picker/dist/date-picker.utils.js +35 -43
  17. package/dist/node_modules/@zag-js/date-utils/dist/locale.js +12 -0
  18. package/dist/node_modules/@zag-js/dialog/dist/dialog.dom.js +36 -35
  19. package/dist/node_modules/@zag-js/dialog/dist/dialog.machine.js +27 -37
  20. package/dist/node_modules/@zag-js/dismissable/dist/dismissable-layer.js +56 -41
  21. package/dist/node_modules/@zag-js/dismissable/dist/layer-stack.js +51 -31
  22. package/dist/node_modules/@zag-js/dismissable/dist/pointer-event-outside.js +46 -25
  23. package/dist/node_modules/@zag-js/dom-query/dist/controller.js +5 -5
  24. package/dist/node_modules/@zag-js/dom-query/dist/overflow.js +13 -21
  25. package/dist/node_modules/@zag-js/dom-query/dist/scroll.js +11 -0
  26. package/dist/node_modules/@zag-js/live-region/dist/index.js +29 -19
  27. package/dist/node_modules/@zag-js/menu/dist/menu.connect.js +138 -135
  28. package/dist/node_modules/@zag-js/menu/dist/menu.dom.js +24 -24
  29. package/dist/node_modules/@zag-js/menu/dist/menu.machine.js +1 -1
  30. package/dist/node_modules/@zag-js/popper/dist/get-placement.js +82 -71
  31. package/dist/node_modules/@zag-js/react/dist/machine.js +105 -96
  32. package/dist/node_modules/@zag-js/remove-scroll/dist/index.js +34 -26
  33. package/dist/node_modules/@zag-js/select/dist/select.connect.js +104 -101
  34. package/dist/node_modules/@zag-js/select/dist/select.machine.js +1 -1
  35. package/dist/node_modules/@zag-js/tabs/dist/tabs.machine.js +63 -60
  36. package/dist/node_modules/@zag-js/tooltip/dist/tooltip.connect.js +27 -25
  37. package/dist/node_modules/@zag-js/tooltip/dist/tooltip.dom.js +15 -14
  38. package/dist/theme/initColorScheme.d.ts +1 -1
  39. package/package.json +8 -8
@@ -1,40 +1,41 @@
1
- import { getEventTarget as V, getEventKey as D, getNativeEvent as q } from "../../dom-query/dist/event.js";
2
- import { isInternalChangeEvent as B } from "../../dom-query/dist/form.js";
3
- import { isValidTabEvent as Y } from "../../dom-query/dist/initial-focus.js";
4
- import { contains as j, isEditableElement as J } from "../../dom-query/dist/node.js";
5
- import { dataAttr as i, ariaAttr as $ } from "../../dom-query/dist/shared.js";
6
- import { getByTypeahead as k } from "../../dom-query/dist/typeahead.js";
7
- import { visuallyHiddenStyle as Q } from "../../dom-query/dist/visually-hidden.js";
8
- import { getPlacementStyles as X } from "../../popper/dist/get-styles.js";
1
+ import { getEventTarget as D, getEventKey as k, getNativeEvent as B } from "../../dom-query/dist/event.js";
2
+ import { isInternalChangeEvent as Y } from "../../dom-query/dist/form.js";
3
+ import { isValidTabEvent as j } from "../../dom-query/dist/initial-focus.js";
4
+ import { contains as J, isEditableElement as $ } from "../../dom-query/dist/node.js";
5
+ import { dataAttr as i, ariaAttr as Q } from "../../dom-query/dist/shared.js";
6
+ import { getByTypeahead as H } from "../../dom-query/dist/typeahead.js";
7
+ import { visuallyHiddenStyle as X } from "../../dom-query/dist/visually-hidden.js";
8
+ import { getPlacementStyles as Z } from "../../popper/dist/get-styles.js";
9
+ import { getPlacementSide as z } from "../../popper/dist/placement.js";
9
10
  import { parts as o } from "./select.anatomy.js";
10
- import { getItemId as H, getTriggerId as x, getLabelId as v, getContentId as M, getPositionerId as Z, getTriggerEl as S, getHiddenSelectId as w, getClearTriggerId as z, getItemGroupLabelId as U, getItemGroupId as ee, getControlId as te, getRootId as re } from "./select.dom.js";
11
- import { ensure as ae } from "../../utils/dist/warning.js";
12
- function ye(m, n) {
13
- const { context: c, prop: a, scope: d, state: R, computed: E, send: r } = m, _ = a("translations"), s = a("disabled") || c.get("fieldsetDisabled"), p = !!a("invalid"), L = !!a("required"), f = !!a("readOnly"), T = a("composite"), h = a("collection"), y = R.hasTag("open"), A = R.matches("focused"), I = c.get("highlightedValue"), K = c.get("highlightedItem"), W = E("selectedItems"), P = c.get("currentPlacement"), O = E("isTypingAhead"), G = E("isInteractive"), C = I ? H(d, I) : void 0;
14
- function b(e) {
15
- const t = h.getItemDisabled(e.item), l = h.getItemValue(e.item);
16
- return ae(l, () => `[zag-js] No value found for item ${JSON.stringify(e.item)}`), {
17
- value: l,
11
+ import { getItemId as x, getTriggerId as M, getLabelId as R, getContentId as w, getPositionerId as ee, getTriggerEl as S, getHiddenSelectId as U, getClearTriggerId as te, getItemGroupLabelId as _, getItemGroupId as re, getControlId as ae, getRootId as ie } from "./select.dom.js";
12
+ import { ensure as de } from "../../utils/dist/warning.js";
13
+ function fe(m, l) {
14
+ const { context: c, prop: a, scope: d, state: P, computed: E, send: r } = m, K = a("translations"), s = a("disabled") || c.get("fieldsetDisabled"), p = !!a("invalid"), L = !!a("required"), h = !!a("readOnly"), T = a("composite"), b = a("collection"), y = P.hasTag("open"), A = P.matches("focused"), I = c.get("highlightedValue"), W = c.get("highlightedItem"), F = E("selectedItems"), f = c.get("currentPlacement"), O = f ? z(f) : void 0, N = E("isTypingAhead"), G = E("isInteractive"), C = I ? x(d, I) : void 0;
15
+ function v(e) {
16
+ const t = b.getItemDisabled(e.item), n = b.getItemValue(e.item);
17
+ return de(n, () => `[zag-js] No value found for item ${JSON.stringify(e.item)}`), {
18
+ value: n,
18
19
  disabled: !!(s || t),
19
- highlighted: I === l,
20
- selected: c.get("value").includes(l)
20
+ highlighted: I === n,
21
+ selected: c.get("value").includes(n)
21
22
  };
22
23
  }
23
- const F = X({
24
+ const q = Z({
24
25
  ...a("positioning"),
25
- placement: P
26
+ placement: f
26
27
  });
27
28
  return {
28
29
  open: y,
29
30
  focused: A,
30
31
  empty: c.get("value").length === 0,
31
- highlightedItem: K,
32
+ highlightedItem: W,
32
33
  highlightedValue: I,
33
- selectedItems: W,
34
+ selectedItems: F,
34
35
  hasSelectedItems: E("hasSelectedItems"),
35
36
  value: c.get("value"),
36
37
  valueAsString: E("valueAsString"),
37
- collection: h,
38
+ collection: b,
38
39
  multiple: !!a("multiple"),
39
40
  disabled: !!s,
40
41
  reposition(e = {}) {
@@ -45,7 +46,7 @@ function ye(m, n) {
45
46
  (e = S(d)) == null || e.focus({ preventScroll: !0 });
46
47
  },
47
48
  setOpen(e) {
48
- R.hasTag("open") !== e && r({ type: e ? "OPEN" : "CLOSE" });
49
+ P.hasTag("open") !== e && r({ type: e ? "OPEN" : "CLOSE" });
49
50
  },
50
51
  selectValue(e) {
51
52
  r({ type: "ITEM.SELECT", value: e });
@@ -54,7 +55,7 @@ function ye(m, n) {
54
55
  r({ type: "VALUE.SET", value: e });
55
56
  },
56
57
  selectAll() {
57
- r({ type: "VALUE.SET", value: h.getValues() });
58
+ r({ type: "VALUE.SET", value: b.getValues() });
58
59
  },
59
60
  setHighlightValue(e) {
60
61
  r({ type: "HIGHLIGHTED_VALUE.SET", value: e });
@@ -65,26 +66,26 @@ function ye(m, n) {
65
66
  clearValue(e) {
66
67
  r(e ? { type: "ITEM.CLEAR", value: e } : { type: "VALUE.CLEAR" });
67
68
  },
68
- getItemState: b,
69
+ getItemState: v,
69
70
  getRootProps() {
70
- return n.element({
71
+ return l.element({
71
72
  ...o.root.attrs,
72
73
  dir: a("dir"),
73
- id: re(d),
74
+ id: ie(d),
74
75
  "data-invalid": i(p),
75
- "data-readonly": i(f)
76
+ "data-readonly": i(h)
76
77
  });
77
78
  },
78
79
  getLabelProps() {
79
- return n.label({
80
+ return l.label({
80
81
  dir: a("dir"),
81
- id: v(d),
82
+ id: R(d),
82
83
  ...o.label.attrs,
83
84
  "data-disabled": i(s),
84
85
  "data-invalid": i(p),
85
- "data-readonly": i(f),
86
+ "data-readonly": i(h),
86
87
  "data-required": i(L),
87
- htmlFor: w(d),
88
+ htmlFor: U(d),
88
89
  onClick(e) {
89
90
  var t;
90
91
  e.defaultPrevented || s || (t = S(d)) == null || t.focus({ preventScroll: !0 });
@@ -92,10 +93,10 @@ function ye(m, n) {
92
93
  });
93
94
  },
94
95
  getControlProps() {
95
- return n.element({
96
+ return l.element({
96
97
  ...o.control.attrs,
97
98
  dir: a("dir"),
98
- id: te(d),
99
+ id: ae(d),
99
100
  "data-state": y ? "open" : "closed",
100
101
  "data-focus": i(A),
101
102
  "data-disabled": i(s),
@@ -103,7 +104,7 @@ function ye(m, n) {
103
104
  });
104
105
  },
105
106
  getValueTextProps() {
106
- return n.element({
107
+ return l.element({
107
108
  ...o.valueText.attrs,
108
109
  dir: a("dir"),
109
110
  "data-disabled": i(s),
@@ -112,24 +113,25 @@ function ye(m, n) {
112
113
  });
113
114
  },
114
115
  getTriggerProps() {
115
- return n.button({
116
- id: x(d),
116
+ return l.button({
117
+ id: M(d),
117
118
  disabled: s,
118
119
  dir: a("dir"),
119
120
  type: "button",
120
121
  role: "combobox",
121
- "aria-controls": M(d),
122
+ "aria-controls": w(d),
122
123
  "aria-expanded": y,
123
124
  "aria-haspopup": "listbox",
124
125
  "data-state": y ? "open" : "closed",
125
126
  "aria-invalid": p,
126
127
  "aria-required": L,
127
- "aria-labelledby": v(d),
128
+ "aria-labelledby": R(d),
128
129
  ...o.trigger.attrs,
129
130
  "data-disabled": i(s),
130
131
  "data-invalid": i(p),
131
- "data-readonly": i(f),
132
- "data-placement": P,
132
+ "data-readonly": i(h),
133
+ "data-placement": f,
134
+ "data-side": O,
133
135
  "data-placeholder-shown": i(!E("hasSelectedItems")),
134
136
  onClick(e) {
135
137
  G && (e.defaultPrevented || r({ type: "TRIGGER.CLICK" }));
@@ -142,7 +144,7 @@ function ye(m, n) {
142
144
  },
143
145
  onKeyDown(e) {
144
146
  if (e.defaultPrevented || !G) return;
145
- const l = {
147
+ const n = {
146
148
  ArrowUp() {
147
149
  r({ type: "TRIGGER.ARROW_UP" });
148
150
  },
@@ -165,35 +167,35 @@ function ye(m, n) {
165
167
  r({ type: "TRIGGER.ENTER" });
166
168
  },
167
169
  Space(u) {
168
- r(O ? { type: "TRIGGER.TYPEAHEAD", key: u.key } : { type: "TRIGGER.ENTER" });
170
+ r(N ? { type: "TRIGGER.TYPEAHEAD", key: u.key } : { type: "TRIGGER.ENTER" });
169
171
  }
170
- }[D(e, {
172
+ }[k(e, {
171
173
  dir: a("dir"),
172
174
  orientation: "vertical"
173
175
  })];
174
- if (l) {
175
- l(e), e.preventDefault();
176
+ if (n) {
177
+ n(e), e.preventDefault();
176
178
  return;
177
179
  }
178
- k.isValidEvent(e) && (r({ type: "TRIGGER.TYPEAHEAD", key: e.key }), e.preventDefault());
180
+ H.isValidEvent(e) && (r({ type: "TRIGGER.TYPEAHEAD", key: e.key }), e.preventDefault());
179
181
  }
180
182
  });
181
183
  },
182
184
  getIndicatorProps() {
183
- return n.element({
185
+ return l.element({
184
186
  ...o.indicator.attrs,
185
187
  dir: a("dir"),
186
188
  "aria-hidden": !0,
187
189
  "data-state": y ? "open" : "closed",
188
190
  "data-disabled": i(s),
189
191
  "data-invalid": i(p),
190
- "data-readonly": i(f)
192
+ "data-readonly": i(h)
191
193
  });
192
194
  },
193
195
  getItemProps(e) {
194
- const t = b(e);
195
- return n.element({
196
- id: H(d, t.value),
196
+ const t = v(e);
197
+ return l.element({
198
+ id: x(d, t.value),
197
199
  role: "option",
198
200
  ...o.item.attrs,
199
201
  dir: a("dir"),
@@ -202,22 +204,22 @@ function ye(m, n) {
202
204
  "data-state": t.selected ? "checked" : "unchecked",
203
205
  "data-highlighted": i(t.highlighted),
204
206
  "data-disabled": i(t.disabled),
205
- "aria-disabled": $(t.disabled),
206
- onPointerMove(l) {
207
- t.disabled || l.pointerType !== "mouse" || t.value !== I && r({ type: "ITEM.POINTER_MOVE", value: t.value });
207
+ "aria-disabled": Q(t.disabled),
208
+ onPointerMove(n) {
209
+ t.disabled || n.pointerType !== "mouse" || t.value !== I && r({ type: "ITEM.POINTER_MOVE", value: t.value });
208
210
  },
209
- onClick(l) {
210
- l.defaultPrevented || t.disabled || r({ type: "ITEM.CLICK", src: "pointerup", value: t.value });
211
+ onClick(n) {
212
+ n.defaultPrevented || t.disabled || r({ type: "ITEM.CLICK", src: "pointerup", value: t.value });
211
213
  },
212
- onPointerLeave(l) {
214
+ onPointerLeave(n) {
213
215
  var g;
214
- t.disabled || e.persistFocus || l.pointerType !== "mouse" || !((g = m.event.previous()) != null && g.type.includes("POINTER")) || r({ type: "ITEM.POINTER_LEAVE" });
216
+ t.disabled || e.persistFocus || n.pointerType !== "mouse" || !((g = m.event.previous()) != null && g.type.includes("POINTER")) || r({ type: "ITEM.POINTER_LEAVE" });
215
217
  }
216
218
  });
217
219
  },
218
220
  getItemTextProps(e) {
219
- const t = b(e);
220
- return n.element({
221
+ const t = v(e);
222
+ return l.element({
221
223
  ...o.itemText.attrs,
222
224
  "data-state": t.selected ? "checked" : "unchecked",
223
225
  "data-disabled": i(t.disabled),
@@ -225,8 +227,8 @@ function ye(m, n) {
225
227
  });
226
228
  },
227
229
  getItemIndicatorProps(e) {
228
- const t = b(e);
229
- return n.element({
230
+ const t = v(e);
231
+ return l.element({
230
232
  "aria-hidden": !0,
231
233
  ...o.itemIndicator.attrs,
232
234
  "data-state": t.selected ? "checked" : "unchecked",
@@ -235,30 +237,30 @@ function ye(m, n) {
235
237
  },
236
238
  getItemGroupLabelProps(e) {
237
239
  const { htmlFor: t } = e;
238
- return n.element({
240
+ return l.element({
239
241
  ...o.itemGroupLabel.attrs,
240
- id: U(d, t),
242
+ id: _(d, t),
241
243
  dir: a("dir"),
242
244
  role: "presentation"
243
245
  });
244
246
  },
245
247
  getItemGroupProps(e) {
246
248
  const { id: t } = e;
247
- return n.element({
249
+ return l.element({
248
250
  ...o.itemGroup.attrs,
249
251
  "data-disabled": i(s),
250
- id: ee(d, t),
251
- "aria-labelledby": U(d, t),
252
+ id: re(d, t),
253
+ "aria-labelledby": _(d, t),
252
254
  role: "group",
253
255
  dir: a("dir")
254
256
  });
255
257
  },
256
258
  getClearTriggerProps() {
257
- return n.button({
259
+ return l.button({
258
260
  ...o.clearTrigger.attrs,
259
- id: z(d),
261
+ id: te(d),
260
262
  type: "button",
261
- "aria-label": _.clearTriggerLabel,
263
+ "aria-label": K.clearTriggerLabel,
262
264
  "data-invalid": i(p),
263
265
  disabled: s,
264
266
  hidden: !E("hasSelectedItems"),
@@ -269,58 +271,59 @@ function ye(m, n) {
269
271
  });
270
272
  },
271
273
  getHiddenSelectProps() {
272
- const e = c.get("value"), t = a("multiple") ? e : e == null ? void 0 : e[0], l = (u) => {
273
- const g = q(u);
274
- B(g) || r({ type: "VALUE.SET", value: ie(u.currentTarget) });
274
+ const e = c.get("value"), t = a("multiple") ? e : e == null ? void 0 : e[0], n = (u) => {
275
+ const g = B(u);
276
+ Y(g) || r({ type: "VALUE.SET", value: ne(u.currentTarget) });
275
277
  };
276
- return n.select({
278
+ return l.select({
277
279
  name: a("name"),
278
280
  form: a("form"),
279
281
  disabled: s,
280
282
  multiple: a("multiple"),
281
283
  required: a("required"),
282
284
  "aria-hidden": !0,
283
- id: w(d),
285
+ id: U(d),
284
286
  defaultValue: t,
285
- style: Q,
287
+ style: X,
286
288
  tabIndex: -1,
287
289
  autoComplete: a("autoComplete"),
288
- onChange: l,
289
- onInput: l,
290
+ onChange: n,
291
+ onInput: n,
290
292
  // Some browser extensions will focus the hidden select.
291
293
  // Let's forward the focus to the trigger.
292
294
  onFocus() {
293
295
  var u;
294
296
  (u = S(d)) == null || u.focus({ preventScroll: !0 });
295
297
  },
296
- "aria-labelledby": v(d)
298
+ "aria-labelledby": R(d)
297
299
  });
298
300
  },
299
301
  getPositionerProps() {
300
- return n.element({
302
+ return l.element({
301
303
  ...o.positioner.attrs,
302
304
  dir: a("dir"),
303
- id: Z(d),
304
- style: F.floating
305
+ id: ee(d),
306
+ style: q.floating
305
307
  });
306
308
  },
307
309
  getContentProps() {
308
- return n.element({
310
+ return l.element({
309
311
  hidden: !y,
310
312
  dir: a("dir"),
311
- id: M(d),
313
+ id: w(d),
312
314
  role: T ? "listbox" : "dialog",
313
315
  ...o.content.attrs,
314
316
  "data-state": y ? "open" : "closed",
315
- "data-placement": P,
317
+ "data-placement": f,
318
+ "data-side": O,
316
319
  "data-activedescendant": C,
317
320
  "aria-activedescendant": T ? C : void 0,
318
321
  "aria-multiselectable": a("multiple") && T ? !0 : void 0,
319
- "aria-labelledby": v(d),
322
+ "aria-labelledby": R(d),
320
323
  tabIndex: 0,
321
324
  onKeyDown(e) {
322
- if (!G || !j(e.currentTarget, V(e))) return;
323
- if (e.key === "Tab" && !Y(e)) {
325
+ if (!G || !J(e.currentTarget, D(e))) return;
326
+ if (e.key === "Tab" && !j(e)) {
324
327
  e.preventDefault();
325
328
  return;
326
329
  }
@@ -341,32 +344,32 @@ function ye(m, n) {
341
344
  r({ type: "ITEM.CLICK", src: "keydown.enter" });
342
345
  },
343
346
  Space(g) {
344
- var N;
345
- O ? r({ type: "CONTENT.TYPEAHEAD", key: g.key }) : (N = t.Enter) == null || N.call(t, g);
347
+ var V;
348
+ N ? r({ type: "CONTENT.TYPEAHEAD", key: g.key }) : (V = t.Enter) == null || V.call(t, g);
346
349
  }
347
- }, l = t[D(e)];
348
- if (l) {
349
- l(e), e.preventDefault();
350
+ }, n = t[k(e)];
351
+ if (n) {
352
+ n(e), e.preventDefault();
350
353
  return;
351
354
  }
352
- const u = V(e);
353
- J(u) || k.isValidEvent(e) && (r({ type: "CONTENT.TYPEAHEAD", key: e.key }), e.preventDefault());
355
+ const u = D(e);
356
+ $(u) || H.isValidEvent(e) && (r({ type: "CONTENT.TYPEAHEAD", key: e.key }), e.preventDefault());
354
357
  }
355
358
  });
356
359
  },
357
360
  getListProps() {
358
- return n.element({
361
+ return l.element({
359
362
  ...o.list.attrs,
360
363
  tabIndex: 0,
361
364
  role: T ? void 0 : "listbox",
362
- "aria-labelledby": x(d),
365
+ "aria-labelledby": M(d),
363
366
  "aria-activedescendant": T ? void 0 : C,
364
367
  "aria-multiselectable": !T && a("multiple") ? !0 : void 0
365
368
  });
366
369
  }
367
370
  };
368
371
  }
369
- var ie = (m) => m.multiple ? Array.from(m.selectedOptions, (n) => n.value) : m.value ? [m.value] : [];
372
+ var ne = (m) => m.multiple ? Array.from(m.selectedOptions, (l) => l.value) : m.value ? [m.value] : [];
370
373
  export {
371
- ye as connect
374
+ fe as connect
372
375
  };
@@ -12,7 +12,7 @@ import { observeAttributes as b } from "../../dom-query/dist/mutation-observer.j
12
12
  import { trackDismissableElement as w } from "../../dismissable/dist/dismissable-layer.js";
13
13
  import { getByTypeahead as W } from "../../dom-query/dist/typeahead.js";
14
14
  import { isEqual as _ } from "../../utils/dist/equal.js";
15
- import { scrollIntoView as U } from "../../dom-query/dist/overflow.js";
15
+ import { scrollIntoView as U } from "../../dom-query/dist/scroll.js";
16
16
  var { and: r, not: c, or: K } = M(), ne = y({
17
17
  props({ props: e }) {
18
18
  return {
@@ -1,13 +1,13 @@
1
- import { getTriggerEl as n, getIndicatorEl as d, getElements as g, getRectByValue as V, getContentEl as T, getPrevTriggerEl as m, getNextTriggerEl as F, getLastTriggerEl as I, getFirstTriggerEl as b, getOffsetRect as E } from "./tabs.dom.js";
2
- import { isAnchorElement as A } from "../../dom-query/dist/node.js";
3
- import { callAll as R } from "../../utils/dist/functions.js";
4
- import { resizeObserverBorderBox as C } from "../../dom-query/dist/resize-observer.js";
1
+ import { getTriggerEl as n, getIndicatorEl as f, getElements as T, getListEl as m, getRectByValue as b, getContentEl as F, getPrevTriggerEl as I, getNextTriggerEl as E, getLastTriggerEl as A, getFirstTriggerEl as R, getOffsetRect as C } from "./tabs.dom.js";
2
+ import { isAnchorElement as y } from "../../dom-query/dist/node.js";
3
+ import { callAll as O } from "../../utils/dist/functions.js";
4
+ import { resizeObserverBorderBox as v } from "../../dom-query/dist/resize-observer.js";
5
5
  import { raf as c } from "../../dom-query/dist/raf.js";
6
- import { getFocusables as y } from "../../dom-query/dist/tabbable.js";
7
- import { clickIfLink as O } from "../../dom-query/dist/navigate.js";
8
- import { setup as p } from "../../core/dist/create-machine.js";
9
- import { isEqual as N } from "../../utils/dist/equal.js";
10
- var { createMachine: _ } = p(), z = _({
6
+ import { getFocusables as p } from "../../dom-query/dist/tabbable.js";
7
+ import { clickIfLink as N } from "../../dom-query/dist/navigate.js";
8
+ import { setup as _ } from "../../core/dist/create-machine.js";
9
+ import { isEqual as h } from "../../utils/dist/equal.js";
10
+ var { createMachine: L } = _(), W = L({
11
11
  props({ props: e }) {
12
12
  return {
13
13
  dir: "ltr",
@@ -16,7 +16,7 @@ var { createMachine: _ } = p(), z = _({
16
16
  loopFocus: !0,
17
17
  composite: !0,
18
18
  navigate(t) {
19
- O(t.node);
19
+ N(t.node);
20
20
  },
21
21
  defaultValue: null,
22
22
  ...e
@@ -30,17 +30,17 @@ var { createMachine: _ } = p(), z = _({
30
30
  value: t(() => ({
31
31
  defaultValue: e("defaultValue"),
32
32
  value: e("value"),
33
- onChange(s) {
34
- var a;
35
- (a = e("onValueChange")) == null || a({ value: s });
33
+ onChange(a) {
34
+ var s;
35
+ (s = e("onValueChange")) == null || s({ value: a });
36
36
  }
37
37
  })),
38
38
  focusedValue: t(() => ({
39
39
  defaultValue: e("value") || e("defaultValue"),
40
40
  sync: !0,
41
- onChange(s) {
42
- var a;
43
- (a = e("onFocusChange")) == null || a({ focusedValue: s });
41
+ onChange(a) {
42
+ var s;
43
+ (s = e("onFocusChange")) == null || s({ focusedValue: a });
44
44
  }
45
45
  })),
46
46
  ssr: t(() => ({ defaultValue: !0 })),
@@ -58,11 +58,11 @@ var { createMachine: _ } = p(), z = _({
58
58
  prevValue: null
59
59
  };
60
60
  },
61
- watch({ context: e, prop: t, track: s, action: a }) {
62
- s([() => e.get("value")], () => {
63
- a(["syncIndicatorAnimation", "syncIndicatorRect", "syncTabIndex", "navigateIfNeeded"]);
64
- }), s([() => t("dir"), () => t("orientation")], () => {
65
- a(["syncIndicatorRect"]);
61
+ watch({ context: e, prop: t, track: a, action: s }) {
62
+ a([() => e.get("value")], () => {
63
+ s(["syncIndicatorAnimation", "syncIndicatorRect", "syncTabIndex", "navigateIfNeeded"]);
64
+ }), a([() => t("dir"), () => t("orientation")], () => {
65
+ s(["syncIndicatorRect"]);
66
66
  });
67
67
  },
68
68
  on: {
@@ -155,23 +155,23 @@ var { createMachine: _ } = p(), z = _({
155
155
  actions: {
156
156
  selectFocusedTab({ context: e, prop: t }) {
157
157
  c(() => {
158
- const s = e.get("focusedValue");
159
- if (!s) return;
160
- const l = t("deselectable") && e.get("value") === s ? null : s;
158
+ const a = e.get("focusedValue");
159
+ if (!a) return;
160
+ const l = t("deselectable") && e.get("value") === a ? null : a;
161
161
  e.set("value", l);
162
162
  });
163
163
  },
164
- setFocusedValue({ context: e, event: t, flush: s }) {
165
- t.value != null && s(() => {
164
+ setFocusedValue({ context: e, event: t, flush: a }) {
165
+ t.value != null && a(() => {
166
166
  e.set("focusedValue", t.value);
167
167
  });
168
168
  },
169
169
  clearFocusedValue({ context: e }) {
170
170
  e.set("focusedValue", null);
171
171
  },
172
- setValue({ context: e, event: t, prop: s }) {
173
- const a = s("deselectable") && e.get("value") === e.get("focusedValue");
174
- e.set("value", a ? null : t.value);
172
+ setValue({ context: e, event: t, prop: a }) {
173
+ const s = a("deselectable") && e.get("value") === e.get("focusedValue");
174
+ e.set("value", s ? null : t.value);
175
175
  },
176
176
  clearValue({ context: e }) {
177
177
  e.set("value", null);
@@ -179,19 +179,19 @@ var { createMachine: _ } = p(), z = _({
179
179
  focusFirstTab({ scope: e }) {
180
180
  c(() => {
181
181
  var t;
182
- (t = b(e)) == null || t.focus();
182
+ (t = R(e)) == null || t.focus();
183
183
  });
184
184
  },
185
185
  focusLastTab({ scope: e }) {
186
186
  c(() => {
187
187
  var t;
188
- (t = I(e)) == null || t.focus();
188
+ (t = A(e)) == null || t.focus();
189
189
  });
190
190
  },
191
- focusNextTab({ context: e, prop: t, scope: s, event: a }) {
192
- const l = a.value ?? e.get("focusedValue");
191
+ focusNextTab({ context: e, prop: t, scope: a, event: s }) {
192
+ const l = s.value ?? e.get("focusedValue");
193
193
  if (!l) return;
194
- const u = F(s, {
194
+ const u = E(a, {
195
195
  value: l,
196
196
  loopFocus: t("loopFocus")
197
197
  });
@@ -199,10 +199,10 @@ var { createMachine: _ } = p(), z = _({
199
199
  t("composite") ? u == null || u.focus() : (u == null ? void 0 : u.dataset.value) != null && e.set("focusedValue", u.dataset.value);
200
200
  });
201
201
  },
202
- focusPrevTab({ context: e, prop: t, scope: s, event: a }) {
203
- const l = a.value ?? e.get("focusedValue");
202
+ focusPrevTab({ context: e, prop: t, scope: a, event: s }) {
203
+ const l = s.value ?? e.get("focusedValue");
204
204
  if (!l) return;
205
- const u = m(s, {
205
+ const u = I(a, {
206
206
  value: l,
207
207
  loopFocus: t("loopFocus")
208
208
  });
@@ -212,20 +212,20 @@ var { createMachine: _ } = p(), z = _({
212
212
  },
213
213
  syncTabIndex({ context: e, scope: t }) {
214
214
  c(() => {
215
- const s = e.get("value");
216
- if (!s) return;
217
- const a = T(t, s);
215
+ const a = e.get("value");
218
216
  if (!a) return;
219
- y(a).length > 0 ? a.removeAttribute("tabindex") : a.setAttribute("tabindex", "0");
217
+ const s = F(t, a);
218
+ if (!s) return;
219
+ p(s).length > 0 ? s.removeAttribute("tabindex") : s.setAttribute("tabindex", "0");
220
220
  });
221
221
  },
222
222
  cleanupObserver({ refs: e }) {
223
223
  const t = e.get("indicatorCleanup");
224
224
  t && t();
225
225
  },
226
- setIndicatorRect({ context: e, event: t, scope: s }) {
227
- const a = t.id ?? e.get("value");
228
- !d(s) || !a || !n(s, a) || e.set("indicatorRect", V(s, a));
226
+ setIndicatorRect({ context: e, event: t, scope: a }) {
227
+ const s = t.id ?? e.get("value");
228
+ !f(a) || !s || !n(a, s) || e.set("indicatorRect", b(a, s));
229
229
  },
230
230
  syncSsr({ context: e }) {
231
231
  e.set("ssr", !1);
@@ -234,35 +234,38 @@ var { createMachine: _ } = p(), z = _({
234
234
  t.set("prevValue", e.get("value"));
235
235
  },
236
236
  syncIndicatorAnimation({ context: e, refs: t }) {
237
- const s = t.get("prevValue"), a = e.get("value"), l = s != null && a != null && s !== a;
238
- e.set("animateIndicator", l), t.set("prevValue", a);
237
+ const a = t.get("prevValue"), s = e.get("value"), l = a != null && s != null && a !== s;
238
+ e.set("animateIndicator", l), t.set("prevValue", s);
239
239
  },
240
240
  clearIndicatorAnimation({ context: e }) {
241
241
  e.set("animateIndicator", !1);
242
242
  },
243
- syncIndicatorRect({ context: e, refs: t, scope: s }) {
244
- const a = t.get("indicatorCleanup");
245
- if (a && a(), !d(s)) return;
243
+ syncIndicatorRect({ context: e, refs: t, scope: a }) {
244
+ const s = t.get("indicatorCleanup");
245
+ if (s && s(), !f(a)) return;
246
246
  const u = () => {
247
- const o = n(s, e.get("value"));
247
+ const o = n(a, e.get("value"));
248
248
  if (!o) return;
249
- const i = E(o);
250
- e.set("indicatorRect", (r) => N(r, i) ? r : i);
249
+ const r = C(o);
250
+ e.set("indicatorRect", (d) => h(d, r) ? d : r);
251
251
  };
252
252
  u();
253
- const f = g(s), v = R(...f.map((o) => C.observe(o, u)));
254
- t.set("indicatorCleanup", v);
253
+ const g = T(a), i = m(a), V = O(
254
+ ...g.map((o) => v.observe(o, u)),
255
+ ...i ? [v.observe(i, u)] : []
256
+ );
257
+ t.set("indicatorCleanup", V);
255
258
  },
256
- navigateIfNeeded({ context: e, prop: t, scope: s }) {
259
+ navigateIfNeeded({ context: e, prop: t, scope: a }) {
257
260
  var u;
258
- const a = e.get("value");
259
- if (!a) return;
260
- const l = n(s, a);
261
- A(l) && ((u = t("navigate")) == null || u({ value: a, node: l, href: l.href }));
261
+ const s = e.get("value");
262
+ if (!s) return;
263
+ const l = n(a, s);
264
+ y(l) && ((u = t("navigate")) == null || u({ value: s, node: l, href: l.href }));
262
265
  }
263
266
  }
264
267
  }
265
268
  });
266
269
  export {
267
- z as machine
270
+ W as machine
268
271
  };