@box-kite/react 2.2.6 → 2.2.8

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 (122) hide show
  1. package/.claude/rules/box-kite-rules.md +2 -0
  2. package/.claude/skills/box-kite/SKILL.md +2 -0
  3. package/.claude/skills/box-kite/references/extending.md +10 -0
  4. package/.claude/skills/box-kite/references/styling.md +3 -2
  5. package/.cursor/rules/box-kite.mdc +2 -0
  6. package/AGENTS.md +2 -0
  7. package/BOX_AI_CONTEXT.md +128 -2
  8. package/BOX_KITE_AI_CONTEXT.md +128 -2
  9. package/analytics.cjs +1 -0
  10. package/analytics.d.ts +10 -0
  11. package/analytics.mjs +121 -0
  12. package/behavior.cjs +1 -1
  13. package/behavior.mjs +42 -38
  14. package/box.cjs +1 -1
  15. package/box.d.ts +14 -0
  16. package/box.mjs +17 -16
  17. package/catalog.cjs +1 -1
  18. package/catalog.mjs +8 -0
  19. package/client.cjs +1 -1
  20. package/client.mjs +144 -113
  21. package/components/accordion.cjs +1 -1
  22. package/components/accordion.mjs +19 -10
  23. package/components/agent.cjs +1 -1
  24. package/components/agent.mjs +21 -8
  25. package/components/calendar.cjs +1 -1
  26. package/components/calendar.d.ts +3 -1
  27. package/components/calendar.mjs +154 -142
  28. package/components/combobox.cjs +1 -1
  29. package/components/combobox.mjs +184 -174
  30. package/components/dashboard.cjs +1 -1
  31. package/components/dashboard.mjs +183 -170
  32. package/components/dataGrid/models/columnModel.d.ts +1 -0
  33. package/components/dataGrid/models/gridModel.d.ts +18 -0
  34. package/components/dataGrid/models/headerCellModel.d.ts +1 -0
  35. package/components/dataGrid/models/rangeModel.d.ts +3 -0
  36. package/components/dataGrid.cjs +3 -3
  37. package/components/dataGrid.mjs +1015 -923
  38. package/components/dateField.cjs +1 -1
  39. package/components/dateField.mjs +165 -159
  40. package/components/datePicker.cjs +1 -1
  41. package/components/datePicker.mjs +198 -183
  42. package/components/dialog.cjs +1 -1
  43. package/components/dialog.mjs +38 -33
  44. package/components/dropdown.cjs +1 -1
  45. package/components/dropdown.mjs +107 -93
  46. package/components/form.cjs +1 -1
  47. package/components/form.mjs +22 -18
  48. package/components/menu.cjs +1 -1
  49. package/components/menu.d.ts +2 -0
  50. package/components/menu.mjs +196 -175
  51. package/components/overlay.cjs +1 -1
  52. package/components/overlay.mjs +7 -7
  53. package/components/popover.cjs +1 -1
  54. package/components/popover.mjs +4 -0
  55. package/components/radioGroup.cjs +1 -1
  56. package/components/radioGroup.mjs +10 -5
  57. package/components/semantics.d.ts +29 -29
  58. package/components/slider.cjs +1 -1
  59. package/components/slider.mjs +84 -83
  60. package/components/sortableList.cjs +1 -1
  61. package/components/sortableList.mjs +158 -150
  62. package/components/swipeItem.cjs +1 -1
  63. package/components/swipeItem.mjs +92 -84
  64. package/components/tabs.cjs +1 -1
  65. package/components/tabs.mjs +10 -5
  66. package/components/timeZoneSelect.cjs +1 -1
  67. package/components/timeZoneSelect.mjs +40 -35
  68. package/components/toaster.cjs +1 -1
  69. package/components/toaster.mjs +151 -113
  70. package/create/src/index.d.ts +1 -0
  71. package/create/src/options.d.ts +27 -0
  72. package/create/src/options.test.d.ts +1 -0
  73. package/create/src/packageManager.d.ts +5 -0
  74. package/create/src/project.d.ts +25 -0
  75. package/create/src/project.test.d.ts +1 -0
  76. package/create/templates/ts/designs/azure.d.ts +5 -0
  77. package/create/templates/ts/designs/ember.d.ts +5 -0
  78. package/create/templates/ts/designs/mono.d.ts +5 -0
  79. package/create/templates/ts/src/App.d.ts +2 -0
  80. package/create/templates/ts/src/design.d.ts +5 -0
  81. package/create/templates/ts/src/main.d.ts +0 -0
  82. package/dataGridDateParts.cjs +1 -1
  83. package/dataGridDateParts.mjs +56 -55
  84. package/dataGridList.cjs +1 -1
  85. package/dataGridList.mjs +437 -436
  86. package/docs/props.md +19 -19
  87. package/effects.cjs +1 -1
  88. package/effects.mjs +1 -1
  89. package/interactionListening.cjs +1 -0
  90. package/interactionListening.mjs +117 -0
  91. package/interactions.cjs +1 -0
  92. package/interactions.mjs +25 -0
  93. package/layer.cjs +1 -1
  94. package/layer.mjs +68 -66
  95. package/package.json +139 -70
  96. package/placement.cjs +1 -1
  97. package/placement.mjs +10 -10
  98. package/platform.cjs +1 -1
  99. package/platform.mjs +44 -25
  100. package/react/interactions/interactions.d.ts +30 -0
  101. package/react/popover/usePopoverLayer.d.ts +3 -0
  102. package/react/theme/theme.d.ts +9 -0
  103. package/react/theme/themeContext.d.ts +2 -0
  104. package/react/useStyles.d.ts +8 -1
  105. package/react-shared.cjs +1 -1
  106. package/react-shared.mjs +49 -48
  107. package/reporting.cjs +1 -0
  108. package/reporting.mjs +51 -0
  109. package/rsc.cjs +1 -1
  110. package/rsc.d.ts +3 -0
  111. package/rsc.mjs +1 -1
  112. package/scrolling.cjs +1 -1
  113. package/scrolling.mjs +1 -1
  114. package/supabase/functions/collect/index.d.ts +30 -0
  115. package/supabase/functions/collect/index.test.d.ts +1 -0
  116. package/utils/analytics/analytics.d.ts +72 -0
  117. package/utils/analytics/analyticsIdentity.d.ts +13 -0
  118. package/utils/interactions/componentAttribute.d.ts +6 -0
  119. package/utils/interactions/interactionChannel.d.ts +35 -0
  120. package/utils/interactions/interactionJson.d.ts +6 -0
  121. package/utils/interactions/interactionListening.d.ts +6 -0
  122. package/utils/interactions/interactionTypes.d.ts +224 -0
