@echothink-ui/inbox 0.1.0

package/dist/index.js

@@ -0,0 +1,1645 @@
+// src/components/InboxShell.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function InboxShell({
+  folders,
+  list,
+  thread,
+  inspector,
+  toolbar,
+  className,
+  title,
+  description,
+  ...props
+}) {
+  const hasInspector = Boolean(inspector);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      ...props,
+      className: `eth-inbox-shell ${className ?? ""}`,
+      "data-eth-component": "InboxShell",
+      children: [
+        (title || description || toolbar) && /* @__PURE__ */ jsxs("header", { className: "eth-inbox-shell__header", children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            title ? /* @__PURE__ */ jsx("h2", { children: title }) : null,
+            description ? /* @__PURE__ */ jsx("p", { children: description }) : null
+          ] }),
+          toolbar ? /* @__PURE__ */ jsx("div", { className: "eth-inbox-shell__toolbar", children: toolbar }) : null
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `eth-inbox-shell__layout ${hasInspector ? "eth-inbox-shell__layout--has-inspector" : ""}`,
+            children: [
+              /* @__PURE__ */ jsx("aside", { className: "eth-inbox-shell__folders", "aria-label": "Mailbox folders", children: folders }),
+              /* @__PURE__ */ jsx("aside", { className: "eth-inbox-shell__list", "aria-label": "Message list", children: list }),
+              /* @__PURE__ */ jsx("main", { className: "eth-inbox-shell__thread", "aria-label": "Selected conversation", children: thread }),
+              inspector ? /* @__PURE__ */ jsx("aside", { className: "eth-inbox-shell__inspector", "aria-label": "Conversation inspector", children: inspector }) : null
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/MailboxFolderList.tsx
+import { Badge } from "@echothink-ui/core";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function MailboxFolderList({
+  folders = [],
+  activeFolderId,
+  onSelect,
+  className,
+  "aria-label": ariaLabel = "Mailbox folders",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2(
+    "nav",
+    {
+      ...props,
+      className: ["eth-inbox-folders", className].filter(Boolean).join(" "),
+      "data-eth-component": "MailboxFolderList",
+      "aria-label": ariaLabel,
+      children: /* @__PURE__ */ jsx2("ul", { className: "eth-inbox-folders__list", children: folders.map((folder) => {
+        const isActive = activeFolderId === folder.id;
+        return /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsxs2(
+          "button",
+          {
+            type: "button",
+            className: [
+              "eth-inbox-folders__item",
+              isActive ? "eth-inbox-folders__item--active" : "",
+              folder.smart ? "eth-inbox-folders__item--smart" : ""
+            ].filter(Boolean).join(" "),
+            "aria-current": isActive ? "page" : void 0,
+            onClick: () => onSelect?.(folder.id),
+            title: folder.label,
+            children: [
+              folder.icon ? /* @__PURE__ */ jsx2("span", { className: "eth-inbox-folders__icon", "aria-hidden": "true", children: folder.icon }) : null,
+              /* @__PURE__ */ jsx2("span", { className: "eth-inbox-folders__label", children: folder.label }),
+              typeof folder.count === "number" ? /* @__PURE__ */ jsx2(Badge, { className: "eth-inbox-folders__count", "aria-label": `${folder.count} items`, children: folder.count }) : null
+            ]
+          }
+        ) }, folder.id);
+      }) })
+    }
+  );
+}
+
+// src/components/MessageList.tsx
+import { Badge as Badge2, StatusDot, Tag, statusLabel } from "@echothink-ui/core";
+
+// src/utils.ts
+function formatDateTime(value) {
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  return new Intl.DateTimeFormat(void 0, {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  }).format(date);
+}
+function formatBytes(size) {
+  if (size < 1024) return `${size} B`;
+  if (size < 1024 * 1024) return `${Math.round(size / 1024)} KB`;
+  return `${(size / (1024 * 1024)).toFixed(1)} MB`;
+}
+function listToInput(value) {
+  return value?.join(", ") ?? "";
+}
+function inputToList(value) {
+  return value.split(",").map((item) => item.trim()).filter(Boolean);
+}
+function prioritySeverity(priority) {
+  if (priority === "high") return "danger";
+  if (priority === "low") return "neutral";
+  return "info";
+}
+
+// src/components/MessageList.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function MessageList({
+  threads = [],
+  selectedThreadId,
+  onSelect,
+  className,
+  ...props
+}) {
+  const hasThreads = threads.length > 0;
+  return /* @__PURE__ */ jsx3(
+    "div",
+    {
+      ...props,
+      className: `eth-inbox-message-list ${className ?? ""}`,
+      role: "listbox",
+      "aria-label": "Message threads",
+      "data-eth-component": "MessageList",
+      children: hasThreads ? threads.map((thread, index) => {
+        const receivedAtLabel = formatDateTime(thread.receivedAt);
+        const selected = selectedThreadId === thread.id;
+        const hasMeta = Boolean(thread.priority || thread.labels?.length || thread.status);
+        return /* @__PURE__ */ jsxs3(
+          "button",
+          {
+            type: "button",
+            role: "option",
+            "aria-label": [
+              thread.unread ? "Unread" : "Read",
+              `From ${thread.from}`,
+              thread.subject,
+              `Received ${receivedAtLabel}`,
+              thread.priority ? `${thread.priority} priority` : null,
+              thread.status ? statusLabel(thread.status) : null
+            ].filter(Boolean).join(", "),
+            "aria-posinset": index + 1,
+            "aria-selected": selected,
+            "aria-setsize": threads.length,
+            className: `eth-inbox-message-list__row ${thread.unread ? "eth-inbox-message-list__row--unread" : ""}`,
+            onClick: () => onSelect?.(thread.id),
+            children: [
+              /* @__PURE__ */ jsx3("span", { className: "eth-inbox-message-list__selection", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsxs3("span", { className: "eth-inbox-message-list__content", children: [
+                /* @__PURE__ */ jsxs3("span", { className: "eth-inbox-message-list__header", children: [
+                  /* @__PURE__ */ jsxs3("span", { className: "eth-inbox-message-list__from-group", children: [
+                    /* @__PURE__ */ jsx3("span", { className: "eth-inbox-message-list__unread", "aria-hidden": "true" }),
+                    /* @__PURE__ */ jsx3("span", { className: "eth-inbox-message-list__from", children: thread.from })
+                  ] }),
+                  /* @__PURE__ */ jsx3("time", { className: "eth-inbox-message-list__date", dateTime: thread.receivedAt, children: receivedAtLabel })
+                ] }),
+                /* @__PURE__ */ jsx3("strong", { className: "eth-inbox-message-list__subject", children: thread.subject }),
+                /* @__PURE__ */ jsx3("span", { className: "eth-inbox-message-list__preview", children: thread.preview }),
+                hasMeta ? /* @__PURE__ */ jsxs3("span", { className: "eth-inbox-message-list__meta", children: [
+                  thread.priority ? /* @__PURE__ */ jsx3(Badge2, { severity: prioritySeverity(thread.priority), children: thread.priority }) : null,
+                  thread.labels?.map((label) => /* @__PURE__ */ jsx3(Tag, { children: label }, label)),
+                  thread.status ? /* @__PURE__ */ jsx3(StatusDot, { status: thread.status, label: statusLabel(thread.status) }) : null
+                ] }) : null
+              ] })
+            ]
+          },
+          thread.id
+        );
+      }) : /* @__PURE__ */ jsx3(
+        "div",
+        {
+          className: "eth-inbox-message-list__empty",
+          role: "status",
+          "aria-label": "No message threads",
+          children: "No message threads"
+        }
+      )
+    }
+  );
+}
+
+// src/components/MessageThread.tsx
+import * as React2 from "react";
+import { Badge as Badge3, Button, StatusDot as StatusDot2 } from "@echothink-ui/core";
+
+// src/components/MessagePreview.tsx
+import * as React from "react";
+
+// src/components/AttachmentList.tsx
+import { IconButton } from "@echothink-ui/core";
+import { DocumentIcon, DownloadIcon, ViewIcon } from "@echothink-ui/icons";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function AttachmentList({
+  attachments = [],
+  onPreview,
+  onDownload,
+  className,
+  role,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  if (!attachments.length) return null;
+  return /* @__PURE__ */ jsx4(
+    "div",
+    {
+      ...props,
+      className: ["eth-inbox-attachments", className].filter(Boolean).join(" "),
+      "data-eth-component": "AttachmentList",
+      role: role ?? "list",
+      "aria-label": ariaLabel ?? "Message attachments",
+      children: attachments.map((attachment) => {
+        const typeLabel = attachmentTypeLabel(attachment);
+        const hasActions = Boolean(onPreview || onDownload);
+        return /* @__PURE__ */ jsxs4("div", { className: "eth-inbox-attachments__tile", role: "listitem", children: [
+          /* @__PURE__ */ jsx4("span", { className: "eth-inbox-attachments__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx4(DocumentIcon, { size: 18 }) }),
+          /* @__PURE__ */ jsxs4("div", { className: "eth-inbox-attachments__content", children: [
+            /* @__PURE__ */ jsx4("strong", { title: attachment.name, children: attachment.name }),
+            /* @__PURE__ */ jsxs4("span", { className: "eth-inbox-attachments__meta", children: [
+              /* @__PURE__ */ jsx4("span", { className: "eth-inbox-attachments__type", children: typeLabel }),
+              /* @__PURE__ */ jsx4("span", { children: attachment.mimeType }),
+              /* @__PURE__ */ jsx4("span", { children: formatBytes(attachment.size) })
+            ] })
+          ] }),
+          hasActions ? /* @__PURE__ */ jsxs4(
+            "div",
+            {
+              className: "eth-inbox-attachments__actions",
+              "aria-label": `Actions for ${attachment.name}`,
+              children: [
+                onPreview ? /* @__PURE__ */ jsx4(
+                  IconButton,
+                  {
+                    intent: "ghost",
+                    density: "compact",
+                    label: `Preview ${attachment.name}`,
+                    icon: /* @__PURE__ */ jsx4(ViewIcon, { size: 16 }),
+                    onClick: () => onPreview(attachment)
+                  }
+                ) : null,
+                onDownload ? /* @__PURE__ */ jsx4(
+                  IconButton,
+                  {
+                    intent: "ghost",
+                    density: "compact",
+                    label: `Download ${attachment.name}`,
+                    icon: /* @__PURE__ */ jsx4(DownloadIcon, { size: 16 }),
+                    onClick: () => onDownload(attachment)
+                  }
+                ) : null
+              ]
+            }
+          ) : null
+        ] }, attachment.id);
+      })
+    }
+  );
+}
+function attachmentTypeLabel(attachment) {
+  const extension = attachment.name.split(".").pop();
+  if (extension && extension !== attachment.name) return extension.slice(0, 4).toUpperCase();
+  const subtype = attachment.mimeType.split("/").pop();
+  return subtype ? subtype.slice(0, 4).toUpperCase() : "FILE";
+}
+
+// src/components/MessagePreview.tsx
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+function MessagePreview({
+  message,
+  showSubject = true,
+  onPreviewAttachment,
+  onDownloadAttachment,
+  className,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  ...props
+}) {
+  const subjectId = React.useId();
+  const attachmentsHeadingId = React.useId();
+  const visibleSubject = showSubject ? message.subject : void 0;
+  const labelledBy = ariaLabel ? ariaLabelledBy : ariaLabelledBy ?? (visibleSubject ? subjectId : void 0);
+  const computedAriaLabel = ariaLabel ?? (labelledBy ? void 0 : "Message preview");
+  const hasAttachments = Boolean(message.attachments?.length);
+  return /* @__PURE__ */ jsxs5(
+    "article",
+    {
+      ...props,
+      className: ["eth-inbox-message-preview", className].filter(Boolean).join(" "),
+      "data-eth-component": "MessagePreview",
+      "aria-label": computedAriaLabel,
+      "aria-labelledby": labelledBy,
+      children: [
+        /* @__PURE__ */ jsxs5("header", { className: "eth-inbox-message-preview__header", children: [
+          /* @__PURE__ */ jsxs5("div", { className: "eth-inbox-message-preview__heading", children: [
+            visibleSubject ? /* @__PURE__ */ jsx5("h3", { id: subjectId, children: visibleSubject }) : null,
+            /* @__PURE__ */ jsxs5("dl", { className: "eth-inbox-message-preview__recipients", "aria-label": "Message routing", children: [
+              /* @__PURE__ */ jsxs5("div", { children: [
+                /* @__PURE__ */ jsx5("dt", { children: "From" }),
+                /* @__PURE__ */ jsx5("dd", { children: message.from })
+              ] }),
+              /* @__PURE__ */ jsxs5("div", { children: [
+                /* @__PURE__ */ jsx5("dt", { children: "To" }),
+                /* @__PURE__ */ jsx5("dd", { children: formatRecipients(message.to) })
+              ] }),
+              message.cc?.length ? /* @__PURE__ */ jsxs5("div", { children: [
+                /* @__PURE__ */ jsx5("dt", { children: "Cc" }),
+                /* @__PURE__ */ jsx5("dd", { children: formatRecipients(message.cc) })
+              ] }) : null
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx5("time", { dateTime: message.date, children: formatDateTime(message.date) })
+        ] }),
+        /* @__PURE__ */ jsx5("div", { className: "eth-inbox-message-preview__body", children: /* @__PURE__ */ jsx5("p", { children: message.body }) }),
+        hasAttachments ? /* @__PURE__ */ jsxs5(
+          "section",
+          {
+            className: "eth-inbox-message-preview__attachments",
+            "aria-labelledby": attachmentsHeadingId,
+            children: [
+              /* @__PURE__ */ jsx5("h4", { id: attachmentsHeadingId, children: "Attachments" }),
+              /* @__PURE__ */ jsx5(
+                AttachmentList,
+                {
+                  attachments: message.attachments,
+                  onPreview: onPreviewAttachment,
+                  onDownload: onDownloadAttachment
+                }
+              )
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function formatRecipients(recipients) {
+  return recipients.length ? recipients.join(", ") : "No recipients";
+}
+
+// src/components/MessageThread.tsx
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+function MessageThread({
+  thread,
+  summaryRef,
+  status,
+  statusLabel: statusLabel2,
+  actions = [],
+  onPreviewAttachment,
+  onDownloadAttachment,
+  className,
+  ...props
+}) {
+  const messages = React2.useMemo(
+    () => [...thread?.messages ?? []].sort(
+      (a, b) => new Date(a.date).getTime() - new Date(b.date).getTime()
+    ),
+    [thread?.messages]
+  );
+  const older = messages.slice(0, Math.max(0, messages.length - 3));
+  const recent = messages.slice(Math.max(0, messages.length - 3));
+  const participantCount = countParticipants(messages);
+  const attachmentCount = messages.reduce(
+    (count, message) => count + (message.attachments?.length ?? 0),
+    0
+  );
+  const latestMessage = messages.at(-1);
+  const messageLabel = formatCount(messages.length, "message");
+  const participantLabel = formatCount(participantCount, "participant");
+  const attachmentLabel = formatCount(attachmentCount, "attachment");
+  return /* @__PURE__ */ jsxs6(
+    "article",
+    {
+      ...props,
+      className: `eth-inbox-thread ${className ?? ""}`,
+      "data-eth-component": "MessageThread",
+      children: [
+        /* @__PURE__ */ jsxs6("header", { className: "eth-inbox-thread__header", children: [
+          /* @__PURE__ */ jsxs6("div", { className: "eth-inbox-thread__heading", children: [
+            /* @__PURE__ */ jsx6("span", { className: "eth-inbox-thread__eyebrow", children: "Conversation thread" }),
+            /* @__PURE__ */ jsx6("h2", { children: thread?.subject ?? "Thread" }),
+            /* @__PURE__ */ jsxs6("ul", { className: "eth-inbox-thread__meta", "aria-label": "Thread metadata", children: [
+              /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsx6(Badge3, { severity: "neutral", children: messageLabel }) }),
+              /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsx6(Badge3, { severity: "neutral", children: participantLabel }) }),
+              attachmentCount ? /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsx6(Badge3, { severity: "info", children: attachmentLabel }) }) : null,
+              status ? /* @__PURE__ */ jsx6("li", { children: /* @__PURE__ */ jsx6(StatusDot2, { status, label: statusLabel2 ?? statusToLabel(status) }) }) : null,
+              latestMessage ? /* @__PURE__ */ jsxs6("li", { className: "eth-inbox-thread__updated", children: [
+                "Last activity",
+                " ",
+                /* @__PURE__ */ jsx6("time", { dateTime: latestMessage.date, children: formatDateTime(latestMessage.date) })
+              ] }) : null
+            ] })
+          ] }),
+          actions.length ? /* @__PURE__ */ jsx6("div", { className: "eth-inbox-thread__actions", role: "group", "aria-label": "Thread actions", children: actions.map((action) => /* @__PURE__ */ jsx6(
+            Button,
+            {
+              intent: action.intent ?? "secondary",
+              density: action.density ?? "compact",
+              disabled: action.disabled,
+              icon: action.icon,
+              onClick: action.onSelect,
+              children: action.label
+            },
+            action.id
+          )) }) : null
+        ] }),
+        summaryRef ? /* @__PURE__ */ jsxs6("aside", { className: "eth-inbox-thread__summary", "aria-label": "Thread summary", children: [
+          /* @__PURE__ */ jsx6("span", { className: "eth-inbox-thread__summary-label", children: "Thread summary" }),
+          /* @__PURE__ */ jsx6("div", { className: "eth-inbox-thread__summary-body", children: summaryRef })
+        ] }) : null,
+        !messages.length ? /* @__PURE__ */ jsxs6("div", { className: "eth-inbox-thread__empty", role: "status", children: [
+          /* @__PURE__ */ jsx6("strong", { children: "No messages in this thread" }),
+          /* @__PURE__ */ jsx6("span", { children: "Replies, summaries, and attachment activity will appear here." })
+        ] }) : null,
+        older.length ? /* @__PURE__ */ jsxs6("details", { className: "eth-inbox-thread__older", children: [
+          /* @__PURE__ */ jsx6("summary", { children: formatCount(older.length, "older message") }),
+          older.map((message) => /* @__PURE__ */ jsx6(
+            MessagePreview,
+            {
+              message,
+              showSubject: false,
+              onPreviewAttachment,
+              onDownloadAttachment
+            },
+            message.id
+          ))
+        ] }) : null,
+        /* @__PURE__ */ jsx6("div", { className: "eth-inbox-thread__messages", children: recent.map((message) => /* @__PURE__ */ jsx6(
+          MessagePreview,
+          {
+            message,
+            showSubject: false,
+            onPreviewAttachment,
+            onDownloadAttachment
+          },
+          message.id
+        )) })
+      ]
+    }
+  );
+}
+function countParticipants(messages) {
+  const participants = /* @__PURE__ */ new Set();
+  messages.forEach((message) => {
+    participants.add(message.from);
+    message.to.forEach((recipient) => participants.add(recipient));
+    message.cc?.forEach((recipient) => participants.add(recipient));
+    message.bcc?.forEach((recipient) => participants.add(recipient));
+  });
+  return participants.size;
+}
+function formatCount(value, singular) {
+  return `${value} ${value === 1 ? singular : `${singular}s`}`;
+}
+function statusToLabel(status) {
+  return status.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join(" ");
+}
+
+// src/components/MessageComposer.tsx
+import * as React3 from "react";
+import { Button as Button2, FormField, Textarea, TextInput } from "@echothink-ui/core";
+import { DocumentIcon as DocumentIcon2, MessageIcon } from "@echothink-ui/icons";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+function MessageComposer({
+  draft = {},
+  onChange,
+  onSend,
+  onDiscard,
+  onAttach,
+  recipients,
+  attachments,
+  statusText,
+  className,
+  ...props
+}) {
+  const [localDraft, setLocalDraft] = React3.useState(draft);
+  React3.useEffect(() => setLocalDraft(draft), [draft]);
+  const update = (next) => {
+    setLocalDraft(next);
+    onChange?.(next);
+  };
+  const draftAttachments = localDraft.attachments ?? [];
+  const hasAttachmentsRegion = Boolean(attachments || draftAttachments.length || onAttach);
+  return /* @__PURE__ */ jsxs7(
+    "form",
+    {
+      ...props,
+      className: ["eth-inbox-composer", className].filter(Boolean).join(" "),
+      "data-eth-component": "MessageComposer",
+      onSubmit: (event) => {
+        event.preventDefault();
+        onSend?.(localDraft);
+      },
+      children: [
+        /* @__PURE__ */ jsxs7("div", { className: "eth-inbox-composer__fields", children: [
+          recipients ?? /* @__PURE__ */ jsxs7("div", { className: "eth-inbox-composer__address-fields", role: "group", "aria-label": "Recipients", children: [
+            /* @__PURE__ */ jsx7(
+              FormField,
+              {
+                className: "eth-inbox-composer__field eth-inbox-composer__field--address",
+                label: "To",
+                children: /* @__PURE__ */ jsx7(
+                  TextInput,
+                  {
+                    density: "compact",
+                    placeholder: "name@company.com",
+                    value: listToInput(localDraft.to),
+                    onChange: (event) => update({ ...localDraft, to: inputToList(event.currentTarget.value) })
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx7(
+              FormField,
+              {
+                className: "eth-inbox-composer__field eth-inbox-composer__field--address",
+                label: "CC",
+                children: /* @__PURE__ */ jsx7(
+                  TextInput,
+                  {
+                    density: "compact",
+                    placeholder: "Optional",
+                    value: listToInput(localDraft.cc),
+                    onChange: (event) => update({ ...localDraft, cc: inputToList(event.currentTarget.value) })
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsx7(
+              FormField,
+              {
+                className: "eth-inbox-composer__field eth-inbox-composer__field--address",
+                label: "BCC",
+                children: /* @__PURE__ */ jsx7(
+                  TextInput,
+                  {
+                    density: "compact",
+                    placeholder: "Optional",
+                    value: listToInput(localDraft.bcc),
+                    onChange: (event) => update({ ...localDraft, bcc: inputToList(event.currentTarget.value) })
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx7(
+            FormField,
+            {
+              className: "eth-inbox-composer__field eth-inbox-composer__field--subject",
+              label: "Subject",
+              children: /* @__PURE__ */ jsx7(
+                TextInput,
+                {
+                  density: "compact",
+                  value: localDraft.subject ?? "",
+                  onChange: (event) => update({ ...localDraft, subject: event.currentTarget.value })
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            FormField,
+            {
+              className: "eth-inbox-composer__field eth-inbox-composer__field--body",
+              label: "Body",
+              children: /* @__PURE__ */ jsx7(
+                Textarea,
+                {
+                  value: localDraft.body ?? "",
+                  rows: 10,
+                  onChange: (event) => update({ ...localDraft, body: event.currentTarget.value })
+                }
+              )
+            }
+          )
+        ] }),
+        hasAttachmentsRegion ? /* @__PURE__ */ jsxs7("section", { className: "eth-inbox-composer__attachments", "aria-label": "Draft attachments", children: [
+          /* @__PURE__ */ jsxs7("div", { className: "eth-inbox-composer__attachments-header", children: [
+            /* @__PURE__ */ jsx7("span", { children: "Attachments" }),
+            onAttach ? /* @__PURE__ */ jsx7(
+              Button2,
+              {
+                type: "button",
+                intent: "tertiary",
+                density: "compact",
+                icon: /* @__PURE__ */ jsx7(DocumentIcon2, { size: 16 }),
+                onClick: onAttach,
+                children: "Attach file"
+              }
+            ) : null
+          ] }),
+          attachments ?? (draftAttachments.length ? /* @__PURE__ */ jsx7(AttachmentList, { attachments: draftAttachments }) : /* @__PURE__ */ jsx7("p", { className: "eth-inbox-composer__empty-attachments", children: "No attachments added" }))
+        ] }) : null,
+        /* @__PURE__ */ jsxs7("div", { className: "eth-inbox-composer__footer", children: [
+          statusText ? /* @__PURE__ */ jsx7("p", { className: "eth-inbox-composer__status", children: statusText }) : null,
+          /* @__PURE__ */ jsxs7("div", { className: "eth-inbox-composer__actions", children: [
+            /* @__PURE__ */ jsx7(Button2, { type: "submit", icon: /* @__PURE__ */ jsx7(MessageIcon, { size: 16 }), children: "Send" }),
+            /* @__PURE__ */ jsx7(Button2, { type: "button", intent: "tertiary", onClick: onDiscard, children: "Discard" })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/AttachmentPreview.tsx
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+function AttachmentPreview({
+  attachment,
+  children,
+  className,
+  ...props
+}) {
+  const kind = getPreviewKind(attachment);
+  const previewSource = attachment?.previewUrl ?? attachment?.src;
+  const hasCustomPreview = children !== void 0 && children !== null;
+  const label = attachment ? `Attachment preview for ${attachment.name}` : "Attachment preview";
+  return /* @__PURE__ */ jsxs8(
+    "section",
+    {
+      ...props,
+      "aria-label": props["aria-label"] ?? label,
+      className: `eth-inbox-attachment-preview ${className ?? ""}`,
+      "data-eth-component": "AttachmentPreview",
+      children: [
+        attachment ? /* @__PURE__ */ jsxs8("header", { className: "eth-inbox-attachment-preview__header", children: [
+          /* @__PURE__ */ jsxs8("div", { className: "eth-inbox-attachment-preview__file", children: [
+            /* @__PURE__ */ jsx8(
+              "span",
+              {
+                className: "eth-inbox-attachment-preview__glyph",
+                "data-kind": kind,
+                "aria-hidden": "true",
+                children: kindToken(kind)
+              }
+            ),
+            /* @__PURE__ */ jsxs8("div", { className: "eth-inbox-attachment-preview__summary", children: [
+              /* @__PURE__ */ jsx8("strong", { title: attachment.name, children: attachment.name }),
+              /* @__PURE__ */ jsxs8("span", { children: [
+                attachment.mimeType,
+                " - ",
+                formatBytes(attachment.size)
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx8("span", { className: "eth-inbox-attachment-preview__state", children: previewStateLabel(kind) })
+        ] }) : null,
+        /* @__PURE__ */ jsx8(
+          "div",
+          {
+            className: `eth-inbox-attachment-preview__body eth-inbox-attachment-preview__body--${kind}`,
+            children: hasCustomPreview ? children : renderDefaultPreview(attachment, kind, previewSource)
+          }
+        )
+      ]
+    }
+  );
+}
+function getPreviewKind(attachment) {
+  if (!attachment) return "empty";
+  const mimeType = attachment.mimeType.toLowerCase();
+  const name = attachment.name.toLowerCase();
+  if (mimeType === "application/pdf" || name.endsWith(".pdf")) return "pdf";
+  if (mimeType.startsWith("image/")) return "image";
+  if (mimeType.includes("spreadsheet") || mimeType.includes("csv") || name.endsWith(".csv") || name.endsWith(".xls") || name.endsWith(".xlsx")) {
+    return "spreadsheet";
+  }
+  if (mimeType.startsWith("text/") || ["application/json", "application/xml", "application/yaml"].includes(mimeType) || name.endsWith(".md")) {
+    return "text";
+  }
+  if (mimeType.includes("zip") || mimeType.includes("compressed") || name.endsWith(".zip") || name.endsWith(".gz")) {
+    return "archive";
+  }
+  return "file";
+}
+function kindToken(kind) {
+  if (kind === "pdf") return "PDF";
+  if (kind === "image") return "IMG";
+  if (kind === "text") return "TXT";
+  if (kind === "spreadsheet") return "CSV";
+  if (kind === "archive") return "ZIP";
+  return "FILE";
+}
+function previewStateLabel(kind) {
+  if (kind === "archive" || kind === "file") return "Preview unavailable";
+  return "Inline preview";
+}
+function renderDefaultPreview(attachment, kind, previewSource) {
+  if (!attachment) {
+    return /* @__PURE__ */ jsxs8("div", { className: "eth-inbox-attachment-preview__empty", children: [
+      /* @__PURE__ */ jsx8("strong", { children: "No attachment selected" }),
+      /* @__PURE__ */ jsx8("span", { children: "PDF, image, text, and spreadsheet files can be previewed inline." })
+    ] });
+  }
+  if (kind === "image") {
+    return previewSource ? /* @__PURE__ */ jsx8(
+      "img",
+      {
+        className: "eth-inbox-attachment-preview__image",
+        src: previewSource,
+        alt: `${attachment.name} preview`
+      }
+    ) : /* @__PURE__ */ jsxs8(
+      "div",
+      {
+        className: "eth-inbox-attachment-preview__image-frame",
+        role: "img",
+        "aria-label": `${attachment.name} image preview`,
+        children: [
+          /* @__PURE__ */ jsx8("span", {}),
+          /* @__PURE__ */ jsx8("span", {})
+        ]
+      }
+    );
+  }
+  if (kind === "text") {
+    return /* @__PURE__ */ jsx8(
+      "div",
+      {
+        className: "eth-inbox-attachment-preview__text",
+        role: "img",
+        "aria-label": `${attachment.name} text preview`,
+        children: Array.from({ length: 9 }, (_, index) => /* @__PURE__ */ jsx8("span", {}, index))
+      }
+    );
+  }
+  if (kind === "spreadsheet") {
+    return /* @__PURE__ */ jsx8(
+      "div",
+      {
+        className: "eth-inbox-attachment-preview__sheet",
+        role: "img",
+        "aria-label": `${attachment.name} spreadsheet preview`,
+        children: Array.from({ length: 20 }, (_, index) => /* @__PURE__ */ jsx8("span", {}, index))
+      }
+    );
+  }
+  if (kind === "pdf") {
+    return /* @__PURE__ */ jsxs8(
+      "div",
+      {
+        className: "eth-inbox-attachment-preview__document",
+        role: "img",
+        "aria-label": `${attachment.name} PDF preview`,
+        children: [
+          /* @__PURE__ */ jsxs8("div", { className: "eth-inbox-attachment-preview__document-bar", children: [
+            /* @__PURE__ */ jsx8("span", { children: attachment.mimeType }),
+            /* @__PURE__ */ jsx8("span", { children: "Page 1" })
+          ] }),
+          /* @__PURE__ */ jsxs8("div", { className: "eth-inbox-attachment-preview__page", children: [
+            /* @__PURE__ */ jsx8("strong", { children: attachment.name.replace(/\.[^.]+$/, "") || attachment.name }),
+            /* @__PURE__ */ jsx8("span", {}),
+            /* @__PURE__ */ jsx8("span", {}),
+            /* @__PURE__ */ jsx8("span", {}),
+            /* @__PURE__ */ jsx8("span", {}),
+            /* @__PURE__ */ jsx8("span", {})
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs8("div", { className: "eth-inbox-attachment-preview__empty", children: [
+    /* @__PURE__ */ jsx8("strong", { children: "Preview unavailable" }),
+    /* @__PURE__ */ jsxs8("span", { children: [
+      attachment.mimeType,
+      " files are kept as attachments for download or external review."
+    ] })
+  ] });
+}
+
+// src/components/RecipientPicker.tsx
+import * as React4 from "react";
+import { Button as Button3, SearchInput, Tag as Tag2, TextInput as TextInput2 } from "@echothink-ui/core";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+function RecipientPicker({
+  value = [],
+  onChange,
+  onSearch,
+  suggestions = [],
+  defaultSuggestionsOpen = false,
+  className,
+  ...props
+}) {
+  const listboxId = React4.useId().replace(/:/g, "");
+  const [query, setQuery] = React4.useState("");
+  const [manualValue, setManualValue] = React4.useState("");
+  const [suggestionsOpen, setSuggestionsOpen] = React4.useState(defaultSuggestionsOpen);
+  const normalizedQuery = query.trim().toLocaleLowerCase();
+  const visibleSuggestions = normalizedQuery ? suggestions.filter(
+    (suggestion) => [suggestion.label, suggestion.email].some(
+      (field) => field.toLocaleLowerCase().includes(normalizedQuery)
+    )
+  ) : suggestions;
+  const showSuggestions = suggestionsOpen && (visibleSuggestions.length > 0 || Boolean(query));
+  const add = (email) => {
+    const normalizedEmail = email.trim();
+    if (!normalizedEmail || value.includes(normalizedEmail)) return false;
+    onChange?.([...value, normalizedEmail]);
+    setManualValue("");
+    setQuery("");
+    return true;
+  };
+  const updateQuery = (nextQuery) => {
+    setQuery(nextQuery);
+    onSearch?.(nextQuery);
+    setSuggestionsOpen(Boolean(nextQuery || suggestions.length));
+  };
+  return /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      ...props,
+      className: `eth-inbox-recipient-picker ${className ?? ""}`,
+      "data-eth-component": "RecipientPicker",
+      onBlur: (event) => {
+        props.onBlur?.(event);
+        if (!event.currentTarget.contains(event.relatedTarget)) {
+          setSuggestionsOpen(false);
+        }
+      },
+      onKeyDown: (event) => {
+        props.onKeyDown?.(event);
+        if (!event.defaultPrevented && event.key === "Escape") {
+          setSuggestionsOpen(false);
+        }
+      },
+      children: [
+        /* @__PURE__ */ jsxs9("div", { className: "eth-inbox-recipient-picker__selected", "aria-label": "Selected recipients", children: [
+          /* @__PURE__ */ jsx9("span", { className: "eth-inbox-recipient-picker__label", children: "To" }),
+          /* @__PURE__ */ jsx9("div", { className: "eth-inbox-recipient-picker__chips", children: value.length ? value.map((email) => /* @__PURE__ */ jsx9(
+            Tag2,
+            {
+              removable: true,
+              onRemove: () => onChange?.(value.filter((item) => item !== email)),
+              children: email
+            },
+            email
+          )) : /* @__PURE__ */ jsx9("span", { className: "eth-inbox-recipient-picker__placeholder", children: "No recipients selected" }) })
+        ] }),
+        /* @__PURE__ */ jsx9(
+          SearchInput,
+          {
+            "aria-controls": showSuggestions ? listboxId : void 0,
+            "aria-expanded": showSuggestions,
+            "aria-haspopup": "listbox",
+            className: "eth-inbox-recipient-picker__search",
+            labelText: "Search recipients",
+            value: query,
+            placeholder: "Search recipients",
+            onFocus: () => setSuggestionsOpen(Boolean(suggestions.length)),
+            onChange: (event) => updateQuery(event.currentTarget.value),
+            onClear: () => {
+              updateQuery("");
+              setSuggestionsOpen(false);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs9("div", { className: "eth-inbox-recipient-picker__manual", children: [
+          /* @__PURE__ */ jsx9(
+            TextInput2,
+            {
+              className: "eth-inbox-recipient-picker__manual-input",
+              density: "compact",
+              hideLabel: true,
+              labelText: "Recipient email",
+              type: "email",
+              value: manualValue,
+              placeholder: "name@company.com",
+              onChange: (event) => setManualValue(event.currentTarget.value),
+              onKeyDown: (event) => {
+                if (event.key === "Enter") {
+                  event.preventDefault();
+                  add(manualValue);
+                }
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx9(
+            Button3,
+            {
+              density: "compact",
+              disabled: !manualValue.trim(),
+              intent: "primary",
+              onClick: () => add(manualValue),
+              children: "Add recipient"
+            }
+          )
+        ] }),
+        showSuggestions ? /* @__PURE__ */ jsxs9(
+          "div",
+          {
+            className: "eth-inbox-recipient-picker__suggestions",
+            id: listboxId,
+            role: "listbox",
+            "aria-label": "Recipient suggestions",
+            "aria-multiselectable": true,
+            children: [
+              /* @__PURE__ */ jsxs9("div", { className: "eth-inbox-recipient-picker__suggestions-header", children: [
+                /* @__PURE__ */ jsx9("span", { children: "Suggested recipients" }),
+                /* @__PURE__ */ jsxs9("strong", { children: [
+                  visibleSuggestions.length,
+                  " result",
+                  visibleSuggestions.length === 1 ? "" : "s"
+                ] })
+              ] }),
+              visibleSuggestions.length ? /* @__PURE__ */ jsx9("ul", { className: "eth-inbox-recipient-picker__suggestions-list", children: visibleSuggestions.map((suggestion) => {
+                const isSelected = value.includes(suggestion.email);
+                return /* @__PURE__ */ jsx9("li", { children: /* @__PURE__ */ jsxs9(
+                  "button",
+                  {
+                    type: "button",
+                    role: "option",
+                    "aria-selected": isSelected,
+                    "aria-disabled": isSelected ? true : void 0,
+                    onClick: () => add(suggestion.email),
+                    children: [
+                      /* @__PURE__ */ jsxs9("span", { className: "eth-inbox-recipient-picker__suggestion-copy", children: [
+                        /* @__PURE__ */ jsx9("strong", { children: suggestion.label }),
+                        /* @__PURE__ */ jsx9("span", { children: suggestion.email })
+                      ] }),
+                      /* @__PURE__ */ jsx9("span", { className: "eth-inbox-recipient-picker__suggestion-status", children: isSelected ? "Selected" : "Add" })
+                    ]
+                  }
+                ) }, suggestion.id);
+              }) }) : /* @__PURE__ */ jsx9("p", { className: "eth-inbox-recipient-picker__empty", children: "No matching recipients" })
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+// src/components/LabelManager.tsx
+import * as React5 from "react";
+import { Button as Button4, FormField as FormField2, Panel, TextInput as TextInput3 } from "@echothink-ui/core";
+import { EditIcon, PlusIcon } from "@echothink-ui/icons";
+import { Fragment, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
+function LabelManager({
+  labels = [],
+  onCreate,
+  onRename,
+  onDelete,
+  className,
+  ...props
+}) {
+  const [newLabel, setNewLabel] = React5.useState("");
+  const [edits, setEdits] = React5.useState({});
+  const trackedLabels = labels.filter((label) => typeof label.count === "number");
+  const trackedMessageCount = trackedLabels.reduce((total, label) => total + (label.count ?? 0), 0);
+  const labelSummary = `${labels.length.toLocaleString()} ${labels.length === 1 ? "label" : "labels"}`;
+  const subtitle = labels.length ? trackedLabels.length ? `${labelSummary} \xB7 ${trackedMessageCount.toLocaleString()} tracked messages` : `${labelSummary} configured for mailbox categories and automation tags.` : "Create categories and automation tags for mailbox workflows.";
+  const submitNewLabel = (event) => {
+    event.preventDefault();
+    const nextLabel = newLabel.trim();
+    if (!nextLabel || !onCreate) return;
+    onCreate(nextLabel);
+    setNewLabel("");
+  };
+  return /* @__PURE__ */ jsxs10(
+    Panel,
+    {
+      ...props,
+      className: `eth-inbox-label-manager ${className ?? ""}`,
+      title: "Labels",
+      subtitle,
+      "data-eth-component": "LabelManager",
+      children: [
+        labels.length ? /* @__PURE__ */ jsxs10("div", { className: "eth-inbox-label-manager__list", role: "table", "aria-label": "Managed labels", children: [
+          /* @__PURE__ */ jsxs10("div", { className: "eth-inbox-label-manager__table-head", role: "row", children: [
+            /* @__PURE__ */ jsx10("span", { role: "columnheader", children: "Label" }),
+            /* @__PURE__ */ jsx10("span", { role: "columnheader", children: "Messages" }),
+            /* @__PURE__ */ jsx10("span", { role: "columnheader", children: "Actions" })
+          ] }),
+          labels.map((label) => {
+            const draft = edits[label.id] ?? label.label;
+            const trimmedDraft = draft.trim();
+            const countLabel = typeof label.count === "number" ? `${label.count.toLocaleString()} ${label.count === 1 ? "message" : "messages"}` : "Message count not tracked";
+            return /* @__PURE__ */ jsxs10("div", { className: "eth-inbox-label-manager__row", role: "row", children: [
+              /* @__PURE__ */ jsx10("div", { className: "eth-inbox-label-manager__name-cell", role: "cell", children: /* @__PURE__ */ jsx10(
+                TextInput3,
+                {
+                  "aria-label": `Label name for ${label.label}`,
+                  density: "compact",
+                  placeholder: "Label name",
+                  value: draft,
+                  onChange: (event) => setEdits((current) => ({
+                    ...current,
+                    [label.id]: event.currentTarget.value
+                  }))
+                }
+              ) }),
+              /* @__PURE__ */ jsx10(
+                "div",
+                {
+                  className: "eth-inbox-label-manager__count-cell",
+                  role: "cell",
+                  "aria-label": countLabel,
+                  children: typeof label.count === "number" ? /* @__PURE__ */ jsxs10(Fragment, { children: [
+                    /* @__PURE__ */ jsx10("strong", { children: label.count.toLocaleString() }),
+                    /* @__PURE__ */ jsx10("span", { children: label.count === 1 ? "message" : "messages" })
+                  ] }) : /* @__PURE__ */ jsx10("span", { className: "eth-inbox-label-manager__count-muted", children: "Not tracked" })
+                }
+              ),
+              /* @__PURE__ */ jsxs10("div", { className: "eth-inbox-label-manager__actions", role: "cell", children: [
+                /* @__PURE__ */ jsx10(
+                  Button4,
+                  {
+                    density: "compact",
+                    disabled: !onRename || !trimmedDraft,
+                    icon: /* @__PURE__ */ jsx10(EditIcon, { size: 16 }),
+                    intent: "secondary",
+                    onClick: () => {
+                      if (trimmedDraft) onRename?.(label.id, trimmedDraft);
+                    },
+                    children: "Rename"
+                  }
+                ),
+                /* @__PURE__ */ jsx10(
+                  Button4,
+                  {
+                    density: "compact",
+                    disabled: !onDelete,
+                    intent: "danger",
+                    onClick: () => onDelete?.(label.id),
+                    children: "Delete"
+                  }
+                )
+              ] })
+            ] }, label.id);
+          })
+        ] }) : /* @__PURE__ */ jsx10("p", { className: "eth-inbox-label-manager__empty", children: "No labels configured. Create a label to route mailbox views and automation rules." }),
+        /* @__PURE__ */ jsxs10("form", { className: "eth-inbox-label-manager__create", onSubmit: submitNewLabel, children: [
+          /* @__PURE__ */ jsx10(
+            FormField2,
+            {
+              label: "New label",
+              helperText: "Use concise names for categories, filters, and automation rules.",
+              children: /* @__PURE__ */ jsx10(
+                TextInput3,
+                {
+                  density: "compact",
+                  placeholder: "e.g. renewal-risk",
+                  value: newLabel,
+                  onChange: (event) => setNewLabel(event.currentTarget.value)
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx10(
+            Button4,
+            {
+              disabled: !onCreate || !newLabel.trim(),
+              icon: /* @__PURE__ */ jsx10(PlusIcon, { size: 16 }),
+              type: "submit",
+              children: "Create"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/MessageSearch.tsx
+import { IconButton as IconButton2, SearchInput as SearchInput2 } from "@echothink-ui/core";
+import { ChevronRightIcon } from "@echothink-ui/icons";
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+function MessageSearch({
+  value = "",
+  onChange,
+  placeholder = "Search messages",
+  resultCount,
+  activeResultIndex = 0,
+  onPreviousResult,
+  onNextResult,
+  className,
+  role,
+  "aria-label": ariaLabel,
+  ...props
+}) {
+  const hasResultCount = typeof resultCount === "number";
+  const normalizedResultCount = hasResultCount && Number.isFinite(resultCount) ? Math.max(0, Math.trunc(resultCount)) : 0;
+  const normalizedResultIndex = Number.isFinite(activeResultIndex) ? Math.trunc(activeResultIndex) : 0;
+  const hasResults = normalizedResultCount > 0;
+  const currentResult = hasResults ? Math.min(Math.max(normalizedResultIndex, 0), normalizedResultCount - 1) + 1 : 0;
+  const canGoPrevious = hasResults && currentResult > 1 && Boolean(onPreviousResult);
+  const canGoNext = hasResults && currentResult < normalizedResultCount && Boolean(onNextResult);
+  const resultNoun = normalizedResultCount === 1 ? "result" : "results";
+  const resultLabel = hasResults ? `${currentResult} of ${normalizedResultCount} ${resultNoun}` : "No results";
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      ...props,
+      className: ["eth-inbox-search", className].filter(Boolean).join(" "),
+      "data-eth-component": "MessageSearch",
+      role: role ?? "search",
+      "aria-label": ariaLabel ?? "Message search",
+      children: [
+        /* @__PURE__ */ jsx11("div", { className: "eth-inbox-search__input", children: /* @__PURE__ */ jsx11(
+          SearchInput2,
+          {
+            value,
+            placeholder,
+            labelText: placeholder,
+            onChange: (event) => onChange?.(event.currentTarget.value),
+            onClear: () => onChange?.(""),
+            className: "eth-inbox-search__control"
+          }
+        ) }),
+        hasResultCount ? /* @__PURE__ */ jsxs11("div", { className: "eth-inbox-search__results", children: [
+          /* @__PURE__ */ jsx11("span", { className: "eth-inbox-search__count", "aria-live": "polite", children: resultLabel }),
+          /* @__PURE__ */ jsxs11(
+            "div",
+            {
+              className: "eth-inbox-search__nav",
+              role: "group",
+              "aria-label": "Search result navigation",
+              children: [
+                /* @__PURE__ */ jsx11(
+                  IconButton2,
+                  {
+                    className: "eth-inbox-search__nav-button eth-inbox-search__nav-button--previous",
+                    density: "compact",
+                    intent: "ghost",
+                    label: "Previous result",
+                    icon: /* @__PURE__ */ jsx11(ChevronRightIcon, { size: 16 }),
+                    disabled: !canGoPrevious,
+                    onClick: onPreviousResult
+                  }
+                ),
+                /* @__PURE__ */ jsx11(
+                  IconButton2,
+                  {
+                    className: "eth-inbox-search__nav-button",
+                    density: "compact",
+                    intent: "ghost",
+                    label: "Next result",
+                    icon: /* @__PURE__ */ jsx11(ChevronRightIcon, { size: 16 }),
+                    disabled: !canGoNext,
+                    onClick: onNextResult
+                  }
+                )
+              ]
+            }
+          )
+        ] }) : null
+      ]
+    }
+  );
+}
+
+// src/components/MessageFilterBar.tsx
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+var filterKindLabels = {
+  priority: "Priority",
+  sender: "Sender",
+  date: "Date",
+  label: "Label",
+  unread: "Read",
+  status: "Status"
+};
+function MessageFilterBar({
+  filters = [],
+  onToggle,
+  className,
+  "aria-label": ariaLabel = "Message filters",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx12(
+    "div",
+    {
+      ...props,
+      className: `eth-inbox-filter-bar ${className ?? ""}`,
+      "data-eth-component": "MessageFilterBar",
+      role: "toolbar",
+      "aria-label": ariaLabel,
+      children: filters.map((filter) => {
+        const kindLabel = filter.kind ? filterKindLabels[filter.kind] : void 0;
+        const accessibleLabel = kindLabel ? `${kindLabel}: ${filter.label}` : filter.label;
+        return /* @__PURE__ */ jsxs12(
+          "button",
+          {
+            type: "button",
+            className: `eth-inbox-filter-bar__chip ${filter.active ? "eth-inbox-filter-bar__chip--active" : ""} ${filter.disabled ? "eth-inbox-filter-bar__chip--disabled" : ""}`,
+            "aria-label": accessibleLabel,
+            "aria-pressed": Boolean(filter.active),
+            "data-filter-kind": filter.kind,
+            disabled: filter.disabled,
+            onClick: () => onToggle?.(filter.id, !Boolean(filter.active)),
+            children: [
+              kindLabel ? /* @__PURE__ */ jsx12("span", { className: "eth-inbox-filter-bar__kind", "aria-hidden": "true", children: kindLabel }) : null,
+              /* @__PURE__ */ jsx12("span", { className: "eth-inbox-filter-bar__label", children: filter.label })
+            ]
+          },
+          filter.id
+        );
+      })
+    }
+  );
+}
+
+// src/components/PriorityInboxView.tsx
+import * as React6 from "react";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
+function PriorityInboxView({
+  groups = [],
+  selectedThreadId,
+  onSelect,
+  className,
+  ...props
+}) {
+  const hasGroups = groups.length > 0;
+  const idBase = React6.useId();
+  return /* @__PURE__ */ jsx13(
+    "div",
+    {
+      ...props,
+      className: `eth-inbox-priority ${className ?? ""}`,
+      "data-eth-component": "PriorityInboxView",
+      children: hasGroups ? groups.map((group, index) => {
+        const headingId = `${idBase}-group-${index}-heading`;
+        return /* @__PURE__ */ jsxs13(
+          "section",
+          {
+            className: "eth-inbox-priority__group",
+            "aria-labelledby": headingId,
+            children: [
+              /* @__PURE__ */ jsxs13("header", { className: "eth-inbox-priority__group-header", children: [
+                /* @__PURE__ */ jsxs13("div", { className: "eth-inbox-priority__heading", children: [
+                  /* @__PURE__ */ jsx13("h3", { id: headingId, children: group.title }),
+                  group.description ? /* @__PURE__ */ jsx13("p", { className: "eth-inbox-priority__description", children: group.description }) : null
+                ] }),
+                /* @__PURE__ */ jsx13("span", { className: "eth-inbox-priority__count", children: formatThreadCount(group.threads.length) })
+              ] }),
+              /* @__PURE__ */ jsx13(
+                MessageList,
+                {
+                  threads: group.threads,
+                  selectedThreadId,
+                  onSelect
+                }
+              )
+            ]
+          },
+          group.id
+        );
+      }) : /* @__PURE__ */ jsx13("div", { className: "eth-inbox-priority__empty", role: "status", "aria-label": "No priority threads", children: "No priority threads" })
+    }
+  );
+}
+function formatThreadCount(count) {
+  return `${count} ${count === 1 ? "thread" : "threads"}`;
+}
+
+// src/components/EmailAutomationRulePanel.tsx
+import { Badge as Badge4, Button as Button5, Panel as Panel2, Toggle } from "@echothink-ui/core";
+import { EditIcon as EditIcon2 } from "@echothink-ui/icons";
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+function EmailAutomationRulePanel({
+  rules = [],
+  onToggle,
+  onEdit,
+  className,
+  ...props
+}) {
+  const enabledCount = rules.reduce((count, rule) => count + (rule.enabled ? 1 : 0), 0);
+  const ruleCountLabel = `${rules.length} automation ${rules.length === 1 ? "rule" : "rules"}`;
+  const subtitle = rules.length ? `${enabledCount} of ${ruleCountLabel} enabled` : "Create routing, drafting, and mailbox automation rules.";
+  return /* @__PURE__ */ jsx14(
+    Panel2,
+    {
+      ...props,
+      className: `eth-inbox-rules ${className ?? ""}`,
+      title: "Automation rules",
+      subtitle,
+      "data-eth-component": "EmailAutomationRulePanel",
+      children: rules.length ? /* @__PURE__ */ jsx14("div", { className: "eth-inbox-rules__list", role: "list", children: rules.map((rule) => {
+        const headingId = `eth-inbox-rule-${rule.id.replace(/[^a-zA-Z0-9_-]/g, "-")}`;
+        return /* @__PURE__ */ jsxs14(
+          "article",
+          {
+            "aria-labelledby": headingId,
+            className: `eth-inbox-rules__item ${rule.enabled ? "eth-inbox-rules__item--enabled" : "eth-inbox-rules__item--paused"}`,
+            role: "listitem",
+            children: [
+              /* @__PURE__ */ jsxs14("div", { className: "eth-inbox-rules__content", children: [
+                /* @__PURE__ */ jsxs14("header", { className: "eth-inbox-rules__item-header", children: [
+                  /* @__PURE__ */ jsx14("h4", { id: headingId, children: rule.name }),
+                  /* @__PURE__ */ jsx14(Badge4, { severity: rule.enabled ? "success" : "neutral", children: rule.enabled ? "Enabled" : "Paused" })
+                ] }),
+                /* @__PURE__ */ jsxs14("dl", { className: "eth-inbox-rules__definition", children: [
+                  /* @__PURE__ */ jsxs14("div", { children: [
+                    /* @__PURE__ */ jsx14("dt", { children: "Trigger" }),
+                    /* @__PURE__ */ jsx14("dd", { children: rule.conditions })
+                  ] }),
+                  /* @__PURE__ */ jsxs14("div", { children: [
+                    /* @__PURE__ */ jsx14("dt", { children: "Action" }),
+                    /* @__PURE__ */ jsx14("dd", { children: rule.actions })
+                  ] })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs14("div", { className: "eth-inbox-rules__controls", children: [
+                /* @__PURE__ */ jsx14(
+                  Toggle,
+                  {
+                    checked: rule.enabled,
+                    className: "eth-inbox-rules__toggle",
+                    disabled: !onToggle,
+                    hideLabel: true,
+                    label: `Automation status for ${rule.name}`,
+                    offLabel: "Paused",
+                    onChange: (event) => onToggle?.(rule.id, event.currentTarget.checked),
+                    onLabel: "Enabled"
+                  }
+                ),
+                /* @__PURE__ */ jsx14(
+                  Button5,
+                  {
+                    "aria-label": `Edit ${rule.name}`,
+                    density: "compact",
+                    disabled: !onEdit,
+                    icon: /* @__PURE__ */ jsx14(EditIcon2, { size: 16 }),
+                    intent: "secondary",
+                    onClick: () => onEdit?.(rule.id),
+                    children: "Edit"
+                  }
+                )
+              ] })
+            ]
+          },
+          rule.id
+        );
+      }) }) : /* @__PURE__ */ jsx14("p", { className: "eth-inbox-rules__empty", children: "No automation rules configured." })
+    }
+  );
+}
+
+// src/components/AgentDraftReviewPanel.tsx
+import { Badge as Badge5, Button as Button6, Panel as Panel3, Tag as Tag3 } from "@echothink-ui/core";
+import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+function formatDraftTimestamp(value) {
+  if (!value) return null;
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  return new Intl.DateTimeFormat("en-US", {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  }).format(date);
+}
+function AgentDraftReviewPanel({
+  draft,
+  onApprove,
+  onEdit,
+  onReject,
+  className,
+  ...props
+}) {
+  const formattedDate = formatDraftTimestamp(draft?.date);
+  const hasDraft = Boolean(draft);
+  return /* @__PURE__ */ jsxs15(
+    Panel3,
+    {
+      ...props,
+      className: `eth-inbox-agent-draft ${className ?? ""}`,
+      title: "Agent draft review",
+      subtitle: "Validate the generated response, source evidence, and approval direction before sending.",
+      "data-eth-component": "AgentDraftReviewPanel",
+      children: [
+        draft ? /* @__PURE__ */ jsxs15("div", { className: "eth-inbox-agent-draft__content", children: [
+          /* @__PURE__ */ jsxs15("div", { className: "eth-inbox-agent-draft__status", children: [
+            /* @__PURE__ */ jsx15(Badge5, { severity: "info", children: draft.statusLabel ?? "Ready for review" }),
+            /* @__PURE__ */ jsx15("span", { children: "Generated from inbound thread and policy context" }),
+            formattedDate ? /* @__PURE__ */ jsxs15("time", { dateTime: draft.date, children: [
+              "Updated ",
+              formattedDate
+            ] }) : null
+          ] }),
+          /* @__PURE__ */ jsxs15("dl", { className: "eth-inbox-agent-draft__meta", children: [
+            /* @__PURE__ */ jsxs15("div", { children: [
+              /* @__PURE__ */ jsx15("dt", { children: "Subject" }),
+              /* @__PURE__ */ jsx15("dd", { children: draft.subject ?? "No subject" })
+            ] }),
+            /* @__PURE__ */ jsxs15("div", { children: [
+              /* @__PURE__ */ jsx15("dt", { children: "Requested by" }),
+              /* @__PURE__ */ jsx15("dd", { children: draft.from || "Unknown sender" })
+            ] }),
+            /* @__PURE__ */ jsxs15("div", { children: [
+              /* @__PURE__ */ jsx15("dt", { children: "Recipients" }),
+              /* @__PURE__ */ jsx15("dd", { children: draft.to?.length ? draft.to.join(", ") : "No recipients" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs15("section", { className: "eth-inbox-agent-draft__section", "aria-label": "Proposed response", children: [
+            /* @__PURE__ */ jsx15("div", { className: "eth-inbox-agent-draft__section-header", children: /* @__PURE__ */ jsx15("span", { children: "Proposed response" }) }),
+            /* @__PURE__ */ jsx15("div", { className: "eth-inbox-agent-draft__body", children: draft.body })
+          ] }),
+          draft.rationale ? /* @__PURE__ */ jsxs15("section", { className: "eth-inbox-agent-draft__rationale", "aria-label": "Agent rationale", children: [
+            /* @__PURE__ */ jsx15("span", { children: "Agent rationale" }),
+            /* @__PURE__ */ jsx15("div", { className: "eth-inbox-agent-draft__rationale-body", children: draft.rationale })
+          ] }) : null,
+          draft.evidence?.length ? /* @__PURE__ */ jsxs15("section", { className: "eth-inbox-agent-draft__evidence", "aria-label": "Source evidence", children: [
+            /* @__PURE__ */ jsx15("span", { children: "Source evidence" }),
+            /* @__PURE__ */ jsx15("div", { className: "eth-inbox-agent-draft__evidence-list", children: draft.evidence.map(
+              (item) => item.href ? /* @__PURE__ */ jsx15("a", { href: item.href, children: /* @__PURE__ */ jsx15(Tag3, { children: item.label }) }, item.id) : /* @__PURE__ */ jsx15(Tag3, { children: item.label }, item.id)
+            ) })
+          ] }) : null
+        ] }) : /* @__PURE__ */ jsxs15("div", { className: "eth-inbox-agent-draft__empty", role: "status", children: [
+          /* @__PURE__ */ jsx15("strong", { children: "No draft selected" }),
+          /* @__PURE__ */ jsx15("p", { children: "Select an agent-generated response to review its evidence and approval options." })
+        ] }),
+        /* @__PURE__ */ jsxs15("div", { className: "eth-inbox-agent-draft__actions", children: [
+          /* @__PURE__ */ jsx15(Button6, { type: "button", disabled: !hasDraft, onClick: onApprove, children: "Approve draft" }),
+          /* @__PURE__ */ jsx15(Button6, { type: "button", intent: "secondary", disabled: !hasDraft, onClick: onEdit, children: "Edit draft" }),
+          /* @__PURE__ */ jsx15(Button6, { type: "button", intent: "danger", disabled: !hasDraft, onClick: onReject, children: "Reject draft" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/ApprovalToSendPanel.tsx
+import * as React7 from "react";
+import { Badge as Badge6, Button as Button7, Panel as Panel4, Textarea as Textarea2 } from "@echothink-ui/core";
+import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
+function ApprovalToSendPanel({
+  draft,
+  recipients = [],
+  riskLevel = "low",
+  policyRef,
+  onApprove,
+  onReject,
+  className,
+  ...props
+}) {
+  const [reason, setReason] = React7.useState("");
+  const toRecipients = recipients.length ? recipients : draft?.to ?? [];
+  const ccRecipients = draft?.cc ?? [];
+  const bccRecipients = draft?.bcc ?? [];
+  const subject = draft?.subject?.trim() || "No subject";
+  const body = draft?.body?.trim() || "No message body provided.";
+  const riskSeverity = riskLevel === "critical" || riskLevel === "high" ? "danger" : riskLevel === "medium" ? "warning" : "info";
+  const riskLabel = `${riskLevel.charAt(0).toUpperCase()}${riskLevel.slice(1)} risk`;
+  const recipientCount = recipients.length || toRecipients.length + ccRecipients.length + bccRecipients.length;
+  const recipientKind = recipients.length ? "external recipient" : "recipient";
+  const recipientSummary = recipientCount === 1 ? `1 ${recipientKind}` : `${recipientCount || "No"} ${recipientKind}s`;
+  const formatRecipients2 = (values) => values.length ? values.join(", ") : "Not specified";
+  return /* @__PURE__ */ jsxs16(
+    Panel4,
+    {
+      ...props,
+      className: `eth-inbox-send-approval eth-inbox-send-approval--${riskLevel} ${className ?? ""}`,
+      title: "Approval required",
+      subtitle: "Review this outbound message before it is sent.",
+      "data-eth-component": "ApprovalToSendPanel",
+      children: [
+        /* @__PURE__ */ jsxs16("div", { className: "eth-inbox-send-approval__status", children: [
+          /* @__PURE__ */ jsxs16("div", { className: "eth-inbox-send-approval__summary", children: [
+            /* @__PURE__ */ jsx16(Badge6, { severity: riskSeverity, children: riskLabel }),
+            policyRef ? /* @__PURE__ */ jsx16("span", { className: "eth-inbox-send-approval__policy", children: policyRef }) : null
+          ] }),
+          /* @__PURE__ */ jsx16("span", { className: "eth-inbox-send-approval__state", children: "Awaiting approval" })
+        ] }),
+        /* @__PURE__ */ jsxs16(
+          "section",
+          {
+            className: "eth-inbox-send-approval__message",
+            "aria-label": "Outbound message for approval",
+            children: [
+              /* @__PURE__ */ jsx16("header", { className: "eth-inbox-send-approval__message-header", children: /* @__PURE__ */ jsxs16("div", { children: [
+                /* @__PURE__ */ jsx16("h4", { children: "Outbound message" }),
+                /* @__PURE__ */ jsx16("p", { children: recipientSummary })
+              ] }) }),
+              /* @__PURE__ */ jsxs16("dl", { className: "eth-inbox-send-approval__meta", children: [
+                /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx16("dt", { children: "To" }),
+                  /* @__PURE__ */ jsx16("dd", { children: formatRecipients2(toRecipients) })
+                ] }),
+                ccRecipients.length ? /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx16("dt", { children: "Cc" }),
+                  /* @__PURE__ */ jsx16("dd", { children: formatRecipients2(ccRecipients) })
+                ] }) : null,
+                bccRecipients.length ? /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx16("dt", { children: "Bcc" }),
+                  /* @__PURE__ */ jsx16("dd", { children: formatRecipients2(bccRecipients) })
+                ] }) : null,
+                /* @__PURE__ */ jsxs16("div", { children: [
+                  /* @__PURE__ */ jsx16("dt", { children: "Subject" }),
+                  /* @__PURE__ */ jsx16("dd", { children: subject })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs16("div", { className: "eth-inbox-send-approval__message-body", children: [
+                /* @__PURE__ */ jsx16("span", { children: "Message body" }),
+                /* @__PURE__ */ jsx16("p", { children: body })
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx16("div", { className: "eth-inbox-send-approval__decision", children: /* @__PURE__ */ jsx16(
+          Textarea2,
+          {
+            value: reason,
+            labelText: "Decision note",
+            helperText: "Optional for approval. Include the policy reason when rejecting.",
+            placeholder: "Add an approval or rejection reason",
+            onChange: (event) => setReason(event.currentTarget.value)
+          }
+        ) }),
+        /* @__PURE__ */ jsxs16("div", { className: "eth-inbox-send-approval__actions", children: [
+          /* @__PURE__ */ jsx16(Button7, { intent: "danger", onClick: () => onReject?.(reason || void 0), children: "Reject" }),
+          /* @__PURE__ */ jsx16(Button7, { onClick: () => onApprove?.(reason || void 0), children: "Approve send" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/ThreadSummaryPanel.tsx
+import { Badge as Badge7, Panel as Panel5, Tag as Tag4 } from "@echothink-ui/core";
+import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
+function ThreadSummaryPanel({
+  summary,
+  className,
+  ...props
+}) {
+  const citations = summary?.citations ?? [];
+  const citationCount = citations.length;
+  return /* @__PURE__ */ jsx17(
+    Panel5,
+    {
+      ...props,
+      className: `eth-inbox-thread-summary ${className ?? ""}`,
+      title: "Thread summary",
+      subtitle: "Agent-generated recap with source references.",
+      "data-eth-component": "ThreadSummaryPanel",
+      children: summary ? /* @__PURE__ */ jsxs17("div", { className: "eth-inbox-thread-summary__content", children: [
+        /* @__PURE__ */ jsxs17(
+          "div",
+          {
+            className: "eth-inbox-thread-summary__metadata",
+            role: "group",
+            "aria-label": "Summary metadata",
+            children: [
+              /* @__PURE__ */ jsx17(Badge7, { severity: "info", children: "Agent generated" }),
+              /* @__PURE__ */ jsx17("span", { children: formatCitationCount(citationCount) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs17("section", { className: "eth-inbox-thread-summary__summary", "aria-label": "Generated summary", children: [
+          /* @__PURE__ */ jsx17("span", { className: "eth-inbox-thread-summary__section-label", children: "Summary" }),
+          /* @__PURE__ */ jsx17("div", { className: "eth-inbox-thread-summary__summary-body", children: summary.text })
+        ] }),
+        citations.length ? /* @__PURE__ */ jsxs17("section", { className: "eth-inbox-thread-summary__sources", "aria-label": "Source citations", children: [
+          /* @__PURE__ */ jsx17("span", { className: "eth-inbox-thread-summary__section-label", children: "Source citations" }),
+          /* @__PURE__ */ jsx17("ul", { className: "eth-inbox-thread-summary__source-list", children: citations.map((citation) => /* @__PURE__ */ jsx17("li", { className: "eth-inbox-thread-summary__source-item", children: /* @__PURE__ */ jsx17(CitationTag, { citation }) }, citation.id)) })
+        ] }) : /* @__PURE__ */ jsx17("div", { className: "eth-inbox-thread-summary__no-sources", role: "status", children: "No citations attached." })
+      ] }) : /* @__PURE__ */ jsxs17("div", { className: "eth-inbox-thread-summary__empty", role: "status", children: [
+        /* @__PURE__ */ jsx17("strong", { children: "No generated summary" }),
+        /* @__PURE__ */ jsx17("p", { children: "Summaries and source citations appear here after the agent reviews the conversation." })
+      ] })
+    }
+  );
+}
+function CitationTag({ citation }) {
+  const referenceLabel = citation.messageRef ? `${citation.label}, message ${citation.messageRef}` : citation.label;
+  const tag = /* @__PURE__ */ jsx17(
+    Tag4,
+    {
+      className: "eth-inbox-thread-summary__source-token",
+      "aria-label": referenceLabel,
+      title: referenceLabel,
+      "data-message-ref": citation.messageRef,
+      children: citation.label
+    }
+  );
+  if (!citation.href) {
+    return /* @__PURE__ */ jsx17("span", { className: "eth-inbox-thread-summary__source-reference", children: tag });
+  }
+  return /* @__PURE__ */ jsx17(
+    "a",
+    {
+      className: "eth-inbox-thread-summary__source-link",
+      href: citation.href,
+      "aria-label": referenceLabel,
+      children: tag
+    }
+  );
+}
+function formatCitationCount(count) {
+  return `${count} ${count === 1 ? "citation" : "citations"}`;
+}
+
+// src/index.tsx
+var InboxComponentNames = [
+  "InboxShell",
+  "MailboxFolderList",
+  "MessageList",
+  "MessageThread",
+  "MessageComposer",
+  "MessagePreview",
+  "AttachmentList",
+  "AttachmentPreview",
+  "RecipientPicker",
+  "LabelManager",
+  "MessageSearch",
+  "MessageFilterBar",
+  "PriorityInboxView",
+  "EmailAutomationRulePanel",
+  "AgentDraftReviewPanel",
+  "ApprovalToSendPanel",
+  "ThreadSummaryPanel"
+];
+export {
+  AgentDraftReviewPanel,
+  ApprovalToSendPanel,
+  AttachmentList,
+  AttachmentPreview,
+  EmailAutomationRulePanel,
+  InboxComponentNames,
+  InboxShell,
+  LabelManager,
+  MailboxFolderList,
+  MessageComposer,
+  MessageFilterBar,
+  MessageList,
+  MessagePreview,
+  MessageSearch,
+  MessageThread,
+  PriorityInboxView,
+  RecipientPicker,
+  ThreadSummaryPanel
+};
+//# sourceMappingURL=index.js.map