impact-nova 1.0.0 → 1.1.0

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

@@ -1,223 +1,235 @@
-import { jsxs as u, jsx as i } from "react/jsx-runtime";
-import * as f from "react";
-import { X as ae } from "lucide-react";
-import { CalendarMonth as de, Info as ie } from "../../../icons/index.js";
-import { format as d, parse as L, isValid as O } from "date-fns";
-import { cn as g, maskDate as z } from "../../../lib/utils.js";
-import { Popover as ce, PopoverTrigger as le, PopoverContent as fe } from "../popover.js";
-import { Calendar as pe } from "../calendar.js";
-import { resolveWeekSelection as me } from "../../../lib/fiscal-calendar.js";
-const ue = f.forwardRef(
+import { jsxs as b, jsx as f } from "react/jsx-runtime";
+import * as o from "react";
+import { X as pe } from "lucide-react";
+import { CalendarMonth as me, Info as ue } from "../../../icons/index.js";
+import { format as x, isValid as S, parse as R } from "date-fns";
+import { cn as N, padValidDateString as X, maskDate as q } from "../../../lib/utils.js";
+import { Popover as ge, PopoverTrigger as xe, PopoverContent as he } from "../popover.js";
+import { Calendar as be } from "../calendar.js";
+import { resolveWeekSelection as we } from "../../../lib/fiscal-calendar.js";
+const g = (e, r = "MM/dd/yyyy") => {
+  const t = x(e.startDate, r), W = x(e.endDate, r);
+  return `${t} - ${W}`;
+}, ke = o.forwardRef(
   ({
-    value: t,
-    onChange: p,
-    format: n = "MM/dd/yyyy",
-    minDate: T,
-    maxDate: X,
-    fromYear: q,
-    toYear: G,
-    showFooter: a = !0,
-    calendarType: v = "calendar",
-    fiscalMode: N = "basic",
-    selectionMode: C = "week",
-    fiscalMonthPattern: S,
-    fiscalYearStartMonth: W = 1,
-    weekStartsOn: P = 1,
-    disabled: x,
-    className: H,
-    isError: b,
-    size: R,
-    label: I,
-    helperText: V,
-    required: J,
-    prefix: xe,
-    prefixClick: ge,
-    ...K
-  }, Q) => {
-    const [s, h] = f.useState(!1), [o, c] = f.useState(t), [U, w] = f.useState(t?.from ? d(t.from.startDate, n) : ""), [Z, y] = f.useState(t?.to ? d(t.to.endDate, n) : ""), [$, D] = f.useState(t?.from?.startDate || /* @__PURE__ */ new Date());
-    f.useEffect(() => {
-      w(t?.from ? d(t.from.startDate, n) : ""), y(t?.to ? d(t.to.endDate, n) : "");
-    }, [t, n]), f.useEffect(() => {
-      s && (c(t), D(t?.from?.startDate || /* @__PURE__ */ new Date()));
-    }, [s]);
-    const Y = (e) => {
-      c(e), !a && e?.from && e?.to && (p?.(e), h(!1));
-    }, _ = (e) => {
-      let r = e !== void 0 ? e : o;
-      r?.from && !r.to && (r = { ...r, to: r.from }), p?.(r), h(!1);
-    }, F = () => {
-      c(t), h(!1);
-    }, A = () => {
-      c(void 0), w(""), y(""), p?.(void 0), a || h(!1);
-    }, E = (e) => me(e, {
-      calendarType: v,
-      fiscalMode: N,
-      selectionMode: C,
-      fiscalMonthPattern: S,
-      fiscalYearStartMonth: W,
-      weekStartsOn: P
-    }), ee = (e) => {
-      const r = z(e.target.value, n);
-      if (w(r), r === "") {
-        const l = { from: void 0, to: o?.to };
-        c(l), a || p?.(l);
+    value: e,
+    onChange: r,
+    format: t = "MM/dd/yyyy",
+    placeholder: W = "Select Week Range",
+    minDate: G,
+    maxDate: J,
+    fromYear: K,
+    toYear: Q,
+    showFooter: p = !0,
+    calendarType: E = "calendar",
+    fiscalMode: v = "basic",
+    selectionMode: A = "week",
+    fiscalMonthPattern: M,
+    fiscalYearStartMonth: T = 1,
+    weekStartsOn: j = 1,
+    disabled: w,
+    className: U,
+    isError: C,
+    size: B,
+    label: L,
+    helperText: O,
+    required: Z,
+    prefix: ye,
+    prefixClick: De,
+    ...Y
+  }, _) => {
+    const $ = o.useRef(null), F = o.useRef(null);
+    o.useRef(null), o.useRef(null), o.useImperativeHandle(_, () => $.current);
+    const [i, I] = o.useState(!1), [k, c] = o.useState(e), [y, m] = o.useState(e?.from ? x(e.from.startDate, t) : ""), [D, u] = o.useState(e?.to ? x(e.to.endDate, t) : ""), [ee, P] = o.useState(e?.from?.startDate || /* @__PURE__ */ new Date());
+    o.useEffect(() => {
+      !i && e && (m(e?.from ? x(e.from.startDate, t) : ""), u(e?.to ? x(e.to.endDate, t) : ""), c(e));
+    }, [e, t, i]), o.useEffect(() => {
+      i && (c(e), m(e?.from ? x(e.from.startDate, t) : ""), u(e?.to ? x(e.to.endDate, t) : ""), P(e?.from?.startDate || /* @__PURE__ */ new Date()));
+    }, [i, e, t]);
+    const te = (n) => {
+      c(n), n?.from && m(g(n.from, t)), n?.to && u(g(n.to, t)), !p && n?.from && n?.to && n.from.startDate.getTime() !== n.to.startDate.getTime() && (r?.(n), I(!1));
+    }, ne = (n) => {
+      r?.(n !== void 0 ? n : k), I(!1);
+    }, oe = () => {
+      c(e), m(e?.from ? g(e.from, t) : ""), u(e?.to ? g(e.to, t) : ""), I(!1);
+    }, z = () => {
+      c(void 0), m(""), u(""), r?.(void 0), p || I(!1);
+    }, V = (n) => we(n, {
+      calendarType: E,
+      fiscalMode: v,
+      selectionMode: A,
+      fiscalMonthPattern: M,
+      fiscalYearStartMonth: T,
+      weekStartsOn: j
+    }), se = (n) => {
+      const a = n.target.value, s = q(a, t, y);
+      if (m(s), s === "") {
+        const l = { from: void 0, to: k?.to };
+        c(l), p || r?.(l);
         return;
       }
-      const m = L(r, n, /* @__PURE__ */ new Date());
-      if (O(m)) {
-        const k = { from: E(m), to: o?.to };
-        c(k), D(m), a || p?.(k);
+      const d = R(s, t, /* @__PURE__ */ new Date());
+      if (S(d) && s.length === t.length) {
+        const h = { from: V(d), to: k?.to };
+        c(h), p || r?.(h);
       }
-    }, te = (e) => {
-      const r = z(e.target.value, n);
-      if (y(r), r === "") {
-        const l = { from: o?.from, to: void 0 };
-        c(l), a || p?.(l);
+    }, re = (n) => {
+      const a = n.target.value, s = q(a, t, D);
+      if (u(s), s === "") {
+        const l = { from: k?.from, to: void 0 };
+        c(l), p || r?.(l);
         return;
       }
-      const m = L(r, n, /* @__PURE__ */ new Date());
-      if (O(m)) {
-        const l = E(m), k = { from: o?.from, to: l };
-        c(k), D(m), a || p?.(k);
+      const d = R(s, t, /* @__PURE__ */ new Date());
+      if (S(d) && s.length === t.length) {
+        const l = V(d), h = { from: k?.from, to: l };
+        c(h), d && P(d), p || r?.(h);
       }
-    }, j = () => {
-      s || (w(o?.from ? d(o.from.startDate, n) : ""), y(o?.to ? d(o.to.endDate, n) : ""));
-    }, ne = t?.from ? d(t.from.startDate, n) : "", oe = t?.to ? d(t.to.endDate, n) : "", B = a && s ? o?.from ? d(o.from.startDate, n) : "" : U, M = a && s ? o?.to ? d(o.to.endDate, n) : o?.from ? d(o.from.endDate, n) : "" : Z, re = a && s && B !== ne, se = a && s && M !== oe;
-    return /* @__PURE__ */ u("div", { className: "w-full space-y-1.5 min-w-[240px]", "data-component": "week-range-picker", "data-disabled": x || void 0, children: [
-      I && /* @__PURE__ */ u(
+    }, H = () => {
+      if (i) return;
+      const n = X(y, t), a = X(D, t), s = R(n, t, /* @__PURE__ */ new Date()), d = R(a, t, /* @__PURE__ */ new Date()), l = S(s) && n.length === t.length, h = S(d) && a.length === t.length;
+      if (!l || !h)
+        m(e?.from ? g(e.from, t) : ""), u(e?.to ? g(e.to, t) : ""), c(e);
+      else if (m(n), u(a), !p) {
+        const fe = V(s), ae = V(d);
+        r?.({ from: fe, to: ae });
+      }
+    }, ie = (e?.from ? g(e.from, t) : "") !== y, ce = (e?.to ? g(e.to, t) : "") !== D, de = y.length === t.length && !S(R(y, t, /* @__PURE__ */ new Date())), le = D.length === t.length && !S(R(D, t, /* @__PURE__ */ new Date()));
+    return /* @__PURE__ */ b("div", { className: "w-full space-y-1.5 min-w-[240px]", "data-component": "week-range-picker", "data-disabled": w || void 0, children: [
+      L && /* @__PURE__ */ b(
         "label",
         {
-          className: g(
+          className: N(
             "text-xs font-medium leading-[18px] text-[#60697d]",
-            x && "opacity-70",
-            b && "text-destructive"
+            w && "opacity-70",
+            C && "text-destructive"
           ),
           children: [
-            I,
+            L,
             " ",
-            J && /* @__PURE__ */ i("span", { className: "text-destructive", children: "*" })
+            Z && /* @__PURE__ */ f("span", { className: "text-destructive", children: "*" })
           ]
         }
       ),
-      /* @__PURE__ */ u(ce, { open: s, onOpenChange: h, children: [
-        /* @__PURE__ */ i(le, { asChild: !0, children: /* @__PURE__ */ u(
+      /* @__PURE__ */ b(ge, { open: i, onOpenChange: I, children: [
+        /* @__PURE__ */ f(xe, { asChild: !0, children: /* @__PURE__ */ b(
           "div",
           {
-            "data-state": s ? "open" : "closed",
-            className: g(
+            "data-state": i ? "open" : "closed",
+            className: N(
               "flex w-full items-center justify-between gap-2 rounded-md border bg-white px-3 text-sm shadow-sm transition-colors hover:border-primary disabled:cursor-not-allowed disabled:bg-disabled-secondary-bg disabled:text-disabled-text disabled:border-border",
-              b ? "border-destructive hover:border-destructive" : "border-input",
-              R === "sm" ? "h-6" : R === "md" ? "h-[28px]" : "h-8",
-              x && "pointer-events-none opacity-100 bg-disabled-secondary-bg border-border text-disabled-text hover:border-border",
+              C ? "border-destructive hover:border-destructive" : "border-input",
+              B === "sm" ? "h-6" : B === "md" ? "h-[28px]" : "h-8",
+              w && "pointer-events-none opacity-100 bg-disabled-secondary-bg border-border text-disabled-text hover:border-border",
               "cursor-pointer",
-              H
+              U
             ),
             children: [
-              /* @__PURE__ */ u("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
-                /* @__PURE__ */ i(
+              /* @__PURE__ */ b("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
+                /* @__PURE__ */ f(
                   "input",
                   {
-                    ref: Q,
+                    ref: $,
                     type: "text",
-                    value: B,
-                    onChange: ee,
-                    onBlur: j,
-                    onClick: (e) => s && e.stopPropagation(),
-                    placeholder: s ? n : "Start Week",
-                    disabled: !!x,
+                    value: y,
+                    onChange: se,
+                    onBlur: H,
+                    onClick: (n) => i && n.stopPropagation(),
+                    placeholder: i ? t : W,
+                    disabled: !!w,
                     "data-field": "start",
-                    className: g(
+                    className: N(
                       "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-[#dfe2e7] disabled:cursor-not-allowed disabled:opacity-50",
-                      re && "text-muted-foreground"
+                      de ? "text-destructive" : ie ? "text-muted-foreground" : ""
                     ),
-                    ...K
+                    ...Y
                   }
                 ),
-                /* @__PURE__ */ i(
+                /* @__PURE__ */ f(
                   "input",
                   {
+                    ref: F,
                     type: "text",
-                    value: M,
-                    onChange: te,
-                    onBlur: j,
-                    onClick: (e) => s && e.stopPropagation(),
-                    placeholder: s ? n : "End Week",
-                    disabled: !!x,
+                    value: D,
+                    onChange: re,
+                    onBlur: H,
+                    onClick: (n) => i && n.stopPropagation(),
+                    placeholder: i ? t : W,
+                    disabled: !!w,
                     "data-field": "end",
-                    className: g(
+                    className: N(
                       "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-[#dfe2e7] disabled:cursor-not-allowed disabled:opacity-50",
-                      se && "text-muted-foreground"
+                      le ? "text-destructive" : ce ? "text-muted-foreground" : ""
                     )
                   }
                 )
               ] }),
-              /* @__PURE__ */ u("div", { className: "flex items-center gap-1 shrink-0", children: [
-                t?.from && !x && /* @__PURE__ */ i(
-                  ae,
+              /* @__PURE__ */ b("div", { className: "flex items-center gap-1 shrink-0", children: [
+                e?.from && !w && /* @__PURE__ */ f(
+                  pe,
                   {
                     className: "h-4 w-4 cursor-pointer hover:text-foreground text-muted-foreground",
-                    onClick: (e) => {
-                      e.stopPropagation(), A();
+                    onClick: (n) => {
+                      n.stopPropagation(), z();
                     }
                   }
                 ),
-                /* @__PURE__ */ i(de, { className: "h-4 w-4 text-secondary-foreground" })
+                /* @__PURE__ */ f(me, { className: "h-4 w-4 text-secondary-foreground" })
               ] })
             ]
           }
         ) }),
-        /* @__PURE__ */ i(
-          fe,
+        /* @__PURE__ */ f(
+          he,
           {
             className: "w-auto p-0",
             align: "start",
-            onOpenAutoFocus: (e) => e.preventDefault(),
-            children: /* @__PURE__ */ i(
-              pe,
+            onOpenAutoFocus: (n) => n.preventDefault(),
+            children: /* @__PURE__ */ f(
+              be,
               {
                 pickerType: "week",
                 weekMode: "range",
-                selectedWeeks: o,
-                onWeekSelect: Y,
-                month: $,
-                onMonthChange: D,
-                fromDate: T,
-                toDate: X,
-                fromYear: q,
-                toYear: G,
-                showFooter: a,
-                calendarType: v,
-                fiscalMode: N,
-                selectionMode: C,
-                fiscalMonthPattern: S,
-                fiscalYearStartMonth: W,
-                weekStartsOn: P,
-                onApply: _,
-                onCancel: F,
-                onClear: A,
+                selectedWeeks: k,
+                onWeekSelect: te,
+                month: ee,
+                onMonthChange: P,
+                disabled: { before: G, after: J },
+                fromYear: K,
+                toYear: Q,
+                showFooter: p,
+                calendarType: E,
+                fiscalMode: v,
+                selectionMode: A,
+                fiscalMonthPattern: M,
+                fiscalYearStartMonth: T,
+                weekStartsOn: j,
+                onApply: ne,
+                onCancel: oe,
+                onClear: z,
                 captionLayout: "dropdown"
               }
             )
           }
         )
       ] }),
-      V && /* @__PURE__ */ u("div", { className: g("flex items-center gap-1", b && "text-destructive"), children: [
-        !b && /* @__PURE__ */ i(ie, { size: 10, className: "shrink-0 text-muted-foreground" }),
-        /* @__PURE__ */ i(
+      O && /* @__PURE__ */ b("div", { className: N("flex items-center gap-1", C && "text-destructive"), children: [
+        !C && /* @__PURE__ */ f(ue, { size: 10, className: "shrink-0 text-muted-foreground" }),
+        /* @__PURE__ */ f(
           "p",
           {
-            className: g(
+            className: N(
               "text-[10px] text-[#7a8294]",
-              b && "text-destructive"
+              C && "text-destructive"
             ),
-            children: V
+            children: O
           }
         )
       ] })
     ] });
   }
 );
-ue.displayName = "WeekRangePicker";
+ke.displayName = "WeekRangePicker";
 export {
-  ue as WeekRangePicker
+  ke as WeekRangePicker
 };

package/dist/components/ui/dynamic-layout.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const dynamicLayoutVariants: (props?: {
     layout?: "grid" | "flex" | "stack";
-    columns?: 12 | 1 | 4 | 3 | 2 | 6;
+    columns?: 1 | 12 | 4 | 3 | 2 | 6;
     gap?: "sm" | "md" | "lg" | "xl" | "none";
 } & import('class-variance-authority/types').ClassProp) => string;
 export interface DynamicLayoutProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof dynamicLayoutVariants> {

package/dist/lib/utils.d.ts

@@ -1,3 +1,4 @@
 import { ClassValue } from 'clsx';
 export declare function cn(...inputs: ClassValue[]): string;
-export declare function maskDate(value: string, formatStr: string): string;
+export declare function maskDate(value: string, formatStr: string, previousValue?: string): string;
+export declare function padValidDateString(value: string, formatStr: string): string;

package/dist/lib/utils.js

@@ -1,18 +1,34 @@
-import { clsx as l } from "clsx";
-import { twMerge as s } from "tailwind-merge";
-function f(...e) {
-  return s(l(e));
+import { clsx as f } from "clsx";
+import { twMerge as d } from "tailwind-merge";
+function x(...s) {
+  return d(f(s));
 }
-function m(e, r) {
-  const i = e.replace(/\D/g, "");
-  let t = "", o = 0;
-  for (let n = 0; n < r.length && o < i.length; n++) {
-    const c = r[n];
-    /[a-zA-Z]/.test(c) ? t += i[o++] : t += c;
+function P(s, g, l = "") {
+  if (!s) return "";
+  const r = g.replace(/[a-zA-Z]/g, "")[0] || "/", a = l && s.length < l.length, n = s.split(r), i = g.split(r), c = [];
+  for (let t = 0; t < n.length && !(t >= i.length); t++) {
+    let e = n[t].replace(/[^0-9]/g, "");
+    const o = i[t].length;
+    if (e.length > o) {
+      const p = e.substring(o);
+      e = e.substring(0, o), n[t + 1] !== void 0 ? n[t + 1] = p + n[t + 1] : n.push(p);
+    }
+    !a && t < n.length - 1 && e.length > 0 && e.length < o && (e = e.padStart(o, "0")), c.push(e);
   }
-  return t;
+  let h = c.join(r);
+  if (!a) {
+    const t = c.length - 1;
+    t < i.length - 1 && c[t].length === i[t].length && (h.endsWith(r) || (h += r));
+  }
+  return h;
+}
+function b(s, g) {
+  if (!s) return "";
+  const l = g.replace(/[a-zA-Z]/g, "")[0] || "/", r = s.split(l), a = g.split(l);
+  return r.map((n, i) => a[i] && n ? n.padStart(a[i].length, "0") : n).join(l);
 }
 export {
-  f as cn,
-  m as maskDate
+  x as cn,
+  P as maskDate,
+  b as padValidDateString
 };

package/package.json

@@ -1,7 +1,7 @@
 
 {
   "name": "impact-nova",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Enterprise-grade React design system built with React 19, Vite, Tailwind CSS, and Radix UI. Comprehensive UI component library for scalable, accessible, and performant applications.",
   "type": "module",
   "main": "./dist/index.js",