@@ -1,27 +1,28 @@
1
1
  "use client";
2
2
  import { f as e } from "../react-shared.mjs";
3
3
  import t from "../box.mjs";
4
- import { a as n, i as r, t as i } from "../behavior.mjs";
5
- import { t as a } from "../placement.mjs";
6
- import { n as o, t as s } from "../dates.mjs";
7
- import { A as c, N as l, O as u, i as d, r as f, x as p } from "../date-math.mjs";
8
- import { l as m, s as h } from "../date-input.mjs";
9
- import { Path as g, Svg as _ } from "./svg.mjs";
10
- import { n as v } from "../date-environment.mjs";
11
- import ee from "./calendar.mjs";
4
+ import { a as n, t as r } from "../behavior.mjs";
5
+ import { t as i } from "../placement.mjs";
6
+ import { n as a, t as o } from "../dates.mjs";
7
+ import { A as s, N as c, O as l, i as u, r as d, x as f } from "../date-math.mjs";
8
+ import { l as p, s as m } from "../date-input.mjs";
9
+ import { a as h, t as g } from "../reporting.mjs";
10
+ import { Path as _, Svg as v } from "./svg.mjs";
11
+ import { n as ee } from "../date-environment.mjs";
12
+ import te from "./calendar.mjs";
12
13
  import { t as y } from "../layer.mjs";
13
14
  import b from "./overlay.mjs";
14
15
  import x from "./dateField.mjs";
15
16
  import { useCallback as S, useEffect as C, useMemo as w, useState as T } from "react";
16
- import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
17
+ import { Fragment as ne, jsx as E, jsxs as D } from "react/jsx-runtime";
17
18
  //#region src/components/datePicker.tsx
