@tangle-network/sandbox-ui 0.9.0 → 0.10.1

package/dist/chat.js

@@ -8,13 +8,13 @@ import {
   MessageList,
   ThinkingIndicator,
   UserMessage
-} from "./chunk-JLKYXLFN.js";
+} from "./chunk-WKSGQVLI.js";
 import "./chunk-54SQQMMM.js";
-import "./chunk-EXSOPXIY.js";
+import "./chunk-QOL4ZB24.js";
 import "./chunk-HRMUF35V.js";
 import "./chunk-MT5FJ3ZT.js";
 import "./chunk-BX6AQMUS.js";
-import "./chunk-PLTZB5BC.js";
+import "./chunk-ZNCEM5CD.js";
 import "./chunk-34I7UFSX.js";
 import "./chunk-T7HMZEVO.js";
 import "./chunk-ZMNSRDMH.js";

package/dist/{chunk-7YWFOGKQ.js → chunk-2XCOGNZP.js}

@@ -516,6 +516,10 @@ function XIcon({ className }) {
     /* @__PURE__ */ jsx7("path", { d: "m6 6 12 12" })
   ] });
 }
+function formatNotifDate(raw) {
+  const d = new Date(raw);
+  return Number.isNaN(d.getTime()) ? raw : d.toLocaleString(void 0, { month: "short", day: "numeric", hour: "2-digit", minute: "2-digit" });
+}
 function DefaultLink2({
   href,
   to,
@@ -546,10 +550,30 @@ function DashboardLayoutInner({
   LinkComponent = DefaultLink2,
   footer,
   railFooter,
-  profileMenuItems
+  profileMenuItems,
+  notifications: notifData
 }) {
   const Link = LinkComponent;
   const [mobileMenuOpen, setMobileMenuOpen] = React3.useState(false);
+  const [notificationsOpen, setNotificationsOpen] = React3.useState(false);
+  const notifRef = React3.useRef(null);
+  React3.useEffect(() => {
+    if (!notificationsOpen) return;
+    const handler = (e) => {
+      if (notifRef.current && !notifRef.current.contains(e.target)) {
+        setNotificationsOpen(false);
+      }
+    };
+    const keyHandler = (e) => {
+      if (e.key === "Escape") setNotificationsOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    document.addEventListener("keydown", keyHandler);
+    return () => {
+      document.removeEventListener("mousedown", handler);
+      document.removeEventListener("keydown", keyHandler);
+    };
+  }, [notificationsOpen]);
   const { contentMargin, hidden, mode, hasPanels, panelOpen } = useSidebar();
   const modeSet = React3.useMemo(() => new Set(modeItems), [modeItems]);
   const sidebarUser = user ? { email: user.email, name: user.name, tier: user.tier, avatarUrl: user.avatarUrl } : void 0;
@@ -640,7 +664,61 @@ function DashboardLayoutInner({
                 ]
               }
             ),
-            /* @__PURE__ */ jsx7("button", { type: "button", className: "text-muted-foreground hover:text-foreground transition-colors p-2 rounded-lg hover:bg-muted/50", children: /* @__PURE__ */ jsx7(Bell, { className: "h-4 w-4" }) })
+            /* @__PURE__ */ jsxs6("div", { className: "relative", ref: notifRef, children: [
+              /* @__PURE__ */ jsxs6(
+                "button",
+                {
+                  type: "button",
+                  className: "relative text-muted-foreground hover:text-foreground transition-colors p-2 rounded-lg hover:bg-muted/50",
+                  onClick: () => setNotificationsOpen(!notificationsOpen),
+                  "aria-label": "Notifications",
+                  "aria-expanded": notificationsOpen,
+                  children: [
+                    /* @__PURE__ */ jsx7(Bell, { className: "h-4 w-4" }),
+                    (notifData?.unreadCount ?? 0) > 0 && /* @__PURE__ */ jsx7("span", { className: "absolute top-1 right-1 h-2 w-2 rounded-full bg-destructive" })
+                  ]
+                }
+              ),
+              notificationsOpen && /* @__PURE__ */ jsxs6("div", { className: "absolute right-0 top-full mt-2 w-80 rounded-lg border border-border bg-card shadow-lg z-50", children: [
+                /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between border-b border-border px-4 py-3", children: [
+                  /* @__PURE__ */ jsx7("p", { className: "font-bold text-foreground text-sm", children: "Notifications" }),
+                  (notifData?.unreadCount ?? 0) > 0 && notifData?.onMarkAllRead && /* @__PURE__ */ jsx7(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => {
+                        notifData.onMarkAllRead?.();
+                      },
+                      className: "text-primary text-xs font-medium hover:underline",
+                      children: "Mark all read"
+                    }
+                  )
+                ] }),
+                !notifData?.items || notifData.items.length === 0 ? /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center justify-center px-4 py-8 text-center", children: [
+                  /* @__PURE__ */ jsx7(Bell, { className: "h-8 w-8 text-muted-foreground/40 mb-2" }),
+                  /* @__PURE__ */ jsx7("p", { className: "text-muted-foreground text-sm", children: "No notifications yet" }),
+                  /* @__PURE__ */ jsx7("p", { className: "text-muted-foreground/60 text-xs mt-1", children: "We'll notify you about important updates" })
+                ] }) : /* @__PURE__ */ jsx7("div", { className: "max-h-80 overflow-y-auto", children: notifData.items.map((n) => /* @__PURE__ */ jsxs6(
+                  "button",
+                  {
+                    type: "button",
+                    className: cn(
+                      "w-full text-left px-4 py-3 border-b border-border last:border-0 transition-colors",
+                      n.read ? "cursor-default" : "bg-primary/5 hover:bg-muted/50"
+                    ),
+                    onClick: () => {
+                      if (!n.read) notifData.onMarkRead?.(n.id);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx7("p", { className: cn("text-sm", !n.read ? "font-semibold text-foreground" : "text-muted-foreground"), children: n.title }),
+                      /* @__PURE__ */ jsx7("p", { className: "text-xs text-muted-foreground mt-0.5 line-clamp-2", children: n.message }),
+                      /* @__PURE__ */ jsx7("p", { className: "text-[10px] text-muted-foreground/50 mt-1", children: formatNotifDate(n.createdAt) })
+                    ]
+                  },
+                  n.id
+                )) })
+              ] })
+            ] })
           ] }),
           /* @__PURE__ */ jsx7(
             "button",

package/dist/{chunk-QC4BJEG6.js → chunk-A5ALUT2B.js}

@@ -10,10 +10,10 @@ import {
 } from "./chunk-MA7YKRUP.js";
 import {
   ChatContainer
-} from "./chunk-JLKYXLFN.js";
+} from "./chunk-WKSGQVLI.js";
 import {
   OpenUIArtifactRenderer
-} from "./chunk-PLTZB5BC.js";
+} from "./chunk-ZNCEM5CD.js";
 import {
   FileArtifactPane,
   FileTree,
@@ -1656,6 +1656,529 @@ function CheckRow({ check }) {
   ] });
 }
 
