cortex-react-components 3.3.0 → 4.0.3

package/dist/chunk-IC4N2KYF.mjs

@@ -0,0 +1,401 @@
+"use client";
+"use strict";
+
+import {
+  DashboardHero
+} from "./chunk-I2MVZVXE.mjs";
+import {
+  extractId
+} from "./chunk-Y6HQV3VB.mjs";
+import {
+  Button
+} from "./chunk-I6LSWXZW.mjs";
+
+// src/components/Projects/GanttView.tsx
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import {
+  addDays,
+  differenceInDays,
+  eachMonthOfInterval,
+  format,
+  isWithinInterval
+} from "date-fns";
+import { BarChart2, Calendar, Maximize2, Minimize2 } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var PHASE_LABELS = {
+  1: "Plan",
+  2: "Dev",
+  3: "Test",
+  4: "Deploy",
+  5: "Review",
+  6: "Maint.",
+  7: "Complete",
+  8: "Archive",
+  9: "Legacy"
+};
+var ZOOM_LEVELS = [
+  { label: "Quarter", dayWidth: 3 },
+  { label: "Month", dayWidth: 7 },
+  { label: "Week", dayWidth: 14 },
+  { label: "Day", dayWidth: 40 }
+];
+var ROW_HEIGHT = 48;
+var TIME_HEADER_HEIGHT = 60;
+var GanttView = ({
+  tasks,
+  epics,
+  sprints,
+  onTaskClick
+}) => {
+  const [dayWidth, setDayWidth] = useState(7);
+  const [isFullscreen, setIsFullscreen] = useState(false);
+  const scrollRef = useRef(null);
+  const heroRef = useRef(null);
+  const [heroHeight, setHeroHeight] = useState(0);
+  useEffect(() => {
+    const measure = () => {
+      if (heroRef.current) setHeroHeight(heroRef.current.offsetHeight);
+    };
+    const observer = new ResizeObserver(measure);
+    if (heroRef.current) observer.observe(heroRef.current);
+    return () => observer.disconnect();
+  }, []);
+  const { timelineStart, timelineEnd, totalDays } = useMemo(() => {
+    if (epics.length === 0) {
+      const today = /* @__PURE__ */ new Date();
+      const start = addDays(today, -14);
+      const end = addDays(today, 76);
+      return { timelineStart: start, timelineEnd: end, totalDays: 90 };
+    }
+    const allDates = epics.flatMap((e) => [new Date(e.startDate), new Date(e.endDate)]);
+    const minTime = Math.min(...allDates.map((d) => d.getTime()));
+    const maxTime = Math.max(...allDates.map((d) => d.getTime()));
+    const paddedStart = addDays(new Date(minTime), -14);
+    const paddedEnd = addDays(new Date(maxTime), 14);
+    return {
+      timelineStart: paddedStart,
+      timelineEnd: paddedEnd,
+      totalDays: differenceInDays(paddedEnd, paddedStart)
+    };
+  }, [epics]);
+  const { groups, sortedKeys } = useMemo(() => {
+    const groups2 = {};
+    epics.forEach((epic) => {
+      if (!groups2[epic.name]) groups2[epic.name] = [];
+      groups2[epic.name].push(epic);
+    });
+    Object.values(groups2).forEach((list) => list.sort((a, b) => a.phase - b.phase));
+    const sortedKeys2 = Object.keys(groups2).sort((a, b) => {
+      const aMin = Math.min(...groups2[a].map((e) => new Date(e.startDate).getTime()));
+      const bMin = Math.min(...groups2[b].map((e) => new Date(e.startDate).getTime()));
+      return aMin - bMin;
+    });
+    return { groups: groups2, sortedKeys: sortedKeys2 };
+  }, [epics]);
+  const realSprints = useMemo(
+    () => sprints.filter((s) => {
+      const name = s.name.toLowerCase();
+      return name !== "backlog" && name !== "all tasks";
+    }),
+    [sprints]
+  );
+  const monthHeaders = useMemo(
+    () => eachMonthOfInterval({ start: timelineStart, end: timelineEnd }).map((month) => ({
+      month,
+      left: differenceInDays(month, timelineStart) * dayWidth
+    })),
+    [timelineStart, timelineEnd, dayWidth]
+  );
+  const totalWidth = Math.max(totalDays * dayWidth, 600);
+  const scrollToToday = useCallback(() => {
+    if (scrollRef.current) {
+      const todayOffset = differenceInDays(/* @__PURE__ */ new Date(), timelineStart) * dayWidth;
+      scrollRef.current.scrollLeft = Math.max(0, todayOffset - 200);
+    }
+  }, [timelineStart, dayWidth]);
+  const todayLeft = differenceInDays(/* @__PURE__ */ new Date(), timelineStart) * dayWidth;
+  const getEpicStats = (epic) => {
+    const epicTasks = tasks.filter((t) => extractId(t.epic) === epic.id);
+    const done = epicTasks.filter((t) => t.status === "done").length;
+    const pct = epicTasks.length > 0 ? Math.round(done / epicTasks.length * 100) : 0;
+    return { total: epicTasks.length, done, pct };
+  };
+  const getGroupStats = (epicList) => {
+    const allTasks = epicList.flatMap(
+      (e) => tasks.filter((t) => extractId(t.epic) === e.id)
+    );
+    const done = allTasks.filter((t) => t.status === "done").length;
+    const pct = allTasks.length > 0 ? Math.round(done / allTasks.length * 100) : 0;
+    return { total: allTasks.length, done, pct };
+  };
+  const isSprintActive = (sprint) => {
+    const today = /* @__PURE__ */ new Date();
+    try {
+      return isWithinInterval(today, {
+        start: new Date(sprint.startDate),
+        end: new Date(sprint.endDate)
+      });
+    } catch {
+      return false;
+    }
+  };
+  const chartContent = /* @__PURE__ */ jsxs("div", { className: "flex flex-1 min-h-0 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs("div", { className: "w-52 flex-shrink-0 border-r bg-background z-10 flex flex-col", children: [
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "border-b flex items-end pb-2 px-3 flex-shrink-0 bg-muted/20",
+          style: { height: TIME_HEADER_HEIGHT },
+          children: /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-muted-foreground tracking-wider uppercase", children: "Epic" })
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "overflow-y-auto flex-1", children: [
+        sortedKeys.length === 0 && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center h-24 text-sm text-muted-foreground", children: "No epics" }),
+        sortedKeys.map((name) => {
+          const stats = getGroupStats(groups[name]);
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "flex flex-col justify-center px-3 border-b",
+              style: { height: ROW_HEIGHT },
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "text-sm font-medium truncate", title: name, children: name }),
+                /* @__PURE__ */ jsxs("span", { className: "text-xs text-muted-foreground", children: [
+                  stats.total,
+                  " task",
+                  stats.total !== 1 ? "s" : "",
+                  " \xB7 ",
+                  stats.pct,
+                  "%"
+                ] })
+              ]
+            },
+            name
+          );
+        })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-x-auto overflow-y-auto", ref: scrollRef, children: /* @__PURE__ */ jsxs("div", { style: { width: totalWidth, position: "relative" }, children: [
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "sticky top-0 border-b bg-muted/20 z-20 flex-shrink-0",
+          style: { height: TIME_HEADER_HEIGHT, width: totalWidth },
+          children: [
+            monthHeaders.map(({ month, left }) => /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: "absolute top-2 text-xs font-semibold text-muted-foreground select-none",
+                style: { left: left + 4 },
+                children: format(month, "MMM yyyy")
+              },
+              month.toISOString()
+            )),
+            realSprints.map((sprint) => {
+              const start = new Date(sprint.startDate);
+              const end = new Date(sprint.endDate);
+              if (start > timelineEnd || end < timelineStart) return null;
+              const left = Math.max(0, differenceInDays(start, timelineStart) * dayWidth);
+              const right = Math.min(
+                totalWidth,
+                differenceInDays(end, timelineStart) * dayWidth
+              );
+              const width = right - left;
+              if (width <= 0) return null;
+              const active = isSprintActive(sprint);
+              return /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: `absolute bottom-0 border-l border-t text-xs px-1 overflow-hidden whitespace-nowrap select-none flex items-center ${active ? "border-primary/50 bg-primary/10 text-primary font-medium" : "border-border bg-muted/40 text-muted-foreground"}`,
+                  style: { left, width, height: 22 },
+                  title: sprint.name,
+                  children: sprint.name
+                },
+                `header-sprint-${sprint.id}`
+              );
+            })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { style: { position: "relative", width: totalWidth }, children: [
+        realSprints.map((sprint) => {
+          const start = new Date(sprint.startDate);
+          const end = new Date(sprint.endDate);
+          if (start > timelineEnd || end < timelineStart) return null;
+          const left = Math.max(0, differenceInDays(start, timelineStart) * dayWidth);
+          const right = Math.min(
+            totalWidth,
+            differenceInDays(end, timelineStart) * dayWidth
+          );
+          const width = right - left;
+          if (width <= 0 || !isSprintActive(sprint)) return null;
+          return /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "absolute inset-y-0 bg-primary/5 pointer-events-none",
+              style: { left, width }
+            },
+            `bg-${sprint.id}`
+          );
+        }),
+        realSprints.map((sprint) => {
+          const left = differenceInDays(new Date(sprint.startDate), timelineStart) * dayWidth;
+          if (left < 0 || left > totalWidth) return null;
+          const active = isSprintActive(sprint);
+          return /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: `absolute inset-y-0 pointer-events-none ${active ? "border-l border-primary/40" : "border-l border-dashed border-border/60"}`,
+              style: { left }
+            },
+            `line-${sprint.id}`
+          );
+        }),
+        todayLeft >= 0 && todayLeft <= totalWidth && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "absolute inset-y-0 pointer-events-none z-10",
+            style: { left: todayLeft },
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "absolute inset-y-0 w-0.5 bg-destructive/50" }),
+              /* @__PURE__ */ jsx("div", { className: "absolute top-1 -translate-x-1/2 w-2 h-2 rounded-full bg-destructive" })
+            ]
+          }
+        ),
+        monthHeaders.map(({ month, left }) => /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "absolute inset-y-0 border-l border-border/30 pointer-events-none",
+            style: { left }
+          },
+          `grid-${month.toISOString()}`
+        )),
+        sortedKeys.map((name) => {
+          const epicList = groups[name];
+          return /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "border-b relative flex items-center",
+              style: { height: ROW_HEIGHT },
+              children: epicList.map((epic) => {
+                const start = new Date(epic.startDate);
+                const end = new Date(epic.endDate);
+                const left = differenceInDays(start, timelineStart) * dayWidth;
+                const width = Math.max(8, differenceInDays(end, start) * dayWidth);
+                const stats = getEpicStats(epic);
+                const phaseLabel = PHASE_LABELS[epic.phase] ?? `Phase ${epic.phase}`;
+                const showLabel = width >= 50;
+                const tooltip = [
+                  `${epic.name} \xB7 ${phaseLabel}`,
+                  epic.description ? epic.description : null,
+                  `${format(start, "dd MMM yyyy")} \u2192 ${format(end, "dd MMM yyyy")}`,
+                  `${stats.total} tasks \xB7 ${stats.pct}% complete`
+                ].filter(Boolean).join("\n");
+                return /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: "absolute rounded overflow-hidden cursor-pointer hover:ring-2 hover:ring-white/40 transition-all",
+                    style: { left, width, height: 32, top: 8 },
+                    title: tooltip,
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: `absolute inset-0 ${epic.color}`,
+                          style: { opacity: 0.2 }
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: `absolute inset-y-0 left-0 ${epic.color} transition-all`,
+                          style: { width: `${stats.pct}%`, opacity: 0.85 }
+                        }
+                      ),
+                      showLabel && /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 flex items-center px-2 gap-1.5 z-10", children: [
+                        /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold text-white drop-shadow truncate", children: phaseLabel }),
+                        stats.total > 0 && /* @__PURE__ */ jsxs("span", { className: "text-xs text-white/80 drop-shadow shrink-0", children: [
+                          stats.pct,
+                          "%"
+                        ] })
+                      ] })
+                    ]
+                  },
+                  epic.id
+                );
+              })
+            },
+            name
+          );
+        }),
+        sortedKeys.length === 0 && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "flex items-center justify-center text-sm text-muted-foreground",
+            style: { height: 200 },
+            children: "No epics to display on the timeline"
+          }
+        )
+      ] })
+    ] }) })
+  ] });
+  const inner = /* @__PURE__ */ jsxs("div", { className: `flex flex-col ${isFullscreen ? "h-screen" : "h-full"} overflow-hidden`, children: [
+    /* @__PURE__ */ jsx("div", { ref: heroRef, className: "flex-shrink-0", children: /* @__PURE__ */ jsx(
+      DashboardHero,
+      {
+        title: "Gantt Chart",
+        description: "Epic timeline with sprint alignment and phase-based grouping.",
+        gradient: "bg-gradient-to-r from-indigo-600 via-blue-600 to-cyan-600",
+        badge: `${sortedKeys.length} epic${sortedKeys.length !== 1 ? "s" : ""}`
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-4 py-2 border-b bg-background flex-shrink-0", children: [
+      /* @__PURE__ */ jsx(BarChart2, { className: "h-4 w-4 text-muted-foreground" }),
+      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", children: ZOOM_LEVELS.map((z) => /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: dayWidth === z.dayWidth ? "default" : "outline",
+          size: "sm",
+          className: "h-7 px-2 text-xs",
+          onClick: () => setDayWidth(z.dayWidth),
+          children: z.label
+        },
+        z.label
+      )) }),
+      /* @__PURE__ */ jsx("div", { className: "flex-1" }),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          className: "h-7 px-2 text-xs",
+          onClick: scrollToToday,
+          children: [
+            /* @__PURE__ */ jsx(Calendar, { className: "h-3 w-3 mr-1" }),
+            "Today"
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "sm",
+          className: "h-7 w-7 p-0",
+          onClick: () => setIsFullscreen((v) => !v),
+          title: isFullscreen ? "Exit fullscreen" : "Fullscreen",
+          children: isFullscreen ? /* @__PURE__ */ jsx(Minimize2, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx(Maximize2, { className: "h-3.5 w-3.5" })
+        }
+      )
+    ] }),
+    chartContent
+  ] });
+  if (isFullscreen) {
+    return /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 bg-background overflow-hidden", children: inner });
+  }
+  return inner;
+};
+
+export {
+  GanttView
+};

