@echothink-ui/activity 0.1.0

package/dist/index.js

@@ -0,0 +1,904 @@
+// src/components/NotificationCenter.tsx
+import { Button as Button2, Surface } from "@echothink-ui/core";
+
+// src/components/NotificationItem.tsx
+import { ActionGroup, Badge, Button } from "@echothink-ui/core";
+
+// src/components/helpers.ts
+function severityToCore(severity) {
+  if (severity === "error" || severity === "danger") return "danger";
+  if (severity === "success") return "success";
+  if (severity === "warning") return "warning";
+  return "info";
+}
+function dateGroupKey(value) {
+  const date = new Date(value);
+  if (!Number.isFinite(date.valueOf())) return value;
+  return date.toISOString().slice(0, 10);
+}
+
+// src/components/NotificationItem.tsx
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function NotificationItem({
+  notification,
+  onRead,
+  onClick,
+  className,
+  title: _title,
+  subtitle: _subtitle,
+  description: _description,
+  eyebrow: _eyebrow,
+  density: _density,
+  status: _status,
+  severity: _severity,
+  loading: _loading,
+  empty: _empty,
+  error: _error,
+  items: _items,
+  actions: _actions,
+  metadata: _metadata,
+  footer: _footer,
+  ...props
+}) {
+  const severity = severityToCore(notification.severity);
+  const mainContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Badge, { className: "eth-activity-notification-item__severity", severity, children: notification.severity }),
+    /* @__PURE__ */ jsxs("span", { className: "eth-activity-notification-item__content", children: [
+      /* @__PURE__ */ jsx("strong", { className: "eth-activity-notification-item__title", children: notification.title }),
+      notification.body ? /* @__PURE__ */ jsx("span", { className: "eth-activity-notification-item__body", children: notification.body }) : null
+    ] }),
+    /* @__PURE__ */ jsx(
+      "time",
+      {
+        className: "eth-activity-notification-item__time",
+        dateTime: dateTimeValue(notification.createdAt),
+        children: formatTimestamp(notification.createdAt)
+      }
+    )
+  ] });
+  const hasActions = Boolean(!notification.read && onRead || notification.actions?.length);
+  return /* @__PURE__ */ jsxs(
+    "article",
+    {
+      ...props,
+      className: [
+        "eth-activity-notification-item",
+        notification.read ? "eth-activity-notification-item--read" : void 0,
+        className
+      ].filter(Boolean).join(" "),
+      "data-eth-component": "NotificationItem",
+      "data-severity": severity,
+      children: [
+        onClick ? /* @__PURE__ */ jsx("button", { type: "button", className: "eth-activity-notification-item__main", onClick, children: mainContent }) : /* @__PURE__ */ jsx("div", { className: "eth-activity-notification-item__main", children: mainContent }),
+        hasActions ? /* @__PURE__ */ jsxs("div", { className: "eth-activity-notification-item__actions", children: [
+          !notification.read && onRead ? /* @__PURE__ */ jsx(Button, { type: "button", intent: "ghost", density: "compact", onClick: onRead, children: "Mark read" }) : null,
+          /* @__PURE__ */ jsx(ActionGroup, { actions: notification.actions })
+        ] }) : null
+      ]
+    }
+  );
+}
+function dateTimeValue(value) {
+  const date = new Date(value);
+  return Number.isFinite(date.valueOf()) ? date.toISOString() : void 0;
+}
+function formatTimestamp(value) {
+  const date = new Date(value);
+  if (!Number.isFinite(date.valueOf())) return value;
+  const iso = date.toISOString();
+  return `${iso.slice(11, 16)} UTC`;
+}
+
+// src/components/NotificationCenter.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function NotificationCenter({
+  notifications,
+  unreadCount,
+  onMarkRead,
+  onMarkAllRead,
+  onDismiss,
+  title,
+  className,
+  role,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const groups = groupByDate(notifications);
+  const unreadTotal = unreadCount ?? notifications.filter((item) => !item.read).length;
+  const displayTitle = title ?? "Notifications";
+  const regionLabel = ariaLabel ?? (typeof displayTitle === "string" ? displayTitle : "Notification center");
+  return /* @__PURE__ */ jsxs2(
+    Surface,
+    {
+      ...props,
+      title: displayTitle,
+      subtitle: `${unreadTotal} unread`,
+      className: ["eth-activity-notification-center", className].filter(Boolean).join(" "),
+      "data-eth-component": "NotificationCenter",
+      role: role ?? "region",
+      "aria-label": regionLabel,
+      children: [
+        onMarkAllRead ? /* @__PURE__ */ jsx2("div", { className: "eth-activity-notification-center__toolbar", children: /* @__PURE__ */ jsx2(
+          Button2,
+          {
+            type: "button",
+            intent: "secondary",
+            density: "compact",
+            disabled: unreadTotal === 0,
+            onClick: onMarkAllRead,
+            children: "Mark all read"
+          }
+        ) }) : null,
+        notifications.length ? /* @__PURE__ */ jsx2("div", { className: "eth-activity-notification-center__groups", children: groups.map((group) => /* @__PURE__ */ jsxs2("section", { className: "eth-activity-notification-center__group", children: [
+          /* @__PURE__ */ jsx2("h3", { children: formatGroupLabel(group.date) }),
+          /* @__PURE__ */ jsx2("ol", { className: "eth-activity-notification-center__items", children: group.items.map((notification) => /* @__PURE__ */ jsxs2("li", { className: "eth-activity-notification-center__row", children: [
+            /* @__PURE__ */ jsx2(
+              NotificationItem,
+              {
+                notification,
+                onRead: onMarkRead && !notification.read ? () => onMarkRead(notification.id) : void 0
+              }
+            ),
+            onDismiss ? /* @__PURE__ */ jsx2(
+              Button2,
+              {
+                type: "button",
+                intent: "ghost",
+                density: "compact",
+                onClick: () => onDismiss(notification.id),
+                children: "Dismiss"
+              }
+            ) : null
+          ] }, notification.id)) })
+        ] }, group.date)) }) : /* @__PURE__ */ jsx2("p", { className: "eth-activity-notification-center__empty", children: "No notifications." })
+      ]
+    }
+  );
+}
+function groupByDate(notifications) {
+  const groups = /* @__PURE__ */ new Map();
+  for (const notification of notifications) {
+    const key = groupKey(notification.createdAt);
+    groups.set(key, [...groups.get(key) ?? [], notification]);
+  }
+  return Array.from(groups, ([date, items]) => ({ date, items }));
+}
+function groupKey(value) {
+  const date = new Date(value);
+  return Number.isFinite(date.valueOf()) ? date.toISOString().slice(0, 10) : "Recent";
+}
+function formatGroupLabel(value) {
+  if (!/^\d{4}-\d{2}-\d{2}$/.test(value)) return value;
+  return new Intl.DateTimeFormat(void 0, {
+    day: "numeric",
+    month: "short",
+    timeZone: "UTC",
+    weekday: "short",
+    year: "numeric"
+  }).format(/* @__PURE__ */ new Date(`${value}T00:00:00Z`));
+}
+
+// src/components/ActivityFeed.tsx
+import { Badge as Badge2, Surface as Surface2 } from "@echothink-ui/core";
+import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function ActivityFeed({ events, streaming, title, className, ...props }) {
+  const hasEvents = events.length > 0;
+  return /* @__PURE__ */ jsxs3(
+    Surface2,
+    {
+      ...props,
+      title: title ?? "Activity",
+      className: ["eth-activity-feed", className].filter(Boolean).join(" "),
+      "data-eth-component": "ActivityFeed",
+      children: [
+        streaming ? /* @__PURE__ */ jsx3("div", { className: "eth-activity-feed__status", "aria-label": "Streaming activity", children: /* @__PURE__ */ jsx3(Badge2, { severity: "success", children: "Streaming" }) }) : null,
+        hasEvents ? /* @__PURE__ */ jsx3("ol", { className: "eth-activity-feed__events", "aria-live": streaming ? "polite" : void 0, children: events.map((event) => /* @__PURE__ */ jsxs3(
+          "li",
+          {
+            className: `eth-activity-feed__event eth-activity-feed__event--${verbClass(event.verb)}`,
+            children: [
+              /* @__PURE__ */ jsx3("span", { className: "eth-activity-feed__icon", "aria-hidden": true, children: iconForVerb(event.verb) }),
+              /* @__PURE__ */ jsxs3("div", { className: "eth-activity-feed__body", children: [
+                /* @__PURE__ */ jsxs3("p", { className: "eth-activity-feed__summary", children: [
+                  /* @__PURE__ */ jsx3("strong", { children: event.actor }),
+                  " ",
+                  event.verb,
+                  " ",
+                  /* @__PURE__ */ jsx3("strong", { children: event.objectLabel }),
+                  event.targetLabel ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
+                    " ",
+                    "in ",
+                    /* @__PURE__ */ jsx3("strong", { children: event.targetLabel })
+                  ] }) : null
+                ] }),
+                event.details ? /* @__PURE__ */ jsx3("p", { className: "eth-activity-feed__details", children: event.details }) : null,
+                /* @__PURE__ */ jsx3("time", { className: "eth-activity-feed__time", dateTime: dateTimeValue2(event.createdAt), children: formatTimestamp2(event.createdAt) })
+              ] })
+            ]
+          },
+          event.id
+        )) }) : /* @__PURE__ */ jsx3("p", { className: "eth-activity-feed__empty", children: "No activity yet." })
+      ]
+    }
+  );
+}
+function iconForVerb(verb) {
+  const normalized = verb.toLowerCase();
+  if (normalized.includes("create") || normalized.includes("add")) return "+";
+  if (normalized.includes("delete") || normalized.includes("remove")) return "-";
+  if (normalized.includes("approve")) return "\u2713";
+  if (normalized.includes("fail") || normalized.includes("reject")) return "!";
+  return "\u2022";
+}
+function verbClass(verb) {
+  return verb.toLowerCase().replace(/[^a-z0-9]+/g, "-") || "event";
+}
+function dateTimeValue2(value) {
+  const date = new Date(value);
+  return Number.isFinite(date.valueOf()) ? date.toISOString() : value;
+}
+function formatTimestamp2(value) {
+  const date = new Date(value);
+  if (!Number.isFinite(date.valueOf())) return value;
+  const iso = date.toISOString();
+  return `${iso.slice(0, 10)} ${iso.slice(11, 16)} UTC`;
+}
+
+// src/components/ActivityTimeline.tsx
+import { Badge as Badge3, Surface as Surface3 } from "@echothink-ui/core";
+import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function ActivityTimeline({
+  events = [],
+  title,
+  subtitle,
+  className,
+  role,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const groups = groupEvents(events);
+  const eventCount = events.length;
+  return /* @__PURE__ */ jsx4(
+    Surface3,
+    {
+      ...props,
+      title: title ?? "Timeline",
+      subtitle: subtitle ?? summaryText(groups.length, eventCount),
+      className: ["eth-activity-timeline", className].filter(Boolean).join(" "),
+      "data-eth-component": "ActivityTimeline",
+      role: role ?? "region",
+      "aria-label": ariaLabel ?? "Activity timeline",
+      children: eventCount > 0 ? /* @__PURE__ */ jsx4("div", { className: "eth-activity-timeline__content", children: groups.map((group) => /* @__PURE__ */ jsxs4("section", { className: "eth-activity-timeline__group", children: [
+        /* @__PURE__ */ jsxs4("header", { className: "eth-activity-timeline__group-header", children: [
+          /* @__PURE__ */ jsx4("h3", { children: formatGroupLabel2(group.date) }),
+          /* @__PURE__ */ jsx4("span", { children: summaryText(0, group.events.length) })
+        ] }),
+        /* @__PURE__ */ jsx4("ol", { className: "eth-activity-timeline__events", children: group.events.map((event) => /* @__PURE__ */ jsxs4(
+          "li",
+          {
+            className: `eth-activity-timeline__event eth-activity-timeline__event--${verbClass2(event.verb)}`,
+            children: [
+              /* @__PURE__ */ jsx4("span", { className: "eth-activity-timeline__marker", "aria-hidden": true, children: iconForVerb2(event.verb) }),
+              /* @__PURE__ */ jsxs4("article", { className: "eth-activity-timeline__card", children: [
+                /* @__PURE__ */ jsxs4("header", { className: "eth-activity-timeline__event-header", children: [
+                  /* @__PURE__ */ jsx4(Badge3, { severity: severityForVerb(event.verb), children: kindLabel(event.verb) }),
+                  /* @__PURE__ */ jsx4("time", { dateTime: dateTimeValue3(event.createdAt), children: formatTimestamp3(event.createdAt) })
+                ] }),
+                /* @__PURE__ */ jsxs4("p", { className: "eth-activity-timeline__summary", children: [
+                  /* @__PURE__ */ jsx4("strong", { children: event.actor }),
+                  " ",
+                  event.verb,
+                  " ",
+                  /* @__PURE__ */ jsx4("strong", { children: event.objectLabel }),
+                  event.targetLabel ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
+                    " ",
+                    "in ",
+                    /* @__PURE__ */ jsx4("strong", { children: event.targetLabel })
+                  ] }) : null
+                ] }),
+                event.details ? /* @__PURE__ */ jsx4("p", { className: "eth-activity-timeline__details", children: event.details }) : null
+              ] })
+            ]
+          },
+          event.id
+        )) })
+      ] }, group.date)) }) : /* @__PURE__ */ jsx4("p", { className: "eth-activity-timeline__empty", children: "No activity yet." })
+    }
+  );
+}
+function groupEvents(events) {
+  const groups = /* @__PURE__ */ new Map();
+  const sortedEvents = events.map((event, index) => ({ event, index })).sort((a, b) => compareEvents(a, b)).map(({ event }) => event);
+  for (const event of sortedEvents) {
+    const key = dateGroupKey(event.createdAt);
+    groups.set(key, [...groups.get(key) ?? [], event]);
+  }
+  return Array.from(groups, ([date, groupedEvents]) => ({ date, events: groupedEvents }));
+}
+function compareEvents(a, b) {
+  const aTime = timestampValue(a.event.createdAt);
+  const bTime = timestampValue(b.event.createdAt);
+  if (aTime !== null && bTime !== null && aTime !== bTime) return bTime - aTime;
+  if (aTime !== null && bTime === null) return -1;
+  if (aTime === null && bTime !== null) return 1;
+  return a.index - b.index;
+}
+function timestampValue(value) {
+  const timestamp = new Date(value).getTime();
+  return Number.isFinite(timestamp) ? timestamp : null;
+}
+function dateTimeValue3(value) {
+  const date = new Date(value);
+  return Number.isFinite(date.valueOf()) ? date.toISOString() : value;
+}
+function formatGroupLabel2(value) {
+  if (!/^\d{4}-\d{2}-\d{2}$/.test(value)) return value;
+  return new Intl.DateTimeFormat(void 0, {
+    day: "numeric",
+    month: "short",
+    timeZone: "UTC",
+    weekday: "short",
+    year: "numeric"
+  }).format(/* @__PURE__ */ new Date(`${value}T00:00:00Z`));
+}
+function formatTimestamp3(value) {
+  const date = new Date(value);
+  if (!Number.isFinite(date.valueOf())) return value;
+  const iso = date.toISOString();
+  return `${iso.slice(11, 16)} UTC`;
+}
+function summaryText(groupCount, eventCount) {
+  const eventLabel = `${eventCount} ${eventCount === 1 ? "event" : "events"}`;
+  if (groupCount <= 0) return eventLabel;
+  return `${eventLabel} across ${groupCount} ${groupCount === 1 ? "day" : "days"}`;
+}
+function iconForVerb2(verb) {
+  const normalized = verb.toLowerCase();
+  if (normalized.includes("approve")) return "\u2713";
+  if (normalized.includes("draft") || normalized.includes("create") || normalized.includes("add")) {
+    return "+";
+  }
+  if (normalized.includes("comment")) return "\u2026";
+  if (normalized.includes("fail") || normalized.includes("reject")) return "!";
+  return "\u2022";
+}
+function kindLabel(verb) {
+  const normalized = verb.trim().toLowerCase();
+  if (normalized.includes("approve")) return "Approval";
+  if (normalized.includes("draft")) return "Draft";
+  if (normalized.includes("comment")) return "Comment";
+  if (normalized.includes("create") || normalized.includes("add")) return "Created";
+  if (normalized.includes("fail") || normalized.includes("reject")) return "Attention";
+  return "Update";
+}
+function severityForVerb(verb) {
+  const normalized = verb.toLowerCase();
+  if (normalized.includes("approve")) return "success";
+  if (normalized.includes("fail") || normalized.includes("reject")) return "danger";
+  if (normalized.includes("comment")) return "info";
+  return "neutral";
+}
+function verbClass2(verb) {
+  return verb.toLowerCase().replace(/[^a-z0-9]+/g, "-") || "event";
+}
+
+// src/components/AlertBanner.tsx
+import {
+  ActionGroup as ActionGroup2,
+  Button as Button3,
+  InlineNotification
+} from "@echothink-ui/core";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function AlertBanner({
+  severity,
+  title,
+  description,
+  onDismiss,
+  actions,
+  className,
+  role,
+  ...props
+}) {
+  const coreSeverity = severityToCore(severity);
+  const hasActions = Boolean(actions?.length || onDismiss);
+  const ariaLive = props["aria-live"] ?? (coreSeverity === "danger" ? "assertive" : "polite");
+  const dataEthComponent = props["data-eth-component"] ?? "AlertBanner";
+  return /* @__PURE__ */ jsxs5(
+    "section",
+    {
+      ...props,
+      className: [
+        "eth-activity-alert-banner",
+        `eth-activity-alert-banner--${coreSeverity}`,
+        className
+      ].filter(Boolean).join(" "),
+      "data-eth-component": dataEthComponent,
+      role: role ?? (coreSeverity === "danger" ? "alert" : "status"),
+      "aria-live": ariaLive,
+      children: [
+        /* @__PURE__ */ jsx5("div", { className: "eth-activity-alert-banner__notice", children: /* @__PURE__ */ jsx5(InlineNotification, { severity: coreSeverity, title, children: description }) }),
+        hasActions ? /* @__PURE__ */ jsxs5("div", { className: "eth-activity-alert-banner__actions", children: [
+          /* @__PURE__ */ jsx5(ActionGroup2, { actions }),
+          onDismiss ? /* @__PURE__ */ jsx5(Button3, { type: "button", intent: "ghost", density: "compact", onClick: onDismiss, children: "Dismiss" }) : null
+        ] }) : null
+      ]
+    }
+  );
+}
+
+// src/components/SystemStatusBanner.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+function SystemStatusBanner({
+  status,
+  title,
+  description,
+  actions,
+  onDismiss,
+  className
+}) {
+  return /* @__PURE__ */ jsx6(
+    AlertBanner,
+    {
+      severity: severityForStatus(status),
+      title: title ?? defaultTitleForStatus(status),
+      description,
+      actions,
+      onDismiss,
+      className: ["eth-activity-system-status-banner", className].filter(Boolean).join(" "),
+      "data-eth-component": "SystemStatusBanner"
+    }
+  );
+}
+function defaultTitleForStatus(status) {
+  if (status === "operational") return "System operational";
+  if (status === "degraded") return "System degraded";
+  if (status === "maintenance") return "Scheduled maintenance";
+  return "System unavailable";
+}
+function severityForStatus(status) {
+  if (status === "operational") return "success";
+  if (status === "degraded" || status === "maintenance") return "warning";
+  return "error";
+}
+
+// src/components/IncidentPanel.tsx
+import { Badge as Badge4, Surface as Surface4 } from "@echothink-ui/core";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function IncidentPanel({ incidents, title, className, ...props }) {
+  const hasIncidents = incidents.length > 0;
+  return /* @__PURE__ */ jsx7(
+    Surface4,
+    {
+      ...props,
+      title: title ?? "Incidents",
+      className: ["eth-activity-incident-panel", className].filter(Boolean).join(" "),
+      "data-eth-component": "IncidentPanel",
+      children: hasIncidents ? /* @__PURE__ */ jsx7("div", { className: "eth-activity-incident-panel__list", role: "list", children: incidents.map((incident) => /* @__PURE__ */ jsxs6(
+        "article",
+        {
+          className: "eth-activity-incident-panel__incident",
+          "data-severity": incident.severity ? severityToCore(incident.severity) : void 0,
+          role: "listitem",
+          "aria-label": incident.title,
+          children: [
+            /* @__PURE__ */ jsxs6("header", { className: "eth-activity-incident-panel__incident-header", children: [
+              /* @__PURE__ */ jsxs6("div", { className: "eth-activity-incident-panel__summary", children: [
+                /* @__PURE__ */ jsx7("h3", { children: incident.title }),
+                incident.description ? /* @__PURE__ */ jsx7("p", { children: incident.description }) : null
+              ] }),
+              incident.severity ? /* @__PURE__ */ jsx7(
+                Badge4,
+                {
+                  className: "eth-activity-incident-panel__severity",
+                  severity: severityToCore(incident.severity),
+                  children: formatIncidentLabel(incident.severity)
+                }
+              ) : null
+            ] }),
+            /* @__PURE__ */ jsxs6("dl", { className: "eth-activity-incident-panel__metadata", children: [
+              incident.status ? /* @__PURE__ */ jsxs6("div", { children: [
+                /* @__PURE__ */ jsx7("dt", { children: "Status" }),
+                /* @__PURE__ */ jsx7("dd", { children: /* @__PURE__ */ jsxs6(
+                  "span",
+                  {
+                    className: "eth-activity-incident-panel__status",
+                    "data-status": incident.status,
+                    children: [
+                      /* @__PURE__ */ jsx7("span", { "aria-hidden": "true" }),
+                      formatIncidentLabel(incident.status)
+                    ]
+                  }
+                ) })
+              ] }) : null,
+              incident.startedAt ? /* @__PURE__ */ jsxs6("div", { children: [
+                /* @__PURE__ */ jsx7("dt", { children: "Started" }),
+                /* @__PURE__ */ jsx7("dd", { children: /* @__PURE__ */ jsx7("time", { children: incident.startedAt }) })
+              ] }) : null
+            ] })
+          ]
+        },
+        incident.id
+      )) }) : /* @__PURE__ */ jsx7("p", { className: "eth-activity-incident-panel__empty", children: "No active incidents." })
+    }
+  );
+}
+function formatIncidentLabel(value) {
+  return value.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join(" ");
+}
+
+// src/components/ChangelogPanel.tsx
+import { Badge as Badge5, Surface as Surface5 } from "@echothink-ui/core";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function ChangelogPanel({
+  entries,
+  title,
+  subtitle,
+  className,
+  role,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx8(
+    Surface5,
+    {
+      ...props,
+      title: title ?? "Changelog",
+      subtitle: subtitle ?? changelogSummary(entries),
+      className: ["eth-activity-changelog", className].filter(Boolean).join(" "),
+      "data-eth-component": "ChangelogPanel",
+      role: role ?? "region",
+      "aria-label": ariaLabel ?? "Product changelog",
+      children: entries.length ? /* @__PURE__ */ jsx8("ol", { className: "eth-activity-changelog__releases", children: entries.map((entry) => /* @__PURE__ */ jsx8("li", { className: "eth-activity-changelog__release", children: /* @__PURE__ */ jsxs7(
+        "article",
+        {
+          className: "eth-activity-changelog__entry",
+          "aria-label": `Version ${entry.version}`,
+          children: [
+            /* @__PURE__ */ jsxs7("header", { className: "eth-activity-changelog__entry-header", children: [
+              /* @__PURE__ */ jsxs7("div", { children: [
+                /* @__PURE__ */ jsx8("h3", { children: entry.version }),
+                /* @__PURE__ */ jsx8("time", { dateTime: dateTimeValue4(entry.date), children: entry.date })
+              ] }),
+              /* @__PURE__ */ jsx8("span", { className: "eth-activity-changelog__entry-count", children: pluralize(entry.changes.length, "change") })
+            ] }),
+            /* @__PURE__ */ jsx8("ul", { className: "eth-activity-changelog__changes", children: entry.changes.map((change, index) => /* @__PURE__ */ jsxs7(
+              "li",
+              {
+                className: `eth-activity-changelog__change eth-activity-changelog__change--${change.type}`,
+                children: [
+                  /* @__PURE__ */ jsx8(Badge5, { severity: severityForChange(change.type), children: changeLabel(change.type) }),
+                  /* @__PURE__ */ jsx8("span", { children: change.summary })
+                ]
+              },
+              `${change.type}-${index}`
+            )) })
+          ]
+        }
+      ) }, entry.id)) }) : /* @__PURE__ */ jsx8("p", { className: "eth-activity-changelog__empty", children: "No release notes published yet." })
+    }
+  );
+}
+function severityForChange(type) {
+  if (type === "added") return "success";
+  if (type === "fixed") return "info";
+  if (type === "removed") return "danger";
+  return "warning";
+}
+function changeLabel(type) {
+  const labels = {
+    added: "Added",
+    changed: "Changed",
+    fixed: "Fixed",
+    removed: "Removed"
+  };
+  return labels[type];
+}
+function changelogSummary(entries) {
+  if (!entries.length) return "No releases published";
+  const changeCount = entries.reduce((count, entry) => count + entry.changes.length, 0);
+  return `${pluralize(entries.length, "release")} \xB7 ${pluralize(changeCount, "change")}`;
+}
+function pluralize(count, label) {
+  return `${count} ${label}${count === 1 ? "" : "s"}`;
+}
+function dateTimeValue4(value) {
+  const date = new Date(value);
+  return Number.isFinite(date.valueOf()) ? date.toISOString().slice(0, 10) : void 0;
+}
+
+// src/components/SubscriptionPreferences.tsx
+import * as React from "react";
+import { Surface as Surface6, Toggle } from "@echothink-ui/core";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function SubscriptionPreferences({
+  categories,
+  onToggle,
+  title,
+  className,
+  role,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const displayTitle = title ?? "Notification preferences";
+  const panelLabel = ariaLabel ?? (typeof displayTitle === "string" ? displayTitle : void 0);
+  return /* @__PURE__ */ jsx9(
+    Surface6,
+    {
+      ...props,
+      title: displayTitle,
+      role: role ?? (panelLabel ? "region" : void 0),
+      "aria-label": panelLabel,
+      className: ["eth-activity-subscription-preferences", className].filter(Boolean).join(" "),
+      "data-eth-component": "SubscriptionPreferences",
+      children: categories.length ? /* @__PURE__ */ jsx9("div", { className: "eth-activity-subscription-preferences__categories", children: categories.map((category) => /* @__PURE__ */ jsx9(SubscriptionCategoryGroup, { category, onToggle }, category.id)) }) : /* @__PURE__ */ jsx9("p", { className: "eth-activity-subscription-preferences__empty", role: "status", children: "No notification categories configured." })
+    }
+  );
+}
+function SubscriptionCategoryGroup({
+  category,
+  onToggle
+}) {
+  const headingId = React.useId();
+  const descriptionId = category.description ? `${headingId}-description` : void 0;
+  return /* @__PURE__ */ jsxs8(
+    "section",
+    {
+      className: "eth-activity-subscription-preferences__category",
+      role: "group",
+      "aria-labelledby": headingId,
+      "aria-describedby": descriptionId,
+      children: [
+        /* @__PURE__ */ jsxs8("header", { className: "eth-activity-subscription-preferences__category-header", children: [
+          /* @__PURE__ */ jsx9("h3", { id: headingId, children: category.label }),
+          category.description ? /* @__PURE__ */ jsx9(
+            "p",
+            {
+              id: descriptionId,
+              className: "eth-activity-subscription-preferences__category-description",
+              children: category.description
+            }
+          ) : null
+        ] }),
+        category.channels.length ? /* @__PURE__ */ jsx9("div", { className: "eth-activity-subscription-preferences__channels", children: category.channels.map((channel) => /* @__PURE__ */ jsx9(
+          SubscriptionChannelRow,
+          {
+            category,
+            channel,
+            onToggle
+          },
+          channel.id
+        )) }) : /* @__PURE__ */ jsx9("p", { className: "eth-activity-subscription-preferences__channel-empty", children: "No channels configured." })
+      ]
+    }
+  );
+}
+function SubscriptionChannelRow({
+  category,
+  channel,
+  onToggle
+}) {
+  const accessibleLabel = `${category.label} ${channel.label}`;
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      className: [
+        "eth-activity-subscription-preferences__channel",
+        channel.disabled ? "eth-activity-subscription-preferences__channel--disabled" : void 0
+      ].filter(Boolean).join(" "),
+      children: [
+        /* @__PURE__ */ jsxs8("div", { className: "eth-activity-subscription-preferences__channel-copy", children: [
+          /* @__PURE__ */ jsx9("span", { className: "eth-activity-subscription-preferences__channel-label", children: channel.label }),
+          channel.description ? /* @__PURE__ */ jsx9("span", { className: "eth-activity-subscription-preferences__channel-description", children: channel.description }) : null
+        ] }),
+        /* @__PURE__ */ jsx9(
+          Toggle,
+          {
+            id: `eth-subscription-${safeId(category.id)}-${safeId(channel.id)}`,
+            label: accessibleLabel,
+            hideLabel: true,
+            density: "compact",
+            checked: channel.enabled,
+            disabled: channel.disabled,
+            onChange: (event) => onToggle?.(category.id, channel.id, event.currentTarget.checked)
+          }
+        )
+      ]
+    }
+  );
+}
+function safeId(value) {
+  return value.replace(/[^a-zA-Z0-9_-]+/g, "-") || "channel";
+}
+
+// src/components/MentionList.tsx
+import { Button as Button4, Surface as Surface7 } from "@echothink-ui/core";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+function MentionList({
+  mentions,
+  onOpen,
+  title,
+  subtitle,
+  className,
+  ...props
+}) {
+  const hasMentions = mentions.length > 0;
+  const countLabel = hasMentions ? `${mentions.length} pending ${mentions.length === 1 ? "reference" : "references"}` : "No pending references";
+  return /* @__PURE__ */ jsx10(
+    Surface7,
+    {
+      ...props,
+      title: title ?? "Mentions",
+      subtitle: subtitle ?? countLabel,
+      className: ["eth-activity-mention-list", className].filter(Boolean).join(" "),
+      "data-eth-component": "MentionList",
+      children: hasMentions ? /* @__PURE__ */ jsx10("ul", { className: "eth-activity-mention-list__items", "aria-label": "Mention assignments", children: mentions.map((mention) => /* @__PURE__ */ jsxs9("li", { className: "eth-activity-mention-list__item", children: [
+        /* @__PURE__ */ jsx10("span", { className: "eth-activity-mention-list__avatar", "aria-hidden": "true", children: initialsForName(mention.from) }),
+        /* @__PURE__ */ jsxs9("div", { className: "eth-activity-mention-list__content", children: [
+          /* @__PURE__ */ jsxs9("div", { className: "eth-activity-mention-list__header", children: [
+            /* @__PURE__ */ jsx10("strong", { className: "eth-activity-mention-list__sender", children: mention.from }),
+            /* @__PURE__ */ jsx10("span", { className: "eth-activity-mention-list__reference", children: mention.messageRef })
+          ] }),
+          /* @__PURE__ */ jsx10("p", { className: "eth-activity-mention-list__excerpt", children: mention.excerpt }),
+          /* @__PURE__ */ jsx10(
+            "time",
+            {
+              className: "eth-activity-mention-list__time",
+              dateTime: dateTimeValue5(mention.createdAt),
+              children: mention.createdAt
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx10(
+          Button4,
+          {
+            type: "button",
+            intent: "tertiary",
+            density: "compact",
+            disabled: !onOpen,
+            "aria-label": `Open mention ${mention.messageRef}`,
+            onClick: () => onOpen?.(mention.messageRef),
+            children: "Open"
+          }
+        )
+      ] }, mention.id)) }) : /* @__PURE__ */ jsx10("p", { className: "eth-activity-mention-list__empty", role: "status", children: "No mentions assigned to you." })
+    }
+  );
+}
+function initialsForName(value) {
+  const parts = value.trim().split(/\s+/).filter(Boolean);
+  if (parts.length === 0) return "?";
+  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
+  return `${parts[0][0]}${parts[parts.length - 1][0]}`.toUpperCase();
+}
+function dateTimeValue5(value) {
+  const trimmed = value.trim();
+  if (/^\d{2}:\d{2}(:\d{2})?$/.test(trimmed)) return trimmed;
+  const date = new Date(trimmed);
+  return Number.isFinite(date.valueOf()) ? date.toISOString() : void 0;
+}
+
+// src/components/WatcherList.tsx
+import {
+  Badge as Badge6,
+  Button as Button5,
+  IconButton,
+  Surface as Surface8
+} from "@echothink-ui/core";
+import { CloseIcon, PlusIcon } from "@echothink-ui/icons";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+function WatcherList({
+  watchers,
+  onAdd,
+  onRemove,
+  title,
+  subtitle,
+  className,
+  role,
+  footer,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const heading = title ?? "Watchers";
+  const regionLabel = ariaLabel ?? (typeof heading === "string" ? heading : "Watchers");
+  const addAction = onAdd ? /* @__PURE__ */ jsx11(
+    Button5,
+    {
+      type: "button",
+      density: "compact",
+      intent: "tertiary",
+      icon: /* @__PURE__ */ jsx11(PlusIcon, { size: 16 }),
+      onClick: onAdd,
+      children: "Add watcher"
+    }
+  ) : null;
+  const surfaceFooter = addAction || footer ? /* @__PURE__ */ jsxs10("div", { className: "eth-activity-watcher-list__footer", children: [
+    addAction,
+    footer
+  ] }) : void 0;
+  return /* @__PURE__ */ jsx11(
+    Surface8,
+    {
+      ...props,
+      title: heading,
+      subtitle: subtitle ?? watcherSummary(watchers.length),
+      className: ["eth-activity-watcher-list", className].filter(Boolean).join(" "),
+      "data-eth-component": "WatcherList",
+      role: role ?? "region",
+      "aria-label": regionLabel,
+      footer: surfaceFooter,
+      children: watchers.length ? /* @__PURE__ */ jsx11("ul", { className: "eth-activity-watcher-list__items", "aria-label": "Watchers", children: watchers.map((watcher) => /* @__PURE__ */ jsxs10("li", { className: "eth-activity-watcher-list__item", children: [
+        /* @__PURE__ */ jsx11("span", { className: "eth-activity-watcher-list__avatar", "aria-hidden": "true", children: watcher.avatar ? /* @__PURE__ */ jsx11("img", { src: watcher.avatar, alt: "" }) : initialsForName2(watcher.label) }),
+        /* @__PURE__ */ jsxs10("span", { className: "eth-activity-watcher-list__identity", children: [
+          /* @__PURE__ */ jsx11("strong", { children: watcher.label }),
+          /* @__PURE__ */ jsx11("span", { children: watcherDetail(watcher) })
+        ] }),
+        /* @__PURE__ */ jsxs10("span", { className: "eth-activity-watcher-list__actions", children: [
+          /* @__PURE__ */ jsx11(Badge6, { severity: "neutral", children: watcherKindLabel(watcher.kind) }),
+          onRemove ? /* @__PURE__ */ jsx11(
+            IconButton,
+            {
+              type: "button",
+              density: "compact",
+              intent: "ghost",
+              label: `Remove ${watcher.label} from watchers`,
+              icon: /* @__PURE__ */ jsx11(CloseIcon, { size: 16 }),
+              onClick: () => onRemove(watcher.id)
+            }
+          ) : null
+        ] })
+      ] }, watcher.id)) }) : /* @__PURE__ */ jsx11("p", { className: "eth-activity-watcher-list__empty", role: "status", children: "No watchers have been added." })
+    }
+  );
+}
+function watcherSummary(count) {
+  if (count === 0) return "No watchers configured";
+  return `${count} ${count === 1 ? "watcher" : "watchers"} notified on updates`;
+}
+function watcherDetail(watcher) {
+  const details = [watcher.role, watcher.email].filter(Boolean);
+  return details.length ? details.join(" / ") : "Receives activity updates";
+}
+function watcherKindLabel(kind) {
+  if (kind === "group") return "Group";
+  if (kind === "service-account") return "Service account";
+  return "User";
+}
+function initialsForName2(value) {
+  const parts = value.trim().split(/\s+/).filter(Boolean);
+  if (!parts.length) return "?";
+  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
+  return `${parts[0][0]}${parts[parts.length - 1][0]}`.toUpperCase();
+}
+
+// src/index.tsx
+import { AuditLogTable } from "@echothink-ui/data";
+var ActivityComponentNames = [
+  "NotificationCenter",
+  "NotificationItem",
+  "ActivityFeed",
+  "ActivityTimeline",
+  "AlertBanner",
+  "SystemStatusBanner",
+  "IncidentPanel",
+  "ChangelogPanel",
+  "SubscriptionPreferences",
+  "MentionList",
+  "WatcherList",
+  "AuditLogTable"
+];
+export {
+  ActivityComponentNames,
+  ActivityFeed,
+  ActivityTimeline,
+  AlertBanner,
+  AuditLogTable,
+  ChangelogPanel,
+  IncidentPanel,
+  MentionList,
+  NotificationCenter,
+  NotificationItem,
+  SubscriptionPreferences,
+  SystemStatusBanner,
+  WatcherList
+};
+//# sourceMappingURL=index.js.map