@zendir/ui 0.1.0

package/dist/react/core/ActivityPlanner.js

@@ -0,0 +1,532 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { memo, useState, useRef, useMemo, useCallback } from "react";
+import { useTheme } from "../theme/ThemeProvider.js";
+function getStatusColor(status, tokens) {
+  if (!status || !tokens) return (tokens == null ? void 0 : tokens.colors.text.muted) ?? "currentColor";
+  switch (status) {
+    case "created":
+    case "scheduled":
+      return tokens.colors.status.standby;
+    case "started":
+    case "completed":
+      return tokens.colors.status.normal;
+    case "paused":
+    case "stopped":
+    case "disabled":
+      return tokens.colors.status.caution;
+    case "error":
+    case "failed":
+    case "crashed":
+      return tokens.colors.status.critical;
+  }
+}
+function getStatusIcon(status) {
+  if (!status) return "◯";
+  switch (status) {
+    case "created":
+      return "◯";
+    case "scheduled":
+      return "◯ ◉";
+    case "started":
+      return "● ▶";
+    case "completed":
+      return "● ✓";
+    case "paused":
+      return "■ ⏸";
+    case "stopped":
+      return "■ ⏹";
+    case "disabled":
+      return "■ ⊘";
+    case "error":
+    case "failed":
+    case "crashed":
+      return "▼";
+  }
+}
+function formatDate(d) {
+  return d.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
+}
+function formatTime(d) {
+  return d.toLocaleTimeString("en-US", { hour12: false, hour: "2-digit", minute: "2-digit", second: "2-digit" });
+}
+function checkOverlap(a, b) {
+  if (!a.end || !b.end) return false;
+  if (a.timeline !== b.timeline) return false;
+  return a.start < b.end && b.start < a.end;
+}
+const ActivityForm = memo(function ActivityForm2({
+  timelines,
+  selectedDate,
+  tokens,
+  onSubmit,
+  onCancel
+}) {
+  var _a;
+  const now = selectedDate || /* @__PURE__ */ new Date();
+  const endDefault = new Date(now.getTime() + 36e5);
+  const [form, setForm] = useState({
+    title: "",
+    type: "command",
+    start: now.toISOString().slice(0, 16),
+    end: endDefault.toISOString().slice(0, 16),
+    timeline: ((_a = timelines[0]) == null ? void 0 : _a.id) || "",
+    description: "",
+    command: "",
+    script: "",
+    hazardous: false,
+    metadata: {}
+  });
+  const [metaKey, setMetaKey] = useState("");
+  const [metaValue, setMetaValue] = useState("");
+  const addMetadata = useCallback(() => {
+    if (metaKey.trim()) {
+      setForm((prev) => ({ ...prev, metadata: { ...prev.metadata, [metaKey.trim()]: metaValue } }));
+      setMetaKey("");
+      setMetaValue("");
+    }
+  }, [metaKey, metaValue]);
+  const inputStyle = {
+    background: tokens.colors.background.base,
+    color: tokens.colors.text.primary,
+    border: `1px solid ${tokens.colors.border.muted}`,
+    borderRadius: tokens.borderRadius.md,
+    padding: `${tokens.spacing.xs}px ${tokens.spacing.sm}px`,
+    fontSize: tokens.typography.fontSize.xs,
+    width: "100%",
+    minHeight: 40,
+    fontFamily: tokens.typography.fontFamily.primary,
+    transition: "all 150ms ease"
+  };
+  const labelStyle = {
+    fontSize: tokens.typography.fontSize.xxs,
+    fontWeight: 500,
+    color: tokens.colors.text.muted,
+    textTransform: "uppercase",
+    marginBottom: 3,
+    display: "block"
+  };
+  return /* @__PURE__ */ jsxs("div", { style: { padding: 12, display: "flex", flexDirection: "column", gap: 8 }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 120px", gap: 8 }, children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("label", { htmlFor: "activity-title", style: labelStyle, children: "Title" }),
+        /* @__PURE__ */ jsx("input", { id: "activity-title", "aria-label": "Activity title", style: inputStyle, value: form.title, onChange: (e) => setForm((p) => ({ ...p, title: e.target.value })), placeholder: "Activity name" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("label", { htmlFor: "activity-type", style: labelStyle, children: "Type" }),
+        /* @__PURE__ */ jsxs("select", { id: "activity-type", "aria-label": "Activity type", style: inputStyle, value: form.type, onChange: (e) => setForm((p) => ({ ...p, type: e.target.value })), children: [
+          /* @__PURE__ */ jsx("option", { value: "command", children: "Command" }),
+          /* @__PURE__ */ jsx("option", { value: "script", children: "Script" }),
+          /* @__PURE__ */ jsx("option", { value: "reserve", children: "Reserve" }),
+          /* @__PURE__ */ jsx("option", { value: "contact", children: "Contact" }),
+          /* @__PURE__ */ jsx("option", { value: "note", children: "Note" }),
+          /* @__PURE__ */ jsx("option", { value: "metadata", children: "Metadata" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 8 }, children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("label", { htmlFor: "activity-start-time", style: labelStyle, children: "Start Time" }),
+        /* @__PURE__ */ jsx("input", { id: "activity-start-time", "aria-label": "Start time", type: "datetime-local", style: { ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }, value: form.start, onChange: (e) => setForm((p) => ({ ...p, start: e.target.value })) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("label", { htmlFor: "activity-end-time", style: labelStyle, children: "End Time" }),
+        /* @__PURE__ */ jsx("input", { id: "activity-end-time", "aria-label": "End time", type: "datetime-local", style: { ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }, value: form.end, onChange: (e) => setForm((p) => ({ ...p, end: e.target.value })) })
+      ] })
+    ] }),
+    timelines.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: "activity-timeline", style: labelStyle, children: "Timeline" }),
+      /* @__PURE__ */ jsx("select", { id: "activity-timeline", "aria-label": "Timeline", style: inputStyle, value: form.timeline, onChange: (e) => setForm((p) => ({ ...p, timeline: e.target.value })), children: timelines.map((t) => /* @__PURE__ */ jsx("option", { value: t.id, children: t.name }, t.id)) })
+    ] }),
+    form.type === "command" && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: "activity-command", style: labelStyle, children: "Command" }),
+      /* @__PURE__ */ jsx("input", { id: "activity-command", "aria-label": "Command", style: { ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }, value: form.command, onChange: (e) => setForm((p) => ({ ...p, command: e.target.value })), placeholder: 'cmd("TARGET COMMAND")' })
+    ] }),
+    form.type === "script" && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: "activity-script", style: labelStyle, children: "Script Path" }),
+      /* @__PURE__ */ jsx("input", { id: "activity-script", "aria-label": "Script path", style: { ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }, value: form.script, onChange: (e) => setForm((p) => ({ ...p, script: e.target.value })), placeholder: "/scripts/ops/collect.rb" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("label", { htmlFor: "activity-description", style: labelStyle, children: "Description" }),
+      /* @__PURE__ */ jsx("textarea", { id: "activity-description", "aria-label": "Description", style: { ...inputStyle, minHeight: 48, resize: "vertical" }, value: form.description, onChange: (e) => setForm((p) => ({ ...p, description: e.target.value })), placeholder: "Notes..." })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { style: labelStyle, children: "Metadata" }),
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 4, marginBottom: 4 }, children: [
+        /* @__PURE__ */ jsx("input", { "aria-label": "Metadata key", style: { ...inputStyle, flex: 1 }, value: metaKey, onChange: (e) => setMetaKey(e.target.value), placeholder: "Key" }),
+        /* @__PURE__ */ jsx("input", { "aria-label": "Metadata value", style: { ...inputStyle, flex: 1 }, value: metaValue, onChange: (e) => setMetaValue(e.target.value), placeholder: "Value" }),
+        /* @__PURE__ */ jsx("button", { onClick: addMetadata, style: {
+          background: tokens.colors.interactive.default,
+          color: tokens.colors.text.inverse,
+          border: "none",
+          borderRadius: tokens.borderRadius.md,
+          padding: `0 ${tokens.spacing.sm}px`,
+          fontSize: tokens.typography.fontSize.xs,
+          cursor: "pointer",
+          transition: "all 150ms ease"
+        }, children: "+" })
+      ] }),
+      Object.keys(form.metadata).length > 0 && /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 4, flexWrap: "wrap" }, children: Object.entries(form.metadata).map(([k, v]) => /* @__PURE__ */ jsxs("span", { style: {
+        fontSize: tokens.typography.fontSize.micro,
+        background: tokens.colors.background.surface,
+        padding: `2px 6px`,
+        borderRadius: tokens.borderRadius.sm,
+        display: "flex",
+        alignItems: "center",
+        gap: tokens.spacing.xs
+      }, children: [
+        k,
+        ": ",
+        v,
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": `Remove metadata ${k}`,
+            onClick: () => setForm((p) => {
+              const m = { ...p.metadata };
+              delete m[k];
+              return { ...p, metadata: m };
+            }),
+            style: {
+              cursor: "pointer",
+              color: tokens.colors.status.critical,
+              fontWeight: 500,
+              border: "none",
+              background: "transparent",
+              padding: 0,
+              lineHeight: 1
+            },
+            children: "×"
+          }
+        )
+      ] }, k)) })
+    ] }),
+    /* @__PURE__ */ jsxs("label", { style: { display: "flex", alignItems: "center", gap: 6, fontSize: tokens.typography.fontSize.xs, cursor: "pointer" }, children: [
+      /* @__PURE__ */ jsx("input", { "aria-label": "Hazardous activity", type: "checkbox", checked: form.hazardous, onChange: (e) => setForm((p) => ({ ...p, hazardous: e.target.checked })) }),
+      /* @__PURE__ */ jsx("span", { style: { color: form.hazardous ? tokens.colors.status.critical : tokens.colors.text.secondary }, children: "⚠ Hazardous Activity" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 6, justifyContent: "flex-end", marginTop: 4 }, children: [
+      /* @__PURE__ */ jsx("button", { onClick: onCancel, style: {
+        background: "transparent",
+        color: tokens.colors.text.muted,
+        border: `1px solid ${tokens.colors.border.muted}`,
+        borderRadius: tokens.borderRadius.md,
+        padding: `${tokens.spacing.xs}px 14px`,
+        fontSize: tokens.typography.fontSize.xs,
+        cursor: "pointer",
+        transition: "all 150ms ease"
+      }, children: "Cancel" }),
+      /* @__PURE__ */ jsx("button", { onClick: () => onSubmit(form), disabled: !form.title.trim(), style: {
+        background: tokens.colors.interactive.default,
+        color: tokens.colors.text.inverse,
+        border: "none",
+        borderRadius: tokens.borderRadius.md,
+        padding: `${tokens.spacing.xs}px 14px`,
+        fontSize: tokens.typography.fontSize.xs,
+        cursor: form.title.trim() ? "pointer" : "not-allowed",
+        fontWeight: 500,
+        opacity: form.title.trim() ? 1 : 0.5,
+        transition: "all 150ms ease"
+      }, children: "Create Activity" })
+    ] })
+  ] });
+});
+const ActivityPlanner = memo(function ActivityPlanner2({
+  activities,
+  timelines,
+  selectedDate,
+  height = 500,
+  title = "Activity Planner",
+  readOnly = false,
+  showOverlapWarning = true,
+  onActivityCreate,
+  onActivityUpdate: _onActivityUpdate,
+  onActivityDelete,
+  onViewInCalendar,
+  onViewInTimeline,
+  className = ""
+}) {
+  const { tokens, theme } = useTheme();
+  const isTransparentTheme = theme === "transparent" || theme === "transparent-bold" || theme === "transparent-minimal";
+  const [showForm, setShowForm] = useState(false);
+  const [filter, setFilter] = useState("");
+  const [sortBy, setSortBy] = useState("time");
+  const listRef = useRef(null);
+  const overlaps = useMemo(() => {
+    const pairs = [];
+    for (let i = 0; i < activities.length; i++) {
+      for (let j = i + 1; j < activities.length; j++) {
+        if (checkOverlap(activities[i], activities[j])) {
+          pairs.push([activities[i].id, activities[j].id]);
+        }
+      }
+    }
+    return new Set(pairs.flat());
+  }, [activities]);
+  const displayActivities = useMemo(() => {
+    let list = [...activities];
+    if (filter) {
+      const lf = filter.toLowerCase();
+      list = list.filter(
+        (a) => {
+          var _a, _b, _c;
+          return a.title.toLowerCase().includes(lf) || ((_a = a.description) == null ? void 0 : _a.toLowerCase().includes(lf)) || ((_b = a.timeline) == null ? void 0 : _b.toLowerCase().includes(lf)) || ((_c = a.command) == null ? void 0 : _c.toLowerCase().includes(lf));
+        }
+      );
+    }
+    switch (sortBy) {
+      case "time":
+        list.sort((a, b) => a.start.getTime() - b.start.getTime());
+        break;
+      case "status":
+        list.sort((a, b) => (a.status || "").localeCompare(b.status || ""));
+        break;
+      case "timeline":
+        list.sort((a, b) => (a.timeline || "").localeCompare(b.timeline || ""));
+        break;
+    }
+    return list;
+  }, [activities, filter, sortBy]);
+  const stats = useMemo(() => ({
+    total: activities.length,
+    scheduled: activities.filter((a) => a.status === "scheduled" || a.status === "created").length,
+    running: activities.filter((a) => a.status === "started").length,
+    completed: activities.filter((a) => a.status === "completed").length,
+    errors: activities.filter((a) => a.status === "error" || a.status === "failed" || a.status === "crashed").length
+  }), [activities]);
+  const handleCreate = useCallback((data) => {
+    onActivityCreate == null ? void 0 : onActivityCreate({
+      title: data.title,
+      type: data.type,
+      start: new Date(data.start),
+      end: new Date(data.end),
+      timeline: data.timeline,
+      description: data.description,
+      command: data.command || void 0,
+      script: data.script || void 0,
+      metadata: Object.keys(data.metadata).length > 0 ? data.metadata : void 0,
+      status: "created"
+    });
+    setShowForm(false);
+  }, [onActivityCreate]);
+  const panelPadX = tokens.spacing.md;
+  const panelPadY = tokens.spacing.sm;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `activity-planner ${className}`,
+      style: {
+        height: typeof height === "number" ? height : void 0,
+        background: tokens.colors.background.base,
+        ...tokens.colors.border.cardStyle ?? { border: `1px solid ${tokens.colors.border.muted}` },
+        borderRadius: tokens.borderRadius.lg,
+        overflow: "hidden",
+        display: "flex",
+        flexDirection: "column",
+        fontFamily: tokens.typography.fontFamily.primary,
+        color: tokens.colors.text.primary,
+        backdropFilter: isTransparentTheme ? "blur(10px)" : void 0,
+        WebkitBackdropFilter: isTransparentTheme ? "blur(10px)" : void 0
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { style: {
+          padding: `${panelPadY}px ${panelPadX}px`,
+          borderBottom: `1px solid ${tokens.colors.border.muted}`,
+          background: tokens.colors.background.surface,
+          backdropFilter: "blur(8px)",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between"
+        }, children: [
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: tokens.spacing.sm }, children: [
+            /* @__PURE__ */ jsx("span", { style: { fontWeight: 500, fontSize: tokens.typography.fontSize.sm }, children: title }),
+            /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 10, fontSize: tokens.typography.fontSize.xxs, color: tokens.colors.text.muted }, children: [
+              /* @__PURE__ */ jsxs("span", { children: [
+                "Scheduled ",
+                stats.scheduled
+              ] }),
+              /* @__PURE__ */ jsxs("span", { style: { color: tokens.colors.text.secondary }, children: [
+                "Running ",
+                stats.running
+              ] }),
+              /* @__PURE__ */ jsxs("span", { style: { color: tokens.colors.text.secondary }, children: [
+                "Completed ",
+                stats.completed
+              ] }),
+              stats.errors > 0 && /* @__PURE__ */ jsxs("span", { style: { color: tokens.colors.status.critical }, children: [
+                "Errors ",
+                stats.errors
+              ] })
+            ] })
+          ] }),
+          !readOnly && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: () => setShowForm(!showForm),
+              style: {
+                background: showForm ? tokens.colors.status.critical + "22" : tokens.colors.interactive.default,
+                color: showForm ? tokens.colors.status.critical : tokens.colors.text.inverse,
+                border: "none",
+                borderRadius: tokens.borderRadius.md,
+                padding: "3px 10px",
+                fontSize: tokens.typography.fontSize.xs,
+                fontWeight: 500,
+                cursor: "pointer",
+                transition: "all 150ms ease"
+              },
+              children: showForm ? "✕ Cancel" : "+ New Activity"
+            }
+          )
+        ] }),
+        showForm && !readOnly && /* @__PURE__ */ jsx("div", { style: { borderBottom: `1px solid ${tokens.colors.border.muted}`, background: tokens.colors.background.surface + "88" }, children: /* @__PURE__ */ jsx(
+          ActivityForm,
+          {
+            timelines,
+            selectedDate,
+            tokens,
+            onSubmit: handleCreate,
+            onCancel: () => setShowForm(false)
+          }
+        ) }),
+        /* @__PURE__ */ jsxs("div", { style: {
+          padding: `${tokens.spacing.xs}px ${panelPadX}px`,
+          display: "flex",
+          gap: 6,
+          alignItems: "center",
+          borderBottom: `1px solid ${tokens.colors.border.muted}`
+        }, children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              value: filter,
+              onChange: (e) => setFilter(e.target.value),
+              "aria-label": "Search activities",
+              placeholder: "Search activities...",
+              style: {
+                flex: 1,
+                background: tokens.colors.background.surface,
+                color: tokens.colors.text.primary,
+                border: `1px solid ${tokens.colors.border.muted}`,
+                borderRadius: tokens.borderRadius.md,
+                padding: "3px 8px",
+                fontSize: tokens.typography.fontSize.xxs,
+                fontFamily: tokens.typography.fontFamily.primary,
+                transition: "all 150ms ease"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "select",
+            {
+              value: sortBy,
+              onChange: (e) => setSortBy(e.target.value),
+              "aria-label": "Sort activities",
+              style: {
+                background: tokens.colors.background.surface,
+                color: tokens.colors.text.secondary,
+                border: `1px solid ${tokens.colors.border.muted}`,
+                borderRadius: tokens.borderRadius.md,
+                padding: "3px 6px",
+                fontSize: tokens.typography.fontSize.xxs,
+                transition: "all 150ms ease"
+              },
+              children: [
+                /* @__PURE__ */ jsx("option", { value: "time", children: "Sort: Time" }),
+                /* @__PURE__ */ jsx("option", { value: "status", children: "Sort: Status" }),
+                /* @__PURE__ */ jsx("option", { value: "timeline", children: "Sort: Timeline" })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { ref: listRef, style: { flex: 1, overflow: "auto", padding: 8 }, children: displayActivities.length === 0 ? /* @__PURE__ */ jsx("div", { style: { textAlign: "center", color: tokens.colors.text.muted, padding: 40, fontSize: tokens.typography.fontSize.xs }, children: filter ? "No matching activities" : "No activities scheduled" }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: displayActivities.map((a) => {
+          const color = a.color || getStatusColor(a.status, tokens);
+          const hasOverlap = overlaps.has(a.id);
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              style: {
+                display: "grid",
+                gridTemplateColumns: "24px 1fr auto",
+                alignItems: "center",
+                gap: tokens.spacing.sm,
+                padding: "6px 10px",
+                background: hasOverlap ? `${tokens.colors.status.caution}10` : `${color}08`,
+                borderLeft: `3px solid ${color}`,
+                borderRadius: tokens.borderRadius.md,
+                fontSize: tokens.typography.fontSize.xs,
+                cursor: "pointer",
+                border: hasOverlap && showOverlapWarning ? `1px solid ${tokens.colors.status.caution}44` : void 0,
+                transition: "all 150ms ease"
+              },
+              children: [
+                /* @__PURE__ */ jsx("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ jsx("span", { style: { color, fontSize: tokens.typography.fontSize.sm, fontWeight: 500 }, children: getStatusIcon(a.status) }) }),
+                /* @__PURE__ */ jsxs("div", { style: { overflow: "hidden" }, children: [
+                  /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 2 }, children: [
+                    /* @__PURE__ */ jsx("span", { style: { fontWeight: 500, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: a.title }),
+                    a.timeline && /* @__PURE__ */ jsx("span", { style: {
+                      fontSize: tokens.typography.fontSize.micro,
+                      background: tokens.colors.background.surface,
+                      padding: `0 ${tokens.spacing.xs}px`,
+                      borderRadius: tokens.borderRadius.sm,
+                      color: tokens.colors.text.muted
+                    }, children: a.timeline }),
+                    hasOverlap && showOverlapWarning && /* @__PURE__ */ jsx("span", { style: { fontSize: tokens.typography.fontSize.micro, color: tokens.colors.status.caution, fontWeight: 500 }, children: "⚠ OVERLAP" })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { style: { fontSize: tokens.typography.fontSize.micro, fontFamily: tokens.typography.fontFamily.mono, color: tokens.colors.text.muted }, children: [
+                    formatDate(a.start),
+                    " ",
+                    formatTime(a.start),
+                    a.end ? ` → ${formatTime(a.end)}` : ""
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 4 }, children: [
+                  onViewInCalendar && /* @__PURE__ */ jsx("button", { "aria-label": `View ${a.title} in calendar`, onClick: () => onViewInCalendar(a), style: actionBtnStyle(tokens), title: "View in Calendar", children: "Calendar" }),
+                  onViewInTimeline && /* @__PURE__ */ jsx("button", { "aria-label": `View ${a.title} in timeline`, onClick: () => onViewInTimeline(a), style: actionBtnStyle(tokens), title: "View in Timeline", children: "Timeline" }),
+                  !readOnly && onActivityDelete && /* @__PURE__ */ jsx("button", { "aria-label": `Delete ${a.title}`, onClick: () => onActivityDelete(a.id), style: { ...actionBtnStyle(tokens), color: tokens.colors.status.critical }, title: "Delete", children: "Delete" })
+                ] })
+              ]
+            },
+            a.id
+          );
+        }) }) }),
+        /* @__PURE__ */ jsxs("div", { style: {
+          padding: `${tokens.spacing.xs}px ${panelPadX}px`,
+          borderTop: `1px solid ${tokens.colors.border.muted}`,
+          background: tokens.colors.background.surface,
+          fontSize: tokens.typography.fontSize.micro,
+          color: tokens.colors.text.muted,
+          display: "flex",
+          justifyContent: "space-between"
+        }, children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            displayActivities.length,
+            " / ",
+            activities.length,
+            " activities"
+          ] }),
+          overlaps.size > 0 && showOverlapWarning && /* @__PURE__ */ jsxs("span", { style: { color: tokens.colors.status.caution }, children: [
+            "⚠ ",
+            overlaps.size,
+            " overlapping activities"
+          ] })
+        ] })
+      ]
+    }
+  );
+});
+function actionBtnStyle(tokens) {
+  return {
+    background: "transparent",
+    border: `1px solid ${tokens.colors.border.muted}`,
+    borderRadius: tokens.borderRadius.sm,
+    padding: `2px ${tokens.spacing.xs}px`,
+    fontSize: tokens.typography.fontSize.xxs,
+    cursor: "pointer",
+    lineHeight: 1,
+    transition: "all 150ms ease"
+  };
+}
+export {
+  ActivityPlanner
+};
+//# sourceMappingURL=ActivityPlanner.js.map