package/dist/{chunk-GGOGMLBY.mjs → chunk-JKVS2VFG.mjs}

@@ -1,3 +1,6 @@
+import {
+  Italic_default
+} from "./chunk-PLFX66EX.mjs";
 import {
   StrikeThrough_default
 } from "./chunk-EGCBZZGV.mjs";
@@ -13,7 +16,7 @@ import {
 import {
   INSERT_UPLOAD_COMMAND,
   InsertInlineImageDialog
-} from "./chunk-4JSM5VYZ.mjs";
+} from "./chunk-SAVDOTMQ.mjs";
 import {
   $createMyUploadNode
 } from "./chunk-ZJB7AFL5.mjs";
@@ -27,9 +30,6 @@ import {
   H4,
   TextIcon
 } from "./chunk-SNUES6JA.mjs";
-import {
-  Italic_default
-} from "./chunk-PLFX66EX.mjs";
 import {
   DropdownMenu,
   DropdownMenuContent,

package/dist/{chunk-OPJMXB4K.mjs → chunk-K4ZS4W4S.mjs}

@@ -9,14 +9,14 @@ import {
 } from "./chunk-WHCZTD2K.mjs";
 import {
   DashboardHero
-} from "./chunk-QPO45D6F.mjs";
+} from "./chunk-I2MVZVXE.mjs";
 import {
   Dialog,
   DialogContent,
   DialogDescription,
   DialogHeader,
   DialogTitle
-} from "./chunk-3BYULUMU.mjs";
+} from "./chunk-T62Q55Y5.mjs";
 
 // src/components/Projects/ProjectsIndexView.tsx
 import { useState } from "react";

