@elevasis/ui 2.22.0 → 2.24.0

package/dist/{chunk-COG4ABRI.js → chunk-M2HWJY6O.js}

@@ -1,19 +1,20 @@
+import { LEAD_GEN_STAGE_CATALOG, LEAD_GEN_PIPELINE_DEFINITIONS, findPipeline } from './chunk-OWHQ65EQ.js';
 import { PageContainer } from './chunk-BZZCNLT6.js';
 import { TableSelectionToolbar, SortableHeader } from './chunk-TUMSNGTX.js';
 import { SubshellNavItem } from './chunk-CEWTOKE7.js';
 import { SubshellSidebarSection } from './chunk-IIMU5YAJ.js';
 import { FilterBar } from './chunk-PDHTXPSF.js';
 import { CustomModal } from './chunk-KVJ3LFH2.js';
-import { acquisitionListKeys, useListsTelemetry, useLists, useCreateList, useTableSort, sortData, usePaginationState, useTableSelection, useList, useListProgress, useListExecutions, useContacts, useCompanies, useCompanyFacets, useDeleteCompanies, useDeleteContacts } from './chunk-B4FHWKEF.js';
+import { acquisitionListKeys, useListsTelemetry, useLists, useCreateList, useTableSort, sortData, usePaginationState, useTableSelection, useList, useListProgress, useListExecutions, useCompanyFacets, useCompanies, useDeleteCompanies, useContacts, useDeleteContacts, useArtifacts, useListMembers, useListMember, useTransitionListMember, useDeriveActions } from './chunk-QULLZ5PE.js';
 import { showApiErrorNotification, showSuccessNotification } from './chunk-Z6FAH4XV.js';
 import { SubshellContentContainer } from './chunk-TKAYX2SP.js';
-import { PageTitleCaption, CenteredErrorState, StatCard, CardHeader, EmptyState } from './chunk-XUYBOO32.js';
+import { PageTitleCaption, CenteredErrorState, StatCard, CardHeader, EmptyState, JsonViewer } from './chunk-XUYBOO32.js';
 import { useRouterContext } from './chunk-Q7DJKLEN.js';
 import { useElevasisServices } from './chunk-IRW7JMQ4.js';
-import { Stack, Paper, Text, Anchor, Group, Title, ActionIcon, Divider, Box, SimpleGrid, Badge, Card, Button, Center, Loader, Alert, Table, TextInput, Checkbox, Pagination, Textarea, Select, SegmentedControl } from '@mantine/core';
-import { IconLayoutGrid, IconList, IconBuilding, IconAddressBook, IconTarget, IconExternalLink, IconX, IconAlertCircle, IconPlayerPlay, IconArrowRight, IconSparkles, IconListDetails, IconPlus, IconSearch, IconAlertTriangle, IconArrowLeft, IconUsers, IconBuildingFactory2 } from '@tabler/icons-react';
+import { Stack, Paper, Text, Anchor, Group, Title, ActionIcon, Divider, Box, SimpleGrid, Badge, Card, Button, Center, Loader, Alert, Table, TextInput, Select, Checkbox, Pagination, Textarea, Tabs, SegmentedControl, Drawer, Progress } from '@mantine/core';
+import { IconLayoutGrid, IconList, IconBuilding, IconAddressBook, IconTarget, IconExternalLink, IconX, IconAlertCircle, IconPlayerPlay, IconArrowRight, IconSparkles, IconListDetails, IconPlus, IconSearch, IconAlertTriangle, IconCopy, IconUsers, IconDatabase, IconBuildingFactory2, IconArrowLeft, IconChevronRight, IconMail, IconUser } from '@tabler/icons-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Link, useNavigate } from '@tanstack/react-router';
+import { Link, useNavigate, useSearch } from '@tanstack/react-router';
 import { useQueryClient, useMutation } from '@tanstack/react-query';
 import { useState, useMemo, useEffect } from 'react';
 
@@ -89,6 +90,22 @@ function formatDate(dateValue) {
 function getStatusColor(status) {
   return status === "active" ? "green" : status === "invalid" ? "red" : "gray";
 }
+function getStateKeyColor(stateKey) {
+  switch (stateKey) {
+    case "draft":
+      return "gray";
+    case "enriching":
+      return "blue";
+    case "launched":
+      return "green";
+    case "closing":
+      return "yellow";
+    case "archived":
+      return "dimmed";
+    default:
+      return "gray";
+  }
+}
 function getEnrichmentColor(status) {
   switch (status) {
     case "complete":
@@ -236,184 +253,6 @@ function ContactDetailModal({
     ] })
   ] }) : null });
 }
-var LIST_TEMPLATE_OPTIONS = [
-  {
-    value: "blank",
-    label: "Blank",
-    description: "Create an empty draft list with qualification defaults and no pipeline steps."
-  },
-  {
-    value: "full_pipeline",
-    label: "Full 6-Stage",
-    description: "Create a complete lead-gen pipeline from scrape through personalization."
-  },
-  {
-    value: "personalize_only",
-    label: "Personalize Only",
-    description: "Start with personalization and upload-focused steps for already-prepared contacts."
-  },
-  {
-    value: "email_refresh",
-    label: "Email Refresh",
-    description: "Run discovery, verification, and personalization for an existing company set."
-  }
-];
-function buildListConfig(template, targetDescription) {
-  const qualification = {
-    targetDescription,
-    minReviewCount: 5,
-    minRating: 4,
-    excludeFranchises: true,
-    customRules: ""
-  };
-  const personalization = {
-    industryContext: targetDescription,
-    emailBody: "",
-    creativeDirection: "",
-    exclusionRules: []
-  };
-  switch (template) {
-    case "full_pipeline":
-      return {
-        qualification,
-        enrichment: {
-          emailDiscovery: { primary: "tomba" },
-          emailVerification: { provider: "millionverifier", threshold: "ok" }
-        },
-        personalization,
-        pipeline: {
-          steps: [
-            {
-              key: "scrape",
-              label: "Scrape Companies",
-              resourceId: "lgn-01a-google-maps-scrape-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 1
-            },
-            {
-              key: "acquire",
-              label: "Import Companies",
-              resourceId: "lgn-01b-apify-acquire-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 2
-            },
-            {
-              key: "extract",
-              label: "Extract Website Data",
-              resourceId: "lgn-02-website-extract-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 3
-            },
-            {
-              key: "qualify",
-              label: "Qualify Companies",
-              resourceId: "lgn-03-company-qualification-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 4
-            },
-            {
-              key: "discover",
-              label: "Discover Emails",
-              resourceId: "lgn-04-email-discovery-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 5
-            },
-            {
-              key: "verify",
-              label: "Verify Emails",
-              resourceId: "lgn-05-email-verification-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 6
-            },
-            {
-              key: "personalize",
-              label: "Personalize Outreach",
-              resourceId: "ist-personalization-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 7
-            }
-          ]
-        }
-      };
-    case "personalize_only":
-      return {
-        qualification,
-        personalization,
-        pipeline: {
-          steps: [
-            {
-              key: "personalize",
-              label: "Personalize Outreach",
-              resourceId: "ist-personalization-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 1
-            },
-            {
-              key: "upload",
-              label: "Upload Contacts",
-              resourceId: "ist-upload-contacts-workflow",
-              inputTemplate: { requireOpeningLine: true },
-              enabled: true,
-              order: 2
-            }
-          ]
-        }
-      };
-    case "email_refresh":
-      return {
-        qualification,
-        enrichment: {
-          emailDiscovery: { primary: "tomba" },
-          emailVerification: { provider: "millionverifier", threshold: "ok" }
-        },
-        personalization,
-        pipeline: {
-          steps: [
-            {
-              key: "discover",
-              label: "Discover Emails",
-              resourceId: "lgn-04-email-discovery-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 1
-            },
-            {
-              key: "verify",
-              label: "Verify Emails",
-              resourceId: "lgn-05-email-verification-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 2
-            },
-            {
-              key: "personalize",
-              label: "Personalize Outreach",
-              resourceId: "ist-personalization-workflow",
-              inputTemplate: {},
-              enabled: true,
-              order: 3
-            }
-          ]
-        }
-      };
-    case "blank":
-    default:
-      return {
-        qualification,
-        pipeline: {
-          steps: []
-        }
-      };
-  }
-}
 function useDeleteLists() {
   const { apiRequest, organizationId } = useElevasisServices();
   const queryClient = useQueryClient();
@@ -710,13 +549,22 @@ function LeadGenOverviewPage() {
   ] }) }) });
 }
 var PAGE_SIZE_DEFAULT = 20;