package/dist/react/core/ActivityPlanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActivityPlanner.js","sources":["../../../src/react/core/ActivityPlanner.tsx"],"sourcesContent":["/**\r\n * @zendir/ui - ActivityPlanner Component\r\n * \r\n * Activity scheduling and management panel. Creates, edits, and monitors\r\n * scheduled activities across timelines. Integrates with MissionCalendar\r\n * and Timeline components.\r\n * \r\n * Space Mission Features:\r\n * - Create/edit activities with command or script execution\r\n * - Drag-and-drop reorder within timeline\r\n * - Hazardous activity warnings (Astro UX)\r\n * - Activity lifecycle tracking (created → scheduled → started → completed)\r\n * - Overlap detection within a timeline\r\n * - Metadata recording (operator, environment, notes)\r\n * - Contact window awareness\r\n * - Batch scheduling\r\n * \r\n * @example\r\n * ```tsx\r\n * <ActivityPlanner\r\n *   activities={activities}\r\n *   timelines={timelines}\r\n *   onActivityCreate={(a) => console.log('Create:', a)}\r\n *   onActivityUpdate={(a) => console.log('Update:', a)}\r\n * />\r\n * ```\r\n */\r\n\r\nimport React, { useState, useMemo, useCallback, memo, useRef } from 'react';\r\nimport { useTheme } from '../theme';\r\nimport type { CalendarEvent, CalendarTimeline, ActivityStatus, ActivityType } from './MissionCalendar';\r\n\r\n// =============================================================================\r\n// Types\r\n// =============================================================================\r\n\r\nexport interface ActivityFormData {\r\n  title: string;\r\n  type: ActivityType;\r\n  start: string; // ISO string\r\n  end: string;   // ISO string\r\n  timeline: string;\r\n  description: string;\r\n  command: string;\r\n  script: string;\r\n  hazardous: boolean;\r\n  metadata: Record<string, string>;\r\n}\r\n\r\nexport interface ActivityPlannerProps {\r\n  /** Activities to display */\r\n  activities: CalendarEvent[];\r\n  /** Available timelines */\r\n  timelines: CalendarTimeline[];\r\n  /** Currently selected date for scheduling */\r\n  selectedDate?: Date;\r\n  /** Height (default: 500) */\r\n  height?: number | string;\r\n  /** Title */\r\n  title?: string;\r\n  /** Read-only mode */\r\n  readOnly?: boolean;\r\n  /** Show overlap warnings */\r\n  showOverlapWarning?: boolean;\r\n  /** Called on create */\r\n  onActivityCreate?: (activity: Partial<CalendarEvent>) => void;\r\n  /** Called on update */\r\n  onActivityUpdate?: (id: string, updates: Partial<CalendarEvent>) => void;\r\n  /** Called on delete */\r\n  onActivityDelete?: (id: string) => void;\r\n  /** Called when requesting to view activity in calendar */\r\n  onViewInCalendar?: (activity: CalendarEvent) => void;\r\n  /** Called when requesting to view in timeline */\r\n  onViewInTimeline?: (activity: CalendarEvent) => void;\r\n  /** CSS class */\r\n  className?: string;\r\n}\r\n\r\n// =============================================================================\r\n// Helpers\r\n// =============================================================================\r\n\r\n/**\r\n * Map activity status → Astro UX status color using tokens.\r\n *   created/scheduled → standby (cyan)\r\n *   started/completed → normal (green)\r\n *   paused/stopped/disabled → caution (yellow)\r\n *   error/failed/crashed → critical (red)\r\n */\r\nfunction getStatusColor(status?: ActivityStatus, tokens?: ReturnType<typeof useTheme>['tokens']): string {\r\n  if (!status || !tokens) return tokens?.colors.text.muted ?? 'currentColor';\r\n  switch (status) {\r\n    case 'created': case 'scheduled': return tokens.colors.status.standby;\r\n    case 'started': case 'completed': return tokens.colors.status.normal;\r\n    case 'paused': case 'stopped': case 'disabled': return tokens.colors.status.caution;\r\n    case 'error': case 'failed': case 'crashed': return tokens.colors.status.critical;\r\n  }\r\n}\r\n\r\n/**\r\n * Return Astro UX status shape + contextual icon.\r\n * The leading character is the Astro status shape for the mapped level:\r\n *   standby → ◯ (ring), normal → ● (filled circle),\r\n *   caution → ■ (square), critical → ▼ (triangle down)\r\n * Followed by a contextual glyph for the specific activity state.\r\n */\r\nfunction getStatusIcon(status?: ActivityStatus): string {\r\n  if (!status) return '◯';\r\n  switch (status) {\r\n    case 'created': return '◯';         // standby ring\r\n    case 'scheduled': return '◯ ◉';     // standby ring + scheduled\r\n    case 'started': return '● ▶';       // normal circle + play\r\n    case 'completed': return '● ✓';     // normal circle + check\r\n    case 'paused': return '■ ⏸';        // caution square + pause\r\n    case 'stopped': return '■ ⏹';       // caution square + stop\r\n    case 'disabled': return '■ ⊘';      // caution square + disabled\r\n    case 'error': case 'failed': case 'crashed': return '▼';  // critical triangle down\r\n  }\r\n}\r\n\r\nfunction formatDate(d: Date): string {\r\n  return d.toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' });\r\n}\r\n\r\nfunction formatTime(d: Date): string {\r\n  return d.toLocaleTimeString('en-US', { hour12: false, hour: '2-digit', minute: '2-digit', second: '2-digit' });\r\n}\r\n\r\nfunction checkOverlap(a: CalendarEvent, b: CalendarEvent): boolean {\r\n  if (!a.end || !b.end) return false;\r\n  if (a.timeline !== b.timeline) return false;\r\n  return a.start < b.end && b.start < a.end;\r\n}\r\n\r\n// =============================================================================\r\n// Form Component\r\n// =============================================================================\r\n\r\nconst ActivityForm = memo(function ActivityForm({\r\n  timelines, selectedDate, tokens, onSubmit, onCancel,\r\n}: {\r\n  timelines: CalendarTimeline[];\r\n  selectedDate?: Date;\r\n  tokens: ReturnType<typeof useTheme>['tokens'];\r\n  onSubmit: (data: ActivityFormData) => void;\r\n  onCancel: () => void;\r\n}) {\r\n  const now = selectedDate || new Date();\r\n  const endDefault = new Date(now.getTime() + 3600000);\r\n\r\n  const [form, setForm] = useState<ActivityFormData>({\r\n    title: '', type: 'command',\r\n    start: now.toISOString().slice(0, 16),\r\n    end: endDefault.toISOString().slice(0, 16),\r\n    timeline: timelines[0]?.id || '',\r\n    description: '', command: '', script: '',\r\n    hazardous: false, metadata: {},\r\n  });\r\n  const [metaKey, setMetaKey] = useState('');\r\n  const [metaValue, setMetaValue] = useState('');\r\n\r\n  const addMetadata = useCallback(() => {\r\n    if (metaKey.trim()) {\r\n      setForm(prev => ({ ...prev, metadata: { ...prev.metadata, [metaKey.trim()]: metaValue } }));\r\n      setMetaKey('');\r\n      setMetaValue('');\r\n    }\r\n  }, [metaKey, metaValue]);\r\n\r\n  const inputStyle: React.CSSProperties = {\r\n    background: tokens.colors.background.base,\r\n    color: tokens.colors.text.primary,\r\n    border: `1px solid ${tokens.colors.border.muted}`,\r\n    borderRadius: tokens.borderRadius.md,\r\n    padding: `${tokens.spacing.xs}px ${tokens.spacing.sm}px`,\r\n    fontSize: tokens.typography.fontSize.xs,\r\n    width: '100%',\r\n    minHeight: 40,\r\n    fontFamily: tokens.typography.fontFamily.primary,\r\n    transition: 'all 150ms ease',\r\n  };\r\n\r\n  const labelStyle: React.CSSProperties = {\r\n    fontSize: tokens.typography.fontSize.xxs, fontWeight: 500, color: tokens.colors.text.muted,\r\n    textTransform: 'uppercase', marginBottom: 3, display: 'block',\r\n  };\r\n\r\n  return (\r\n    <div style={{ padding: 12, display: 'flex', flexDirection: 'column', gap: 8 }}>\r\n      <div style={{ display: 'grid', gridTemplateColumns: '1fr 120px', gap: 8 }}>\r\n        <div>\r\n          <label htmlFor=\"activity-title\" style={labelStyle}>Title</label>\r\n          <input id=\"activity-title\" aria-label=\"Activity title\" style={inputStyle} value={form.title} onChange={e => setForm(p => ({ ...p, title: e.target.value }))} placeholder=\"Activity name\" />\r\n        </div>\r\n        <div>\r\n          <label htmlFor=\"activity-type\" style={labelStyle}>Type</label>\r\n          <select id=\"activity-type\" aria-label=\"Activity type\" style={inputStyle} value={form.type} onChange={e => setForm(p => ({ ...p, type: e.target.value as ActivityType }))}>\r\n            <option value=\"command\">Command</option>\r\n            <option value=\"script\">Script</option>\r\n            <option value=\"reserve\">Reserve</option>\r\n            <option value=\"contact\">Contact</option>\r\n            <option value=\"note\">Note</option>\r\n            <option value=\"metadata\">Metadata</option>\r\n          </select>\r\n        </div>\r\n      </div>\r\n      <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 8 }}>\r\n        <div>\r\n          <label htmlFor=\"activity-start-time\" style={labelStyle}>Start Time</label>\r\n          <input id=\"activity-start-time\" aria-label=\"Start time\" type=\"datetime-local\" style={{ ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }} value={form.start} onChange={e => setForm(p => ({ ...p, start: e.target.value }))} />\r\n        </div>\r\n        <div>\r\n          <label htmlFor=\"activity-end-time\" style={labelStyle}>End Time</label>\r\n          <input id=\"activity-end-time\" aria-label=\"End time\" type=\"datetime-local\" style={{ ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }} value={form.end} onChange={e => setForm(p => ({ ...p, end: e.target.value }))} />\r\n        </div>\r\n      </div>\r\n      {timelines.length > 0 && (\r\n        <div>\r\n          <label htmlFor=\"activity-timeline\" style={labelStyle}>Timeline</label>\r\n          <select id=\"activity-timeline\" aria-label=\"Timeline\" style={inputStyle} value={form.timeline} onChange={e => setForm(p => ({ ...p, timeline: e.target.value }))}>\r\n            {timelines.map(t => <option key={t.id} value={t.id}>{t.name}</option>)}\r\n          </select>\r\n        </div>\r\n      )}\r\n      {form.type === 'command' && (\r\n        <div>\r\n          <label htmlFor=\"activity-command\" style={labelStyle}>Command</label>\r\n          <input id=\"activity-command\" aria-label=\"Command\" style={{ ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }} value={form.command} onChange={e => setForm(p => ({ ...p, command: e.target.value }))} placeholder='cmd(\"TARGET COMMAND\")' />\r\n        </div>\r\n      )}\r\n      {form.type === 'script' && (\r\n        <div>\r\n          <label htmlFor=\"activity-script\" style={labelStyle}>Script Path</label>\r\n          <input id=\"activity-script\" aria-label=\"Script path\" style={{ ...inputStyle, fontFamily: tokens.typography.fontFamily.mono }} value={form.script} onChange={e => setForm(p => ({ ...p, script: e.target.value }))} placeholder=\"/scripts/ops/collect.rb\" />\r\n        </div>\r\n      )}\r\n      <div>\r\n        <label htmlFor=\"activity-description\" style={labelStyle}>Description</label>\r\n        <textarea id=\"activity-description\" aria-label=\"Description\" style={{ ...inputStyle, minHeight: 48, resize: 'vertical' }} value={form.description} onChange={e => setForm(p => ({ ...p, description: e.target.value }))} placeholder=\"Notes...\" />\r\n      </div>\r\n\r\n      {/* Metadata KV */}\r\n      <div>\r\n        <div style={labelStyle}>Metadata</div>\r\n        <div style={{ display: 'flex', gap: 4, marginBottom: 4 }}>\r\n          <input aria-label=\"Metadata key\" style={{ ...inputStyle, flex: 1 }} value={metaKey} onChange={e => setMetaKey(e.target.value)} placeholder=\"Key\" />\r\n          <input aria-label=\"Metadata value\" style={{ ...inputStyle, flex: 1 }} value={metaValue} onChange={e => setMetaValue(e.target.value)} placeholder=\"Value\" />\r\n          <button onClick={addMetadata} style={{\r\n            background: tokens.colors.interactive.default, color: tokens.colors.text.inverse, border: 'none',\r\n            borderRadius: tokens.borderRadius.md, padding: `0 ${tokens.spacing.sm}px`, fontSize: tokens.typography.fontSize.xs, cursor: 'pointer',\r\n            transition: 'all 150ms ease',\r\n          }}>+</button>\r\n        </div>\r\n        {Object.keys(form.metadata).length > 0 && (\r\n          <div style={{ display: 'flex', gap: 4, flexWrap: 'wrap' }}>\r\n            {Object.entries(form.metadata).map(([k, v]) => (\r\n              <span key={k} style={{\r\n                fontSize: tokens.typography.fontSize.micro, background: tokens.colors.background.surface, padding: `2px 6px`,\r\n                borderRadius: tokens.borderRadius.sm, display: 'flex', alignItems: 'center', gap: tokens.spacing.xs,\r\n              }}>\r\n                {k}: {v}\r\n                <button\r\n                  type=\"button\"\r\n                  aria-label={`Remove metadata ${k}`}\r\n                  onClick={() => setForm(p => {\r\n                    const m = { ...p.metadata };\r\n                    delete m[k];\r\n                    return { ...p, metadata: m };\r\n                  })}\r\n                  style={{\r\n                    cursor: 'pointer',\r\n                    color: tokens.colors.status.critical,\r\n                    fontWeight: 500,\r\n                    border: 'none',\r\n                    background: 'transparent',\r\n                    padding: 0,\r\n                    lineHeight: 1,\r\n                  }}\r\n                >\r\n                  ×\r\n                </button>\r\n              </span>\r\n            ))}\r\n          </div>\r\n        )}\r\n      </div>\r\n\r\n      {/* Hazardous toggle */}\r\n      <label style={{ display: 'flex', alignItems: 'center', gap: 6, fontSize: tokens.typography.fontSize.xs, cursor: 'pointer' }}>\r\n        <input aria-label=\"Hazardous activity\" type=\"checkbox\" checked={form.hazardous} onChange={e => setForm(p => ({ ...p, hazardous: e.target.checked }))} />\r\n        <span style={{ color: form.hazardous ? tokens.colors.status.critical : tokens.colors.text.secondary }}>\r\n          ⚠ Hazardous Activity\r\n        </span>\r\n      </label>\r\n\r\n      {/* Buttons */}\r\n      <div style={{ display: 'flex', gap: 6, justifyContent: 'flex-end', marginTop: 4 }}>\r\n        <button onClick={onCancel} style={{\r\n          background: 'transparent', color: tokens.colors.text.muted,\r\n          border: `1px solid ${tokens.colors.border.muted}`,\r\n          borderRadius: tokens.borderRadius.md, padding: `${tokens.spacing.xs}px 14px`, fontSize: tokens.typography.fontSize.xs, cursor: 'pointer',\r\n          transition: 'all 150ms ease',\r\n        }}>Cancel</button>\r\n        <button onClick={() => onSubmit(form)} disabled={!form.title.trim()} style={{\r\n          background: tokens.colors.interactive.default, color: tokens.colors.text.inverse,\r\n          border: 'none', borderRadius: tokens.borderRadius.md, padding: `${tokens.spacing.xs}px 14px`, fontSize: tokens.typography.fontSize.xs,\r\n          cursor: form.title.trim() ? 'pointer' : 'not-allowed', fontWeight: 500, opacity: form.title.trim() ? 1 : 0.5,\r\n          transition: 'all 150ms ease',\r\n        }}>Create Activity</button>\r\n      </div>\r\n    </div>\r\n  );\r\n});\r\n\r\n// =============================================================================\r\n// Main Component\r\n// =============================================================================\r\n\r\nexport const ActivityPlanner = memo(function ActivityPlanner({\r\n  activities,\r\n  timelines,\r\n  selectedDate,\r\n  height = 500,\r\n  title = 'Activity Planner',\r\n  readOnly = false,\r\n  showOverlapWarning = true,\r\n  onActivityCreate,\r\n  onActivityUpdate: _onActivityUpdate,\r\n  onActivityDelete,\r\n  onViewInCalendar,\r\n  onViewInTimeline,\r\n  className = '',\r\n}: ActivityPlannerProps): React.ReactElement {\r\n  const { tokens, theme } = useTheme();\r\n  const isTransparentTheme =\r\n    theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\r\n  const [showForm, setShowForm] = useState(false);\r\n  const [filter, setFilter] = useState('');\r\n  const [sortBy, setSortBy] = useState<'time' | 'status' | 'timeline'>('time');\r\n  const listRef = useRef<HTMLDivElement>(null);\r\n\r\n  // Overlap detection\r\n  const overlaps = useMemo(() => {\r\n    const pairs: [string, string][] = [];\r\n    for (let i = 0; i < activities.length; i++) {\r\n      for (let j = i + 1; j < activities.length; j++) {\r\n        if (checkOverlap(activities[i], activities[j])) {\r\n          pairs.push([activities[i].id, activities[j].id]);\r\n        }\r\n      }\r\n    }\r\n    return new Set(pairs.flat());\r\n  }, [activities]);\r\n\r\n  // Sort and filter\r\n  const displayActivities = useMemo(() => {\r\n    let list = [...activities];\r\n    if (filter) {\r\n      const lf = filter.toLowerCase();\r\n      list = list.filter(a =>\r\n        a.title.toLowerCase().includes(lf) ||\r\n        a.description?.toLowerCase().includes(lf) ||\r\n        a.timeline?.toLowerCase().includes(lf) ||\r\n        a.command?.toLowerCase().includes(lf)\r\n      );\r\n    }\r\n    switch (sortBy) {\r\n      case 'time': list.sort((a, b) => a.start.getTime() - b.start.getTime()); break;\r\n      case 'status': list.sort((a, b) => (a.status || '').localeCompare(b.status || '')); break;\r\n      case 'timeline': list.sort((a, b) => (a.timeline || '').localeCompare(b.timeline || '')); break;\r\n    }\r\n    return list;\r\n  }, [activities, filter, sortBy]);\r\n\r\n  // Stats\r\n  const stats = useMemo(() => ({\r\n    total: activities.length,\r\n    scheduled: activities.filter(a => a.status === 'scheduled' || a.status === 'created').length,\r\n    running: activities.filter(a => a.status === 'started').length,\r\n    completed: activities.filter(a => a.status === 'completed').length,\r\n    errors: activities.filter(a => a.status === 'error' || a.status === 'failed' || a.status === 'crashed').length,\r\n  }), [activities]);\r\n\r\n  const handleCreate = useCallback((data: ActivityFormData) => {\r\n    onActivityCreate?.({\r\n      title: data.title,\r\n      type: data.type,\r\n      start: new Date(data.start),\r\n      end: new Date(data.end),\r\n      timeline: data.timeline,\r\n      description: data.description,\r\n      command: data.command || undefined,\r\n      script: data.script || undefined,\r\n      metadata: Object.keys(data.metadata).length > 0 ? data.metadata : undefined,\r\n      status: 'created',\r\n    });\r\n    setShowForm(false);\r\n  }, [onActivityCreate]);\r\n\r\n  const panelPadX = tokens.spacing.md;\r\n  const panelPadY = tokens.spacing.sm;\r\n\r\n  return (\r\n    <div\r\n      className={`activity-planner ${className}`}\r\n      style={{\r\n        height: typeof height === 'number' ? height : undefined,\r\n        background: tokens.colors.background.base,\r\n        ...(tokens.colors.border.cardStyle ?? { border: `1px solid ${tokens.colors.border.muted}` }),\r\n        borderRadius: tokens.borderRadius.lg, overflow: 'hidden',\r\n        display: 'flex', flexDirection: 'column',\r\n        fontFamily: tokens.typography.fontFamily.primary, color: tokens.colors.text.primary,\r\n        backdropFilter: isTransparentTheme ? 'blur(10px)' : undefined,\r\n        WebkitBackdropFilter: isTransparentTheme ? 'blur(10px)' : undefined,\r\n      }}\r\n    >\r\n      {/* Header */}\r\n      <div style={{\r\n        padding: `${panelPadY}px ${panelPadX}px`,\r\n        borderBottom: `1px solid ${tokens.colors.border.muted}`,\r\n        background: tokens.colors.background.surface,\r\n        backdropFilter: 'blur(8px)',\r\n        display: 'flex', alignItems: 'center', justifyContent: 'space-between',\r\n      }}>\r\n        <div style={{ display: 'flex', alignItems: 'center', gap: tokens.spacing.sm }}>\r\n          <span style={{ fontWeight: 500, fontSize: tokens.typography.fontSize.sm }}>{title}</span>\r\n          <div style={{ display: 'flex', gap: 10, fontSize: tokens.typography.fontSize.xxs, color: tokens.colors.text.muted }}>\r\n            <span>Scheduled {stats.scheduled}</span>\r\n            <span style={{ color: tokens.colors.text.secondary }}>Running {stats.running}</span>\r\n            <span style={{ color: tokens.colors.text.secondary }}>Completed {stats.completed}</span>\r\n            {stats.errors > 0 && <span style={{ color: tokens.colors.status.critical }}>Errors {stats.errors}</span>}\r\n          </div>\r\n        </div>\r\n        {!readOnly && (\r\n          <button\r\n            onClick={() => setShowForm(!showForm)}\r\n            style={{\r\n              background: showForm ? tokens.colors.status.critical + '22' : tokens.colors.interactive.default,\r\n              color: showForm ? tokens.colors.status.critical : tokens.colors.text.inverse,\r\n              border: 'none', borderRadius: tokens.borderRadius.md, padding: '3px 10px',\r\n              fontSize: tokens.typography.fontSize.xs, fontWeight: 500, cursor: 'pointer',\r\n              transition: 'all 150ms ease',\r\n            }}\r\n          >\r\n            {showForm ? '✕ Cancel' : '+ New Activity'}\r\n          </button>\r\n        )}\r\n      </div>\r\n\r\n      {/* Create form */}\r\n      {showForm && !readOnly && (\r\n        <div style={{ borderBottom: `1px solid ${tokens.colors.border.muted}`, background: tokens.colors.background.surface + '88' }}>\r\n          <ActivityForm\r\n            timelines={timelines}\r\n            selectedDate={selectedDate}\r\n            tokens={tokens}\r\n            onSubmit={handleCreate}\r\n            onCancel={() => setShowForm(false)}\r\n          />\r\n        </div>\r\n      )}\r\n\r\n      {/* Search / Sort */}\r\n      <div style={{\r\n        padding: `${tokens.spacing.xs}px ${panelPadX}px`, display: 'flex', gap: 6, alignItems: 'center',\r\n        borderBottom: `1px solid ${tokens.colors.border.muted}`,\r\n      }}>\r\n        <input\r\n          value={filter}\r\n          onChange={e => setFilter(e.target.value)}\r\n          aria-label=\"Search activities\"\r\n          placeholder=\"Search activities...\"\r\n          style={{\r\n            flex: 1, background: tokens.colors.background.surface,\r\n            color: tokens.colors.text.primary,\r\n            border: `1px solid ${tokens.colors.border.muted}`,\r\n            borderRadius: tokens.borderRadius.md, padding: '3px 8px', fontSize: tokens.typography.fontSize.xxs,\r\n            fontFamily: tokens.typography.fontFamily.primary,\r\n            transition: 'all 150ms ease',\r\n          }}\r\n        />\r\n        <select\r\n          value={sortBy}\r\n          onChange={e => setSortBy(e.target.value as 'time' | 'status' | 'timeline')}\r\n          aria-label=\"Sort activities\"\r\n          style={{\r\n            background: tokens.colors.background.surface,\r\n            color: tokens.colors.text.secondary,\r\n            border: `1px solid ${tokens.colors.border.muted}`,\r\n            borderRadius: tokens.borderRadius.md, padding: '3px 6px', fontSize: tokens.typography.fontSize.xxs,\r\n            transition: 'all 150ms ease',\r\n          }}\r\n        >\r\n          <option value=\"time\">Sort: Time</option>\r\n          <option value=\"status\">Sort: Status</option>\r\n          <option value=\"timeline\">Sort: Timeline</option>\r\n        </select>\r\n      </div>\r\n\r\n      {/* Activity list */}\r\n      <div ref={listRef} style={{ flex: 1, overflow: 'auto', padding: 8 }}>\r\n        {displayActivities.length === 0 ? (\r\n          <div style={{ textAlign: 'center', color: tokens.colors.text.muted, padding: 40, fontSize: tokens.typography.fontSize.xs }}>\r\n            {filter ? 'No matching activities' : 'No activities scheduled'}\r\n          </div>\r\n        ) : (\r\n          <div style={{ display: 'flex', flexDirection: 'column', gap: 4 }}>\r\n            {displayActivities.map(a => {\r\n              const color = a.color || getStatusColor(a.status, tokens);\r\n              const hasOverlap = overlaps.has(a.id);\r\n              return (\r\n                <div\r\n                  key={a.id}\r\n                  style={{\r\n                    display: 'grid', gridTemplateColumns: '24px 1fr auto',\r\n                    alignItems: 'center', gap: tokens.spacing.sm,\r\n                    padding: '6px 10px',\r\n                    background: hasOverlap ? `${tokens.colors.status.caution}10` : `${color}08`,\r\n                    borderLeft: `3px solid ${color}`,\r\n                    borderRadius: tokens.borderRadius.md, fontSize: tokens.typography.fontSize.xs, cursor: 'pointer',\r\n                    border: hasOverlap && showOverlapWarning ? `1px solid ${tokens.colors.status.caution}44` : undefined,\r\n                    transition: 'all 150ms ease',\r\n                  }}\r\n                >\r\n                  {/* Status icon */}\r\n                  <div style={{ textAlign: 'center' }}>\r\n                    <span style={{ color, fontSize: tokens.typography.fontSize.sm, fontWeight: 500 }}>{getStatusIcon(a.status)}</span>\r\n                  </div>\r\n                  {/* Info */}\r\n                  <div style={{ overflow: 'hidden' }}>\r\n                    <div style={{ display: 'flex', alignItems: 'center', gap: 6, marginBottom: 2 }}>\r\n                      <span style={{ fontWeight: 500, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>\r\n                        {a.title}\r\n                      </span>\r\n                      {a.timeline && (\r\n                        <span style={{\r\n                          fontSize: tokens.typography.fontSize.micro, background: tokens.colors.background.surface,\r\n                          padding: `0 ${tokens.spacing.xs}px`, borderRadius: tokens.borderRadius.sm, color: tokens.colors.text.muted,\r\n                        }}>{a.timeline}</span>\r\n                      )}\r\n                      {hasOverlap && showOverlapWarning && (\r\n                        <span style={{ fontSize: tokens.typography.fontSize.micro, color: tokens.colors.status.caution, fontWeight: 500 }}>⚠ OVERLAP</span>\r\n                      )}\r\n                    </div>\r\n                    <div style={{ fontSize: tokens.typography.fontSize.micro, fontFamily: tokens.typography.fontFamily.mono, color: tokens.colors.text.muted }}>\r\n                      {formatDate(a.start)} {formatTime(a.start)}\r\n                      {a.end ? ` → ${formatTime(a.end)}` : ''}\r\n                    </div>\r\n                  </div>\r\n                  {/* Actions */}\r\n                  <div style={{ display: 'flex', gap: 4 }}>\r\n                    {onViewInCalendar && (\r\n                      <button aria-label={`View ${a.title} in calendar`} onClick={() => onViewInCalendar(a)} style={actionBtnStyle(tokens)} title=\"View in Calendar\">Calendar</button>\r\n                    )}\r\n                    {onViewInTimeline && (\r\n                      <button aria-label={`View ${a.title} in timeline`} onClick={() => onViewInTimeline(a)} style={actionBtnStyle(tokens)} title=\"View in Timeline\">Timeline</button>\r\n                    )}\r\n                    {!readOnly && onActivityDelete && (\r\n                      <button aria-label={`Delete ${a.title}`} onClick={() => onActivityDelete(a.id)} style={{ ...actionBtnStyle(tokens), color: tokens.colors.status.critical }} title=\"Delete\">Delete</button>\r\n                    )}\r\n                  </div>\r\n                </div>\r\n              );\r\n            })}\r\n          </div>\r\n        )}\r\n      </div>\r\n\r\n      {/* Footer */}\r\n      <div style={{\r\n        padding: `${tokens.spacing.xs}px ${panelPadX}px`,\r\n        borderTop: `1px solid ${tokens.colors.border.muted}`,\r\n        background: tokens.colors.background.surface,\r\n        fontSize: tokens.typography.fontSize.micro, color: tokens.colors.text.muted,\r\n        display: 'flex', justifyContent: 'space-between',\r\n      }}>\r\n        <span>{displayActivities.length} / {activities.length} activities</span>\r\n        {overlaps.size > 0 && showOverlapWarning && (\r\n          <span style={{ color: tokens.colors.status.caution }}>⚠ {overlaps.size} overlapping activities</span>\r\n        )}\r\n      </div>\r\n    </div>\r\n  );\r\n});\r\n\r\nfunction actionBtnStyle(tokens: ReturnType<typeof useTheme>['tokens']): React.CSSProperties {\r\n  return {\r\n    background: 'transparent', border: `1px solid ${tokens.colors.border.muted}`,\r\n    borderRadius: tokens.borderRadius.sm, padding: `2px ${tokens.spacing.xs}px`, fontSize: tokens.typography.fontSize.xxs, cursor: 'pointer',\r\n    lineHeight: 1,\r\n    transition: 'all 150ms ease',\r\n  };\r\n}\r\n\r\nexport default ActivityPlanner;\r\n"],"names":["ActivityForm","ActivityPlanner"],"mappings":"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"}