package/dist/{chunk-Q6CUUDUR.mjs → chunk-LVLYUHSA.mjs}

@@ -1,6 +1,6 @@
 import {
   SectionHeading
-} from "./chunk-WX5QYPGU.mjs";
+} from "./chunk-CUUAA2TB.mjs";
 import {
   Form
 } from "./chunk-GSG52WU5.mjs";

package/dist/{chunk-UDCOG2XL.mjs → chunk-LY4RR7AL.mjs}

@@ -17,7 +17,7 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle
-} from "./chunk-3BYULUMU.mjs";
+} from "./chunk-T62Q55Y5.mjs";
 import {
   Input
 } from "./chunk-YMZ2OUK6.mjs";

package/dist/{chunk-QMFGV3M5.mjs → chunk-LZUYY2G6.mjs}

@@ -1,9 +1,9 @@
 import {
   AddSprintModal
-} from "./chunk-B7WVGDB6.mjs";
+} from "./chunk-SZJ6XME5.mjs";
 import {
   DashboardHero
-} from "./chunk-QPO45D6F.mjs";
+} from "./chunk-I2MVZVXE.mjs";
 import {
   extractId
 } from "./chunk-Y6HQV3VB.mjs";

package/dist/{chunk-XGHUG2WQ.mjs → chunk-MDG2I4PB.mjs}