+var STATUS_FILTER_OPTIONS = [
+  { value: "", label: "All statuses" },
+  { value: "draft", label: "Draft" },
+  { value: "enriching", label: "Enriching" },
+  { value: "launched", label: "Launched" },
+  { value: "closing", label: "Closing" },
+  { value: "archived", label: "Archived" }
+];
 function LeadGenListsPage() {
   const navigate = useNavigate();
   const [searchQuery, setSearchQuery] = useState("");
+  const [statusFilter, setStatusFilter] = useState("");
   const [showCreateList, setShowCreateList] = useState(false);
   const [newListName, setNewListName] = useState("");
   const [newListDescription, setNewListDescription] = useState("");
-  const [selectedTemplate, setSelectedTemplate] = useState("full_pipeline");
+  const [newRubricKey, setNewRubricKey] = useState("");
   const [showBatchDelete, setShowBatchDelete] = useState(false);
   const { data: lists, isLoading: listsLoading } = useLists();
   const { data: telemetry, isLoading: telemetryLoading } = useListsTelemetry();
@@ -732,38 +580,46 @@ function LeadGenListsPage() {
       name: (list) => list.name,
       description: (list) => list.description || "",
       contacts: (list) => contactCountByListId.get(list.id) ?? 0,
-      created: (list) => list.createdAt
+      batches: (list) => list.batchIds.length,
+      created: (list) => list.createdAt,
+      status: (list) => list.status
     }),
     [contactCountByListId]
   );
   const filteredLists = useMemo(() => {
     if (!lists) return [];
-    if (!searchQuery.trim()) return lists;
-    const query = searchQuery.toLowerCase();
-    return lists.filter((list) => list.name.toLowerCase().includes(query));
-  }, [lists, searchQuery]);
+    let result = lists;
+    if (searchQuery.trim()) {
+      const query = searchQuery.toLowerCase();
+      result = result.filter((list) => list.name.toLowerCase().includes(query));
+    }
+    if (statusFilter) {
+      result = result.filter((list) => list.status === statusFilter);
+    }
+    return result;
+  }, [lists, searchQuery, statusFilter]);
   const sortedLists = useMemo(() => sortData(filteredLists, sort, sortAccessors), [filteredLists, sort, sortAccessors]);
-  const pagination = usePaginationState(PAGE_SIZE_DEFAULT, [searchQuery], sortedLists.length);
+  const pagination = usePaginationState(PAGE_SIZE_DEFAULT, [searchQuery, statusFilter], sortedLists.length);
   const paginatedLists = useMemo(
     () => sortedLists.slice(pagination.offset, pagination.offset + PAGE_SIZE_DEFAULT),
     [sortedLists, pagination.offset]
   );
   const selection = useTableSelection(paginatedLists, sortedLists);