+// src/workspace/task-board.tsx
+import { useMemo as useMemo5 } from "react";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+function TaskBoard({
+  items,
+  columns,
+  className,
+  onMoveItem,
+  onClickItem,
+  renderItemMeta,
+  renderColumnAction,
+  renderBadge,
+  columnEmptyState,
+  header
+}) {
+  const grouped = useMemo5(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const col of columns) map.set(col.id, []);
+    for (const item of items) {
+      const list = map.get(item.status);
+      if (list) list.push(item);
+      else map.get(columns[columns.length - 1]?.id)?.push(item);
+    }
+    return map;
+  }, [items, columns]);
+  return /* @__PURE__ */ jsxs11("div", { className: cn("flex flex-1 flex-col overflow-hidden", className), children: [
+    header,
+    /* @__PURE__ */ jsx11("div", { className: "flex flex-1 gap-3 overflow-x-auto p-4", children: columns.map((col) => {
+      const colItems = grouped.get(col.id) ?? [];
+      return /* @__PURE__ */ jsxs11(
+        "div",
+        {
+          className: cn(
+            "flex w-72 shrink-0 flex-col rounded-xl border border-border bg-card/50 border-t-2",
+            col.accent ?? "border-t-muted-foreground/30"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs11("div", { className: "flex items-center justify-between px-4 py-3", children: [
+              /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx11("h3", { className: "text-xs font-semibold uppercase tracking-wider text-muted-foreground", children: col.label }),
+                /* @__PURE__ */ jsx11("span", { className: "inline-flex h-5 min-w-[20px] items-center justify-center rounded-full border border-border px-1.5 text-[10px] font-medium text-muted-foreground", children: colItems.length })
+              ] }),
+              renderColumnAction?.(col)
+            ] }),
+            /* @__PURE__ */ jsxs11("div", { className: "flex flex-1 flex-col gap-2 overflow-y-auto px-2 pb-2 min-h-[80px]", children: [
+              colItems.length === 0 && columnEmptyState,
+              colItems.map((item) => /* @__PURE__ */ jsxs11(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => onClickItem?.(item),
+                  className: "group w-full rounded-lg border border-border bg-card p-3 text-left transition-colors hover:border-accent/50",
+                  children: [
+                    /* @__PURE__ */ jsx11("p", { className: "text-sm font-medium text-foreground", children: item.title }),
+                    item.description && /* @__PURE__ */ jsx11("p", { className: "mt-1 text-xs text-muted-foreground line-clamp-2", children: item.description }),
+                    (item.priority || item.tags?.length) && /* @__PURE__ */ jsxs11("div", { className: "mt-2 flex flex-wrap gap-1.5", children: [
+                      item.priority && (renderBadge ? renderBadge(item.priority, "priority") : /* @__PURE__ */ jsx11("span", { className: "rounded-full border border-border px-2 py-0.5 text-[10px] font-medium text-muted-foreground", children: item.priority })),
+                      item.tags?.map(
+                        (tag) => renderBadge ? /* @__PURE__ */ jsx11("span", { children: renderBadge(tag, "tag") }, tag) : /* @__PURE__ */ jsx11(
+                          "span",
+                          {
+                            className: "rounded-full border border-border px-2 py-0.5 text-[10px] text-muted-foreground",
+                            children: tag
+                          },
+                          tag
+                        )
+                      )
+                    ] }),
+                    renderItemMeta?.(item)
+                  ]
+                },
+                item.id
+              ))
+            ] })
+          ]
+        },
+        col.id
+      );
+    }) })
+  ] });
+}
+
+// src/workspace/calendar-view.tsx
+import { useState as useState6, useMemo as useMemo6 } from "react";
+import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+function toDateKey(d) {
+  return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+}
+function getMonthDays(year, month) {
+  const first = new Date(year, month, 1);
+  const startDay = first.getDay();
+  const days = [];
+  for (let i = startDay - 1; i >= 0; i--) {
+    const d = new Date(year, month, -i);
+    days.push({ date: d, key: toDateKey(d), inMonth: false });
+  }
+  const daysInMonth = new Date(year, month + 1, 0).getDate();
+  for (let i = 1; i <= daysInMonth; i++) {
+    const d = new Date(year, month, i);
+    days.push({ date: d, key: toDateKey(d), inMonth: true });
+  }
+  const remaining = 7 - days.length % 7;
+  if (remaining < 7) {
+    for (let i = 1; i <= remaining; i++) {
+      const d = new Date(year, month + 1, i);
+      days.push({ date: d, key: toDateKey(d), inMonth: false });
+    }
+  }
+  return days;
+}
+function CalendarView({
+  events,
+  className,
+  month: controlledMonth,
+  year: controlledYear,
+  onMonthChange,
+  selectedDay: controlledSelectedDay,
+  onSelectDay,
+  onDoubleClickDay,
+  renderEventChip,
+  renderDayDetail,
+  headerLeft,
+  headerRight,
+  showDayPanel = true
+}) {
+  const today = /* @__PURE__ */ new Date();
+  const todayKey = toDateKey(today);
+  const [internalMonth, setInternalMonth] = useState6({
+    year: today.getFullYear(),
+    month: today.getMonth()
+  });
+  const [internalSelectedDay, setInternalSelectedDay] = useState6(
+    todayKey
+  );
+  const viewYear = controlledYear ?? internalMonth.year;
+  const viewMonth = controlledMonth ?? internalMonth.month;
+  const selectedDay = controlledSelectedDay ?? internalSelectedDay;
+  function setMonth(y, m) {
+    if (onMonthChange) onMonthChange(y, m);
+    else setInternalMonth({ year: y, month: m });
+  }
+  function selectDay(key) {
+    if (onSelectDay) onSelectDay(key);
+    else setInternalSelectedDay(key);
+  }
+  function prevMonth() {
+    const m = viewMonth === 0 ? 11 : viewMonth - 1;
+    const y = viewMonth === 0 ? viewYear - 1 : viewYear;
+    setMonth(y, m);
+  }
+  function nextMonth() {
+    const m = viewMonth === 11 ? 0 : viewMonth + 1;
+    const y = viewMonth === 11 ? viewYear + 1 : viewYear;
+    setMonth(y, m);
+  }
+  const eventsByDate = useMemo6(() => {
+    const map = {};
+    for (const evt of events) {
+      const d = typeof evt.startAt === "string" ? evt.startAt.slice(0, 10) : toDateKey(evt.startAt);
+      if (!map[d]) map[d] = [];
+      map[d].push(evt);
+    }
+    return map;
+  }, [events]);
+  const monthDays = useMemo6(
+    () => getMonthDays(viewYear, viewMonth),
+    [viewYear, viewMonth]
+  );
+  const monthLabel = new Date(viewYear, viewMonth).toLocaleString("en-US", {
+    month: "long",
+    year: "numeric"
+  });
+  const selectedDayEvents = selectedDay ? eventsByDate[selectedDay] ?? [] : [];
+  return /* @__PURE__ */ jsxs12("div", { className: cn("flex flex-1 min-h-0 overflow-hidden", className), children: [
+    /* @__PURE__ */ jsxs12("div", { className: "flex-1 flex flex-col overflow-hidden border-r border-border", children: [
+      /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between border-b border-border px-4 py-2.5 shrink-0", children: [
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
+          headerLeft,
+          /* @__PURE__ */ jsx12(
+            "button",
+            {
+              type: "button",
+              onClick: prevMonth,
+              className: "h-7 w-7 rounded-md hover:bg-muted flex items-center justify-center text-muted-foreground",
+              children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx12("path", { d: "m15 18-6-6 6-6" }) })
+            }
+          ),
+          /* @__PURE__ */ jsx12("span", { className: "text-sm font-semibold text-foreground min-w-[160px] text-center", children: monthLabel }),
+          /* @__PURE__ */ jsx12(
+            "button",
+            {
+              type: "button",
+              onClick: nextMonth,
+              className: "h-7 w-7 rounded-md hover:bg-muted flex items-center justify-center text-muted-foreground",
+              children: /* @__PURE__ */ jsx12("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx12("path", { d: "m9 18 6-6-6-6" }) })
+            }
+          ),
+          /* @__PURE__ */ jsx12(
+            "button",
+            {
+              type: "button",
+              onClick: () => {
+                setMonth(today.getFullYear(), today.getMonth());
+                selectDay(todayKey);
+              },
+              className: "h-7 px-2 rounded-md border border-border text-xs font-medium text-muted-foreground hover:text-foreground",
+              children: "Today"
+            }
+          )
+        ] }),
+        headerRight
+      ] }),
+      /* @__PURE__ */ jsx12("div", { className: "grid grid-cols-7 border-b border-border shrink-0", children: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"].map((d) => /* @__PURE__ */ jsx12(
+        "div",
+        {
+          className: "px-2 py-1.5 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground text-center",
+          children: d
+        },
+        d
+      )) }),
+      /* @__PURE__ */ jsx12("div", { className: "flex-1 grid grid-cols-7 auto-rows-fr overflow-y-auto", children: monthDays.map(({ date, key, inMonth }) => {
+        const dayEvents = eventsByDate[key] ?? [];
+        const isToday = key === todayKey;
+        const isSelected = key === selectedDay;
+        return /* @__PURE__ */ jsxs12(
+          "button",
+          {
+            type: "button",
+            onClick: () => selectDay(key),
+            onDoubleClick: () => onDoubleClickDay?.(key),
+            className: cn(
+              "flex flex-col items-start p-1.5 border-b border-r border-border text-left transition-colors min-h-[72px]",
+              !inMonth && "bg-muted/30",
+              isSelected && "bg-primary/5 ring-1 ring-inset ring-primary/20",
+              !isSelected && "hover:bg-muted/50"
+            ),
+            children: [
+              /* @__PURE__ */ jsx12(
+                "span",
+                {
+                  className: cn(
+                    "text-xs font-medium w-6 h-6 flex items-center justify-center rounded-full mb-0.5",
+                    isToday && "bg-primary text-primary-foreground",
+                    !isToday && !inMonth && "text-muted-foreground/50",
+                    !isToday && inMonth && "text-foreground"
+                  ),
+                  children: date.getDate()
+                }
+              ),
+              /* @__PURE__ */ jsxs12("div", { className: "flex flex-wrap gap-0.5 w-full", children: [
+                dayEvents.slice(0, 3).map(
+                  (evt) => renderEventChip ? /* @__PURE__ */ jsx12("span", { children: renderEventChip(evt) }, evt.id) : /* @__PURE__ */ jsx12(
+                    "div",
+                    {
+                      className: "w-full truncate text-[9px] px-1 py-0.5 rounded bg-primary/10 text-primary",
+                      title: evt.title,
+                      children: evt.title
+                    },
+                    evt.id
+                  )
+                ),
+                dayEvents.length > 3 && /* @__PURE__ */ jsxs12("span", { className: "text-[9px] text-muted-foreground px-1", children: [
+                  "+",
+                  dayEvents.length - 3,
+                  " more"
+                ] })
+              ] })
+            ]
+          },
+          key
+        );
+      }) })
+    ] }),
+    showDayPanel && /* @__PURE__ */ jsx12("div", { className: "w-80 shrink-0 flex flex-col overflow-hidden", children: renderDayDetail ? renderDayDetail(selectedDay ?? todayKey, selectedDayEvents) : /* @__PURE__ */ jsxs12(Fragment2, { children: [
+      /* @__PURE__ */ jsxs12("div", { className: "px-4 py-3 border-b border-border shrink-0", children: [
+        /* @__PURE__ */ jsx12("h3", { className: "text-sm font-semibold text-foreground", children: selectedDay === todayKey ? "Today" : selectedDay ? (/* @__PURE__ */ new Date(selectedDay + "T00:00:00")).toLocaleDateString(
+          "en-US",
+          { weekday: "long", month: "long", day: "numeric" }
+        ) : "Select a day" }),
+        /* @__PURE__ */ jsxs12("p", { className: "text-xs text-muted-foreground", children: [
+          selectedDayEvents.length,
+          " event",
+          selectedDayEvents.length !== 1 ? "s" : ""
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs12("div", { className: "flex-1 overflow-y-auto p-2 space-y-2", children: [
+        selectedDayEvents.length === 0 && /* @__PURE__ */ jsx12("div", { className: "px-2 py-8 text-center", children: /* @__PURE__ */ jsx12("p", { className: "text-xs text-muted-foreground", children: "No events this day" }) }),
+        selectedDayEvents.map((evt) => /* @__PURE__ */ jsxs12(
+          "div",
+          {
+            className: "rounded-lg border border-border bg-card p-3",
+            children: [
+              /* @__PURE__ */ jsx12("p", { className: "text-sm font-medium text-foreground", children: evt.title }),
+              evt.type && /* @__PURE__ */ jsx12("span", { className: "mt-1 inline-block rounded-full border border-border px-2 py-0.5 text-[10px] text-muted-foreground", children: evt.type })
+            ]
+          },
+          evt.id
+        ))
+      ] })
+    ] }) })
+  ] });
+}
+
+// src/workspace/approval-queue.tsx
+import { useState as useState7, useMemo as useMemo7 } from "react";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+function ApprovalQueue({
+  items,
+  className,
+  onApprove,
+  onReject,
+  renderItemDetail,
+  renderTypeBadge,
+  renderStats,
+  canResolve = true,
+  header,
+  emptyState,
+  showResolved: controlledShowResolved
+}) {
+  const [rejectingId, setRejectingId] = useState7(null);
+  const [rejectReason, setRejectReason] = useState7("");
+  const [showResolved, setShowResolved] = useState7(controlledShowResolved ?? false);
+  const pending = useMemo7(
+    () => items.filter((a) => a.status === "pending"),
+    [items]
+  );
+  const resolved = useMemo7(
+    () => items.filter((a) => a.status !== "pending"),
+    [items]
+  );
+  const stats = useMemo7(() => {
+    const map = {};
+    for (const item of items) {
+      if (!map[item.type])
+        map[item.type] = { type: item.type, approved: 0, rejected: 0, total: 0, rate: 0 };
+      map[item.type].total++;
+      if (item.status === "approved" || item.status === "executed")
+        map[item.type].approved++;
+      if (item.status === "rejected") map[item.type].rejected++;
+    }
+    for (const s of Object.values(map)) {
+      s.rate = s.total > 0 ? Math.round(s.approved / s.total * 100) : 0;
+    }
+    return Object.values(map);
+  }, [items]);
+  if (items.length === 0) {
+    return /* @__PURE__ */ jsx13("div", { className: cn("flex-1 flex items-center justify-center", className), children: emptyState ?? /* @__PURE__ */ jsx13("div", { className: "text-center py-20", children: /* @__PURE__ */ jsx13("p", { className: "text-sm text-muted-foreground", children: "No proposals yet" }) }) });
+  }
+  return /* @__PURE__ */ jsx13("div", { className: cn("flex-1 overflow-y-auto", className), children: /* @__PURE__ */ jsxs13("div", { className: "max-w-3xl mx-auto p-6", children: [
+    header,
+    stats.length > 0 && /* @__PURE__ */ jsx13("div", { className: "flex gap-3 mb-6 flex-wrap", children: renderStats ? renderStats(stats) : stats.map((s) => /* @__PURE__ */ jsxs13(
+      "div",
+      {
+        className: "flex-1 min-w-[120px] rounded-lg border border-border bg-card p-3",
+        children: [
+          /* @__PURE__ */ jsx13("div", { className: "flex items-center gap-2 mb-1", children: renderTypeBadge ? renderTypeBadge(s.type) : /* @__PURE__ */ jsx13("span", { className: "rounded-full border border-border px-2 py-0.5 text-[10px] font-medium text-muted-foreground", children: s.type }) }),
+          /* @__PURE__ */ jsx13("div", { className: "flex items-baseline gap-1", children: /* @__PURE__ */ jsxs13("span", { className: "text-xl font-semibold text-foreground", children: [
+            s.rate,
+            "%"
+          ] }) }),
+          /* @__PURE__ */ jsxs13("p", { className: "text-[10px] text-muted-foreground", children: [
+            s.approved,
+            "/",
+            s.total,
+            " approved"
+          ] })
+        ]
+      },
+      s.type
+    )) }),
+    pending.length > 0 && /* @__PURE__ */ jsxs13("section", { className: "mb-8", children: [
+      /* @__PURE__ */ jsxs13("h3", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wider mb-3", children: [
+        "Pending (",
+        pending.length,
+        ")"
+      ] }),
+      /* @__PURE__ */ jsx13("div", { className: "space-y-3", children: pending.map((item) => /* @__PURE__ */ jsxs13(
+        "div",
+        {
+          className: "rounded-lg border border-primary/20 bg-card p-4",
+          children: [
+            /* @__PURE__ */ jsxs13("div", { className: "flex items-start gap-3", children: [
+              /* @__PURE__ */ jsxs13("div", { className: "flex-1 min-w-0", children: [
+                /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 mb-1", children: [
+                  /* @__PURE__ */ jsx13("h4", { className: "text-sm font-medium text-foreground", children: item.title }),
+                  renderTypeBadge ? renderTypeBadge(item.type) : /* @__PURE__ */ jsx13("span", { className: "rounded-full border border-border px-2 py-0.5 text-[10px] text-muted-foreground", children: item.type })
+                ] }),
+                item.description && /* @__PURE__ */ jsx13("p", { className: "text-xs text-muted-foreground line-clamp-2", children: item.description }),
+                renderItemDetail?.(item)
+              ] }),
+              canResolve && /* @__PURE__ */ jsxs13("div", { className: "flex gap-1.5 shrink-0", children: [
+                /* @__PURE__ */ jsx13(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => onApprove?.(item),
+                    className: "h-8 px-3 rounded-md border border-border text-xs font-medium text-emerald-500 hover:bg-emerald-500/10 hover:border-emerald-500/30 transition-colors",
+                    children: "Approve"
+                  }
+                ),
+                /* @__PURE__ */ jsx13(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => {
+                      setRejectingId(
+                        rejectingId === item.id ? null : item.id
+                      );
+                      setRejectReason("");
+                    },
+                    className: "h-8 px-3 rounded-md border border-border text-xs font-medium text-destructive hover:bg-destructive/10 hover:border-destructive/30 transition-colors",
+                    children: "Reject"
+                  }
+                )
+              ] })
+            ] }),
+            rejectingId === item.id && /* @__PURE__ */ jsxs13("div", { className: "mt-3 border-t border-border pt-3", children: [
+              /* @__PURE__ */ jsx13(
+                "textarea",
+                {
+                  placeholder: "Why are you rejecting this?",
+                  value: rejectReason,
+                  onChange: (e) => setRejectReason(e.target.value),
+                  className: "w-full rounded-md border border-border bg-background px-3 py-2 text-sm placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-primary/40 mb-2",
+                  rows: 2
+                }
+              ),
+              /* @__PURE__ */ jsxs13("div", { className: "flex gap-2 justify-end", children: [
+                /* @__PURE__ */ jsx13(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => {
+                      setRejectingId(null);
+                      setRejectReason("");
+                    },
+                    className: "h-7 px-3 rounded-md text-xs text-muted-foreground hover:text-foreground",
+                    children: "Cancel"
+                  }
+                ),
+                /* @__PURE__ */ jsx13(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => {
+                      onReject?.(item, rejectReason.trim() || void 0);
+                      setRejectingId(null);
+                      setRejectReason("");
+                    },
+                    className: "h-7 px-3 rounded-md bg-destructive text-destructive-foreground text-xs font-medium",
+                    children: "Submit Rejection"
+                  }
+                )
+              ] })
+            ] })
+          ]
+        },
+        item.id
+      )) })
+    ] }),
+    resolved.length > 0 && /* @__PURE__ */ jsxs13("section", { children: [
+      /* @__PURE__ */ jsxs13(
+        "button",
+        {
+          type: "button",
+          onClick: () => setShowResolved(!showResolved),
+          className: "flex items-center gap-2 text-xs font-medium text-muted-foreground uppercase tracking-wider mb-3 hover:text-foreground transition-colors",
+          children: [
+            /* @__PURE__ */ jsx13(
+              "svg",
+              {
+                width: "12",
+                height: "12",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                className: cn(
+                  "transition-transform",
+                  showResolved && "rotate-180"
+                ),
+                children: /* @__PURE__ */ jsx13("path", { d: "m6 9 6 6 6-6" })
+              }
+            ),
+            "Resolved (",
+            resolved.length,
+            ")"
+          ]
+        }
+      ),
+      showResolved && /* @__PURE__ */ jsx13("div", { className: "space-y-2", children: resolved.map((item) => /* @__PURE__ */ jsxs13(
+        "div",
+        {
+          className: "rounded-lg border border-border bg-card p-4 opacity-60",
+          children: [
+            /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2 mb-1", children: [
+              /* @__PURE__ */ jsx13("h4", { className: "text-sm font-medium text-foreground", children: item.title }),
+              renderTypeBadge?.(item.type),
+              /* @__PURE__ */ jsx13(
+                "span",
+                {
+                  className: cn(
+                    "rounded-full px-2 py-0.5 text-[10px] font-medium",
+                    item.status === "approved" && "bg-emerald-500/10 text-emerald-500",
+                    item.status === "rejected" && "bg-destructive/10 text-destructive",
+                    item.status === "executed" && "bg-primary/10 text-primary"
+                  ),
+                  children: item.status
+                }
+              )
+            ] }),
+            item.meta?.rejectionReason != null && /* @__PURE__ */ jsxs13("p", { className: "mt-1 text-xs text-destructive", children: [
+              "Reason: ",
+              String(item.meta.rejectionReason)
+            ] })
+          ]
+        },
+        item.id
+      )) })
+    ] })
+  ] }) });
+}
+
 export {
   WorkspaceLayout,
   DirectoryPane,
@@ -1667,5 +2190,8 @@ export {
   SessionActivityMonitor,
   SandboxWorkbench,
   AgentWorkbench,
-  AuditResults
+  AuditResults,
+  TaskBoard,
+  CalendarView,
+  ApprovalQueue
 };