@@ -19,7 +19,7 @@ import {
   Button
 } from "./chunk-I6LSWXZW.mjs";
 
-// src/components/.archive/app-card.tsx
+// src/components/Foundry/app-card.tsx
 import { motion } from "motion/react";
 import { Star } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/{chunk-YD7Q7IZX.mjs → chunk-MNJ5CMJM.mjs}

@@ -3,7 +3,7 @@
 
 import {
   RichText
-} from "./chunk-RFQKQLNT.mjs";
+} from "./chunk-JJDC25TG.mjs";
 import {
   cn
 } from "./chunk-KZPGX6CG.mjs";

package/dist/{chunk-YY4VLYYH.mjs → chunk-MOMYX6OH.mjs}

@@ -3,28 +3,31 @@
 
 import {
   TasksView
-} from "./chunk-DSVXGGGV.mjs";
+} from "./chunk-54AIO5ED.mjs";
 import {
   PlanningView
-} from "./chunk-QMFGV3M5.mjs";
+} from "./chunk-LZUYY2G6.mjs";
 import {
   EpicsView
-} from "./chunk-APXXTGT4.mjs";
+} from "./chunk-PBIUFMQ7.mjs";
 import {
-  KanbanBoardView
-} from "./chunk-LM4J7254.mjs";
+  FileView
+} from "./chunk-DST7L2PX.mjs";
 import {
-  AddEpicModal
-} from "./chunk-UDCOG2XL.mjs";
+  GanttView
+} from "./chunk-IC4N2KYF.mjs";
+import {
+  KanbanBoardView
+} from "./chunk-ZSGXRIK7.mjs";
 import {
   AddTaskModal
-} from "./chunk-C3CKYJ2F.mjs";
+} from "./chunk-GZRODHXY.mjs";
 import {
-  FileView
-} from "./chunk-SSE3MQDP.mjs";
+  AddEpicModal
+} from "./chunk-LY4RR7AL.mjs";
 import {
   ManagementSidebar
-} from "./chunk-IWG2URAU.mjs";
+} from "./chunk-QM3XSGNV.mjs";
 import {
   extractId
 } from "./chunk-Y6HQV3VB.mjs";