-  const selectedTemplateMeta = LIST_TEMPLATE_OPTIONS.find((option) => option.value === selectedTemplate);
   function resetCreateListModal() {
     setNewListName("");
     setNewListDescription("");
-    setSelectedTemplate("full_pipeline");
+    setNewRubricKey("");
     setShowCreateList(false);
   }
   function handleCreateList() {
     const trimmedName = newListName.trim();
     if (!trimmedName) return;
+    const trimmedRubric = newRubricKey.trim();
+    const icp = trimmedRubric ? { qualificationRubricKey: trimmedRubric } : void 0;
     const body = {
       name: trimmedName,
       description: newListDescription.trim() || null,
-      type: selectedTemplate,
-      config: buildListConfig(selectedTemplate, trimmedName)
+      ...icp ? { icp } : {}
     };
     createListMutation.mutate(body, {
       onSuccess: (list) => {
@@ -791,7 +647,7 @@ function LeadGenListsPage() {
       }
     ) }),
     /* @__PURE__ */ jsx(Paper, { children: /* @__PURE__ */ jsxs(Stack, { children: [
-      /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsxs(
         FilterBar,
         {
           actions: /* @__PURE__ */ jsx(
@@ -802,24 +658,38 @@ function LeadGenListsPage() {
               isDeleting: deleteListsMutation.isPending
             }
           ),
-          children: /* @__PURE__ */ jsx(
-            TextInput,
-            {
-              placeholder: "Search by name...",
-              leftSection: /* @__PURE__ */ jsx(IconSearch, { size: 16 }),
-              value: searchQuery,
-              onChange: (e) => setSearchQuery(e.currentTarget.value)
-            }
-          )
+          children: [
+            /* @__PURE__ */ jsx(
+              TextInput,
+              {
+                placeholder: "Search by name...",
+                leftSection: /* @__PURE__ */ jsx(IconSearch, { size: 16 }),
+                value: searchQuery,
+                onChange: (e) => setSearchQuery(e.currentTarget.value)
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Select,
+              {
+                placeholder: "All statuses",
+                data: STATUS_FILTER_OPTIONS,
+                value: statusFilter,
+                onChange: (value) => setStatusFilter(value ?? ""),
+                clearable: true,
+                size: "sm",
+                w: 160
+              }
+            )
+          ]
         }
       ),
       listsLoading || telemetryLoading ? /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) : !filteredLists.length ? /* @__PURE__ */ jsx(
         EmptyState,
         {
           icon: IconList,
-          title: searchQuery.trim() ? "No lists match your search" : "No lists yet",
-          description: searchQuery.trim() ? void 0 : "Create one to get started.",
-          action: searchQuery.trim() ? void 0 : {
+          title: searchQuery.trim() || statusFilter ? "No lists match your filters" : "No lists yet",
+          description: searchQuery.trim() || statusFilter ? void 0 : "Create one to get started.",
+          action: searchQuery.trim() || statusFilter ? void 0 : {
             label: "Create List",
             onClick: () => setShowCreateList(true),
             icon: /* @__PURE__ */ jsx(IconPlus, { size: 16 })
@@ -837,24 +707,53 @@ function LeadGenListsPage() {
           ) }),
           /* @__PURE__ */ jsx(SortableHeader, { column: "name", sort, onToggle: toggleSort, children: "Name" }),
           /* @__PURE__ */ jsx(SortableHeader, { column: "description", sort, onToggle: toggleSort, children: "Description" }),
+          /* @__PURE__ */ jsx(SortableHeader, { column: "status", sort, onToggle: toggleSort, children: "Status" }),
+          /* @__PURE__ */ jsx(Table.Th, { children: "ICP Rubric" }),
           /* @__PURE__ */ jsx(SortableHeader, { column: "contacts", sort, onToggle: toggleSort, children: "Contacts" }),
+          /* @__PURE__ */ jsx(SortableHeader, { column: "batches", sort, onToggle: toggleSort, children: "Batches" }),
           /* @__PURE__ */ jsx(SortableHeader, { column: "created", sort, onToggle: toggleSort, children: "Created" })
         ] }) }),
-        /* @__PURE__ */ jsx(Table.Tbody, { children: paginatedLists.map((list) => /* @__PURE__ */ jsxs(
-          Table.Tr,
-          {
-            style: { cursor: "pointer" },
-            onClick: () => navigate({ to: "/lead-gen/lists/$listId", params: { listId: list.id } }),
-            children: [
-              /* @__PURE__ */ jsx(Table.Td, { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(Checkbox, { checked: selection.isSelected(list.id), onChange: () => selection.toggle(list.id) }) }),
-              /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { fw: 500, children: list.name }) }),
-              /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: list.description || "-" }) }),
-              /* @__PURE__ */ jsx(Table.Td, { children: contactCountByListId.get(list.id) ?? 0 }),
-              /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: formatDate(list.createdAt) }) })
-            ]
-          },
-          list.id
-        )) })
+        /* @__PURE__ */ jsx(Table.Tbody, { children: paginatedLists.map((list) => {
+          const rubricKey = list.icp?.qualificationRubricKey;
+          return /* @__PURE__ */ jsxs(
+            Table.Tr,
+            {
+              style: { cursor: "pointer" },
+              onClick: () => navigate({ to: "/lead-gen/lists/$listId", params: { listId: list.id } }),
+              children: [
+                /* @__PURE__ */ jsx(Table.Td, { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    checked: selection.isSelected(list.id),
+                    onChange: () => selection.toggle(list.id)
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsxs(Group, { gap: 6, wrap: "nowrap", children: [
+                  /* @__PURE__ */ jsx(Text, { fw: 500, children: list.name }),
+                  list.instantlyCampaignId ? /* @__PURE__ */ jsx(
+                    Anchor,
+                    {
+                      href: `https://app.instantly.ai/app/campaign/${list.instantlyCampaignId}/analytics`,
+                      target: "_blank",
+                      rel: "noreferrer",
+                      onClick: (e) => e.stopPropagation(),
+                      c: "dimmed",
+                      lh: 1,
+                      children: /* @__PURE__ */ jsx(IconExternalLink, { size: 16 })
+                    }
+                  ) : null
+                ] }) }),
+                /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: list.description || "-" }) }),
+                /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", color: getStateKeyColor(list.status), variant: "light", children: list.status }) }),
+                /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: rubricKey || "\u2014" }) }),
+                /* @__PURE__ */ jsx(Table.Td, { children: contactCountByListId.get(list.id) ?? 0 }),
+                /* @__PURE__ */ jsx(Table.Td, { children: list.batchIds.length }),
+                /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: formatDate(list.createdAt) }) })
+              ]
+            },
+            list.id
+          );
+        }) })
       ] }),
       sortedLists.length > PAGE_SIZE_DEFAULT && /* @__PURE__ */ jsx(Group, { justify: "center", children: /* @__PURE__ */ jsx(
         Pagination,
@@ -901,20 +800,16 @@ function LeadGenListsPage() {
             }
           ),
           /* @__PURE__ */ jsx(
-            Select,
+            TextInput,
             {
-              label: "Pipeline Template",
-              data: LIST_TEMPLATE_OPTIONS.map((option) => ({
-                value: option.value,
-                label: option.label
-              })),
-              value: selectedTemplate,
-              onChange: (value) => setSelectedTemplate(value ?? "full_pipeline"),
-              disabled: createListMutation.isPending,
-              allowDeselect: false
+              label: "ICP Rubric Key",
+              description: "Optional free-form text key identifying the qualification rubric for this list.",
+              placeholder: "e.g. smb-veterinary-us",
+              value: newRubricKey,
+              onChange: (event) => setNewRubricKey(event.currentTarget.value),
+              disabled: createListMutation.isPending
             }
           ),
-          selectedTemplateMeta ? /* @__PURE__ */ jsx(Alert, { variant: "light", color: "blue", children: /* @__PURE__ */ jsx(Text, { size: "sm", children: selectedTemplateMeta.description }) }) : null,
           /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "The list will open in draft mode after creation so you can review configuration, edit pipeline steps, and run workflows from the detail page." }),
           /* @__PURE__ */ jsxs(Group, { justify: "flex-end", children: [
             /* @__PURE__ */ jsx(Button, { variant: "light", onClick: resetCreateListModal, disabled: createListMutation.isPending, children: "Cancel" }),
@@ -989,37 +884,554 @@ function formatDateTime(value) {
     minute: "2-digit"
   });
 }
+function resolveMemberStateLabel(member) {
+  const defs = LEAD_GEN_PIPELINE_DEFINITIONS["acq.list-member"];
+  if (!defs) return null;
+  const pipeline = findPipeline(defs, member.pipelineKey);
+  if (!pipeline) return null;
+  const stage = pipeline.stages.find((s) => s.stageKey === member.stageKey);
+  if (!stage) return null;
+  const state = stage.states.find((s) => s.stateKey === member.stateKey);
+  return {
+    stageLabel: stage.label,
+    stateLabel: state?.label ?? member.stateKey
+  };
+}
+function getMemberStateColor(stateKey) {
+  switch (stateKey) {
+    case "personalized":
+    case "verified":
+    case "qualified":
+    case "interested":
+      return "green";
+    case "uploaded":
+    case "discovered":
+    case "extracted":
+    case "populated":
+      return "blue";
+    case "pending":
+      return "gray";
+    default:
+      return "gray";
+  }
+}
+function ArtifactsPanel({ listMemberId }) {
+  const { data, isLoading, error } = useArtifacts({ ownerKind: "list_member", ownerId: listMemberId });
+  const artifacts = data?.artifacts ?? [];
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load artifacts" });
+  }
+  if (!artifacts.length) {
+    return /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconDatabase, { size: 16 }), color: "gray", variant: "light", children: "No artifacts recorded for this member yet." });
+  }
+  return /* @__PURE__ */ jsx(Stack, { gap: "sm", children: artifacts.map((artifact) => /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+    /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: "blue", children: artifact.kind }),
+        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          "v",
+          artifact.version
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatDateTime(artifact.createdAt) })
+    ] }),
+    /* @__PURE__ */ jsx(JsonViewer, { data: artifact.content, maxHeight: 240 })
+  ] }) }, artifact.id)) });
+}
+function ListMemberDrawerContent({ member, listId }) {
+  const transitionMember = useTransitionListMember();
+  const statefulItem = useMemo(
+    () => ({
+      id: member.id,
+      pipeline_key: member.pipelineKey,
+      stage_key: member.stageKey,
+      state_key: member.stateKey,
+      activity_log: member.activityLog
+    }),
+    [member]
+  );
+  const derivedActions = useDeriveActions(statefulItem);
+  const resolved = resolveMemberStateLabel(member);
+  const contactName = [member.contact?.firstName, member.contact?.lastName].filter(Boolean).join(" ").trim() || member.contact?.email || "\u2014";
+  return /* @__PURE__ */ jsxs(Stack, { gap: "md", p: "md", children: [
+    /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
+      /* @__PURE__ */ jsx(Group, { gap: "xs", align: "center", children: resolved ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: "blue", children: resolved.stageLabel }),
+        /* @__PURE__ */ jsx(IconChevronRight, { size: 14, style: { color: "var(--color-text-dimmed)" } }),
+        /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "filled", color: getMemberStateColor(member.stateKey), children: resolved.stateLabel })
+      ] }) : /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "filled", color: getMemberStateColor(member.stateKey), children: member.stateKey }) }),
+      /* @__PURE__ */ jsx(Title, { order: 4, children: contactName }),
+      member.contact?.email && /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(IconMail, { size: 14, style: { color: "var(--color-text-dimmed)" } }),
+        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: member.contact.email })
+      ] }),
+      member.contact?.title && /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(IconUser, { size: 14, style: { color: "var(--color-text-dimmed)" } }),
+        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: member.contact.title })
+      ] })
+    ] }),
+    derivedActions.length > 0 && /* @__PURE__ */ jsx(Group, { gap: "xs", children: derivedActions.map((action) => /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "light",
+        size: "xs",
+        loading: transitionMember.isPending,
+        onClick: () => {
+          transitionMember.mutate({
+            memberId: member.id,
+            listId,
+            pipelineKey: member.pipelineKey,
+            // Lead-gen action dispatch targets are resolved server-side via the action key.
+            // Stage/state keys are no longer embedded in the client-side Action shape.
+            stageKey: action.key,
+            stateKey: null
+          });
+        },
+        children: action.label
+      },
+      action.key
+    )) }),
+    /* @__PURE__ */ jsx(ArtifactsPanel, { listMemberId: member.id })
+  ] });
+}
+function CompanyMemberDrawerContent({ companyId: _companyId }) {
+  return /* @__PURE__ */ jsxs(Stack, { gap: "md", p: "md", children: [
+    /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
+      /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: "gray", children: "company member" }),
+      /* @__PURE__ */ jsx(Title, { order: 4, children: "Company" })
+    ] }),
+    /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), color: "blue", variant: "light", children: "Company-level pipeline transitions are not yet available in this view." })
+  ] });
+}
+function ContactMemberDrawerShell({ contactId, listId }) {
+  const { data: membersData, isLoading, error } = useListMembers({ listId });
+  const listMember = useMemo(() => {
+    if (!membersData?.members) return null;
+    return membersData.members.find((m) => m.contactId === contactId) ?? null;
+  }, [membersData, contactId]);
+  const directQuery = useListMember(listMember === null && !isLoading ? contactId : "");
+  const resolvedMember = listMember ?? directQuery.data ?? null;
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load member detail" });
+  }
+  if (!resolvedMember) {
+    return /* @__PURE__ */ jsx(Stack, { gap: "md", p: "md", children: /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), color: "gray", variant: "light", children: "Member detail not found. The member may have been removed from this list." }) });
+  }
+  return /* @__PURE__ */ jsx(ListMemberDrawerContent, { member: resolvedMember, listId });
+}
+function ListMemberDrawer({ memberId, memberKind, listId, onClose }) {
+  const opened = !!memberId && !!memberKind;
+  return /* @__PURE__ */ jsxs(
+    Drawer,
+    {
+      opened,
+      onClose,
+      position: "right",
+      size: "lg",
+      title: "Member Detail",
+      styles: {
+        body: { padding: 0 }
+      },
+      children: [
+        opened && memberId && memberKind === "contact" && /* @__PURE__ */ jsx(ContactMemberDrawerShell, { contactId: memberId, listId }),
+        opened && memberId && memberKind === "company" && /* @__PURE__ */ jsx(CompanyMemberDrawerContent, { companyId: memberId })
+      ]
+    }
+  );
+}
+function formatDateTime2(value) {
+  if (!value) return "Not yet";
+  return new Date(value).toLocaleString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  });
+}
 function contactDisplayName(firstName, lastName) {
   const full = [firstName, lastName].filter(Boolean).join(" ").trim();
   return full || "\u2014";
 }
