impact-nova 1.3.0 → 1.5.2

package/dist/components/ui/date-picker/multi-date-picker.js

@@ -1,91 +1,93 @@
-import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import * as a from "react";
-import { X as v } from "lucide-react";
-import { CalendarMonth as w } from "../../../icons/index.js";
-import { format as j } from "date-fns";
-import { cn as R } from "../../../lib/utils.js";
-import { Input as b } from "../input.js";
-import { Popover as E, PopoverTrigger as I, PopoverContent as L } from "../popover.js";
-import { Calendar as V } from "../calendar.js";
-import { Tooltip as f, TooltipTrigger as h, TooltipContent as u } from "../tooltip.js";
-const X = a.forwardRef(
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import * as r from "react";
+import { X as j } from "lucide-react";
+import { CalendarMonth as R } from "../../../icons/index.js";
+import { format as b } from "date-fns";
+import { cn as E } from "../../../lib/utils.js";
+import { Input as F } from "../input.js";
+import { Popover as V, PopoverTrigger as X, PopoverContent as $ } from "../popover.js";
+import { Calendar as q } from "../calendar.js";
+import { Tooltip as u, TooltipTrigger as g, TooltipContent as y } from "../tooltip.js";
+import { getDateFnsLocale as z } from "../../../i18n/getDateFnsLocale.js";
+import { useImpactNovaI18n as B } from "../../../i18n/ImpactNovaI18nContext.js";
+const G = r.forwardRef(
   ({
     value: e,
-    onChange: l,
-    format: y = "MM/dd/yyyy",
-    placeholder: g = "Select Dates",
-    minDate: C,
-    maxDate: P,
-    startMonth: x,
-    endMonth: T,
+    onChange: i,
+    format: C = "MM/dd/yyyy",
+    placeholder: P,
+    minDate: M,
+    maxDate: x,
+    startMonth: D,
+    endMonth: N,
     showFooter: s = !0,
-    disabled: c,
-    className: N,
-    ...A
-  }, D) => {
-    const [d, o] = a.useState(!1), [p, n] = a.useState(e);
-    a.useEffect(() => {
-      n(e);
-    }, [d, e]);
-    const M = (r) => {
-      n(r), s || l?.(r);
-    }, S = (r) => {
-      l?.(r !== void 0 ? r : p), o(!1);
-    }, k = () => {
-      n(e), o(!1);
-    }, m = () => {
-      n(void 0), l?.(void 0), s || o(!1);
-    }, O = e && e.length > 0 ? e.length === 1 ? j(e[0], y) : `${e.length} dates selected` : "";
-    return /* @__PURE__ */ i(E, { open: d, onOpenChange: o, children: [
-      /* @__PURE__ */ t(I, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
-        b,
+    disabled: d,
+    className: T,
+    ...k
+  }, A) => {
+    const { locale: p, t: c } = B(), v = r.useMemo(() => z(p), [p]), L = P ?? c("datePicker.selectMultipleDates"), [m, n] = r.useState(!1), [f, a] = r.useState(e);
+    r.useEffect(() => {
+      a(e);
+    }, [m, e]);
+    const O = (o) => {
+      a(o), s || i?.(o);
+    }, S = (o) => {
+      i?.(o !== void 0 ? o : f), n(!1);
+    }, w = () => {
+      a(e), n(!1);
+    }, h = () => {
+      a(void 0), i?.(void 0), s || n(!1);
+    }, I = e && e.length > 0 ? e.length === 1 ? b(e[0], C, { locale: v }) : `${e.length} dates selected` : "";
+    return /* @__PURE__ */ l(V, { open: m, onOpenChange: n, children: [
+      /* @__PURE__ */ t(X, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
+        F,
         {
-          ref: D,
-          value: O,
-          placeholder: g,
+          ref: A,
+          value: I,
+          placeholder: L,
           readOnly: !0,
-          disabled: c,
-          className: R("cursor-pointer", N),
-          suffix: /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
-            e && e.length > 0 && !c && /* @__PURE__ */ i(f, { children: [
-              /* @__PURE__ */ t(h, { asChild: !0, children: /* @__PURE__ */ t(
-                v,
+          disabled: d,
+          className: E("cursor-pointer", T),
+          suffix: /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
+            e && e.length > 0 && !d && /* @__PURE__ */ l(u, { children: [
+              /* @__PURE__ */ t(g, { asChild: !0, children: /* @__PURE__ */ t(
+                j,
                 {
                   className: "h-4 w-4 cursor-pointer hover:text-foreground",
-                  onClick: (r) => {
-                    r.stopPropagation(), m();
+                  onClick: (o) => {
+                    o.stopPropagation(), h();
                   }
                 }
               ) }),
-              /* @__PURE__ */ t(u, { variant: "tertiary", side: "top", children: "Clear" })
+              /* @__PURE__ */ t(y, { variant: "tertiary", side: "top", children: c("calendar.clear") })
             ] }),
-            /* @__PURE__ */ i(f, { children: [
-              /* @__PURE__ */ t(h, { asChild: !0, children: /* @__PURE__ */ t(w, { className: "h-4 w-4 text-secondary-foreground" }) }),
-              /* @__PURE__ */ t(u, { variant: "tertiary", side: "top", children: "Pick dates" })
+            /* @__PURE__ */ l(u, { children: [
+              /* @__PURE__ */ t(g, { asChild: !0, children: /* @__PURE__ */ t(R, { className: "h-4 w-4 text-secondary-foreground" }) }),
+              /* @__PURE__ */ t(y, { variant: "tertiary", side: "top", children: c("datePicker.selectMultipleDates") })
             ] })
           ] }),
-          ...A
+          ...k
         }
       ) }) }),
       /* @__PURE__ */ t(
-        L,
+        $,
         {
           className: "w-auto p-0",
           align: "start",
-          onOpenAutoFocus: (r) => r.preventDefault(),
+          onOpenAutoFocus: (o) => o.preventDefault(),
           children: /* @__PURE__ */ t(
-            V,
+            q,
             {
               mode: "multiple",
-              selected: p,
-              onSelect: M,
-              disabled: { before: C, after: P },
-              startMonth: x,
-              endMonth: T,
+              selected: f,
+              onSelect: O,
+              disabled: { before: M, after: x },
+              startMonth: D,
+              endMonth: N,
               showFooter: s,
               onApply: S,
-              onCancel: k,
-              onClear: m,
+              onCancel: w,
+              onClear: h,
               captionLayout: "dropdown"
             }
           )
@@ -94,7 +96,7 @@ const X = a.forwardRef(
     ] });
   }
 );
-X.displayName = "MultiDatePicker";
+G.displayName = "MultiDatePicker";
 export {
-  X as MultiDatePicker
+  G as MultiDatePicker
 };

package/dist/components/ui/date-picker/multi-month-picker.js

@@ -1,90 +1,91 @@
-import { jsxs as i, jsx as t } from "react/jsx-runtime";
-import * as s from "react";
-import { X as w } from "lucide-react";
-import { CalendarMonth as $ } from "../../../icons/index.js";
-import { cn as j } from "../../../lib/utils.js";
-import { Input as v } from "../input.js";
-import { Popover as R, PopoverTrigger as b, PopoverContent as D } from "../popover.js";
-import { Calendar as E } from "../calendar.js";
-import { Tooltip as m, TooltipTrigger as f, TooltipContent as g } from "../tooltip.js";
-const I = s.forwardRef(
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import * as c from "react";
+import { X as I } from "lucide-react";
+import { CalendarMonth as j } from "../../../icons/index.js";
+import { cn as R } from "../../../lib/utils.js";
+import { Input as $ } from "../input.js";
+import { Popover as b, PopoverTrigger as D, PopoverContent as E } from "../popover.js";
+import { Calendar as L } from "../calendar.js";
+import { Tooltip as f, TooltipTrigger as u, TooltipContent as g } from "../tooltip.js";
+import { useImpactNovaI18n as V } from "../../../i18n/ImpactNovaI18nContext.js";
+const X = c.forwardRef(
   ({
     value: e,
-    onChange: l,
-    placeholder: u = "Select Months",
-    minDate: y,
+    onChange: s,
+    placeholder: y,
+    minDate: M,
     maxDate: C,
-    startMonth: M,
-    endMonth: P,
+    startMonth: P,
+    endMonth: T,
     showFooter: a = !0,
-    disabled: c,
-    className: T,
+    disabled: p,
+    className: k,
     ...x
   }, N) => {
-    const [p, r] = s.useState(!1), [d, n] = s.useState(e);
-    s.useEffect(() => {
-      n(e);
-    }, [p, e]);
-    const k = (o) => {
-      n(o), a || l?.(o);
-    }, A = (o) => {
-      l?.(o !== void 0 ? o : d), r(!1);
-    }, S = () => {
-      n(e), r(!1);
-    }, h = () => {
-      n(void 0), l?.(void 0), a || r(!1);
-    }, O = e && e.length > 0 ? e.length === 1 ? `${e[0].month + 1}/${e[0].year}` : `${e.length} months selected` : "";
-    return /* @__PURE__ */ i(R, { open: p, onOpenChange: r, children: [
-      /* @__PURE__ */ t(b, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
-        v,
+    const { t: r } = V(), A = y ?? r("datePicker.selectMultipleMonths"), [d, n] = c.useState(!1), [h, i] = c.useState(e);
+    c.useEffect(() => {
+      i(e);
+    }, [d, e]);
+    const S = (o) => {
+      i(o), a || s?.(o);
+    }, O = (o) => {
+      s?.(o !== void 0 ? o : h), n(!1);
+    }, v = () => {
+      i(e), n(!1);
+    }, m = () => {
+      i(void 0), s?.(void 0), a || n(!1);
+    }, w = e && e.length > 0 ? e.length === 1 ? `${e[0].month + 1}/${e[0].year}` : r("datePicker.monthsSelected", { count: e.length }) : "";
+    return /* @__PURE__ */ l(b, { open: d, onOpenChange: n, children: [
+      /* @__PURE__ */ t(D, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
+        $,
         {
           ref: N,
-          value: O,
-          placeholder: u,
+          value: w,
+          placeholder: A,
           readOnly: !0,
-          disabled: c,
-          className: j("cursor-pointer", T),
-          suffix: /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: [
-            e && e.length > 0 && !c && /* @__PURE__ */ i(m, { children: [
-              /* @__PURE__ */ t(f, { asChild: !0, children: /* @__PURE__ */ t(
-                w,
+          disabled: p,
+          className: R("cursor-pointer", k),
+          suffix: /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
+            e && e.length > 0 && !p && /* @__PURE__ */ l(f, { children: [
+              /* @__PURE__ */ t(u, { asChild: !0, children: /* @__PURE__ */ t(
+                I,
                 {
                   className: "h-4 w-4 cursor-pointer hover:text-foreground",
                   onClick: (o) => {
-                    o.stopPropagation(), h();
+                    o.stopPropagation(), m();
                   }
                 }
               ) }),
-              /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: "Clear" })
+              /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: r("calendar.clear") })
             ] }),
-            /* @__PURE__ */ i(m, { children: [
-              /* @__PURE__ */ t(f, { asChild: !0, children: /* @__PURE__ */ t($, { className: "h-4 w-4 text-secondary-foreground" }) }),
-              /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: "Pick months" })
+            /* @__PURE__ */ l(f, { children: [
+              /* @__PURE__ */ t(u, { asChild: !0, children: /* @__PURE__ */ t(j, { className: "h-4 w-4 text-secondary-foreground" }) }),
+              /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: r("datePicker.selectMultipleMonths") })
             ] })
           ] }),
           ...x
         }
       ) }) }),
       /* @__PURE__ */ t(
-        D,
+        E,
         {
           className: "w-auto p-0",
           align: "start",
           onOpenAutoFocus: (o) => o.preventDefault(),
           children: /* @__PURE__ */ t(
-            E,
+            L,
             {
               pickerType: "month",
               monthMode: "multiple",
-              selectedMonths: d,
-              onMonthSelect: k,
-              disabled: { before: y, after: C },
-              startMonth: M,
-              endMonth: P,
+              selectedMonths: h,
+              onMonthSelect: S,
+              disabled: { before: M, after: C },
+              startMonth: P,
+              endMonth: T,
               showFooter: a,
-              onApply: A,
-              onCancel: S,
-              onClear: h,
+              onApply: O,
+              onCancel: v,
+              onClear: m,
               captionLayout: "dropdown"
             }
           )
@@ -93,7 +94,7 @@ const I = s.forwardRef(
     ] });
   }
 );
-I.displayName = "MultiMonthPicker";
+X.displayName = "MultiMonthPicker";
 export {
-  I as MultiMonthPicker
+  X as MultiMonthPicker
 };

package/dist/components/ui/date-picker/multi-week-picker.js

@@ -1,107 +1,109 @@
-import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import * as a from "react";
-import { X as E } from "lucide-react";
-import { CalendarMonth as I } from "../../../icons/index.js";
-import { format as y } from "date-fns";
-import { cn as L } from "../../../lib/utils.js";
-import { Input as V } from "../input.js";
-import { Popover as X, PopoverTrigger as q, PopoverContent as z } from "../popover.js";
-import { Calendar as B } from "../calendar.js";
-import { Tooltip as k, TooltipTrigger as u, TooltipContent as g } from "../tooltip.js";
-const G = (e, o = "MM/dd/yyyy") => {
-  const l = y(e.startDate, o), c = y(e.endDate, o);
-  return `${l} - ${c}`;
-}, H = a.forwardRef(
+import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import * as s from "react";
+import { X } from "lucide-react";
+import { CalendarMonth as q } from "../../../icons/index.js";
+import { format as g } from "date-fns";
+import { cn as z } from "../../../lib/utils.js";
+import { Input as B } from "../input.js";
+import { Popover as F, PopoverTrigger as G, PopoverContent as H } from "../popover.js";
+import { Calendar as J } from "../calendar.js";
+import { Tooltip as C, TooltipTrigger as M, TooltipContent as P } from "../tooltip.js";
+import { getDateFnsLocale as K } from "../../../i18n/getDateFnsLocale.js";
+import { useImpactNovaI18n as Q } from "../../../i18n/ImpactNovaI18nContext.js";
+const U = (e, o = "MM/dd/yyyy", n) => {
+  const l = g(e.startDate, o, n ? { locale: n } : {}), d = g(e.endDate, o, n ? { locale: n } : {});
+  return `${l} - ${d}`;
+}, Y = s.forwardRef(
   ({
     value: e,
     onChange: o,
-    format: l = "MM/dd/yyyy",
-    placeholder: c = "Select Weeks",
-    minDate: C,
-    maxDate: w,
-    startMonth: M,
-    endMonth: P,
-    showFooter: d = !0,
-    calendarType: T = "calendar",
-    fiscalMode: x = "basic",
+    format: n = "MM/dd/yyyy",
+    placeholder: l,
+    minDate: d,
+    maxDate: T,
+    startMonth: W,
+    endMonth: w,
+    showFooter: p = !0,
+    calendarType: x = "calendar",
+    fiscalMode: N = "basic",
     selectionMode: S = "week",
-    fiscalMonthPattern: W,
-    fiscalYearStartMonth: N = 1,
-    weekStartsOn: A = 1,
-    disabled: p,
-    className: O,
-    ...v
-  }, D) => {
-    const [f, n] = a.useState(!1), [m, i] = a.useState(e);
-    a.useEffect(() => {
+    fiscalMonthPattern: A,
+    fiscalYearStartMonth: v = 1,
+    weekStartsOn: D = 1,
+    disabled: f,
+    className: L,
+    ...O
+  }, I) => {
+    const { locale: h, t: m } = Q(), $ = s.useMemo(() => K(h), [h]), b = l ?? m("datePicker.selectWeeks"), [y, a] = s.useState(!1), [k, i] = s.useState(e);
+    s.useEffect(() => {
       i(e);
-    }, [f, e]);
-    const $ = (r) => {
-      i(r), d || o?.(r);
-    }, b = (r) => {
-      o?.(r !== void 0 ? r : m), n(!1);
-    }, j = () => {
-      i(e), n(!1);
-    }, h = () => {
-      i(void 0), o?.(void 0), d || n(!1);
-    }, R = e && e.length > 0 ? e.length === 1 ? G(e[0], l) : `${e.length} weeks selected` : "";
-    return /* @__PURE__ */ s(X, { open: f, onOpenChange: n, children: [
-      /* @__PURE__ */ t(q, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
-        V,
+    }, [y, e]);
+    const j = (r) => {
+      i(r), p || o?.(r);
+    }, R = (r) => {
+      o?.(r !== void 0 ? r : k), a(!1);
+    }, E = () => {
+      i(e), a(!1);
+    }, u = () => {
+      i(void 0), o?.(void 0), p || a(!1);
+    }, V = e && e.length > 0 ? e.length === 1 ? U(e[0], n, $) : `${e.length} weeks selected` : "";
+    return /* @__PURE__ */ c(F, { open: y, onOpenChange: a, children: [
+      /* @__PURE__ */ t(G, { asChild: !0, children: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(
+        B,
         {
-          ref: D,
-          value: R,
-          placeholder: c,
+          ref: I,
+          value: V,
+          placeholder: b,
           readOnly: !0,
-          disabled: p,
-          className: L("cursor-pointer", O),
-          suffix: /* @__PURE__ */ s("div", { className: "flex items-center gap-1", children: [
-            e && e.length > 0 && !p && /* @__PURE__ */ s(k, { children: [
-              /* @__PURE__ */ t(u, { asChild: !0, children: /* @__PURE__ */ t(
-                E,
+          disabled: f,
+          className: z("cursor-pointer", L),
+          suffix: /* @__PURE__ */ c("div", { className: "flex items-center gap-1", children: [
+            e && e.length > 0 && !f && /* @__PURE__ */ c(C, { children: [
+              /* @__PURE__ */ t(M, { asChild: !0, children: /* @__PURE__ */ t(
+                X,
                 {
                   className: "h-4 w-4 cursor-pointer hover:text-foreground",
                   onClick: (r) => {
-                    r.stopPropagation(), h();
+                    r.stopPropagation(), u();
                   }
                 }
               ) }),
-              /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: "Clear" })
+              /* @__PURE__ */ t(P, { variant: "tertiary", side: "top", children: m("calendar.clear") })
             ] }),
-            /* @__PURE__ */ s(k, { children: [
-              /* @__PURE__ */ t(u, { asChild: !0, children: /* @__PURE__ */ t(I, { className: "h-4 w-4 text-secondary-foreground" }) }),
-              /* @__PURE__ */ t(g, { variant: "tertiary", side: "top", children: "Pick weeks" })
+            /* @__PURE__ */ c(C, { children: [
+              /* @__PURE__ */ t(M, { asChild: !0, children: /* @__PURE__ */ t(q, { className: "h-4 w-4 text-secondary-foreground" }) }),
+              /* @__PURE__ */ t(P, { variant: "tertiary", side: "top", children: m("datePicker.selectWeeks") })
             ] })
           ] }),
-          ...v
+          ...O
         }
       ) }) }),
       /* @__PURE__ */ t(
-        z,
+        H,
         {
           className: "w-auto p-0",
           align: "start",
           onOpenAutoFocus: (r) => r.preventDefault(),
           children: /* @__PURE__ */ t(
-            B,
+            J,
             {
               pickerType: "week",
               weekMode: "multiple",
-              selectedWeeks: m,
-              onWeekSelect: $,
-              disabled: { before: C, after: w },
-              startMonth: M,
-              endMonth: P,
-              showFooter: d,
-              calendarType: T,
-              fiscalMode: x,
+              selectedWeeks: k,
+              onWeekSelect: j,
+              disabled: { before: d, after: T },
+              startMonth: W,
+              endMonth: w,
+              showFooter: p,
+              calendarType: x,
+              fiscalMode: N,
               selectionMode: S,
-              fiscalMonthPattern: W,
-              fiscalYearStartMonth: N,
-              weekStartsOn: A,
-              onApply: b,
-              onCancel: j,
-              onClear: h,
+              fiscalMonthPattern: A,
+              fiscalYearStartMonth: v,
+              weekStartsOn: D,
+              onApply: R,
+              onCancel: E,
+              onClear: u,
               captionLayout: "dropdown"
             }
           )
@@ -110,7 +112,7 @@ const G = (e, o = "MM/dd/yyyy") => {
     ] });
   }
 );
-H.displayName = "MultiWeekPicker";
+Y.displayName = "MultiWeekPicker";
 export {
-  H as MultiWeekPicker
+  Y as MultiWeekPicker
 };