impact-nova 1.8.2 → 1.8.3

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 (13) hide show
  1. package/dist/components/ui/calendar.js +2 -3
  2. package/dist/components/ui/combobox.d.ts +1 -0
  3. package/dist/components/ui/combobox.js +116 -102
  4. package/dist/components/ui/date-picker/date-picker.js +52 -50
  5. package/dist/components/ui/date-picker/date-range-picker.js +92 -90
  6. package/dist/components/ui/date-picker/month-picker.js +57 -55
  7. package/dist/components/ui/date-picker/month-range-picker.js +84 -82
  8. package/dist/components/ui/date-picker/multi-date-picker.js +45 -43
  9. package/dist/components/ui/date-picker/week-range-picker.js +77 -75
  10. package/dist/components/ui/expandable-sku/expandable-sku.js +10 -10
  11. package/dist/components/ui/filter-strip/filter-tag-list.d.ts +8 -1
  12. package/dist/components/ui/filter-strip/filter-tag-list.js +99 -85
  13. package/package.json +1 -1
package/dist/components/ui/date-picker/month-range-picker.js CHANGED
@@ -1,17 +1,17 @@
1
- import { jsxs as u, jsx as d } from "react/jsx-runtime";
1
+ import { jsxs as h, jsx as d } from "react/jsx-runtime";
2
2
  import * as p from "react";
3
3
  import { X as ht } from "lucide-react";
4
4
  import { CalendarMonth as gt, Info as G } from "../../../icons/index.js";
5
- import { isValid as x, parse as M } from "date-fns";
6
- import { cn as h, padValidDateString as R, maskDate as J } from "../../../lib/utils.js";
5
+ import { isValid as M, parse as Y } from "date-fns";
6
+ import { cn as g, padValidDateString as R, maskDate as J } from "../../../lib/utils.js";
7
7
  import { Popover as xt, PopoverTrigger as Mt, PopoverContent as Yt } from "../popover.js";
8
8
  import { Calendar as yt } from "../calendar.js";
9
9
  import { Tooltip as L, TooltipTrigger as Q, TooltipContent as U } from "../tooltip.js";