+function getStatusColor2(status) {
+  switch (status) {
+    case "draft":
+      return "gray";
+    case "enriching":
+      return "blue";
+    case "launched":
+      return "green";
+    case "closing":
+      return "yellow";
+    case "archived":
+      return "red";
+    default:
+      return "gray";
+  }
+}
+function getMemberStateColor2(stateKey) {
+  switch (stateKey) {
+    case "personalized":
+    case "verified":
+    case "qualified":
+    case "interested":
+      return "green";
+    case "uploaded":
+    case "discovered":
+    case "extracted":
+    case "populated":
+      return "blue";
+    case "pending":
+      return "gray";
+    default:
+      return "gray";
+  }
+}
+var ORPHAN_STAGE_ORDER = 9999;
+function sortStageKeys(keys) {
+  return keys.slice().sort((a, b) => {
+    const oa = LEAD_GEN_STAGE_CATALOG[a]?.order ?? ORPHAN_STAGE_ORDER;
+    const ob = LEAD_GEN_STAGE_CATALOG[b]?.order ?? ORPHAN_STAGE_ORDER;
+    return oa - ob || a.localeCompare(b);
+  });
+}
+function PipelineSection({
+  title,
+  byStage,
+  emptyText
+}) {
+  const orderedKeys = sortStageKeys(Object.keys(byStage));
+  return /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+    /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, children: title }),
+    orderedKeys.length === 0 ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: emptyText }) : /* @__PURE__ */ jsx(Stack, { gap: "xs", children: orderedKeys.map((key) => {
+      const entry = byStage[key];
+      const done = entry?.done ?? 0;
+      const total = entry?.total ?? 0;
+      const percent = total > 0 ? Math.round(done / total * 100) : 0;
+      const label = LEAD_GEN_STAGE_CATALOG[key]?.label ?? key;
+      return /* @__PURE__ */ jsxs(Stack, { gap: 4, children: [
+        /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", children: [
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: label }),
+          /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+            done,
+            " / ",
+            total,
+            " (",
+            percent,
+            "%)"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(Progress, { value: percent, size: "sm", color: getMemberStateColor2(key) })
+      ] }, key);
+    }) })
+  ] });
+}
+function PipelineStagesCard({ list, progress }) {
+  const hasAnyActivity = Object.keys(progress.byCompanyStage).length > 0 || Object.keys(progress.byContactStage).length > 0;
+  return /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
+    /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "center", children: [
+      /* @__PURE__ */ jsx(Title, { order: 5, children: "Pipeline Stages" }),
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "filled", color: getStatusColor2(list.status), children: list.status }),
+        list.launchedAt && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          "Launched ",
+          formatDateTime2(list.launchedAt)
+        ] }),
+        list.completedAt && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          "Completed ",
+          formatDateTime2(list.completedAt)
+        ] })
+      ] })
+    ] }),
+    !hasAnyActivity ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No pipeline activity yet \u2014 stages appear here as workflows write processing_state flags." }) : /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, md: 2 }, spacing: "md", children: [
+      /* @__PURE__ */ jsx(
+        PipelineSection,
+        {
+          title: `Company Pipeline (${progress.totalCompanies})`,
+          byStage: progress.byCompanyStage,
+          emptyText: "No company-stage flags recorded yet."
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        PipelineSection,
+        {
+          title: `Contact Pipeline (${progress.totalMembers})`,
+          byStage: progress.byContactStage,
+          emptyText: "No contact-stage flags recorded yet."
+        }
+      )
+    ] })
+  ] }) });
+}
+function ListConfigCard({ list }) {
+  const icp = list.icp ?? {};
+  const scraping = list.scrapingConfig ?? {};
+  const hasIcp = Object.values(icp).some((v) => v !== void 0 && v !== null && v !== "");
+  const hasScraping = Object.values(scraping).some((v) => v !== void 0 && v !== null && v !== "");
+  if (!hasIcp && !hasScraping) {
+    return /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+      /* @__PURE__ */ jsx(Title, { order: 5, children: "List Config" }),
+      /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No ICP rubric or scraping criteria configured for this list." })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+    /* @__PURE__ */ jsx(Title, { order: 5, children: "List Config" }),
+    /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, md: 2 }, spacing: "md", children: [
+      hasIcp && /* @__PURE__ */ jsxs(Stack, { gap: 6, children: [
+        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, children: "ICP Rubric" }),
+        icp.qualificationRubricKey && /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Rubric Key" }),
+          /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", children: icp.qualificationRubricKey })
+        ] }),
+        icp.targetDescription && /* @__PURE__ */ jsxs(Stack, { gap: 2, children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Target" }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: icp.targetDescription })
+        ] }),
+        (icp.minReviewCount !== void 0 || icp.minRating !== void 0) && /* @__PURE__ */ jsxs(Group, { gap: "md", children: [
+          icp.minReviewCount !== void 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+            "Min reviews:",
+            " ",
+            /* @__PURE__ */ jsx(Text, { span: true, size: "xs", c: "bright", children: icp.minReviewCount })
+          ] }),
+          icp.minRating !== void 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+            "Min rating:",
+            " ",
+            /* @__PURE__ */ jsx(Text, { span: true, size: "xs", c: "bright", children: icp.minRating })
+          ] })
+        ] }),
+        icp.excludeFranchises !== void 0 && /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          "Exclude franchises:",
+          " ",
+          /* @__PURE__ */ jsx(Text, { span: true, size: "xs", c: "bright", children: String(icp.excludeFranchises) })
+        ] }),
+        icp.customRules && /* @__PURE__ */ jsxs(Stack, { gap: 2, children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Custom rules" }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: icp.customRules })
+        ] })
+      ] }),
+      hasScraping && /* @__PURE__ */ jsxs(Stack, { gap: 6, children: [
+        /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, children: "Scraping Criteria" }),
+        scraping.vertical && /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Vertical" }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: scraping.vertical })
+        ] }),
+        scraping.geography && /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Geography" }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: scraping.geography })
+        ] }),
+        scraping.size && /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Size" }),
+          /* @__PURE__ */ jsx(Text, { size: "sm", children: scraping.size })
+        ] }),
+        scraping.apifyInput && Object.keys(scraping.apifyInput).length > 0 && /* @__PURE__ */ jsxs(Stack, { gap: 2, children: [
+          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Apify input" }),
+          /* @__PURE__ */ jsx(JsonViewer, { data: scraping.apifyInput, maxHeight: 160, fontSize: "0.75rem" })
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+function OverviewTab({ list, progress }) {
+  const hasMetadata = list.metadata && Object.keys(list.metadata).length > 0;
+  return /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
+    /* @__PURE__ */ jsx(PipelineStagesCard, { list, progress }),
+    /* @__PURE__ */ jsx(ListConfigCard, { list }),
+    /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, sm: 2 }, children: [
+      /* @__PURE__ */ jsx(StatCard, { label: "Companies", value: progress.totalCompanies, icon: IconBuilding }),
+      /* @__PURE__ */ jsx(StatCard, { label: "Members", value: progress.totalMembers, icon: IconUsers })
+    ] }),
+    hasMetadata && /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+      /* @__PURE__ */ jsx(Title, { order: 5, children: "Metadata / Qualification Signals" }),
+      /* @__PURE__ */ jsx(JsonViewer, { data: list.metadata, maxHeight: 320 })
+    ] }) })
+  ] });
+}
+function MembersTab({
+  listId,
+  progress,
+  onMemberClick
+}) {
+  const [memberTab, setMemberTab] = useState("contacts");
+  const contactsQuery = useContacts({ listId, limit: 100, offset: 0 });
+  const companiesQuery = useCompanies({ listId, limit: 100, offset: 0 });
+  const contacts = contactsQuery.data?.data ?? [];
+  const companies = companiesQuery.data?.data ?? [];
+  return /* @__PURE__ */ jsxs(Paper, { withBorder: true, p: "md", children: [
+    /* @__PURE__ */ jsx(
+      CardHeader,
+      {
+        icon: /* @__PURE__ */ jsx(IconAddressBook, { size: 16 }),
+        title: "Members",
+        rightSection: /* @__PURE__ */ jsx(
+          SegmentedControl,
+          {
+            value: memberTab,
+            onChange: (value) => setMemberTab(value),
+            size: "xs",
+            data: [
+              { label: `Members (${progress.totalMembers})`, value: "contacts" },
+              { label: `Companies (${progress.totalCompanies})`, value: "companies" }
+            ]
+          }
+        )
+      }
+    ),
+    memberTab === "contacts" && /* @__PURE__ */ jsx(Fragment, { children: contactsQuery.isLoading ? /* @__PURE__ */ jsx(Center, { p: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : !contacts.length ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No contacts attached to this list yet." }) : /* @__PURE__ */ jsxs(Table, { highlightOnHover: true, children: [
+      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
+        /* @__PURE__ */ jsx(Table.Th, { children: "Name" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Email" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Title" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Company" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "State" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Created" })
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Tbody, { children: contacts.map((contact) => {
+        const handleRowClick = () => onMemberClick?.(contact.id, "contact");
+        const memberState = contact.stateKey ?? null;
+        return /* @__PURE__ */ jsxs(Table.Tr, { onClick: handleRowClick, style: { cursor: "pointer" }, children: [
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { fw: 500, children: contactDisplayName(contact.firstName, contact.lastName) }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: contact.email }),
+          /* @__PURE__ */ jsx(Table.Td, { children: contact.title ?? "\u2014" }),
+          /* @__PURE__ */ jsx(Table.Td, { children: contact.company?.name ?? "\u2014" }),
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor2(contact.status), children: contact.status }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: memberState ? /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "dot", color: getMemberStateColor2(memberState), children: memberState }) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "\u2014" }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime2(contact.createdAt) })
+        ] }, contact.id);
+      }) })
+    ] }) }),
+    memberTab === "companies" && /* @__PURE__ */ jsx(Fragment, { children: companiesQuery.isLoading ? /* @__PURE__ */ jsx(Center, { p: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : !companies.length ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No companies attached to this list yet." }) : /* @__PURE__ */ jsxs(Table, { highlightOnHover: true, children: [
+      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
+        /* @__PURE__ */ jsx(Table.Th, { children: "Name" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Domain" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Segment" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Contacts" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "State" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Created" })
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Tbody, { children: companies.map((company) => {
+        const handleRowClick = () => onMemberClick?.(company.id, "company");
+        const memberState = company.stateKey ?? null;
+        return /* @__PURE__ */ jsxs(Table.Tr, { onClick: handleRowClick, style: { cursor: "pointer" }, children: [
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { fw: 500, children: company.name }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: company.domain ?? "\u2014" }),
+          /* @__PURE__ */ jsx(Table.Td, { children: company.segment ?? "\u2014" }),
+          /* @__PURE__ */ jsx(Table.Td, { children: company.contactCount }),
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor2(company.status), children: company.status }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: memberState ? /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "dot", color: getMemberStateColor2(memberState), children: memberState }) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "\u2014" }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime2(company.createdAt) })
+        ] }, company.id);
+      }) })
+    ] }) })
+  ] });
+}
+function ArtifactsTab({ listId }) {
+  const { data, isLoading, error } = useArtifacts({ ownerKind: "list", ownerId: listId });
+  const artifacts = data?.artifacts ?? [];
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load artifacts" });
+  }
+  if (!artifacts.length) {
+    return /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconDatabase, { size: 16 }), color: "gray", variant: "light", children: "No artifacts recorded for this list yet." });
+  }
+  return /* @__PURE__ */ jsx(Stack, { gap: "sm", children: artifacts.map((artifact) => /* @__PURE__ */ jsx(Card, { withBorder: true, children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+    /* @__PURE__ */ jsxs(Group, { justify: "space-between", children: [
+      /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: "blue", children: artifact.kind }),
+        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          "v",
+          artifact.version
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatDateTime2(artifact.createdAt) })
+    ] }),
+    /* @__PURE__ */ jsx(JsonViewer, { data: artifact.content, maxHeight: 240 })
+  ] }) }, artifact.id)) });
+}
+function ExecutionHistorySection({
+  executions
+}) {
+  if (!executions.length) {
+    return /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No executions recorded for this list yet." });
+  }
+  return /* @__PURE__ */ jsxs(Table, { children: [
+    /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
+      /* @__PURE__ */ jsx(Table.Th, { children: "Resource" }),
+      /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
+      /* @__PURE__ */ jsx(Table.Th, { children: "Started" }),
+      /* @__PURE__ */ jsx(Table.Th, { children: "Completed" }),
+      /* @__PURE__ */ jsx(Table.Th, { children: "Duration" })
+    ] }) }),
+    /* @__PURE__ */ jsx(Table.Tbody, { children: executions.map((execution) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
+      /* @__PURE__ */ jsxs(Table.Td, { children: [
+        /* @__PURE__ */ jsx(Text, { fw: 500, children: execution.resourceId }),
+        /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: execution.executionId })
+      ] }),
+      /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor2(execution.status), children: execution.status }) }),
+      /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime2(execution.createdAt) }),
+      /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime2(execution.completedAt) }),
+      /* @__PURE__ */ jsx(Table.Td, { children: execution.durationMs == null ? "n/a" : `${execution.durationMs} ms` })
+    ] }, execution.executionId)) })
+  ] });
+}
+function ListDetailHeader({
+  title,
+  caption,
+  rightSection
+}) {
+  return /* @__PURE__ */ jsx(PageTitleCaption, { title, caption, rightSection });
+}
 function LeadGenListDetailPage({ listId }) {
   const navigate = useNavigate();
+  const rawSearch = useSearch({ strict: false });
+  const memberId = rawSearch.member ?? null;
+  const memberKind = rawSearch.memberKind ?? null;
+  const handleMemberClick = (id, kind) => {
+    const params = new URLSearchParams(window.location.search);
+    params.set("member", id);
+    params.set("memberKind", kind);
+    window.history.pushState(null, "", `${window.location.pathname}?${params.toString()}`);
+  };
+  const handleDrawerClose = () => {
+    const params = new URLSearchParams(window.location.search);
+    params.delete("member");
+    params.delete("memberKind");
+    const qs = params.toString();
+    window.history.pushState(null, "", qs ? `${window.location.pathname}?${qs}` : window.location.pathname);
+  };
   const listQuery = useList(listId);
   const progressQuery = useListProgress(listId);
   const executionsQuery = useListExecutions(listId);
-  const contactsQuery = useContacts({ listId, limit: 100, offset: 0 });
-  const companiesQuery = useCompanies({ listId, limit: 100, offset: 0 });
-  const [memberTab, setMemberTab] = useState("contacts");
   const isLoading = listQuery.isLoading || progressQuery.isLoading || executionsQuery.isLoading;
   const error = listQuery.error ?? progressQuery.error ?? executionsQuery.error;
+  const backButton = /* @__PURE__ */ jsx(
+    Button,
+    {
+      variant: "light",
+      size: "xs",
+      leftSection: /* @__PURE__ */ jsx(IconArrowLeft, { size: 16 }),
+      onClick: () => navigate({ to: "/lead-gen/lists" }),
+      children: "Lists"
+    }
+  );
   if (isLoading) {
     return /* @__PURE__ */ jsx(SubshellContentContainer, { children: /* @__PURE__ */ jsx(PageContainer, { children: /* @__PURE__ */ jsxs(Stack, { children: [
       /* @__PURE__ */ jsx(
-        PageTitleCaption,
+        ListDetailHeader,
         {
           title: "List Detail",
           caption: "Configuration, progress, and execution history for a single lead-gen list",
-          rightSection: /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "light",
-              size: "xs",
-              leftSection: /* @__PURE__ */ jsx(IconArrowLeft, { size: 16 }),
-              onClick: () => navigate({ to: "/lead-gen/lists" }),
-              children: "Lists"
-            }
-          )
+          rightSection: backButton
         }
       ),
       /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(Center, { p: "xl", children: /* @__PURE__ */ jsx(Loader, {}) }) })
@@ -1028,20 +1440,11 @@ function LeadGenListDetailPage({ listId }) {
   if (error) {
     return /* @__PURE__ */ jsx(SubshellContentContainer, { children: /* @__PURE__ */ jsx(PageContainer, { children: /* @__PURE__ */ jsxs(Stack, { children: [
       /* @__PURE__ */ jsx(
-        PageTitleCaption,
+        ListDetailHeader,
         {
           title: "List Detail",
           caption: "Configuration, progress, and execution history for a single lead-gen list",
-          rightSection: /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "light",
-              size: "xs",
-              leftSection: /* @__PURE__ */ jsx(IconArrowLeft, { size: 16 }),
-              onClick: () => navigate({ to: "/lead-gen/lists" }),
-              children: "Lists"
-            }
-          )
+          rightSection: backButton
         }
       ),
       /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(CenteredErrorState, { error, title: "Failed to load list detail" }) })
@@ -1050,20 +1453,11 @@ function LeadGenListDetailPage({ listId }) {
   if (!listQuery.data || !progressQuery.data) {
     return /* @__PURE__ */ jsx(SubshellContentContainer, { children: /* @__PURE__ */ jsx(PageContainer, { children: /* @__PURE__ */ jsxs(Stack, { children: [
       /* @__PURE__ */ jsx(
-        PageTitleCaption,
+        ListDetailHeader,
         {
           title: "List Not Found",
           caption: "The requested lead-gen list is unavailable.",
-          rightSection: /* @__PURE__ */ jsx(
-            Button,
-            {
-              variant: "light",
-              size: "xs",
-              leftSection: /* @__PURE__ */ jsx(IconArrowLeft, { size: 16 }),
-              onClick: () => navigate({ to: "/lead-gen/lists" }),
-              children: "Lists"
-            }
-          )
+          rightSection: backButton
         }
       ),
       /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsx(Center, { h: 240, children: /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), color: "gray", variant: "light", children: "The requested list could not be found." }) }) })
@@ -1072,117 +1466,52 @@ function LeadGenListDetailPage({ listId }) {
   const list = listQuery.data;
   const progress = progressQuery.data;
   const executions = executionsQuery.data ?? [];
-  const contacts = contactsQuery.data?.data ?? [];
-  const companies = companiesQuery.data?.data ?? [];
-  return /* @__PURE__ */ jsx(SubshellContentContainer, { children: /* @__PURE__ */ jsx(PageContainer, { children: /* @__PURE__ */ jsxs(Stack, { children: [
-    /* @__PURE__ */ jsx(
-      PageTitleCaption,
-      {
-        title: list.name,
-        caption: list.description ?? "Configuration, progress, and execution history for this list",
-        rightSection: /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "light",
-            size: "xs",
-            leftSection: /* @__PURE__ */ jsx(IconArrowLeft, { size: 16 }),
-            onClick: () => navigate({ to: "/lead-gen/lists" }),
-            children: "Lists"
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-      /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor(list.status), children: list.status }),
-      /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
-        "Created ",
-        formatDateTime(list.createdAt)
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, sm: 2 }, children: [
-      /* @__PURE__ */ jsx(StatCard, { label: "Companies", value: progress.totalCompanies, icon: IconBuilding }),
-      /* @__PURE__ */ jsx(StatCard, { label: "Contacts", value: progress.totalContacts, icon: IconUsers })
-    ] }),
-    /* @__PURE__ */ jsxs(Paper, { withBorder: true, p: "md", children: [
+  const handleCopyListCommand = () => {
+    void navigator.clipboard.writeText(`/acquisition --lead-gen list ${list.id}`);
+    showSuccessNotification("Copied list command to clipboard");
+  };
+  return /* @__PURE__ */ jsxs(SubshellContentContainer, { children: [
+    /* @__PURE__ */ jsx(PageContainer, { children: /* @__PURE__ */ jsxs(Stack, { children: [
       /* @__PURE__ */ jsx(
-        CardHeader,
+        ListDetailHeader,
         {
-          icon: /* @__PURE__ */ jsx(IconAddressBook, { size: 16 }),
-          title: "Members",
-          rightSection: /* @__PURE__ */ jsx(
-            SegmentedControl,
-            {
-              value: memberTab,
-              onChange: (value) => setMemberTab(value),
-              size: "xs",
-              data: [
-                { label: `Contacts (${progress.totalContacts})`, value: "contacts" },
-                { label: `Companies (${progress.totalCompanies})`, value: "companies" }
-              ]
-            }
-          )
+          title: list.name,
+          caption: list.description ?? "Configuration, progress, and execution history for this list"
         }
       ),
-      memberTab === "contacts" && /* @__PURE__ */ jsx(Fragment, { children: contactsQuery.isLoading ? /* @__PURE__ */ jsx(Center, { p: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : !contacts.length ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No contacts attached to this list yet." }) : /* @__PURE__ */ jsxs(Table, { children: [
-        /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsx(Table.Th, { children: "Name" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Email" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Title" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Company" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Created" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Tbody, { children: contacts.map((contact) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { fw: 500, children: contactDisplayName(contact.firstName, contact.lastName) }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: contact.email }),
-          /* @__PURE__ */ jsx(Table.Td, { children: contact.title ?? "\u2014" }),
-          /* @__PURE__ */ jsx(Table.Td, { children: contact.company?.name ?? "\u2014" }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor(contact.status), children: contact.status }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime(contact.createdAt) })
-        ] }, contact.id)) })
-      ] }) }),
-      memberTab === "companies" && /* @__PURE__ */ jsx(Fragment, { children: companiesQuery.isLoading ? /* @__PURE__ */ jsx(Center, { p: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) }) : !companies.length ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No companies attached to this list yet." }) : /* @__PURE__ */ jsxs(Table, { children: [
-        /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsx(Table.Th, { children: "Name" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Domain" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Segment" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Contacts" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Created" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Tbody, { children: companies.map((company) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { fw: 500, children: company.name }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: company.domain ?? "\u2014" }),
-          /* @__PURE__ */ jsx(Table.Td, { children: company.segment ?? "\u2014" }),
-          /* @__PURE__ */ jsx(Table.Td, { children: company.contactCount }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor(company.status), children: company.status }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime(company.createdAt) })
-        ] }, company.id)) })
-      ] }) })
-    ] }),
-    /* @__PURE__ */ jsxs(Paper, { withBorder: true, p: "md", children: [
-      /* @__PURE__ */ jsx(CardHeader, { icon: /* @__PURE__ */ jsx(IconPlayerPlay, { size: 16 }), title: "Execution History" }),
-      !executions.length ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No executions recorded for this list yet." }) : /* @__PURE__ */ jsxs(Table, { children: [
-        /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsx(Table.Th, { children: "Resource" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Started" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Completed" }),
-          /* @__PURE__ */ jsx(Table.Th, { children: "Duration" })
-        ] }) }),
-        /* @__PURE__ */ jsx(Table.Tbody, { children: executions.map((execution) => /* @__PURE__ */ jsxs(Table.Tr, { children: [
-          /* @__PURE__ */ jsxs(Table.Td, { children: [
-            /* @__PURE__ */ jsx(Text, { fw: 500, children: execution.resourceId }),
-            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: execution.executionId })
+      /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", wrap: "nowrap", children: [
+        /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+          /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "filled", color: getStatusColor2(list.status), children: list.status }),
+          /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+            "Created ",
+            formatDateTime2(list.createdAt)
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+          /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", onClick: handleCopyListCommand, style: { cursor: "pointer" }, children: [
+            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", ff: "monospace", children: list.id }),
+            /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", size: "sm", "aria-label": "Copy list command", children: /* @__PURE__ */ jsx(IconCopy, { size: 14 }) })
           ] }),
-          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getStatusColor(execution.status), children: execution.status }) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime(execution.createdAt) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: formatDateTime(execution.completedAt) }),
-          /* @__PURE__ */ jsx(Table.Td, { children: execution.durationMs == null ? "n/a" : `${execution.durationMs} ms` })
-        ] }, execution.executionId)) })
+          backButton
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Paper, { withBorder: true, children: /* @__PURE__ */ jsxs(Tabs, { defaultValue: "overview", children: [
+        /* @__PURE__ */ jsxs(Tabs.List, { children: [
+          /* @__PURE__ */ jsx(Tabs.Tab, { value: "overview", leftSection: /* @__PURE__ */ jsx(IconBuilding, { size: 14 }), children: "Overview" }),
+          /* @__PURE__ */ jsx(Tabs.Tab, { value: "members", leftSection: /* @__PURE__ */ jsx(IconUsers, { size: 14 }), children: "Members" }),
+          /* @__PURE__ */ jsx(Tabs.Tab, { value: "artifacts", leftSection: /* @__PURE__ */ jsx(IconDatabase, { size: 14 }), children: "Artifacts" })
+        ] }),
+        /* @__PURE__ */ jsx(Tabs.Panel, { value: "overview", pt: "sm", children: /* @__PURE__ */ jsx(OverviewTab, { list, progress }) }),
+        /* @__PURE__ */ jsx(Tabs.Panel, { value: "members", pt: "sm", children: /* @__PURE__ */ jsx(MembersTab, { listId, progress, onMemberClick: handleMemberClick }) }),
+        /* @__PURE__ */ jsx(Tabs.Panel, { value: "artifacts", pt: "sm", children: /* @__PURE__ */ jsx(ArtifactsTab, { listId }) })
+      ] }) }),
+      /* @__PURE__ */ jsxs(Paper, { withBorder: true, p: "md", children: [
+        /* @__PURE__ */ jsx(CardHeader, { icon: /* @__PURE__ */ jsx(IconPlayerPlay, { size: 16 }), title: "Execution History" }),
+        /* @__PURE__ */ jsx(ExecutionHistorySection, { executions })
       ] })