@@ -326,6 +329,8 @@ function ProjectView({
         return "Documentation";
       case "epics":
         return "Epic Planning";
+      case "gantt":
+        return "Gantt Chart";
       default:
         return "Project Board";
     }
@@ -407,6 +412,16 @@ function ProjectView({
         onDeleteEpic: handleDeleteEpic
       }
     ) }),
+    currentView === "gantt" && /* @__PURE__ */ jsx("div", { className: "hidden md:block h-full", children: /* @__PURE__ */ jsx(
+      GanttView,
+      {
+        tasks,
+        epics,
+        sprints,
+        onUpdateEpic: handleUpdateEpic,
+        onTaskClick: handleTaskClick
+      }
+    ) }),
     /* @__PURE__ */ jsx(
       AddTaskModal,
       {

package/dist/{chunk-EDYFH3EJ.mjs → chunk-NM7RODDO.mjs}

@@ -1,13 +1,13 @@
 import {
   CollapsibleBlock
-} from "./chunk-YD7Q7IZX.mjs";
+} from "./chunk-MNJ5CMJM.mjs";
 import {
   ContentBlock
-} from "./chunk-URC56DLC.mjs";
+} from "./chunk-T2VDQBFT.mjs";
 import {
   CallToActionBlock,
   FeaturesBlock
-} from "./chunk-RFQKQLNT.mjs";
+} from "./chunk-JJDC25TG.mjs";
 import {
   MediaBlock
 } from "./chunk-KIZUBPPQ.mjs";

package/dist/{chunk-KOK3VCJZ.mjs → chunk-O5RKEF5N.mjs}

@@ -3,13 +3,13 @@
 
 import {
   FileEdit
-} from "./chunk-4JHX6BW6.mjs";
+} from "./chunk-BEGQGEDH.mjs";
 import {
   Dialog,
   DialogOverlay,
   DialogPortal,
   DialogTitle
-} from "./chunk-3BYULUMU.mjs";
+} from "./chunk-T62Q55Y5.mjs";
 import {
   Button
 } from "./chunk-I6LSWXZW.mjs";