18
- function te() {
19
- return /* @__PURE__ */ D(_, {
19
+ function re() {
20
+ return /* @__PURE__ */ E(v, {
20
21
  viewBox: "0 0 16 16",
21
22
  width: "1rem",
22
23
  height: "1rem",
23
24
  props: { fill: "none" },
24
- children: /* @__PURE__ */ D(g, {
25
+ children: /* @__PURE__ */ E(_, {
25
26
  d: "M3 3.5h10a1 1 0 0 1 1 1V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4.5a1 1 0 0 1 1-1ZM2 7h12M5.5 2v3M10.5 2v3",
26
27
  stroke: "currentColor",
27
28
  strokeWidth: 1.5,
@@ -29,13 +30,13 @@ function te() {
29
30
  })
30
31
  });
31
32
  }
32
- function ne() {
33
- return /* @__PURE__ */ D(_, {
33
+ function ie() {
34
+ return /* @__PURE__ */ E(v, {
34
35
  viewBox: "0 0 16 16",
35
36
  width: "1rem",
36
37
  height: "1rem",
37
38
  props: { fill: "none" },
38
- children: /* @__PURE__ */ D(g, {
39
+ children: /* @__PURE__ */ E(_, {
39
40
  d: "M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12ZM8 5v3l2 1.5",
40
41
  stroke: "currentColor",
41
42
  strokeWidth: 1.5,
@@ -44,13 +45,13 @@ function ne() {
44
45
  })
45
46
  });
46
47
  }
47
- function re() {
48
- return /* @__PURE__ */ D(_, {
48
+ function ae() {
49
+ return /* @__PURE__ */ E(v, {
49
50
  viewBox: "0 0 16 16",
50
51
  width: "0.875rem",
51
52
  height: "0.875rem",
52
53
  props: { fill: "none" },
53
- children: /* @__PURE__ */ D(g, {
54
+ children: /* @__PURE__ */ E(_, {
54
55
  d: "m4.5 4.5 7 7m0-7-7 7",
55
56
  stroke: "currentColor",
56
57
  strokeWidth: 1.5,
@@ -58,12 +59,12 @@ function re() {
58
59
  })
59
60
  });
60
61
  }
61
- function k(e, t) {
62
+ function O(e, t) {
62
63
  typeof e == "function" ? e(t) : e && (e.current = t);
63
64
  }
64
- function ie(e) {
65
- let [r, i] = T(null), o = e.ref, s = S((e) => {
66
- i(e), k(o, e);
65
+ function oe(e) {
66
+ let [r, a] = T(null), o = e.ref, s = S((e) => {
67
+ a(e), O(o, e);
67
68
  }, [o]), c = (e) => {
68
69
  if (!e || e.contains(document.activeElement) && document.activeElement !== e) return;
69
70
  let t = [
@@ -78,11 +79,15 @@ function ie(e) {
78
79
  open: e.open,
79
80
  defaultOpen: e.defaultOpen,
80
81
  onOpenChange: e.onOpenChange,
82
+ interaction: {
83
+ component: "datePicker",
84
+ type: "openChange"
85
+ },
81
86
  onOpened: l,
82
87
  onClosing: (e, t) => {
83
88
  e && t?.focus();
84
89
  }
85
- }), v = a({
90
+ }), v = i({
86
91
  side: e.side,
87
92
  align: e.align,
88
93
  offset: 1,
@@ -108,7 +113,7 @@ function ie(e) {
108
113
  "aria-label": e.label,
109
114
  tabIndex: -1
110
115
  };
111
- return u ? /* @__PURE__ */ D(t, {
116
+ return u ? /* @__PURE__ */ E(t, {
112
117
  ref: p,
113
118
  component: "popover",
114
119
  variant: { topLayer: !0 },
@@ -120,7 +125,7 @@ function ie(e) {
120
125
  ...i
121
126
  },
122
127
  children: d ? n : null
123
- }) : d && /* @__PURE__ */ D(b, {
128
+ }) : d && /* @__PURE__ */ E(b, {
124
129
  contentRef: p,
125
130
  anchor: r,
126
131
  side: e.side,
@@ -135,14 +140,14 @@ function ie(e) {
135
140
  }
136
141
  };
137
142
  }
138
- function ae(e) {
139
- let { value: n, step: r, locale: a, hourCycle: o, onSelect: c, label: l } = e, u = w(() => m(r), [r]), d = h(n, r), f = Math.max(0, d ? u.indexOf(d) : u.indexOf("09:00:00")), p = i({
143
+ function se(e) {
144
+ let { value: n, step: i, locale: a, hourCycle: s, onSelect: c, label: l } = e, u = w(() => p(i), [i]), d = m(n, i), f = Math.max(0, d ? u.indexOf(d) : u.indexOf("09:00:00")), h = r({
140
145
  count: u.length,
141
146
  defaultActiveIndex: f,
142
147
  loop: !1,
143
148
  onSelect: (e, t) => c(u[e], t)
144
149
  });
145
- return /* @__PURE__ */ D(t, {
150
+ return /* @__PURE__ */ E(t, {
146
151
  component: "datePicker.times",
147
152
  position: "relative",
148
153
  display: "flex",
@@ -155,9 +160,9 @@ function ae(e) {
155
160
  props: {
156
161
  role: "listbox",
157
162
  "aria-label": l,
158
- onKeyDown: p.onKeyDown
163
+ onKeyDown: h.onKeyDown
159
164
  },
160
- children: u.map((e, n) => /* @__PURE__ */ D(t, {
165
+ children: u.map((e, n) => /* @__PURE__ */ E(t, {
161
166
  component: "datePicker.time",
162
167
  variant: { selected: e === d },
163
168
  px: 3,
@@ -170,20 +175,20 @@ function ae(e) {
170
175
  props: {
171
176
  role: "option",
172
177
  "aria-selected": e === d,
173
- ...p.itemProps(n),
178
+ ...h.itemProps(n),
174
179
  onClick: (t) => c(e, t)
175
180
  },
176
- children: s(e, {
181
+ children: o(e, {
177
182
  locale: a,
178
183
  hour: "numeric",
179
184
  minute: "2-digit",
180
- hourCycle: o === void 0 ? void 0 : o === 12 ? "h12" : "h23"
185
+ hourCycle: s === void 0 ? void 0 : s === 12 ? "h12" : "h23"
181
186
  })
182
187
  }, e))
183
188
  });
184
189
  }
185
- function oe(e) {
186
- return /* @__PURE__ */ D(t, {
190
+ function ce(e) {
191
+ return /* @__PURE__ */ E(t, {
187
192
  component: "datePicker.presets",
188
193
  display: "flex",
189
194
  d: "column",
@@ -191,7 +196,7 @@ function oe(e) {
191
196
  pe: 2,
192
197
  be: 1,
193
198
  props: { role: "group" },
194
- children: e.presets.map((n) => /* @__PURE__ */ D(t, {
199
+ children: e.presets.map((n) => /* @__PURE__ */ E(t, {
195
200
  tag: "button",
196
201
  component: "datePicker.preset",
197
202
  variant: { selected: e.isSelected(n.value) },
@@ -209,51 +214,56 @@ function oe(e) {
209
214
  }, n.label))
210
215
  });
211
216
  }
212
- function A(e, n) {
213
- let { type: i = "date", value: a, defaultValue: o = null, onValueChange: m, zone: h, locale: g, hourCycle: _, granularity: y, disambiguation: b, min: S, max: C, isDateUnavailable: w, disabled: T = !1, readOnly: k = !1, required: A, invalid: j, name: M, label: N, labelledBy: se, describedBy: ce, open: le, defaultOpen: ue, onOpenChange: P, closeOnSelect: F = !0, firstDayOfWeek: I, weekNumbers: L, side: de = "bottom", align: R = "start", clearable: fe = !1, triggerLabel: z, clearLabel: pe = "Clear", tabIndex: B, step: V = 30, defaultTime: H = "00:00", presets: U, showZone: me, ...he } = e, W = v({
214
- locale: g,
215
- zone: h === "none" ? void 0 : h
216
- }), { locale: G } = W, K = i === "datetime" && h !== "none" ? W.zone : null, q = K ?? W.zone, [J, Y] = r({
217
- value: a,
218
- defaultValue: o,
219
- onChange: (e, t) => m?.(e, {
217
+ function k(e, n) {
218
+ let { type: r = "date", value: i, defaultValue: a = null, onValueChange: p, zone: m, locale: _, hourCycle: v, granularity: y, disambiguation: b, min: S, max: C, isDateUnavailable: w, disabled: T = !1, readOnly: O = !1, required: k, invalid: A, name: j, label: M, labelledBy: le, describedBy: ue, open: N, defaultOpen: P, onOpenChange: de, closeOnSelect: F = !0, firstDayOfWeek: I, weekNumbers: fe, side: L = "bottom", align: pe = "start", clearable: R = !1, triggerLabel: z, clearLabel: B = "Clear", tabIndex: V, step: H = 30, defaultTime: U = "00:00", presets: W, showZone: me, ...he } = e, G = ee({
219
+ locale: _,
220
+ zone: m === "none" ? void 0 : m
221
+ }), { locale: K } = G, q = r === "datetime" && m !== "none" ? G.zone : null, J = q ?? G.zone, [Y, X] = h({
222
+ value: i,
223
+ defaultValue: a,
224
+ onChange: (e, t) => p?.(e, {
220
225
  ...t,
221
- ...p(e, q)
222
- })
223
- }), X = z ?? (i === "time" ? "Choose time" : "Choose date"), Z = typeof N == "string" ? N : X, { attachTrigger: Q, triggerAttributes: ge, closeOnChoice: _e, attachField: ve, panel: ye } = ie({
226
+ ...f(e, J)
227
+ }),
228
+ interaction: {
229
+ component: "datePicker",
230
+ type: "valueChange",
231
+ content: ["value"]
232
+ }
233
+ }), Z = z ?? (r === "time" ? "Choose time" : "Choose date"), Q = typeof M == "string" ? M : Z, { attachTrigger: ge, triggerAttributes: _e, closeOnChoice: ve, attachField: ye, panel: be } = oe({
224
234
  ref: n,
225
- open: le,
226
- defaultOpen: ue,
227
- onOpenChange: P,
228
- side: de,
229
- align: R,
230
- label: Z
231
- }), be = J && i !== "time" ? u(J, { zone: q }) : null, xe = J && i !== "date" ? c(J, { zone: q }) : null, Se = J ? s(J, {
232
- locale: G,
233
- zone: q,
234
- ...i === "date" ? { dateStyle: "medium" } : i === "time" ? { timeStyle: "short" } : {
235
+ open: N,
236
+ defaultOpen: P,
237
+ onOpenChange: de,
238
+ side: L,
239
+ align: pe,
240
+ label: Q
241
+ }), xe = Y && r !== "time" ? l(Y, { zone: J }) : null, Se = Y && r !== "date" ? s(Y, { zone: J }) : null, Ce = Y ? o(Y, {
242
+ locale: K,
243
+ zone: J,
244
+ ...r === "date" ? { dateStyle: "medium" } : r === "time" ? { timeStyle: "short" } : {
235
245
  dateStyle: "medium",
236
246
  timeStyle: "short"
237
247
  }
238
- }) : "", $ = _e, Ce = (e, t) => f(e, t, K ? {
239
- zone: K,
248
+ }) : "", $ = ve, we = (e, t) => d(e, t, q ? {
249
+ zone: q,
240
250
  disambiguation: b
241
- } : {}), we = (e, t) => {
242
- e && (i === "date" ? (Y(e, {
251
+ } : {}), Te = (e, t) => {
252
+ e && (r === "date" ? (X(e, {
243
253
  reason: "select",
244
254
  event: t
245
- }), F && $(t)) : Y(Ce(e, xe ?? H), {
255
+ }), F && $(t)) : X(we(e, Se ?? U), {
246
256
  reason: "select",
247
257
  event: t
248
258
  }));
249
- }, Te = (e, t) => {
250
- Y(i === "time" ? e : Ce(be ?? l(q), e), {
259
+ }, Ee = (e, t) => {
260
+ X(r === "time" ? e : we(xe ?? c(J), e), {
251
261
  reason: "select",
252
262
  event: t
253
263
  }), F && $(t);
254
- }, Ee = /* @__PURE__ */ D(t, {
264
+ }, De = /* @__PURE__ */ E(t, {
255
265
  tag: "button",
256
- ref: Q,
266
+ ref: ge,
257
267
  component: "datePicker.trigger",
258
268
  display: "inline-flex",
259
269
  ai: "center",
@@ -263,15 +273,15 @@ function A(e, n) {
263
273
  ms: 2,
264
274
  me: -1.5,
265
275
  borderRadius: 1.5,
266
- disabled: T || k,
276
+ disabled: T || O,
267
277
  props: {
268
278
  type: "button",
269
- "aria-label": Se ? `${X}, ${Se}` : X,
270
- tabIndex: B,
271
- ...ge
279
+ "aria-label": Ce ? `${Z}, ${Ce}` : Z,
280
+ tabIndex: V,
281
+ ..._e
272
282
  },
273
- children: D(i === "time" ? ne : te, {})
274
- }), De = fe && J && !T && !k && /* @__PURE__ */ D(t, {
283
+ children: E(r === "time" ? ie : re, {})
284
+ }), Oe = R && Y && !T && !O && /* @__PURE__ */ E(t, {
275
285
  tag: "button",
276
286
  component: "datePicker.clear",
277
287
  display: "inline-flex",
@@ -283,105 +293,110 @@ function A(e, n) {
283
293
  borderRadius: 999,
284
294
  props: {
285
295
  type: "button",
286
- "aria-label": pe,
287
- tabIndex: B,
288
- onClick: (e) => Y(null, {
296
+ "aria-label": B,
297
+ tabIndex: V,
298
+ onClick: (e) => X(null, {
289
299
  reason: "clear",
290
300
  event: e
291
301
  })
292
302
  },
293
- children: /* @__PURE__ */ D(re, {})
303
+ children: /* @__PURE__ */ E(ae, {})
294
304
  });
295
- return /* @__PURE__ */ O(E, { children: [/* @__PURE__ */ D(x, {
296
- ref: ve,
305
+ return /* @__PURE__ */ D(g, { children: [/* @__PURE__ */ E(x, {
306
+ ref: ye,
297
307
  ...he,
298
- type: i,
299
- value: J,
300
- onValueChange: (e, t) => Y(e, {
308
+ type: r,
309
+ value: Y,
310
+ onValueChange: (e, t) => X(e, {
301
311
  reason: t.reason,
302
312
  event: t.event
303
313
  }),
304
- zone: h,
305
- locale: g,
306
- hourCycle: _,
314
+ zone: m,
315
+ locale: _,
316
+ hourCycle: v,
307
317
  granularity: y,
308
318
  disambiguation: b,
309
319
  min: S,
310
320
  max: C,
311
321
  isDateUnavailable: w,
312
322
  disabled: T,
313
- readOnly: k,
314
- required: A,
315
- invalid: j,
316
- name: M,
317
- label: N,
318
- labelledBy: se,
319
- describedBy: ce,
323
+ readOnly: O,
324
+ required: k,
325
+ invalid: A,
326
+ name: j,
327
+ label: M,
328
+ labelledBy: le,
329
+ describedBy: ue,
320
330
  showZone: me,
321
- tabIndex: B,
322
- end: /* @__PURE__ */ O(E, { children: [De, Ee] })
323
- }), ye(/* @__PURE__ */ O(t, {
331
+ tabIndex: V,
332
+ end: /* @__PURE__ */ D(ne, { children: [Oe, De] })
333
+ }), be(/* @__PURE__ */ D(t, {
324
334
  display: "flex",
325
335
  gap: 3,
326
336
  ai: "stretch",
327
337
  children: [
328
- U && U.length > 0 && /* @__PURE__ */ D(oe, {
329
- presets: U,
330
- isSelected: (e) => J !== null && d(e, J, { zone: q }) === 0,
338
+ W && W.length > 0 && /* @__PURE__ */ E(ce, {
339
+ presets: W,
340
+ isSelected: (e) => Y !== null && u(e, Y, { zone: J }) === 0,
331
341
  onSelect: (e, t) => {
332
- Y(e, {
342
+ X(e, {
333
343
  reason: "preset",
334
344
  event: t
335
345
  }), F && $(t);
336
346
  }
337
347
  }),
338
- i !== "time" && /* @__PURE__ */ D(ee, {
339
- value: be,
340
- onValueChange: (e, t) => we(e, t.event),
341
- min: S ? u(S, { zone: q }) : void 0,
342
- max: C ? u(C, { zone: q }) : void 0,
348
+ r !== "time" && /* @__PURE__ */ E(te, {
349
+ value: xe,
350
+ onValueChange: (e, t) => Te(e, t.event),
351
+ min: S ? l(S, { zone: J }) : void 0,
352
+ max: C ? l(C, { zone: J }) : void 0,
343
353
  isDateUnavailable: w,
344
- locale: g,
345
- zone: h === "none" ? void 0 : h,
354
+ locale: _,
355
+ zone: m === "none" ? void 0 : m,
346
356
  firstDayOfWeek: I,
347
- weekNumbers: L
357
+ weekNumbers: fe
348
358
  }),
349
- i !== "date" && /* @__PURE__ */ D(ae, {
350
- value: xe,
351
- step: V,
352
- locale: G,
353
- hourCycle: _,
354
- label: i === "time" ? Z : "Time",
355
- onSelect: Te
359
+ r !== "date" && /* @__PURE__ */ E(se, {
360
+ value: Se,
361
+ step: H,
362
+ locale: K,
363
+ hourCycle: v,
364
+ label: r === "time" ? Q : "Time",
365
+ onSelect: Ee
356
366
  })
357
367
  ]
358
368
  }))] });
359
369
  }
360
- function j(e, n) {
361
- let { value: i, defaultValue: a = null, onValueChange: s, locale: c, min: l, max: u, isDateUnavailable: f, disabled: p = !1, readOnly: m = !1, required: h, invalid: g, startName: _, endName: y, label: b, labelledBy: S, describedBy: C, startLabel: w = "Start date", endLabel: ne = "End date", open: k, defaultOpen: ae, onOpenChange: A, closeOnSelect: j = !0, firstDayOfWeek: M, weekNumbers: N, months: se = 2, side: ce = "bottom", align: le = "start", clearable: ue = !1, triggerLabel: P = "Choose dates", clearLabel: F = "Clear", tabIndex: I, presets: L, props: de, ...R } = e, { locale: fe } = v({ locale: c }), [z, pe] = r({
362
- value: i,
363
- defaultValue: a,
364
- onChange: s
370
+ function A(e, n) {
371
+ let { value: r, defaultValue: i = null, onValueChange: o, locale: s, min: c, max: l, isDateUnavailable: d, disabled: f = !1, readOnly: p = !1, required: m, invalid: _, startName: v, endName: y, label: b, labelledBy: S, describedBy: C, startLabel: w = "Start date", endLabel: ne = "End date", open: ie, defaultOpen: O, onOpenChange: se, closeOnSelect: k = !0, firstDayOfWeek: A, weekNumbers: j, months: M = 2, side: le = "bottom", align: ue = "start", clearable: N = !1, triggerLabel: P = "Choose dates", clearLabel: de = "Clear", tabIndex: F, presets: I, props: fe, ...L } = e, { locale: pe } = ee({ locale: s }), [R, z] = h({
372
+ value: r,
373
+ defaultValue: i,
374
+ onChange: o,
375
+ interaction: {
376
+ component: "dateRangePicker",
377
+ type: "valueChange",
378
+ content: ["value"]
379
+ }
365
380
  }), [B, V] = T({
366
- start: z?.start ?? null,
367
- end: z?.end ?? null,
368
- source: z
381
+ start: R?.start ?? null,
382
+ end: R?.end ?? null,
383
+ source: R
369
384
  }), { start: H, end: U } = B;
370
- B.source !== z && (H = z?.start ?? null, U = z?.end ?? null, V({
385
+ B.source !== R && (H = R?.start ?? null, U = R?.end ?? null, V({
371
386
  start: H,
372
387
  end: U,
373
- source: z
388
+ source: R
374
389
  }));
375
- let { attachTrigger: me, triggerAttributes: he, closeOnChoice: W, id: G, attachField: K, panel: q } = ie({
390
+ let { attachTrigger: W, triggerAttributes: me, closeOnChoice: he, id: G, attachField: K, panel: q } = oe({
376
391
  ref: n,
377
- open: k,
378
- defaultOpen: ae,
379
- onOpenChange: A,
380
- side: ce,
381
- align: le,
392
+ open: ie,
393
+ defaultOpen: O,
394
+ onOpenChange: se,
395
+ side: le,
396
+ align: ue,
382
397
  label: typeof b == "string" ? b : P
383
- }), J = z ? o(z.start, z.end, { locale: fe }) : "", Y = H !== null && U !== null && d(H, U) > 0, X = (e, t, n, r) => {
384
- let i = e && t && d(e, t) <= 0 ? {
398
+ }), J = R ? a(R.start, R.end, { locale: pe }) : "", Y = H !== null && U !== null && u(H, U) > 0, X = (e, t, n, r) => {
399
+ let i = e && t && u(e, t) <= 0 ? {
385
400
  start: e,
386
401
  end: t
387
402
  } : null;
@@ -389,25 +404,25 @@ function j(e, n) {
389
404
  start: e,
390
405
  end: t,
391
406
  source: i
392
- }), pe(i, {
407
+ }), z(i, {
393
408
  reason: n,
394
409
  event: r
395
410
  });
396
- }, Z = W, Q = {
397
- locale: c,
398
- min: l,
399
- max: u,
400
- isDateUnavailable: f,
401
- disabled: p,
402
- readOnly: m,
403
- required: h,
411
+ }, Z = he, Q = {
412
+ locale: s,
413
+ min: c,
414
+ max: l,
415
+ isDateUnavailable: d,
416
+ disabled: f,
417
+ readOnly: p,
418
+ required: m,
404
419
  component: "datePicker.part",
405
420
  px: 0,
406
421
  py: 0,
407
- tabIndex: I
422
+ tabIndex: F
408
423
  };
409
- return /* @__PURE__ */ O(E, { children: [
410
- b !== void 0 && /* @__PURE__ */ D(t, {
424
+ return /* @__PURE__ */ D(g, { children: [
425
+ b !== void 0 && /* @__PURE__ */ E(t, {
411
426
  component: "dateField.label",
412
427
  display: "block",
413
428
  mb: 1.5,
@@ -415,7 +430,7 @@ function j(e, n) {
415
430
  id: `${G}-label`,
416
431
  children: b
417
432
  }),
418
- /* @__PURE__ */ O(t, {
433
+ /* @__PURE__ */ D(t, {
419
434
  ref: K,
420
435
  component: "dateField",
421
436
  display: "inline-flex",
@@ -423,41 +438,41 @@ function j(e, n) {
423
438
  gap: 2,
424
439
  px: 3,
425
440
  py: 2,
426
- ...R,
427
- variant: [R.variant, {
428
- disabled: p,
429
- invalid: g ?? Y
441
+ ...L,
442
+ variant: [L.variant, {
443
+ disabled: f,
444
+ invalid: _ ?? Y
430
445
  }],
431
446
  props: {
432
447
  role: "group",
433
448
  "aria-labelledby": [b === void 0 ? void 0 : `${G}-label`, S].filter(Boolean).join(" ") || void 0,
434
- "aria-invalid": (g ?? Y) || void 0,
449
+ "aria-invalid": (_ ?? Y) || void 0,
435
450
  "aria-describedby": C,
436
- ...de
451
+ ...fe
437
452
  },
438
453
  children: [
439
- /* @__PURE__ */ D(x, {
454
+ /* @__PURE__ */ E(x, {
440
455
  ...Q,
441
456
  value: H,
442
457
  onValueChange: (e, t) => X(e, U, t.reason, t.event),
443
- name: _,
458
+ name: v,
444
459
  props: { "aria-label": w },
445
- invalid: g ?? Y
460
+ invalid: _ ?? Y
446
461
  }),
447
- /* @__PURE__ */ D(t, {
462
+ /* @__PURE__ */ E(t, {
448
463
  component: "dateField.literal",
449
464
  props: { "aria-hidden": !0 },
450
465
  children: "–"
451
466
  }),
452
- /* @__PURE__ */ D(x, {
467
+ /* @__PURE__ */ E(x, {
453
468
  ...Q,
454
469
  value: U,
455
470
  onValueChange: (e, t) => X(H, e, t.reason, t.event),
456
471
  name: y,
457
472
  props: { "aria-label": ne },
458
- invalid: g ?? Y
473
+ invalid: _ ?? Y
459
474
  }),
460
- ue && z && !p && !m && /* @__PURE__ */ D(t, {
475
+ N && R && !f && !p && /* @__PURE__ */ E(t, {
461
476
  tag: "button",
462
477
  component: "datePicker.clear",
463
478
  display: "inline-flex",
@@ -468,15 +483,15 @@ function j(e, n) {
468
483
  borderRadius: 999,
469
484
  props: {
470
485
  type: "button",
471
- "aria-label": F,
472
- tabIndex: I,
486
+ "aria-label": de,
487
+ tabIndex: F,
473
488
  onClick: (e) => X(null, null, "clear", e)
474
489
  },
475
- children: /* @__PURE__ */ D(re, {})
490
+ children: /* @__PURE__ */ E(ae, {})
476
491
  }),
477
- /* @__PURE__ */ D(t, {
492
+ /* @__PURE__ */ E(t, {
478
493
  tag: "button",
479
- ref: me,
494
+ ref: W,
480
495
  component: "datePicker.trigger",
481
496
  display: "inline-flex",
482
497
  ai: "center",
@@ -485,45 +500,45 @@ function j(e, n) {
485
500
  height: 7,
486
501
  me: -1.5,
487
502
  borderRadius: 1.5,
488
- disabled: p || m,
503
+ disabled: f || p,
489
504
  props: {
490
505
  type: "button",
491
506
  "aria-label": J ? `${P}, ${J}` : P,
492
- tabIndex: I,
493
- ...he
507
+ tabIndex: F,
508
+ ...me
494
509
  },
495
- children: /* @__PURE__ */ D(te, {})
510
+ children: /* @__PURE__ */ E(re, {})
496
511
  })
497
512
  ]
498
513
  }),
499
- q(/* @__PURE__ */ O(t, {
514
+ q(/* @__PURE__ */ D(t, {
500
515
  display: "flex",
501
516
  gap: 3,
502
517
  ai: "stretch",
503
- children: [L && L.length > 0 && /* @__PURE__ */ D(oe, {
504
- presets: L,
505
- isSelected: (e) => z !== null && e.start === z.start && e.end === z.end,
518
+ children: [I && I.length > 0 && /* @__PURE__ */ E(ce, {
519
+ presets: I,
520
+ isSelected: (e) => R !== null && e.start === R.start && e.end === R.end,
506
521
  onSelect: (e, t) => {
507
- X(e.start, e.end, "preset", t), j && Z(t);
522
+ X(e.start, e.end, "preset", t), k && Z(t);
508
523
  }
509
- }), /* @__PURE__ */ D(ee, {
524
+ }), /* @__PURE__ */ E(te, {
510
525
  mode: "range",
511
- months: se,
512
- value: z,
526
+ months: M,
527
+ value: R,
513
528
  defaultFocusedDate: H ?? void 0,
514
529
  onValueChange: (e, t) => {
515
- X(e?.start ?? null, e?.end ?? null, "select", t.event), j && e && t.event && Z(t.event);
530
+ X(e?.start ?? null, e?.end ?? null, "select", t.event), k && e && t.event && Z(t.event);
516
531
  },
517
- min: l,
518
- max: u,
519
- isDateUnavailable: f,
520
- locale: c,
521
- firstDayOfWeek: M,
522
- weekNumbers: N
532
+ min: c,
533
+ max: l,
534
+ isDateUnavailable: d,
535
+ locale: s,
536
+ firstDayOfWeek: A,
537
+ weekNumbers: j
523
538
  })]
524
539
  }))
525
540
  ] });
526
541
  }
527
- var M = e(A, "DatePicker"), N = e(j, "DateRangePicker");
542
+ var j = e(k, "DatePicker"), M = e(A, "DateRangePicker");
528
543
  //#endregion
529
- export { N as DateRangePicker, M as default };
544
+ export { M as DateRangePicker, j as default };