10
- import { useImpactNovaI18n as bt } from "../../../i18n/ImpactNovaI18nContext.js";
10
+ import { useImpactNovaI18n as wt } from "../../../i18n/ImpactNovaI18nContext.js";
11
11
  const m = (e, i = "MM/YYYY") => {
12
12
  const A = (e.month + 1).toString().padStart(2, "0");
13
13
  return i === "YYYY/MM" ? `${e.year}/${A}` : `${A}/${e.year}`;
14
- }, wt = p.forwardRef(
14
+ }, bt = p.forwardRef(
15
15
  ({
16
16
  value: e,
17
17
  onChange: i,
@@ -20,10 +20,10 @@ const m = (e, i = "MM/YYYY") => {
20
20
  maxDate: W,
21
21
  startMonth: Z,
22
22
  endMonth: _,
23
- showFooter: g = !0,
24
- disabled: P,
23
+ showFooter: x = !0,
24
+ disabled: u,
25
25
  className: F,
26
- isError: D,
26
+ isError: S,
27
27
  size: B,
28
28
  label: O,
29
29
  helperText: E,
@@ -34,74 +34,74 @@ const m = (e, i = "MM/YYYY") => {
34
34
  displayFormat: a = "MM/YYYY",
35
35
  ...et
36
36
  }, nt) => {
37
- const { t: Y } = bt();
38
- A ?? Y("datePicker.selectMonthRange");
37
+ const { t: y } = wt();
38
+ A ?? y("datePicker.selectMonthRange");
39
39
  const T = p.useRef(null), ot = p.useRef(null), c = p.useMemo(
40
40
  () => a === "YYYY/MM" ? "yyyy/MM" : "MM/yyyy",
41
41
  [a]
42
42
  );
43
43
  p.useImperativeHandle(nt, () => T.current);
44
- const [s, y] = p.useState(!1), V = p.useRef(!1), [v, b] = p.useState(e), [w, S] = p.useState(e?.from ? m(e.from, a) : ""), [k, N] = p.useState(e?.to ? m(e.to, a) : ""), [rt, j] = p.useState(() => e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date());
44
+ const [s, w] = p.useState(!1), V = p.useRef(!1), [v, b] = p.useState(e), [k, N] = p.useState(e?.from ? m(e.from, a) : ""), [D, P] = p.useState(e?.to ? m(e.to, a) : ""), [rt, j] = p.useState(() => e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date());
45
45
  p.useEffect(() => {
46
- s || (S(e?.from ? m(e.from, a) : ""), N(e?.to ? m(e.to, a) : ""), b(e));
46
+ s || (N(e?.from ? m(e.from, a) : ""), P(e?.to ? m(e.to, a) : ""), b(e));
47
47
  }, [s, e, a]), p.useEffect(() => {
48
- s && (b(e), S(e?.from ? m(e.from, a) : ""), N(e?.to ? m(e.to, a) : ""), j(e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date()));
48
+ s && (b(e), N(e?.from ? m(e.from, a) : ""), P(e?.to ? m(e.to, a) : ""), j(e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date()));
49
49
  }, [s, e, a, I]);
50
50
  const at = (t) => {
51
- b(t), t?.from && S(m(t.from, a)), t?.to && N(m(t.to, a)), !g && t?.from && t?.to && (t.from.month !== t.to.month || t.from.year !== t.to.year) && (i?.(t), y(!1));
51
+ b(t), t?.from && N(m(t.from, a)), t?.to && P(m(t.to, a)), !x && t?.from && t?.to && (t.from.month !== t.to.month || t.from.year !== t.to.year) && (i?.(t), w(!1));
52
52
  }, st = (t) => {
53
- i?.(t !== void 0 ? t : v), y(!1);
53
+ i?.(t !== void 0 ? t : v), w(!1);
54
54
  }, $ = () => {
55
- b(e), S(e?.from ? m(e.from, a) : ""), N(e?.to ? m(e.to, a) : ""), y(!1);
55
+ b(e), N(e?.from ? m(e.from, a) : ""), P(e?.to ? m(e.to, a) : ""), w(!1);
56
56
  }, z = () => {
57
- b(void 0), S(""), N(""), i?.(void 0), g || y(!1);
57
+ b(void 0), N(""), P(""), i?.(void 0), x || w(!1);
58
58
  }, it = (t) => {
59
- const f = t.target.value, r = J(f, c, w);
60
- if (S(r), r === "") {
59
+ const f = t.target.value, r = J(f, c, k);
60
+ if (N(r), r === "") {
61
61
  const o = { from: void 0, to: v?.to };
62
- b(o), g || i?.(o);
62
+ b(o), x || i?.(o);
63
63
  return;
64
64
  }
65
- const n = M(r, c, /* @__PURE__ */ new Date());
66
- if (x(n) && r.length === 7) {
65
+ const n = Y(r, c, /* @__PURE__ */ new Date());
66
+ if (M(n) && r.length === 7) {
67
67
  const l = { from: { month: n.getMonth(), year: n.getFullYear() }, to: v?.to };
68
- b(l), j(n), g || i?.(l);
68
+ b(l), j(n), x || i?.(l);
69
69
  }
70
70
  }, ct = (t) => {
71
- const f = t.target.value, r = J(f, c, k);
72
- if (N(r), r === "") {
71
+ const f = t.target.value, r = J(f, c, D);
72
+ if (P(r), r === "") {
73
73
  const o = { from: v?.from, to: void 0 };
74
- b(o), g || i?.(o);
74
+ b(o), x || i?.(o);
75
75
  return;
76
76
  }
77
- const n = M(r, c, /* @__PURE__ */ new Date());
78
- if (x(n) && r.length === 7) {
77
+ const n = Y(r, c, /* @__PURE__ */ new Date());
78
+ if (M(n) && r.length === 7) {
79
79
  const o = { month: n.getMonth(), year: n.getFullYear() }, l = { from: v?.from, to: o };
80
- b(l), j(n), g || i?.(l);
80
+ b(l), j(n), x || i?.(l);
81
81
  }
82
82
  }, H = () => {
83
83
  if (s) return;
84
- const t = R(w, c), f = R(k, c), r = M(t, c, /* @__PURE__ */ new Date()), n = M(f, c, /* @__PURE__ */ new Date()), o = x(r) && t.length === 7, l = x(n) && f.length === 7;
85
- w && !o ? S(e?.from ? m(e.from, a) : "") : o && S(t), k && !l ? N(e?.to ? m(e.to, a) : "") : l && N(f), o && l && !g ? i?.({
84
+ const t = R(k, c), f = R(D, c), r = Y(t, c, /* @__PURE__ */ new Date()), n = Y(f, c, /* @__PURE__ */ new Date()), o = M(r) && t.length === 7, l = M(n) && f.length === 7;
85
+ k && !o ? N(e?.from ? m(e.from, a) : "") : o && N(t), D && !l ? P(e?.to ? m(e.to, a) : "") : l && P(f), o && l && !x ? i?.({
86
86
  from: { month: r.getMonth(), year: r.getFullYear() },
87
87
  to: { month: n.getMonth(), year: n.getFullYear() }
88
- }) : o && !g ? i?.({
88
+ }) : o && !x ? i?.({
89
89
  from: { month: r.getMonth(), year: r.getFullYear() },
90
90
  to: e?.to
91
- }) : l && !g && i?.({
91
+ }) : l && !x && i?.({
92
92
  from: e?.from,
93
93
  to: { month: n.getMonth(), year: n.getFullYear() }
94
94
  });
95
- }, dt = e?.from ? m(e.from, a) : "", lt = e?.to ? m(e.to, a) : "", ft = w !== dt, mt = k !== lt, pt = w.length === 7 && !x(M(w, c, /* @__PURE__ */ new Date())), ut = k.length === 7 && !x(M(k, c, /* @__PURE__ */ new Date())), X = Y("datePicker.startMonth"), q = Y("datePicker.endMonth");
96
- return /* @__PURE__ */ u("div", { className: "flex w-full min-w-[240px] flex-col gap-[6px]", "data-component": "month-range-picker", "data-disabled": P || void 0, children: [
97
- /* @__PURE__ */ u("div", { className: "flex flex-col gap-[6px]", children: [
98
- O && /* @__PURE__ */ u(
95
+ }, dt = e?.from ? m(e.from, a) : "", lt = e?.to ? m(e.to, a) : "", ft = k !== dt, mt = D !== lt, pt = k.length === 7 && !M(Y(k, c, /* @__PURE__ */ new Date())), ut = D.length === 7 && !M(Y(D, c, /* @__PURE__ */ new Date())), X = y("datePicker.startMonth"), q = y("datePicker.endMonth");
96
+ return /* @__PURE__ */ h("div", { className: "flex w-full min-w-[240px] flex-col gap-[6px]", "data-component": "month-range-picker", "data-disabled": u || void 0, children: [
97
+ /* @__PURE__ */ h("div", { className: "flex flex-col gap-[6px]", children: [
98
+ O && /* @__PURE__ */ h(
99
99
  "label",
100
100
  {
101
- className: h(
101
+ className: g(
102
102
  "text-xs font-medium leading-[18px] text-content-tertiary",
103
- P && "opacity-70",
104
- D && "text-destructive"
103
+ u && "opacity-70",
104
+ S && "text-destructive"
105
105
  ),
106
106
  children: [
107
107
  O,
@@ -110,42 +110,44 @@ const m = (e, i = "MM/YYYY") => {
110
110
  ]
111
111
  }
112
112
  ),
113
- /* @__PURE__ */ u(
113
+ /* @__PURE__ */ h(
114
114
  "div",
115
115
  {
116
- className: h(
116
+ className: g(
117
117
  "w-full",
118
118
  E && K === "absolute" && "relative"
119
119
  ),
120
120
  children: [
121
- /* @__PURE__ */ u(xt, { open: s, onOpenChange: y, children: [
122
- /* @__PURE__ */ d(Mt, { asChild: !0, children: /* @__PURE__ */ u(
121
+ /* @__PURE__ */ h(xt, { open: u ? !1 : s, onOpenChange: (t) => {
122
+ u || w(t);
123
+ }, children: [
124
+ /* @__PURE__ */ d(Mt, { asChild: !0, children: /* @__PURE__ */ h(
123
125
  "div",
124
126
  {
125
127
  "data-state": s ? "open" : "closed",
126
- className: h(
128
+ className: g(
127
129
  "flex w-full items-center justify-between gap-2 rounded-md border bg-canvas-elevated px-3 text-sm shadow-sm transition-colors hover:border-brand disabled:cursor-not-allowed disabled:bg-disabled-surface disabled:text-disabled-foreground disabled:border-stroke",
128
- D ? "border-destructive hover:border-destructive" : "border-field",
130
+ S ? "border-destructive hover:border-destructive" : "border-field",
129
131
  B === "sm" ? "h-6" : B === "md" ? "h-[28px]" : "h-8",
130
- P && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
132
+ u && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
131
133
  "cursor-pointer",
132
134
  F
133
135
  ),
134
136
  children: [
135
- /* @__PURE__ */ u("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
137
+ /* @__PURE__ */ h("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
136
138
  /* @__PURE__ */ d(
137
139
  "input",
138
140
  {
139
141
  ref: T,
140
142
  type: "text",
141
- value: w,
143
+ value: k,
142
144
  onChange: it,
143
145
  onBlur: H,
144
146
  onClick: (t) => s && t.stopPropagation(),
145
147
  onKeyDown: (t) => {
146
148
  if (t.key === "Enter" && !s) {
147
149
  t.preventDefault();
148
- const f = R(w, c), r = R(k, c), n = M(f, c, /* @__PURE__ */ new Date()), o = M(r, c, /* @__PURE__ */ new Date()), l = x(n) && f.length === 7, C = x(o) && r.length === 7;
150
+ const f = R(k, c), r = R(D, c), n = Y(f, c, /* @__PURE__ */ new Date()), o = Y(r, c, /* @__PURE__ */ new Date()), l = M(n) && f.length === 7, C = M(o) && r.length === 7;
149
151
  l && C ? i?.({
150
152
  from: { month: n.getMonth(), year: n.getFullYear() },
151
153
  to: { month: o.getMonth(), year: o.getFullYear() }
@@ -157,13 +159,13 @@ const m = (e, i = "MM/YYYY") => {
157
159
  to: { month: o.getMonth(), year: o.getFullYear() }
158
160
  });
159
161
  }
160
- t.key === "ArrowDown" && !s && (t.preventDefault(), V.current = !0, y(!0)), t.key === "Escape" && s && (t.preventDefault(), $());
162
+ t.key === "ArrowDown" && !s && !u && (t.preventDefault(), V.current = !0, w(!0)), t.key === "Escape" && s && (t.preventDefault(), $());
161
163
  },
162
- placeholder: s ? a === "YYYY/MM" ? "YYYY/MM" : Y("datePicker.monthYearFormat") : X,
163
- disabled: !!P,
164
+ placeholder: s ? a === "YYYY/MM" ? "YYYY/MM" : y("datePicker.monthYearFormat") : X,
165
+ disabled: !!u,
164
166
  "aria-label": X,
165
167
  "data-field": "start",
166
- className: h(
168
+ className: g(
167
169
  "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
168
170
  pt ? "text-destructive" : ft ? "text-content-muted" : ""
169
171
  ),
@@ -175,14 +177,14 @@ const m = (e, i = "MM/YYYY") => {
175
177
  {
176
178
  ref: ot,
177
179
  type: "text",
178
- value: k,
180
+ value: D,
179
181
  onChange: ct,
180
182
  onBlur: H,
181
183
  onClick: (t) => s && t.stopPropagation(),
182
184
  onKeyDown: (t) => {
183
185
  if (t.key === "Enter" && !s) {
184
186
  t.preventDefault();
185
- const f = R(w, c), r = R(k, c), n = M(f, c, /* @__PURE__ */ new Date()), o = M(r, c, /* @__PURE__ */ new Date()), l = x(n) && f.length === 7, C = x(o) && r.length === 7;
187
+ const f = R(k, c), r = R(D, c), n = Y(f, c, /* @__PURE__ */ new Date()), o = Y(r, c, /* @__PURE__ */ new Date()), l = M(n) && f.length === 7, C = M(o) && r.length === 7;
186
188
  l && C ? i?.({
187
189
  from: { month: n.getMonth(), year: n.getFullYear() },
188
190
  to: { month: o.getMonth(), year: o.getFullYear() }
@@ -194,27 +196,27 @@ const m = (e, i = "MM/YYYY") => {
194
196
  to: { month: o.getMonth(), year: o.getFullYear() }
195
197
  });
196
198
  }
197
- t.key === "ArrowDown" && !s && (t.preventDefault(), V.current = !0, y(!0)), t.key === "Escape" && s && (t.preventDefault(), $());
199
+ t.key === "ArrowDown" && !s && !u && (t.preventDefault(), V.current = !0, w(!0)), t.key === "Escape" && s && (t.preventDefault(), $());
198
200
  },
199
- placeholder: s ? a === "YYYY/MM" ? "YYYY/MM" : Y("datePicker.monthYearFormat") : q,
200
- disabled: !!P,
201
+ placeholder: s ? a === "YYYY/MM" ? "YYYY/MM" : y("datePicker.monthYearFormat") : q,
202
+ disabled: !!u,
201
203
  "aria-label": q,
202
204
  "data-field": "end",
203
- className: h(
205
+ className: g(
204
206
  "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
205
207
  ut ? "text-destructive" : mt ? "text-content-muted" : ""
206
208
  )
207
209
  }
208
210
  )
209
211
  ] }),
210
- /* @__PURE__ */ u("div", { className: "flex items-center gap-1 shrink-0", children: [
211
- e?.from && !P && /* @__PURE__ */ u(L, { children: [
212
+ /* @__PURE__ */ h("div", { className: "flex items-center gap-1 shrink-0", children: [
213
+ e?.from && !u && /* @__PURE__ */ h(L, { children: [
212
214
  /* @__PURE__ */ d(Q, { asChild: !0, children: /* @__PURE__ */ d(
213
215
  "button",
214
216
  {
215
217
  type: "button",
216
218
  tabIndex: 0,
217
- "aria-label": Y("calendar.clear"),
219
+ "aria-label": y("calendar.clear"),
218
220
  onClick: (t) => {
219
221
  t.stopPropagation(), z();
220
222
  },
@@ -225,15 +227,15 @@ const m = (e, i = "MM/YYYY") => {
225
227
  children: /* @__PURE__ */ d(ht, { className: "h-4 w-4 hover:text-content text-content-muted" })
226
228
  }
227
229
  ) }),
228
- /* @__PURE__ */ d(U, { variant: "tertiary", side: "top", children: Y("calendar.clear") })
230
+ /* @__PURE__ */ d(U, { variant: "tertiary", side: "top", children: y("calendar.clear") })
229
231
  ] }),
230
- /* @__PURE__ */ u(L, { children: [
231
- /* @__PURE__ */ d(Q, { asChild: !0, children: /* @__PURE__ */ d("button", { type: "button", tabIndex: 0, "aria-label": Y("datePicker.selectMonthRange"), onClick: (t) => {
232
- t.stopPropagation(), y(!s);
232
+ /* @__PURE__ */ h(L, { children: [
233
+ /* @__PURE__ */ d(Q, { asChild: !0, children: /* @__PURE__ */ d("button", { type: "button", tabIndex: 0, "aria-label": y("datePicker.selectMonthRange"), onClick: (t) => {
234
+ t.stopPropagation(), u || w(!s);
233
235
  }, onKeyDown: (t) => {
234
- (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), V.current = !0, y(!s));
236
+ (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), u || (V.current = !0, w(!s)));
235
237
  }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ d(gt, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
236
- /* @__PURE__ */ d(U, { variant: "tertiary", side: "top", children: Y("datePicker.selectMonthRange") })
238
+ /* @__PURE__ */ d(U, { variant: "tertiary", side: "top", children: y("datePicker.selectMonthRange") })
237
239
  ] })
238
240
  ] })
239
241
  ]
@@ -259,7 +261,7 @@ const m = (e, i = "MM/YYYY") => {
259
261
  disabled: { before: I, after: W },
260
262
  startMonth: Z,
261
263
  endMonth: _,
262
- showFooter: g,
264
+ showFooter: x,
263
265
  onApply: st,
264
266
  onCancel: $,
265
267
  onClear: z
@@ -268,23 +270,23 @@ const m = (e, i = "MM/YYYY") => {
268
270
  }
269
271
  )
270
272
  ] }),
271
- E && K === "absolute" && /* @__PURE__ */ u("div", { className: h("absolute left-0 top-full z-10 mt-1 flex min-w-0 max-w-full items-center gap-[6px]", D && "text-destructive"), children: [
273
+ E && K === "absolute" && /* @__PURE__ */ h("div", { className: g("absolute left-0 top-full z-10 mt-1 flex min-w-0 max-w-full items-center gap-[6px]", S && "text-destructive"), children: [
272
274
  /* @__PURE__ */ d(
273
275
  G,
274
276
  {
275
277
  size: "xs",
276
- className: h(
278
+ className: g(
277
279
  "shrink-0",
278
- D ? "text-destructive" : "text-content-muted"
280
+ S ? "text-destructive" : "text-content-muted"
279
281
  )
280
282
  }
281
283
  ),
282
284
  /* @__PURE__ */ d(
283
285
  "p",
284
286
  {
285
- className: h(
287
+ className: g(
286
288
  "min-w-0 text-[12px] font-medium leading-[18px] text-navigation-muted",
287
- D && "text-destructive"
289
+ S && "text-destructive"
288
290
  ),
289
291
  children: E
290
292
  }
@@ -294,23 +296,23 @@ const m = (e, i = "MM/YYYY") => {
294
296
  }
295
297
  )
296
298
  ] }),
297
- E && K === "flow" && /* @__PURE__ */ u("div", { className: h("flex items-center gap-[6px]", D && "text-destructive"), children: [
299
+ E && K === "flow" && /* @__PURE__ */ h("div", { className: g("flex items-center gap-[6px]", S && "text-destructive"), children: [
298
300
  /* @__PURE__ */ d(
299
301
  G,
300
302
  {
301
303
  size: "xs",
302
- className: h(
304
+ className: g(
303
305
  "shrink-0",
304
- D ? "text-destructive" : "text-content-muted"
306
+ S ? "text-destructive" : "text-content-muted"
305
307
  )
306
308
  }
307
309
  ),
308
310
  /* @__PURE__ */ d(
309
311
  "p",
310
312
  {
311
- className: h(
313
+ className: g(
312
314
  "text-[12px] font-medium leading-[18px] text-navigation-muted",
313
- D && "text-destructive"
315
+ S && "text-destructive"
314
316
  ),
315
317
  children: E
316
318
  }
@@ -319,7 +321,7 @@ const m = (e, i = "MM/YYYY") => {
319
321
  ] });
320
322
  }
321
323
  );
322
- wt.displayName = "MonthRangePicker";
324
+ bt.displayName = "MonthRangePicker";
323
325
  export {
324
- wt as MonthRangePicker
326
+ bt as MonthRangePicker
325
327
  };
package/dist/components/ui/date-picker/multi-date-picker.js CHANGED
@@ -1,82 +1,84 @@
1
- import { jsxs as l, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as i, jsx as o } from "react/jsx-runtime";
2
2
  import * as r from "react";
3
3
  import { X as j } from "lucide-react";
4
4
  import { CalendarMonth as R } from "../../../icons/index.js";
5
- import { format as b } from "date-fns";
6
- import { cn as E } from "../../../lib/utils.js";
7
- import { Input as F } from "../input.js";
8
- import { Popover as V, PopoverTrigger as X, PopoverContent as $ } from "../popover.js";
9
- import { Calendar as q } from "../calendar.js";
5
+ import { format as E } from "date-fns";
6
+ import { cn as F } from "../../../lib/utils.js";
7
+ import { Input as V } from "../input.js";
8
+ import { Popover as X, PopoverTrigger as $, PopoverContent as q } from "../popover.js";
9
+ import { Calendar as z } from "../calendar.js";
10
10
  import { Tooltip as u, TooltipTrigger as y, TooltipContent as g } from "../tooltip.js";
11
- import { getDateFnsLocale as z } from "../../../i18n/getDateFnsLocale.js";
12
- import { useImpactNovaI18n as B } from "../../../i18n/ImpactNovaI18nContext.js";
13
- const G = r.forwardRef(
11
+ import { getDateFnsLocale as B } from "../../../i18n/getDateFnsLocale.js";
12
+ import { useImpactNovaI18n as G } from "../../../i18n/ImpactNovaI18nContext.js";
13
+ const H = r.forwardRef(
14
14
  ({
15
15
  value: e,
16
- onChange: i,
16
+ onChange: c,
17
17
  format: C = "MM/dd/yyyy",
18
18
  placeholder: P,
19
19
  minDate: M,
20
20
  maxDate: x,
21
21
  startMonth: D,
22
22
  endMonth: N,
23
- showFooter: c = !0,
24
- disabled: p,
23
+ showFooter: s = !0,
24
+ disabled: n,
25
25
  className: T,
26
26
  ...k
27
27
  }, A) => {
28
- const { locale: d, t: s } = B(), v = r.useMemo(() => z(d), [d]), L = P ?? s("datePicker.selectMultipleDates"), [m, n] = r.useState(!1), [f, a] = r.useState(e);
28
+ const { locale: d, t: p } = G(), v = r.useMemo(() => B(d), [d]), L = P ?? p("datePicker.selectMultipleDates"), [m, a] = r.useState(!1), [f, l] = r.useState(e);
29
29
  r.useEffect(() => {
30
- a(e);
30
+ l(e);
31
31
  }, [m, e]);
32
- const O = (o) => {
33
- a(o), c || i?.(o);
34
- }, S = (o) => {
35
- i?.(o !== void 0 ? o : f), n(!1);
32
+ const O = (t) => {
33
+ l(t), s || c?.(t);
34
+ }, S = (t) => {
35
+ c?.(t !== void 0 ? t : f), a(!1);
36
36
  }, w = () => {
37
- a(e), n(!1);
37
+ l(e), a(!1);
38
38
  }, h = () => {
39
- a(void 0), i?.(void 0), c || n(!1);
40
- }, I = e && e.length > 0 ? e.length === 1 ? b(e[0], C, { locale: v }) : `${e.length} dates selected` : "";
41
- return /* @__PURE__ */ l(V, { open: m, onOpenChange: n, children: [
42
- /* @__PURE__ */ t(X, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
43
- F,
39
+ l(void 0), c?.(void 0), s || a(!1);
40
+ }, I = e && e.length > 0 ? e.length === 1 ? E(e[0], C, { locale: v }) : `${e.length} dates selected` : "";
41
+ return /* @__PURE__ */ i(X, { open: n ? !1 : m, onOpenChange: (t) => {
42
+ n || a(t);
43
+ }, children: [
44
+ /* @__PURE__ */ o($, { asChild: !0, children: /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(
45
+ V,
44
46
  {
45
47
  ref: A,
46
48
  value: I,
47
49
  placeholder: L,
48
50
  readOnly: !0,
49
- disabled: p,
50
- className: E("cursor-pointer", T),
51
- suffix: /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
52
- e && e.length > 0 && !p && /* @__PURE__ */ l(u, { children: [
53
- /* @__PURE__ */ t(y, { asChild: !0, children: /* @__PURE__ */ t(
51
+ disabled: n,
52
+ className: F("cursor-pointer", T),
53
+ suffix: /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
54
+ e && e.length > 0 && !n && /* @__PURE__ */ i(u, { children: [
55
+ /* @__PURE__ */ o(y, { asChild: !0, children: /* @__PURE__ */ o(
54
56
  j,
55
57
  {
56
58
  className: "h-4 w-4 cursor-pointer hover:text-content",
57
- onClick: (o) => {
58
- o.stopPropagation(), h();
59
+ onClick: (t) => {
60
+ t.stopPropagation(), h();
59
61
  }
60
62
  }
61
63
  ) }),
62
- /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: s("calendar.clear") })
64
+ /* @__PURE__ */ o(g, { variant: "tertiary", side: "top", children: p("calendar.clear") })
63
65
  ] }),
64
- /* @__PURE__ */ l(u, { children: [
65
- /* @__PURE__ */ t(y, { asChild: !0, children: /* @__PURE__ */ t(R, { className: "h-4 w-4 text-secondary-foreground" }) }),
66
- /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: s("datePicker.selectMultipleDates") })
66
+ /* @__PURE__ */ i(u, { children: [
67
+ /* @__PURE__ */ o(y, { asChild: !0, children: /* @__PURE__ */ o(R, { className: "h-4 w-4 text-secondary-foreground" }) }),
68
+ /* @__PURE__ */ o(g, { variant: "tertiary", side: "top", children: p("datePicker.selectMultipleDates") })
67
69
  ] })
68
70
  ] }),
69
71
  ...k
70
72
  }
71
73
  ) }) }),
72
- /* @__PURE__ */ t(
73
- $,
74
+ /* @__PURE__ */ o(
75
+ q,
74
76
  {
75
77
  className: "w-auto p-0",
76
78
  align: "start",
77
- onOpenAutoFocus: (o) => o.preventDefault(),
78
- children: /* @__PURE__ */ t(
79
- q,
79
+ onOpenAutoFocus: (t) => t.preventDefault(),
80
+ children: /* @__PURE__ */ o(
81
+ z,
80
82
  {
81
83
  mode: "multiple",
82
84
  selected: f,
@@ -84,7 +86,7 @@ const G = r.forwardRef(
84
86
  disabled: { before: M, after: x },
85
87
  startMonth: D,
86
88
  endMonth: N,
87
- showFooter: c,
89
+ showFooter: s,
88
90
  onApply: S,
89
91
  onCancel: w,
90
92
  onClear: h,
@@ -96,7 +98,7 @@ const G = r.forwardRef(
96
98
  ] });
97
99
  }
98
100
  );
99
- G.displayName = "MultiDatePicker";
101
+ H.displayName = "MultiDatePicker";
100
102
  export {
101
- G as MultiDatePicker
103
+ H as MultiDatePicker
102
104
  };