-    ] })
-  ] }) }) });
+    ] }) }),
+    /* @__PURE__ */ jsx(ListMemberDrawer, { memberId, memberKind, listId, onClose: handleDrawerClose })
+  ] });
 }
 var PAGE_SIZE_DEFAULT2 = 20;
 function LeadGenCompaniesPage() {
@@ -1542,4 +1871,4 @@ function LeadGenContactsPage() {
   ] }) });
 }
 
-export { CompanyDetailModal, ContactDetailModal, LEAD_GEN_ITEMS, LEAD_GEN_ROUTE_LINKS, LIST_TEMPLATE_OPTIONS, LeadGenCompaniesPage, LeadGenContactsPage, LeadGenListDetailPage, LeadGenListsPage, LeadGenOverviewPage, LeadGenRouteShell, LeadGenSidebar, LeadGenSidebarMiddle, LeadGenSidebarTop, buildListConfig, formatDate, getEnrichmentColor, getEnrichmentStatus, getStatusColor, leadGenManifest, useDeleteLists };
+export { CompanyDetailModal, ContactDetailModal, LEAD_GEN_ITEMS, LEAD_GEN_ROUTE_LINKS, LeadGenCompaniesPage, LeadGenContactsPage, LeadGenListDetailPage, LeadGenListsPage, LeadGenOverviewPage, LeadGenRouteShell, LeadGenSidebar, LeadGenSidebarMiddle, LeadGenSidebarTop, formatDate, getEnrichmentColor, getEnrichmentStatus, getStateKeyColor, getStatusColor, leadGenManifest, useDeleteLists };