@elevasis/ui 2.29.0 → 2.31.0

package/dist/{chunk-65RQE3XF.js → chunk-SHQXMW4F.js}

@@ -1,66 +1,36 @@
-import { DEFAULT_ORGANIZATION_MODEL_PROSPECTING, PROSPECTING_STEPS } from './chunk-FFDAE2QI.js';
+import { SalesSidebar, LeadGenSidebarMiddle } from './chunk-7KC4P3AU.js';
+import { DEFAULT_ORGANIZATION_MODEL_PROSPECTING, PROSPECTING_STEPS } from './chunk-TVRQ6AQI.js';
 import { sanitizeInput } from './chunk-3MEXPLWT.js';
+import { SubshellSidebarSection } from './chunk-IIMU5YAJ.js';
 import { PageContainer } from './chunk-BZZCNLT6.js';
 import { TableSelectionToolbar, SortableHeader } from './chunk-TUMSNGTX.js';
-import { SubshellNavItem } from './chunk-X4WBGKJQ.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, useWorkflowExecution, useList, useListProgress, useListExecutions, useDeleteList, useCompanyFacets, useCompanies, useDeleteCompanies, useContacts, useDeleteContacts, useListMembers, useListMember, useTransitionListMember, useDeriveActions, useArtifacts } from './chunk-HNFQCOD2.js';
-import { showApiErrorNotification, showSuccessNotification } from './chunk-CEHUFNAL.js';
-import { PageTitleCaption, CenteredErrorState, StatCard, CardHeader, EmptyState, JsonViewer } from './chunk-6WXDE5LZ.js';
-import { useListActions, LEAD_GEN_STAGE_CATALOG, LEAD_GEN_PIPELINE_DEFINITIONS, findPipeline } from './chunk-OWESKPTJ.js';
+import { CustomModal } from './chunk-R66W5UDG.js';
+import { acquisitionListKeys, useListsTelemetry, useLists, useCreateList, useTableSort, sortData, usePaginationState, useTableSelection, useWorkflowExecution, useList, useListProgress, useListExecutions, useDeleteList, useCompanyFacets, useCompanies, useDeleteCompanies, useContacts, useDeleteContacts, useCredentials, useVerifyCredential, useInFlightExecutions, useListRecords, useExecutionSSE, useListMembers, useListMember, useTransitionListMember, useDeriveActions, useArtifacts } from './chunk-JKSUN5GN.js';
+import { showApiErrorNotification, showSuccessNotification } from './chunk-7HMCB26R.js';
+import { PageTitleCaption, CenteredErrorState, StatCard, CardHeader, EmptyState, JsonViewer } from './chunk-L3BVJWML.js';
+import { useListActions, LEAD_GEN_STAGE_CATALOG, LEAD_GEN_PIPELINE_DEFINITIONS, findPipeline } from './chunk-CQZ3DNQY.js';
 import { SubshellContentContainer } from './chunk-TKAYX2SP.js';
-import { useRouterContext } from './chunk-Q7DJKLEN.js';
-import { useElevasisServices } from './chunk-5WWZXCS5.js';
-import { Stack, Group, Title, Text, Alert, Button, Collapse, Paper, Anchor, ActionIcon, Divider, Box, SimpleGrid, Badge, Card, Center, Loader, Table, TextInput, Select, Checkbox, Pagination, Textarea, Tooltip, Tabs, ThemeIcon, Pill, SegmentedControl, UnstyledButton, Drawer, JsonInput, Switch, NumberInput, MultiSelect, TagsInput, ScrollArea } from '@mantine/core';
-import { IconLayoutGrid, IconList, IconBuilding, IconAddressBook, IconTarget, IconExternalLink, IconX, IconAlertCircle, IconPlayerPlay, IconArrowRight, IconSparkles, IconListDetails, IconPlus, IconSearch, IconAlertTriangle, IconLayoutDashboard, IconBolt, IconCopy, IconUsers, IconTrash, IconBuildingFactory2, IconArrowLeft, IconChevronDown, IconChevronRight, IconRefresh, IconSettings, IconMail, IconUser, IconDatabase } from '@tabler/icons-react';
+import { isStepStartedContext, isStepCompletedContext, isStepFailedContext } from './chunk-KRWALB24.js';
+import { useElevasisServices } from './chunk-KJ3QUBNU.js';
+import { Stack, Group, Title, Text, Alert, Button, Collapse, Paper, Anchor, Center, Loader, SimpleGrid, Card, Table, Badge, TextInput, Select, Checkbox, Pagination, Textarea, ActionIcon, Tooltip, Tabs, ThemeIcon, Box, Pill, SegmentedControl, UnstyledButton, Drawer, JsonInput, Switch, NumberInput, MultiSelect, TagsInput, ScrollArea, Progress } from '@mantine/core';
+import { IconTarget, IconAlertCircle, IconPlayerPlay, IconArrowRight, IconSparkles, IconListDetails, IconPlus, IconSearch, IconList, IconExternalLink, IconAlertTriangle, IconLayoutDashboard, IconBolt, IconCopy, IconBuilding, IconUsers, IconTrash, IconBuildingFactory2, IconArrowLeft, IconChevronDown, IconChevronRight, IconRefresh, IconAddressBook, IconSettings, IconCircleCheck, IconCircleDot, IconTerminal2, IconProgressCheck, IconMail, IconUser, IconDatabase } from '@tabler/icons-react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { Link, useNavigate, useSearch } from '@tanstack/react-router';
-import { useState, useRef, useMemo, useEffect, Fragment as Fragment$1 } from 'react';
+import { useState, useRef, useMemo, useEffect, Fragment as Fragment$1, useCallback } from 'react';
 import { useForm } from '@mantine/form';
 import { zod4Resolver } from 'mantine-form-zod-resolver';
+import { Link, useNavigate, useSearch } from '@tanstack/react-router';
 import { useQueryClient, useMutation } from '@tanstack/react-query';
 
 var LeadGenSidebarTop = () => {
   return /* @__PURE__ */ jsx(SubshellSidebarSection, { icon: IconTarget, label: "Lead Gen" });
 };
-var LEAD_GEN_ITEMS = [
-  { label: "Overview", to: "/lead-gen", icon: IconLayoutGrid, exact: true },
-  { label: "Lists", to: "/lead-gen/lists", icon: IconList, exact: false },
-  { label: "Companies", to: "/lead-gen/companies", icon: IconBuilding, exact: false },
-  { label: "Contacts", to: "/lead-gen/contacts", icon: IconAddressBook, exact: false }
-];
-var LeadGenSidebarMiddle = ({ items = LEAD_GEN_ITEMS } = {}) => {
-  const { currentPath, navigate } = useRouterContext();
-  return /* @__PURE__ */ jsx(Stack, { gap: 0, style: { flex: 1, overflowY: "auto" }, children: /* @__PURE__ */ jsx(Stack, { gap: 0, p: "sm", children: items.map((item) => {
-    const isActive = item.exact ? currentPath === item.to || currentPath === `${item.to}/` : currentPath.startsWith(item.to);
-    return /* @__PURE__ */ jsx(
-      SubshellNavItem,
-      {
-        icon: item.icon,
-        label: item.label,
-        isActive,
-        href: item.to,
-        onClick: () => navigate(item.to)
-      },
-      item.to
-    );
-  }) }) });
-};
 var LeadGenSidebar = ({ children } = {}) => {
   return /* @__PURE__ */ jsxs(Stack, { gap: 0, style: { height: "100%", display: "flex", flexDirection: "column" }, children: [
     /* @__PURE__ */ jsx(LeadGenSidebarTop, {}),
     children ?? /* @__PURE__ */ jsx(LeadGenSidebarMiddle, {})
   ] });
 };
-var leadGenManifest = {
-  key: "lead-gen",
-  featureId: "sales.lead-gen",
-  capabilityIds: ["leadgen.lists.manage"],
-  icon: IconTarget,
-  sidebar: LeadGenSidebar
-};
 
 // ../core/src/business/acquisition/build-templates.ts
 var PROSPECTING_BUILD_TEMPLATE_OPTIONS = DEFAULT_ORGANIZATION_MODEL_PROSPECTING.buildTemplates.map(
@@ -84,13 +54,25 @@ function createBuildPlanSnapshotFromTemplateId(templateId) {
         primaryEntity: step.primaryEntity,
         outputs: [...step.outputs],
         stageKey: step.stageKey,
+        recordsStageKey: step.recordsStageKey ?? step.stageKey,
+        recordSourceStageKey: step.recordSourceStageKey ?? step.recordsStageKey ?? step.stageKey,
         dependencyMode: step.dependencyMode,
         capabilityKey: step.capabilityKey,
         defaultBatchSize: step.defaultBatchSize,
         maxBatchSize: step.maxBatchSize
       };
       if (step.description) snapshotStep.description = step.description;
+      if (step.recordEntity) snapshotStep.recordEntity = step.recordEntity;
       if (step.dependsOn?.length) snapshotStep.dependsOn = [...step.dependsOn];
+      if (step.credentialRequirements?.length) {
+        snapshotStep.credentialRequirements = step.credentialRequirements.map((requirement) => ({ ...requirement }));
+      }
+      if (step.recordColumns) {
+        snapshotStep.recordColumns = {
+          ...step.recordColumns.company ? { company: step.recordColumns.company.map((column) => ({ ...column })) } : {},
+          ...step.recordColumns.contact ? { contact: step.recordColumns.contact.map((column) => ({ ...column })) } : {}
+        };
+      }
       return snapshotStep;
     })
   };
@@ -388,6 +370,15 @@ function StepConfigForm({
     )) })
   ] });
 }
+
+// src/features/lead-gen/manifest.ts
+var leadGenManifest = {
+  key: "lead-gen",
+  featureId: "sales.lead-gen",
+  capabilityIds: ["leadgen.lists.manage"],
+  icon: IconTarget,
+  sidebar: SalesSidebar
+};
 var LEAD_GEN_ROUTE_LINKS = [
   { label: "Overview", to: "/lead-gen" },
   { label: "Lists", to: "/lead-gen/lists" },
@@ -458,135 +449,8 @@ function getEnrichmentStatus(enrichmentData) {
   if (website === "failed" || linkedin === "failed") return "failed";
   return "pending";
 }
-function formatName(parts, fallback) {
-  const name = parts.filter(Boolean).join(" ").trim();
-  return name || fallback;
-}
-function CompanyDetailModal({
-  company,
-  onClose
-}) {
-  return /* @__PURE__ */ jsx(CustomModal, { opened: !!company, onClose, size: "xl", children: company ? /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "flex-start", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Title, { order: 3, children: company.name }),
-        company.domain ? /* @__PURE__ */ jsxs(Anchor, { href: `https://${company.domain}`, target: "_blank", size: "sm", c: "dimmed", children: [
-          company.domain,
-          " ",
-          /* @__PURE__ */ jsx(IconExternalLink, { size: 12, style: { verticalAlign: "middle" } })
-        ] }) : null
-      ] }),
-      /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", onClick: onClose, children: /* @__PURE__ */ jsx(IconX, { size: 18 }) })
-    ] }),
-    /* @__PURE__ */ jsx(Divider, {}),
-    /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsx(Title, { order: 4, mb: "xs", children: "Firmographics" }),
-      /* @__PURE__ */ jsxs(SimpleGrid, { cols: 3, children: [
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Segment" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: company.segment || "-" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Category" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: company.category || "-" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Employees" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: company.numEmployees || "-" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Founded" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: company.foundedYear || "-" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Location" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: [company.locationCity, company.locationState].filter(Boolean).join(", ") || "-" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Contacts" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: company.contactCount })
-        ] })
-      ] })
-    ] }),
-    company.enrichmentData ? /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsx(Title, { order: 4, mb: "xs", children: "Enrichment Data" }),
-      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", style: { whiteSpace: "pre-wrap" }, children: JSON.stringify(company.enrichmentData, null, 2) })
-    ] }) : null,
-    /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-      company.linkedinUrl ? /* @__PURE__ */ jsxs(Anchor, { href: company.linkedinUrl, target: "_blank", size: "sm", children: [
-        "LinkedIn ",
-        /* @__PURE__ */ jsx(IconExternalLink, { size: 12 })
-      ] }) : null,
-      company.website ? /* @__PURE__ */ jsxs(Anchor, { href: company.website, target: "_blank", size: "sm", children: [
-        "Website ",
-        /* @__PURE__ */ jsx(IconExternalLink, { size: 12 })
-      ] }) : null
-    ] }),
-    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-      "Created: ",
-      formatDate(company.createdAt),
-      company.updatedAt && ` | Updated: ${formatDate(company.updatedAt)}`
-    ] })
-  ] }) : null });
-}
-function ContactDetailModal({
-  contact,
-  onClose
-}) {
-  return /* @__PURE__ */ jsx(CustomModal, { opened: !!contact, onClose, size: "xl", children: contact ? /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
-    /* @__PURE__ */ jsxs(Group, { justify: "space-between", align: "flex-start", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx(Title, { order: 3, children: formatName([contact.firstName, contact.lastName], contact.email) }),
-        /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: contact.email }),
-        contact.title ? /* @__PURE__ */ jsx(Text, { size: "sm", children: contact.title }) : null
-      ] }),
-      /* @__PURE__ */ jsx(ActionIcon, { variant: "subtle", onClick: onClose, children: /* @__PURE__ */ jsx(IconX, { size: 18 }) })
-    ] }),
-    /* @__PURE__ */ jsx(Divider, {}),
-    /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
-      /* @__PURE__ */ jsx(Badge, { color: getStatusColor(contact.status), children: contact.status }),
-      contact.openingLine ? /* @__PURE__ */ jsx(Badge, { color: "green", children: "Personalized" }) : null
-    ] }),
-    contact.company ? /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsx(Title, { order: 4, mb: "xs", children: "Company" }),
-      /* @__PURE__ */ jsxs(Card, { withBorder: true, children: [
-        /* @__PURE__ */ jsx(Text, { fw: 500, children: contact.company.name }),
-        contact.company.domain ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: contact.company.domain }) : null
-      ] })
-    ] }) : null,
-    /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsx(Title, { order: 4, mb: "xs", children: "Contact Information" }),
-      /* @__PURE__ */ jsxs(SimpleGrid, { cols: 2, children: [
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Headline" }),
-          /* @__PURE__ */ jsx(Text, { size: "sm", children: contact.headline || "-" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "LinkedIn" }),
-          contact.linkedinUrl ? /* @__PURE__ */ jsxs(Anchor, { href: contact.linkedinUrl, target: "_blank", size: "sm", children: [
-            "View Profile ",
-            /* @__PURE__ */ jsx(IconExternalLink, { size: 12 })
-          ] }) : /* @__PURE__ */ jsx(Text, { size: "sm", children: "-" })
-        ] })
-      ] })
-    ] }),
-    contact.filterReason ? /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsx(Title, { order: 4, mb: "xs", children: "Qualification" }),
-      /* @__PURE__ */ jsx(Text, { size: "sm", c: "red", children: contact.filterReason })
-    ] }) : null,
-    contact.openingLine ? /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsx(Title, { order: 4, mb: "xs", children: "Personalization" }),
-      /* @__PURE__ */ jsx(Text, { size: "sm", children: contact.openingLine })
-    ] }) : null,
-    /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-      "Created: ",
-      formatDate(contact.createdAt),
-      contact.updatedAt && ` | Updated: ${formatDate(contact.updatedAt)}`
-    ] })
-  ] }) : null });
-}
 function useDeleteLists() {
-  const { apiRequest, organizationId } = useElevasisServices();
+  const { apiRequest, workOSOrganizationId } = useElevasisServices();
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: async (listIds) => {
@@ -601,8 +465,8 @@ function useDeleteLists() {
       );
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: acquisitionListKeys.list(organizationId) });
-      queryClient.invalidateQueries({ queryKey: acquisitionListKeys.telemetry(organizationId) });
+      queryClient.invalidateQueries({ queryKey: acquisitionListKeys.list(workOSOrganizationId) });
+      queryClient.invalidateQueries({ queryKey: acquisitionListKeys.telemetry(workOSOrganizationId) });
       showSuccessNotification("Lists deleted");
     },
     onError: (error) => {
@@ -1369,6 +1233,253 @@ function ListMemberDrawer({ memberId, memberKind, listId, onClose }) {
     }
   );
 }
+function formatEventTime(timestamp) {
+  return new Date(timestamp).toLocaleTimeString("en-US", {
+    hour12: false,
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit"
+  });
+}
+function formatId(executionId) {
+  return executionId.length > 10 ? `${executionId.slice(0, 8)}...` : executionId;
+}
+function getLogLevelColor(level) {
+  switch (level) {
+    case "error":
+      return "red";
+    case "warn":
+      return "yellow";
+    case "debug":
+      return "gray";
+    default:
+      return "blue";
+  }
+}
+function getStepStatusColor(status) {
+  switch (status) {
+    case "failed":
+      return "red";
+    case "done":
+      return "green";
+    default:
+      return "blue";
+  }
+}
+function getStepStatusLabel(status) {
+  switch (status) {
+    case "failed":
+      return "Failed";
+    case "done":
+      return "Done";
+    default:
+      return "Running";
+  }
+}
+function getEventColor(event) {
+  switch (event.type) {
+    case "new-execution":
+      return "blue";
+    case "execution-complete":
+      return event.data.success ? "green" : "red";
+    case "log":
+      return getLogLevelColor(event.data.log.level);
+    default:
+      return "gray";
+  }
+}
+function getEventLabel(event) {
+  switch (event.type) {
+    case "new-execution":
+      return "Execution started";
+    case "execution-complete":
+      return event.data.success ? "Execution completed" : "Execution failed";
+    case "log":
+      return event.data.log.message;
+    default:
+      return "Stream connected";
+  }
+}
+function hasExecutionId(event) {
+  return event.type !== "connected" && typeof event.executionId === "string" && event.executionId.length > 0;
+}
+function toTimelineEvents(events) {
+  return events.filter(hasExecutionId).map((event) => ({
+    executionId: event.executionId,
+    timestamp: event.timestamp,
+    label: getEventLabel(event),
+    color: getEventColor(event),
+    detail: event.type === "execution-complete" ? event.data.error : void 0
+  })).sort((a, b) => b.timestamp - a.timestamp).slice(0, 5);
+}
+function collectStepStatuses(events, streamingLogs) {
+  const statuses = /* @__PURE__ */ new Map();
+  const applyLog = (executionId, log) => {
+    const context = log.context;
+    if (!context || context.type !== "workflow") return;
+    if (!("stepId" in context)) return;
+    let status = null;
+    if (isStepStartedContext(context)) status = "running";
+    if (isStepCompletedContext(context)) status = "done";
+    if (isStepFailedContext(context)) status = "failed";
+    if (!status) return;
+    statuses.set(executionId, {
+      executionId,
+      stepId: context.stepId,
+      status,
+      timestamp: log.timestamp,
+      message: log.message
+    });
+  };
+  events.forEach((event) => {
+    if (event.type === "log") applyLog(event.executionId, event.data.log);
+  });
+  streamingLogs.forEach((logs, executionId) => {
+    logs.forEach((log) => applyLog(executionId, log));
+  });
+  return Array.from(statuses.values()).sort((a, b) => b.timestamp - a.timestamp);
+}
+function getExecutionId(execution) {
+  return "executionId" in execution ? execution.executionId : execution.id;
+}
+function getInFlightExecutions(data) {
+  if (Array.isArray(data)) return data;
+  if (data && typeof data === "object" && "executions" in data) {
+    const executions = data.executions;
+    return Array.isArray(executions) ? executions : [];
+  }
+  return [];
+}
+function getStageProgress(progress, stageKey) {
+  return progress?.byCompanyStage[stageKey] ?? progress?.byContactStage[stageKey];
+}
+function getStageLabel(stageKey) {
+  return LEAD_GEN_STAGE_CATALOG[stageKey]?.label ?? stageKey;
+}
+function getDoneCount(stageProgress) {
+  return stageProgress?.attempted ?? 0;
+}
+function LeadGenLiveStatusPanel({
+  listId,
+  resourceId,
+  stageKey,
+  stepLabel,
+  enabled = true,
+  onRunningChange
+}) {
+  const sse = useExecutionSSE(resourceId, {
+    enabled: enabled && Boolean(resourceId),
+    listId
+  });
+  const inFlightQuery = useInFlightExecutions(resourceId, {
+    enabled: enabled && Boolean(resourceId),
+    limit: 5,
+    refetchInterval: enabled && Boolean(resourceId) ? 2e3 : false
+  });
+  const inFlightExecutions = useMemo(() => getInFlightExecutions(inFlightQuery.data), [inFlightQuery.data]);
+  const activeExecutionIds = useMemo(() => {
+    const ids = new Set(sse.liveExecutions);
+    inFlightExecutions.forEach((execution) => {
+      const executionId = getExecutionId(execution);
+      if (executionId) ids.add(executionId);
+    });
+    return Array.from(ids);
+  }, [inFlightExecutions, sse.liveExecutions]);
+  const running = enabled && activeExecutionIds.length > 0;
+  const [showCompletedActivity, setShowCompletedActivity] = useState(false);
+  const progressQuery = useListProgress(listId, {
+    enabled: enabled && Boolean(listId),
+    refetchInterval: running ? 2e3 : false
+  });
+  useEffect(() => {
+    onRunningChange?.(running);
+  }, [onRunningChange, running]);
+  const stepStatuses = useMemo(
+    () => collectStepStatuses(sse.events, sse.streamingLogs),
+    [sse.events, sse.streamingLogs]
+  );
+  const latestStepStatus = stepStatuses[0];
+  const lastEvents = useMemo(() => toTimelineEvents(sse.events), [sse.events]);
+  const stageProgress = getStageProgress(progressQuery.data, stageKey);
+  const doneCount = getDoneCount(stageProgress);
+  const totalCount = stageProgress?.total ?? 0;
+  const failed = Boolean(sse.error) || sse.events.some((event) => event.type === "execution-complete" && !event.data.success);
+  const latestEvent = sse.latestEvent;
+  useEffect(() => {
+    if (running || failed || sse.error) {
+      setShowCompletedActivity(true);
+      return;
+    }
+    if (latestEvent?.type !== "execution-complete") return;
+    setShowCompletedActivity(true);
+    const timeoutId = window.setTimeout(() => setShowCompletedActivity(false), 1e4);
+    return () => window.clearTimeout(timeoutId);
+  }, [failed, latestEvent, running, sse.error]);
+  const hasActivity = activeExecutionIds.length > 0 || sse.streamingLogs.size > 0 || showCompletedActivity || Boolean(sse.error);
+  if (!enabled || !hasActivity && !sse.error && !failed) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Paper, { withBorder: true, p: "sm", children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+    /* @__PURE__ */ jsx(
+      CardHeader,
+      {
+        icon: /* @__PURE__ */ jsx(IconTerminal2, { size: 16 }),
+        title: stepLabel ? `${stepLabel} status` : "Live status",
+        rightSection: /* @__PURE__ */ jsxs(Group, { gap: 6, children: [
+          /* @__PURE__ */ jsx(
+            Badge,
+            {
+              size: "xs",
+              variant: "light",
+              color: sse.connected ? "green" : running ? "yellow" : "gray",
+              leftSection: sse.connected ? /* @__PURE__ */ jsx(IconCircleCheck, { size: 9 }) : /* @__PURE__ */ jsx(IconCircleDot, { size: 9 }),
+              children: sse.connected ? "Connected" : running ? "Reconnecting" : "Idle"
+            }
+          ),
+          running ? /* @__PURE__ */ jsxs(Badge, { size: "xs", variant: "filled", color: "blue", leftSection: /* @__PURE__ */ jsx(IconPlayerPlay, { size: 9 }), children: [
+            activeExecutionIds.length,
+            " running"
+          ] }) : null
+        ] })
+      }
+    ),
+    sse.error ? /* @__PURE__ */ jsx(Alert, { icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 14 }), color: "red", variant: "light", p: "xs", children: /* @__PURE__ */ jsx(Text, { size: "xs", children: sse.error }) }) : null,
+    activeExecutionIds.length > 0 ? /* @__PURE__ */ jsx(Group, { gap: 6, children: activeExecutionIds.map((executionId) => /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "light", color: "blue", ff: "monospace", children: formatId(executionId) }, executionId)) }) : null,
+    /* @__PURE__ */ jsxs(Box, { p: "xs", bg: "var(--surface-primary-subtle)", style: { borderRadius: "var(--mantine-radius-sm)" }, children: [
+      /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", wrap: "nowrap", children: [
+        /* @__PURE__ */ jsxs(Group, { gap: 6, wrap: "nowrap", style: { minWidth: 0 }, children: [
+          /* @__PURE__ */ jsx(IconProgressCheck, { size: 14 }),
+          /* @__PURE__ */ jsx(Text, { size: "xs", fw: 600, truncate: "end", children: getStageLabel(stageKey) })
+        ] }),
+        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", ff: "monospace", children: [
+          doneCount,
+          "/",
+          totalCount,
+          " done"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(
+        Progress,
+        {
+          mt: 6,
+          size: "xs",
+          value: totalCount > 0 ? doneCount / totalCount * 100 : 0,
+          color: stageProgress && stageProgress.error > 0 ? "red" : "blue"
+        }
+      )
+    ] }),
+    latestStepStatus ? /* @__PURE__ */ jsxs(Group, { gap: 6, wrap: "nowrap", children: [
+      /* @__PURE__ */ jsx(Badge, { size: "xs", color: getStepStatusColor(latestStepStatus.status), variant: "light", children: getStepStatusLabel(latestStepStatus.status) }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", fw: 500, truncate: "end", children: latestStepStatus.stepId }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", truncate: "end", style: { flex: 1 }, children: latestStepStatus.message })
+    ] }) : running ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Waiting for workflow step events." }) : null,
+    lastEvents.length > 0 ? /* @__PURE__ */ jsx(Stack, { gap: 4, children: lastEvents.map((event) => /* @__PURE__ */ jsxs(Group, { gap: 6, wrap: "nowrap", children: [
+      /* @__PURE__ */ jsx(Badge, { size: "xs", variant: "dot", color: event.color, miw: 68, children: formatEventTime(event.timestamp) }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", ff: "monospace", miw: 62, children: formatId(event.executionId) }),
+      /* @__PURE__ */ jsx(Text, { size: "xs", truncate: "end", style: { flex: 1 }, children: event.detail ?? event.label })
+    ] }, `${event.executionId}-${event.timestamp}-${event.label}`)) }) : null
+  ] }) });
+}
 var panelStyle = {
   flex: 1,
   minHeight: 0,
@@ -1377,6 +1488,7 @@ var panelStyle = {
 };
 function StepDetailRightColumn({
   configuration,
+  records,
   advanced,
   runs,
   action,
@@ -1397,7 +1509,7 @@ function StepDetailRightColumn({
           {
             value: activeTab,
             onChange: (value) => {
-              if (value === "configuration" || value === "advanced" || value === "runs") {
+              if (value === "configuration" || value === "records" || value === "advanced" || value === "runs") {
                 onTabChange(value);
               }
             },
@@ -1410,10 +1522,12 @@ function StepDetailRightColumn({
             children: [
               /* @__PURE__ */ jsxs(Tabs.List, { children: [
                 /* @__PURE__ */ jsx(Tabs.Tab, { value: "configuration", children: "Configuration" }),
+                /* @__PURE__ */ jsx(Tabs.Tab, { value: "records", children: "Records" }),
                 /* @__PURE__ */ jsx(Tabs.Tab, { value: "advanced", children: "Advanced" }),
                 /* @__PURE__ */ jsx(Tabs.Tab, { value: "runs", children: "Runs" })
               ] }),
               /* @__PURE__ */ jsx(Tabs.Panel, { value: "configuration", style: panelStyle, children: configuration }),
+              /* @__PURE__ */ jsx(Tabs.Panel, { value: "records", style: panelStyle, children: records ?? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No records view configured for this step." }) }),
               /* @__PURE__ */ jsx(Tabs.Panel, { value: "advanced", style: panelStyle, children: advanced ?? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No advanced settings for this step." }) }),
               /* @__PURE__ */ jsx(Tabs.Panel, { value: "runs", style: panelStyle, children: runs })
             ]
@@ -1513,6 +1627,12 @@ var STAGE_COLOR_SETS = {
     border: "color-mix(in srgb, var(--color-border) 70%, var(--color-primary))",
     text: "var(--color-text)"
   },
+  crawled: {
+    accent: "color-mix(in srgb, var(--color-primary) 70%, var(--color-text-subtle))",
+    background: "color-mix(in srgb, var(--color-primary) 9%, transparent)",
+    border: "color-mix(in srgb, var(--color-border) 72%, var(--color-primary))",
+    text: "var(--color-text)"
+  },
   extracted: {
     accent: "color-mix(in srgb, var(--color-primary) 78%, var(--color-success))",
     background: "color-mix(in srgb, var(--color-primary) 10%, transparent)",
@@ -1628,7 +1748,7 @@ function buildLaneStages({
     })
   );
 }
-function getStageProgress(progress, stageKey, entity) {
+function getStageProgress2(progress, stageKey, entity) {
   const stageProgress = entity === "company" ? progress.byCompanyStage[stageKey] : progress.byContactStage[stageKey];
   const total = stageProgress?.total ?? (entity === "company" ? progress.totalCompanies : progress.totalMembers);
   return {
@@ -1746,7 +1866,7 @@ function TimelineLane({
               position: "relative"
             },
             children: stages.map((stage, index) => {
-              const counts = getStageProgress(progress, stage.key, entity);
+              const counts = getStageProgress2(progress, stage.key, entity);
               const accent = getLeadGenStageColorVar(stage.key);
               const completion = Math.round(percent(counts.success, counts.total));
               const attempted = Math.round(percent(counts.attempted, counts.total));
@@ -2416,7 +2536,7 @@ function sortStageKeys(keys) {
     return oa - ob || a.localeCompare(b);
   });
 }
-function getStageProgress2(progress, step) {
+function getStageProgress3(progress, step) {
   return step.primaryEntity === "company" ? progress.byCompanyStage[step.stageKey] : progress.byContactStage[step.stageKey];
 }
 function getEntityTotal(progress, entity) {
@@ -2434,11 +2554,16 @@ function normalizeBuildPlanStep(step) {
     primaryEntity: step.primaryEntity,
     outputs: step.outputs,
     stageKey: step.stageKey,
+    recordEntity: step.recordEntity,
+    recordsStageKey: step.recordsStageKey,
+    recordSourceStageKey: step.recordSourceStageKey,
     dependsOn: step.dependsOn,
     dependencyMode: step.dependencyMode,
     capabilityKey: step.capabilityKey,
     defaultBatchSize: step.defaultBatchSize,
     maxBatchSize: step.maxBatchSize,
+    recordColumns: step.recordColumns,
+    credentialRequirements: step.credentialRequirements,
     emptyBlockedText: fallback?.emptyBlockedText ?? "Complete prerequisite build steps before this action can run."
   };
 }
@@ -2563,7 +2688,7 @@ function getStepRecommendedAction(step, action, kind) {
 function deriveBuildStepStates(list, progress, actions) {
   const byStepId = /* @__PURE__ */ new Map();
   for (const step of resolveBuildPlanSteps(list)) {
-    const stageProgress = getStageProgress2(progress, step);
+    const stageProgress = getStageProgress3(progress, step);
     const entityTotal = getEntityTotal(progress, step.primaryEntity);
     const prerequisites = getPrerequisiteSteps(step, byStepId);
     const hasDependencies = (step.dependsOn?.length ?? 0) > 0;
@@ -2652,6 +2777,101 @@ function displayMemberStageFor(row, kind) {
 function asRecord3(value) {
   return value && typeof value === "object" && !Array.isArray(value) ? value : {};
 }
+function valueAtPath(source, path) {
+  return path.split(".").reduce((current, segment) => {
+    if (!current || typeof current !== "object") return void 0;
+    return current[segment];
+  }, source);
+}
+function compactText(value) {
+  if (value === null || value === void 0 || value === "") return "-";
+  if (Array.isArray(value)) {
+    if (!value.length) return "-";
+    return value.map((item) => {
+      if (item && typeof item === "object") {
+        const labelled = item;
+        return String(labelled.name ?? labelled.label ?? labelled.title ?? labelled.id ?? JSON.stringify(item));
+      }
+      return String(item);
+    }).join(", ");
+  }
+  if (typeof value === "object") return JSON.stringify(value);
+  return String(value);
+}
+function getRecordDisplayName(row) {
+  if (row.entity === "company") return row.company?.name ?? "Company";
+  const contact = row.contact;
+  const full = [contact?.firstName, contact?.lastName].filter(Boolean).join(" ").trim();
+  return full || contact?.email || "Contact";
+}
+function getRecordColumnSource(row) {
+  if (row.entity === "company") {
+    return {
+      ...row,
+      company: row.company ? {
+        ...row.company,
+        enrichmentData: row.enrichmentData,
+        processingState: row.processingState
+      } : null
+    };
+  }
+  return {
+    ...row,
+    contact: row.contact ? {
+      ...row.contact,
+      name: getRecordDisplayName(row),
+      enrichmentData: row.enrichmentData,
+      processingState: row.processingState
+    } : null
+  };
+}
+function getStageEntry(row, stageKey) {
+  const entry = valueAtPath(row.processingState, stageKey);
+  return asRecord3(entry);
+}
+function getRecordStageStatus(row, stageKey) {
+  const status = getStageEntry(row, stageKey).status;
+  return typeof status === "string" ? status : "pending";
+}
+function getStageFailureReason(row, stageKey) {
+  const data = asRecord3(getStageEntry(row, stageKey).data);
+  const error = data.error ?? data.reason ?? data.failureReason ?? data.disqualifiedReason;
+  return compactText(error);
+}
+function getRecordStatusColor(status) {
+  switch (status) {
+    case "success":
+      return "green";
+    case "error":
+    case "failed":
+      return "red";
+    case "skipped":
+    case "no_result":
+      return "yellow";
+    case "pending":
+      return "gray";
+    default:
+      return "blue";
+  }
+}
+function renderRecordValue(value, column) {
+  if (value === null || value === void 0 || value === "") {
+    return /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "-" });
+  }
+  switch (column.renderType) {
+    case "badge":
+      return /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: column.badgeColor ?? getRecordStatusColor(String(value)), children: compactText(value) });
+    case "datetime":
+      return compactText(typeof value === "string" ? formatDateTime4(value) : value);
+    case "count":
+      return Array.isArray(value) ? value.length : compactText(value);
+    case "json":
+      return /* @__PURE__ */ jsx(Text, { size: "xs", lineClamp: 2, children: compactText(value) });
+    case "text":
+    default:
+      return /* @__PURE__ */ jsx(Text, { size: "sm", lineClamp: 2, children: compactText(value) });
+  }
+}
 function getRunStatusColor(status) {
   switch (status) {
     case "completed":
@@ -3090,20 +3310,364 @@ function getBuildTabDescription(steps, currentStep) {
   if (currentStep.status === "failed") return `${currentStep.label} needs attention.`;
   return `${currentStep.label} is waiting on earlier work.`;
 }
+var RECORDS_PAGE_SIZE = 25;
+var EXPORT_WORKFLOW_ID = "lgn-06-export-list-workflow";
+function setValueAtInputPath(source, path, value) {
+  const segments = path.split(".").filter(Boolean);
+  if (!segments.length) return source;
+  const next = { ...source };
+  let cursor = next;
+  segments.forEach((segment, index) => {
+    if (index === segments.length - 1) {
+      cursor[segment] = value;
+      return;
+    }
+    const current = cursor[segment];
+    const child = current && typeof current === "object" && !Array.isArray(current) ? { ...current } : {};
+    cursor[segment] = child;
+    cursor = child;
+  });
+  return next;
+}
+function credentialMatchesRequirement(credential, requirement) {
+  const provider = requirement.provider.toLowerCase();
+  const credentialProvider = credential.provider?.toLowerCase() ?? "";
+  const credentialType = credential.type.toLowerCase();
+  const credentialName = credential.name.toLowerCase();
+  if (credentialProvider === provider || credentialType === provider || credentialName.startsWith(`${provider}-`) || credentialName.includes(`-${provider}`) || credentialName.includes(`${provider}-`)) {
+    return true;
+  }
+  return credentialType === requirement.credentialType;
+}
+function getMatchingCredentials(credentials, requirement) {
+  return credentials.filter((credential) => credentialMatchesRequirement(credential, requirement));
+}
+function getSelectedCredential(credentials, selections, requirement) {
+  const selectedId = selections[requirement.key];
+  return credentials.find((credential) => credential.id === selectedId) ?? null;
+}
+function getClickUpRequirement(step) {
+  return step.credentialRequirements?.find((requirement) => requirement.provider === "clickup") ?? null;
+}
+function filterCredentialRequirementFields(layout, requirements) {
+  if (!layout || requirements.length === 0) return layout;
+  const credentialInputPaths = new Set(requirements.map((requirement) => requirement.inputPath).filter(Boolean));
+  if (!credentialInputPaths.size) return layout;
+  const filterSection = (section) => {
+    const fields = section.fields.filter((field) => !credentialInputPaths.has(field.path));
+    return fields.length > 0 ? { ...section, fields } : null;
+  };
+  return {
+    ...layout,
+    sections: layout.sections.map(filterSection).filter((section) => section !== null),
+    advanced: layout.advanced ? filterSection(layout.advanced) ?? void 0 : void 0
+  };
+}
+function hasMainConfigFields(layout) {
+  return Boolean(layout?.sections.some((section) => section.fields.length > 0));
+}
+function hasAdvancedConfigFields(layout) {
+  return Boolean(layout?.advanced?.fields.length);
+}
+function formatCredentialVerificationDetails(details) {
+  if (!details) return null;
+  const entries = Object.entries(details).filter(([, value]) => value !== null && value !== void 0 && value !== "").slice(0, 4);
+  if (!entries.length) return null;
+  return entries.map(([key, value]) => `${key}: ${compactText(value)}`).join(" | ");
+}
+function CredentialRequirementsPanel({
+  requirements,
+  credentials,
+  credentialsLoading,
+  selections,
+  verificationByCredentialId,
+  verifyingCredentialId,
+  onSelect,
+  onVerify
+}) {
+  if (!requirements.length) return null;
+  return /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+    /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", fw: 700, tt: "uppercase", children: "Credentials" }),
+    requirements.map((requirement) => {
+      const matchingCredentials = getMatchingCredentials(credentials, requirement);
+      const selectedCredential = getSelectedCredential(credentials, selections, requirement);
+      const verification = selectedCredential ? verificationByCredentialId[selectedCredential.id] : null;
+      return /* @__PURE__ */ jsxs(Stack, { gap: 6, children: [
+        /* @__PURE__ */ jsxs(Group, { gap: "xs", align: "flex-end", wrap: "nowrap", children: [
+          /* @__PURE__ */ jsx(
+            Select,
+            {
+              label: requirement.label,
+              description: `${requirement.provider} credential for ${requirement.inputPath}`,
+              placeholder: credentialsLoading ? "Loading credentials..." : "Select credential",
+              data: matchingCredentials.map((credential) => ({
+                value: credential.id,
+                label: `${credential.name} (${credential.provider ?? credential.type})`
+              })),
+              value: selectedCredential?.id ?? null,
+              onChange: (credentialId) => {
+                onSelect(requirement, credentials.find((credential) => credential.id === credentialId) ?? null);
+              },
+              required: requirement.required,
+              disabled: credentialsLoading || matchingCredentials.length === 0,
+              style: { flex: 1 }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "xs",
+              variant: "light",
+              disabled: !selectedCredential,
+              loading: selectedCredential ? verifyingCredentialId === selectedCredential.id : false,
+              onClick: () => selectedCredential && onVerify(selectedCredential),
+              children: "Test credential"
+            }
+          )
+        ] }),
+        matchingCredentials.length === 0 ? /* @__PURE__ */ jsx(
+          Alert,
+          {
+            color: requirement.required ? "yellow" : "gray",
+            variant: "light",
+            icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }),
+            children: /* @__PURE__ */ jsxs(Text, { size: "sm", children: [
+              "No matching ",
+              requirement.provider,
+              " credentials found. Add one in",
+              " ",
+              /* @__PURE__ */ jsx(Text, { component: "a", href: "/settings/credentials", size: "sm", fw: 600, children: "Settings -> Credentials" }),
+              "."
+            ] })
+          }
+        ) : null,
+        verification ? /* @__PURE__ */ jsx(
+          Alert,
+          {
+            color: verification.status === "success" ? "green" : "red",
+            variant: "light",
+            icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }),
+            children: /* @__PURE__ */ jsxs(Stack, { gap: 2, children: [
+              /* @__PURE__ */ jsx(Text, { size: "sm", children: verification.message }),
+              verification.checkedAt ? /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+                "Checked ",
+                formatDateTime4(verification.checkedAt)
+              ] }) : null,
+              formatCredentialVerificationDetails(verification.details) ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: formatCredentialVerificationDetails(verification.details) }) : null
+            ] })
+          }
+        ) : null
+      ] }, requirement.key);
+    })
+  ] });
+}
+function BuildStepRunningWatcher({
+  resourceId,
+  onRunningChange
+}) {
+  const inFlightQuery = useInFlightExecutions(resourceId, {
+    enabled: Boolean(resourceId),
+    limit: 5,
+    refetchInterval: 2e3
+  });
+  const isRunning = (inFlightQuery.data?.executions.length ?? 0) > 0;
+  useEffect(() => {
+    onRunningChange(resourceId, isRunning);
+    return () => onRunningChange(resourceId, false);
+  }, [isRunning, onRunningChange, resourceId]);
+  return null;
+}
+function StepRecordsPanel({
+  list,
+  step,
+  credentialSelections,
+  credentials,
+  clickupListId
+}) {
+  const queryClient = useQueryClient();
+  const [page, setPage] = useState(1);
+  const [approvalByCompanyId, setApprovalByCompanyId] = useState({});
+  const navigate = useNavigate();
+  const recordsStageKey = step.recordSourceStageKey ?? step.recordsStageKey ?? step.stageKey;
+  const recordsEntity = step.recordEntity ?? step.primaryEntity;
+  const columns = step.recordColumns?.[recordsEntity] ?? [];
+  const recordsQuery = useListRecords(list.id, {
+    entity: recordsEntity,
+    stage: recordsStageKey,
+    limit: RECORDS_PAGE_SIZE,
+    offset: (page - 1) * RECORDS_PAGE_SIZE
+  });
+  const exportWorkflowId = step.action?.resourceId ?? EXPORT_WORKFLOW_ID;
+  const exportExecution = useWorkflowExecution({
+    workflowId: exportWorkflowId,
+    listId: list.id
+  });
+  useEffect(() => {
+    setPage(1);
+    setApprovalByCompanyId({});
+  }, [step.id]);
+  const rows = recordsQuery.data?.data ?? [];
+  const total = recordsQuery.data?.total ?? 0;
+  const totalPages = Math.max(1, Math.ceil(total / RECORDS_PAGE_SIZE));
+  const isReviewExportStep = step.primaryEntity === "company" && (step.capabilityKey === "lead-gen.export.list" || exportWorkflowId === EXPORT_WORKFLOW_ID);
+  const approvedCompanyIds = Object.entries(approvalByCompanyId).filter(([, status]) => status === "approved").map(([companyId]) => companyId);
+  const rejectedCompanyIds = Object.entries(approvalByCompanyId).filter(([, status]) => status === "rejected").map(([companyId]) => companyId);
+  const clickupRequirement = getClickUpRequirement(step);
+  const clickupCredential = clickupRequirement ? getSelectedCredential(credentials, credentialSelections, clickupRequirement) : null;
+  const isClickUpExportPath = isReviewExportStep && Boolean(clickupRequirement);
+  const normalizedClickupListId = clickupListId.trim();
+  const canExport = approvedCompanyIds.length > 0 && (!isClickUpExportPath || Boolean(clickupCredential) && normalizedClickupListId.length > 0);
+  const exportDisabledReason = approvedCompanyIds.length === 0 ? "Approve at least one company before export." : isClickUpExportPath && !clickupCredential ? "Select a ClickUp credential in Configuration." : isClickUpExportPath && !normalizedClickupListId ? "Enter a ClickUp List ID in Configuration." : null;
+  const setApproval = (companyId, status) => {
+    setApprovalByCompanyId((current) => ({ ...current, [companyId]: status }));
+  };
+  const openRecordDetail = (row) => {
+    if (row.entity === "company") {
+      void navigate({ to: "/crm/companies/$companyId", params: { companyId: row.companyId } });
+      return;
+    }
+    void navigate({ to: "/crm/contacts/$contactId", params: { contactId: row.contactId } });
+  };
+  const exportApproved = async () => {
+    try {
+      const result = await exportExecution.execute({
+        input: {
+          listId: list.id,
+          mode: "export",
+          approved: true,
+          ...isClickUpExportPath ? {
+            destination: "clickup",
+            clickupCredential: clickupCredential?.name,
+            clickupListId: normalizedClickupListId
+          } : {},
+          approvedCompanyIds,
+          rejectedCompanyIds
+        }
+      });
+      showSuccessNotification(`Export workflow run started: ${result.executionId}`);
+      await queryClient.invalidateQueries({ queryKey: acquisitionListKeys.all });
+    } catch (error) {
+      showApiErrorNotification(error);
+    }
+  };
+  if (!columns.length) {
+    return /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No record columns are configured for this step." });
+  }
+  if (recordsQuery.isLoading) {
+    return /* @__PURE__ */ jsx(Center, { p: "md", children: /* @__PURE__ */ jsx(Loader, { size: "sm" }) });
+  }
+  if (recordsQuery.error) {
+    return /* @__PURE__ */ jsx(CenteredErrorState, { error: recordsQuery.error, title: "Failed to load records" });
+  }
+  if (!rows.length) {
+    return /* @__PURE__ */ jsx(Stack, { gap: "xs", children: /* @__PURE__ */ jsxs(Text, { size: "sm", c: "dimmed", children: [
+      "No records found for ",
+      LEAD_GEN_STAGE_CATALOG[recordsStageKey]?.label ?? recordsStageKey,
+      "."
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+    /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", children: [
+      /* @__PURE__ */ jsxs(Stack, { gap: 2, children: [
+        /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", fw: 700, tt: "uppercase", children: "Records" }),
+        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          total,
+          " ",
+          recordsEntity,
+          " records from ",
+          LEAD_GEN_STAGE_CATALOG[recordsStageKey]?.label ?? recordsStageKey
+        ] })
+      ] }),
+      recordsQuery.isFetching ? /* @__PURE__ */ jsx(Loader, { size: "xs" }) : null
+    ] }),
+    /* @__PURE__ */ jsx(Box, { style: { overflowX: "auto" }, children: /* @__PURE__ */ jsxs(Table, { highlightOnHover: true, children: [
+      /* @__PURE__ */ jsx(Table.Thead, { children: /* @__PURE__ */ jsxs(Table.Tr, { children: [
+        columns.map((column) => /* @__PURE__ */ jsx(Table.Th, { style: column.width ? { width: column.width } : void 0, children: column.label }, column.key)),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Status" }),
+        /* @__PURE__ */ jsx(Table.Th, { children: "Failure reason" }),
+        isReviewExportStep ? /* @__PURE__ */ jsx(Table.Th, { children: "Approval" }) : null
+      ] }) }),
+      /* @__PURE__ */ jsx(Table.Tbody, { children: rows.map((row) => {
+        const columnSource = getRecordColumnSource(row);
+        const status = getRecordStageStatus(row, recordsStageKey);
+        const companyId = row.entity === "company" ? row.companyId : null;
+        return /* @__PURE__ */ jsxs(Table.Tr, { onClick: () => openRecordDetail(row), style: { cursor: "pointer" }, children: [
+          columns.map((column) => /* @__PURE__ */ jsx(Table.Td, { children: renderRecordValue(valueAtPath(columnSource, column.path), column) }, column.key)),
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getRecordStatusColor(status), children: status }) }),
+          /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Text, { size: "sm", lineClamp: 2, children: getStageFailureReason(row, recordsStageKey) }) }),
+          isReviewExportStep ? /* @__PURE__ */ jsx(Table.Td, { children: companyId ? /* @__PURE__ */ jsxs(Group, { gap: 4, wrap: "nowrap", "aria-label": `Approval for ${getRecordDisplayName(row)}`, children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                size: "compact-xs",
+                variant: approvalByCompanyId[companyId] === "approved" ? "filled" : "light",
+                color: "green",
+                onClick: (event) => {
+                  event.stopPropagation();
+                  setApproval(companyId, "approved");
+                },
+                children: "Approve"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                size: "compact-xs",
+                variant: approvalByCompanyId[companyId] === "rejected" ? "filled" : "light",
+                color: "red",
+                onClick: (event) => {
+                  event.stopPropagation();
+                  setApproval(companyId, "rejected");
+                },
+                children: "Reject"
+              }
+            )
+          ] }) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "-" }) }) : null
+        ] }, row.id);
+      }) })
+    ] }) }),
+    /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", children: [
+      /* @__PURE__ */ jsx(Pagination, { size: "sm", total: totalPages, value: page, onChange: setPage, disabled: recordsQuery.isFetching }),
+      isReviewExportStep ? /* @__PURE__ */ jsxs(Group, { gap: "xs", children: [
+        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+          approvedCompanyIds.length,
+          " approved, ",
+          rejectedCompanyIds.length,
+          " rejected"
+        ] }),
+        exportDisabledReason ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: exportDisabledReason }) : null,
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: "xs",
+            leftSection: /* @__PURE__ */ jsx(IconPlayerPlay, { size: 14 }),
+            loading: exportExecution.isPending,
+            disabled: !canExport,
+            onClick: () => void exportApproved(),
+            children: isClickUpExportPath ? "Export to ClickUp" : "Export approved"
+          }
+        )
+      ] }) : null
+    ] })
+  ] });
+}
 function BuildTab({
   list,
   steps,
   recommendedStep,
   onRunStep,
   onRetryStep,
-  onViewRunLog,
-  onViewRuns
+  onViewRunLog
 }) {
   const [selectedStepId, setSelectedStepId] = useState(null);
   const [stepInputFormState, setStepInputFormState] = useState({});
   const [stepInputError, setStepInputError] = useState(null);
   const [stepInputInitialized, setStepInputInitialized] = useState(false);
   const [activeRightColumnTab, setActiveRightColumnTab] = useState("configuration");
+  const [credentialSelections, setCredentialSelections] = useState({});
+  const [credentialVerificationById, setCredentialVerificationById] = useState({});
+  const [clickupListId, setClickupListId] = useState("");
+  const [runningResources, setRunningResources] = useState({});
   const [stepInputResetKey, setStepInputResetKey] = useState(0);
   const currentStep = getDisplayStep(steps, recommendedStep);
   const selectedStep = steps.find((step) => step.id === selectedStepId) ?? currentStep;
@@ -3113,10 +3677,36 @@ function BuildTab({
   const selectedResourceId = selectedStep?.action?.resourceId ?? null;
   const stepSchema = selectedStep?.action?.schema;
   const stepLayout = selectedStep?.action?.layout;
+  const credentialRequirements = selectedStep?.credentialRequirements ?? [];
+  const visibleStepLayout = useMemo(
+    () => filterCredentialRequirementFields(stepLayout, credentialRequirements),
+    [stepLayout, credentialRequirements]
+  );
+  const showMainStepConfig = stepSchema && hasMainConfigFields(visibleStepLayout);
+  const showAdvancedStepConfig = stepSchema && hasAdvancedConfigFields(visibleStepLayout);
   const recentRunsQuery = useListExecutions(list.id, { resourceId: selectedResourceId, limit: 5 });
   const recentRuns = useMemo(() => recentRunsQuery.data ?? [], [recentRunsQuery.data]);
+  const credentialsQuery = useCredentials();
+  const credentials = credentialsQuery.data ?? [];
+  const verifyCredential = useVerifyCredential();
   const canRunSelectedAction = !!selectedStep?.action && (selectedActionKind === "retry_failed" || selectedActionKind === "run_next_batch");
+  const selectedResourceIsRunning = selectedResourceId ? runningResources[selectedResourceId] ?? false : false;
+  const selectedActionDisabled = !canRunSelectedAction || selectedResourceIsRunning;
+  const selectedActionLabel = selectedResourceIsRunning ? "Running..." : selectedActionKind === "none" ? "No action" : getStepActionLabel(selectedActionKind);
   const selectedActionIcon = selectedActionKind === "retry_failed" ? /* @__PURE__ */ jsx(IconRefresh, { size: 14 }) : /* @__PURE__ */ jsx(IconPlayerPlay, { size: 14 });
+  const handleResourceRunningChange = useCallback((resourceId, isRunning) => {
+    setRunningResources((current) => {
+      if (current[resourceId] === isRunning) return current;
+      return { ...current, [resourceId]: isRunning };
+    });
+  }, []);
+  const handleSelectedResourceRunningChange = useCallback(
+    (isRunning) => {
+      if (!selectedResourceId) return;
+      handleResourceRunningChange(selectedResourceId, isRunning);
+    },
+    [handleResourceRunningChange, selectedResourceId]
+  );
   useEffect(() => {
     setStepInputFormState(getInitialStepInput(list, selectedStep?.action));
     setStepInputError(null);
@@ -3139,8 +3729,45 @@ function BuildTab({
     setStepInputFormState(next);
     if (stepInputError) setStepInputError(null);
   };
+  const handleCredentialSelect = (requirement, credential) => {
+    setCredentialSelections((current) => ({
+      ...current,
+      [requirement.key]: credential?.id ?? null
+    }));
+    setStepInputFormState((current) => setValueAtInputPath(current, requirement.inputPath, credential?.name ?? ""));
+    if (stepInputError) setStepInputError(null);
+  };
+  const handleVerifyCredential = (credential) => {
+    verifyCredential.mutate(credential.id, {
+      onSuccess: (result) => {
+        setCredentialVerificationById((current) => ({
+          ...current,
+          [credential.id]: {
+            status: result.ok ? "success" : "error",
+            checkedAt: result.checkedAt,
+            message: result.message ?? (result.ok ? "Credential verified." : "Credential verification failed."),
+            details: result.details
+          }
+        }));
+      },
+      onError: (error) => {
+        setCredentialVerificationById((current) => ({
+          ...current,
+          [credential.id]: {
+            status: "error",
+            message: error instanceof Error ? error.message : "Credential verification failed."
+          }
+        }));
+      }
+    });
+  };
+  const handleClickupListIdChange = (value) => {
+    setClickupListId(value);
+    setStepInputFormState((current) => setValueAtInputPath(current, "clickupListId", value));
+    if (stepInputError) setStepInputError(null);
+  };
   const handleSelectedAction = () => {
-    if (!selectedStep || !canRunSelectedAction) return;
+    if (!selectedStep || selectedActionDisabled) return;
     if (stepSchema) {
       const parsed = stepSchema.safeParse(stepInputFormState);
       if (!parsed.success) {
@@ -3167,196 +3794,238 @@ function BuildTab({
     if (!resourceId) return;
     onViewRunLog(resourceId, run.executionId);
   };
-  return /* @__PURE__ */ jsx(
-    TabSection,
-    {
-      icon: /* @__PURE__ */ jsx(IconBolt, { size: 16 }),
-      title: "Build",
-      description: getBuildTabDescription(steps, currentStep),
-      children: /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, md: 2 }, spacing: "md", children: [
-        /* @__PURE__ */ jsx(Card, { withBorder: true, style: { height: "100%", display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ jsx(Stack, { gap: "xs", style: { flex: 1, minHeight: 0 }, children: steps.map((step, index) => {
-          const isCurrent = currentStep?.id === step.id;
-          const isSelected = selectedStep?.id === step.id;
-          const isWaiting = step.status === "blocked";
-          const isPassiveWaiting = isWaiting && !isSelected && !isCurrent;
-          const stepTone = isSelected || isCurrent ? step.status : step.status === "complete" || isWaiting ? step.status : "neutral";
-          return /* @__PURE__ */ jsx(
-            UnstyledButton,
-            {
-              onClick: () => setSelectedStepId(step.id),
-              style: {
-                backgroundColor: isSelected ? "var(--surface-primary-strong)" : isPassiveWaiting ? "color-mix(in srgb, var(--color-surface-hover) 38%, transparent)" : "transparent",
-                border: isSelected ? "var(--active-border)" : "1px solid var(--color-border)",
-                borderStyle: isPassiveWaiting ? "dashed" : "solid",
-                borderRadius: 8,
-                display: "block",
-                opacity: isPassiveWaiting ? 0.72 : 1,
-                padding: 12,
-                textAlign: "left",
-                width: "100%"
-              },
-              children: /* @__PURE__ */ jsxs(Group, { gap: "sm", align: "flex-start", wrap: "nowrap", children: [
-                /* @__PURE__ */ jsx(
-                  Box,
-                  {
-                    w: 28,
-                    h: 28,
-                    style: {
-                      alignItems: "center",
-                      ...getBuildToneStyle(stepTone),
-                      borderRadius: 999,
-                      borderStyle: "solid",
-                      borderWidth: 1,
-                      display: "flex",
-                      flexShrink: 0,
-                      fontWeight: 700,
-                      justifyContent: "center"
-                    },
-                    children: index + 1
-                  }
-                ),
-                /* @__PURE__ */ jsxs(Stack, { gap: 4, style: { minWidth: 0, flex: 1 }, children: [
-                  /* @__PURE__ */ jsxs(Group, { gap: "xs", justify: "space-between", wrap: "nowrap", children: [
-                    /* @__PURE__ */ jsx(Text, { fw: 700, c: isPassiveWaiting ? "dimmed" : void 0, truncate: true, children: step.label }),
-                    isCurrent ? /* @__PURE__ */ jsx(StatusPill, { label: "Current", tone: step.status }) : null,
-                    !isCurrent && isWaiting ? /* @__PURE__ */ jsx(StatusPill, { label: "Waiting", tone: "blocked" }) : null
-                  ] }),
-                  /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 2, children: step.description }),
-                  /* @__PURE__ */ jsx(StepCounterLine, { step })
-                ] })
-              ] })
+  return /* @__PURE__ */ jsx(TabSection, { icon: /* @__PURE__ */ jsx(IconBolt, { size: 16 }), title: "Build", description: getBuildTabDescription(steps, currentStep), children: /* @__PURE__ */ jsxs(SimpleGrid, { cols: { base: 1, md: 2 }, spacing: "md", children: [
+    /* @__PURE__ */ jsx(Card, { withBorder: true, style: { height: "100%", display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ jsxs(Stack, { gap: "xs", style: { flex: 1, minHeight: 0 }, children: [
+      steps.map(
+        (step) => step.action?.resourceId ? /* @__PURE__ */ jsx(
+          BuildStepRunningWatcher,
+          {
+            resourceId: step.action.resourceId,
+            onRunningChange: handleResourceRunningChange
+          },
+          `running-${step.id}`
+        ) : null
+      ),
+      steps.map((step, index) => {
+        const isCurrent = currentStep?.id === step.id;
+        const isSelected = selectedStep?.id === step.id;
+        const stepResourceId = step.action?.resourceId ?? null;
+        const isStepRunning = stepResourceId ? runningResources[stepResourceId] ?? false : false;
+        const isWaiting = step.status === "blocked";
+        const isPassiveWaiting = isWaiting && !isSelected && !isCurrent;
+        const stepTone = isStepRunning ? "ready" : isSelected || isCurrent ? step.status : step.status === "complete" || isWaiting ? step.status : "neutral";
+        return /* @__PURE__ */ jsx(
+          UnstyledButton,
+          {
+            onClick: () => setSelectedStepId(step.id),
+            style: {
+              backgroundColor: isSelected ? "var(--surface-primary-strong)" : isStepRunning ? "color-mix(in srgb, var(--color-primary) 12%, transparent)" : isPassiveWaiting ? "color-mix(in srgb, var(--color-surface-hover) 38%, transparent)" : "transparent",
+              border: isSelected ? "var(--active-border)" : isStepRunning ? "1px solid var(--border-primary-muted)" : "1px solid var(--color-border)",
+              borderStyle: isPassiveWaiting && !isStepRunning ? "dashed" : "solid",
+              borderRadius: 8,
+              display: "block",
+              opacity: isPassiveWaiting && !isStepRunning ? 0.72 : 1,
+              padding: 12,
+              textAlign: "left",
+              width: "100%"
             },
-            step.id
-          );
-        }) }) }),
-        selectedStep ? /* @__PURE__ */ jsx(Card, { withBorder: true, style: { height: "100%", display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", style: { flex: 1, minHeight: 0 }, children: [
-          /* @__PURE__ */ jsxs(Stack, { gap: 2, style: { minWidth: 0, flexShrink: 0 }, children: [
-            /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", fw: 700, tt: "uppercase", children: [
-              "Step ",
-              selectedStepIndex + 1,
-              " details"
-            ] }),
-            /* @__PURE__ */ jsx(Title, { order: 5, children: selectedStep.label })
+            children: /* @__PURE__ */ jsxs(Group, { gap: "sm", align: "flex-start", wrap: "nowrap", children: [
+              /* @__PURE__ */ jsx(
+                Box,
+                {
+                  w: 28,
+                  h: 28,
+                  style: {
+                    alignItems: "center",
+                    ...getBuildToneStyle(stepTone),
+                    borderRadius: 999,
+                    borderStyle: "solid",
+                    borderWidth: 1,
+                    display: "flex",
+                    flexShrink: 0,
+                    fontWeight: 700,
+                    justifyContent: "center"
+                  },
+                  children: index + 1
+                }
+              ),
+              /* @__PURE__ */ jsxs(Stack, { gap: 4, style: { minWidth: 0, flex: 1 }, children: [
+                /* @__PURE__ */ jsxs(Group, { gap: "xs", justify: "space-between", wrap: "nowrap", children: [
+                  /* @__PURE__ */ jsx(Text, { fw: 700, c: isPassiveWaiting && !isStepRunning ? "dimmed" : void 0, truncate: true, children: step.label }),
+                  isStepRunning ? /* @__PURE__ */ jsx(StatusPill, { label: "Running", tone: "ready" }) : null,
+                  !isStepRunning && isCurrent ? /* @__PURE__ */ jsx(StatusPill, { label: "Current", tone: step.status }) : null,
+                  !isStepRunning && !isCurrent && isWaiting ? /* @__PURE__ */ jsx(StatusPill, { label: "Waiting", tone: "blocked" }) : null
+                ] }),
+                /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", lineClamp: 2, children: step.description }),
+                /* @__PURE__ */ jsx(StepCounterLine, { step })
+              ] })
+            ] })
+          },
+          step.id
+        );
+      })
+    ] }) }),
+    selectedStep ? /* @__PURE__ */ jsx(Card, { withBorder: true, style: { height: "100%", display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ jsxs(Stack, { gap: "md", style: { flex: 1, minHeight: 0 }, children: [
+      /* @__PURE__ */ jsxs(Stack, { gap: 2, style: { minWidth: 0, flexShrink: 0 }, children: [
+        /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", fw: 700, tt: "uppercase", children: [
+          "Step ",
+          selectedStepIndex + 1,
+          " details"
+        ] }),
+        /* @__PURE__ */ jsx(Title, { order: 5, children: selectedStep.label })
+      ] }),
+      /* @__PURE__ */ jsx(BuildStepProgressBar, { step: selectedStep }),
+      /* @__PURE__ */ jsx(
+        StepDetailRightColumn,
+        {
+          activeTab: activeRightColumnTab,
+          onTabChange: setActiveRightColumnTab,
+          configuration: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
+            selectedResourceId && selectedStep.stageKey ? /* @__PURE__ */ jsx(
+              LeadGenLiveStatusPanel,
+              {
+                listId: list.id,
+                resourceId: selectedResourceId,
+                stageKey: selectedStep.stageKey,
+                stepLabel: selectedStep.label,
+                enabled: true,
+                onRunningChange: handleSelectedResourceRunningChange
+              },
+              selectedResourceId
+            ) : null,
+            selectedStep.status === "blocked" ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: selectedStep.emptyBlockedText }) : null,
+            selectedStep.outputs.includes(selectedStep.primaryEntity) && selectedStep.ready === 0 && selectedStep.complete === 0 && selectedStep.failed === 0 && selectedStep.blocked === 0 ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Run this step to populate members." }) : null,
+            !selectedStep.outputs.includes(selectedStep.primaryEntity) && selectedStep.recommendedAction?.defaultSize !== void 0 && selectedStep.recommendedAction.maxSize !== void 0 ? /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
+              "Batch size: ",
+              selectedStep.recommendedAction.defaultSize,
+              " default,",
+              " ",
+              selectedStep.recommendedAction.maxSize,
+              " max."
+            ] }) : null,
+            showMainStepConfig && visibleStepLayout ? /* @__PURE__ */ jsx(
+              StepConfigForm,
+              {
+                slot: "main",
+                schema: stepSchema,
+                layout: visibleStepLayout,
+                value: stepInputFormState,
+                onChange: (v) => handleStepInputChange(asRecord3(v) ?? {}),
+                disabled: !canRunSelectedAction
+              },
+              `${selectedResourceId ?? "none"}-main-${stepInputResetKey}`
+            ) : !credentialRequirements.length ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No configuration for this step." }) : null,
+            /* @__PURE__ */ jsx(
+              CredentialRequirementsPanel,
+              {
+                requirements: credentialRequirements,
+                credentials,
+                credentialsLoading: credentialsQuery.isLoading,
+                selections: credentialSelections,
+                verificationByCredentialId: credentialVerificationById,
+                verifyingCredentialId: verifyCredential.isPending ? verifyCredential.variables ?? null : null,
+                onSelect: handleCredentialSelect,
+                onVerify: handleVerifyCredential
+              }
+            ),
+            selectedStep.capabilityKey === "lead-gen.export.list" || getClickUpRequirement(selectedStep) ? /* @__PURE__ */ jsx(
+              TextInput,
+              {
+                label: "ClickUp List ID",
+                description: "Destination List ID for approved company tasks.",
+                placeholder: "123456789",
+                value: clickupListId,
+                onChange: (event) => handleClickupListIdChange(event.currentTarget.value)
+              }
+            ) : null
           ] }),
-          /* @__PURE__ */ jsx(BuildStepProgressBar, { step: selectedStep }),
-          /* @__PURE__ */ jsx(
-            StepDetailRightColumn,
+          advanced: showAdvancedStepConfig && visibleStepLayout ? /* @__PURE__ */ jsx(
+            StepConfigForm,
             {
-              activeTab: activeRightColumnTab,
-              onTabChange: setActiveRightColumnTab,
-              configuration: /* @__PURE__ */ jsxs(Stack, { gap: "sm", children: [
-                selectedStep.status === "blocked" ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: selectedStep.emptyBlockedText }) : null,
-                selectedStep.outputs.includes(selectedStep.primaryEntity) && selectedStep.ready === 0 && selectedStep.complete === 0 && selectedStep.failed === 0 && selectedStep.blocked === 0 ? /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "Run this step to populate members." }) : null,
-                !selectedStep.outputs.includes(selectedStep.primaryEntity) && selectedStep.recommendedAction?.defaultSize !== void 0 && selectedStep.recommendedAction.maxSize !== void 0 ? /* @__PURE__ */ jsxs(Text, { size: "xs", c: "dimmed", children: [
-                  "Batch size: ",
-                  selectedStep.recommendedAction.defaultSize,
-                  " default,",
-                  " ",
-                  selectedStep.recommendedAction.maxSize,
-                  " max."
-                ] }) : null,
-                stepSchema && stepLayout ? /* @__PURE__ */ jsx(
-                  StepConfigForm,
-                  {
-                    slot: "main",
-                    schema: stepSchema,
-                    layout: stepLayout,
-                    value: stepInputFormState,
-                    onChange: (v) => handleStepInputChange(asRecord3(v) ?? {}),
-                    disabled: !canRunSelectedAction
-                  },
-                  `${selectedResourceId ?? "none"}-main-${stepInputResetKey}`
-                ) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No configuration for this step." })
-              ] }),
-              advanced: stepSchema && stepLayout?.advanced ? /* @__PURE__ */ jsx(
-                StepConfigForm,
+              slot: "advanced",
+              schema: stepSchema,
+              layout: visibleStepLayout,
+              value: stepInputFormState,
+              onChange: (v) => handleStepInputChange(asRecord3(v) ?? {}),
+              disabled: !canRunSelectedAction
+            },
+            `${selectedResourceId ?? "none"}-advanced-${stepInputResetKey}`
+          ) : void 0,
+          records: /* @__PURE__ */ jsx(
+            StepRecordsPanel,
+            {
+              list,
+              step: selectedStep,
+              credentialSelections,
+              credentials,
+              clickupListId
+            },
+            selectedStep.id
+          ),
+          runs: selectedResourceId ? /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
+            /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", children: [
+              /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", fw: 700, tt: "uppercase", children: "Recent runs" }),
+              recentRunsQuery.isFetching ? /* @__PURE__ */ jsx(Loader, { size: "xs" }) : null
+            ] }),
+            !recentRuns.length && !recentRunsQuery.isLoading ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No runs yet for this step." }) : /* @__PURE__ */ jsx(Stack, { gap: 4, children: recentRuns.map((run) => {
+              const canUseSettings = hasRunInput(run);
+              return /* @__PURE__ */ jsx(
+                Box,
                 {
-                  slot: "advanced",
-                  schema: stepSchema,
-                  layout: stepLayout,
-                  value: stepInputFormState,
-                  onChange: (v) => handleStepInputChange(asRecord3(v) ?? {}),
-                  disabled: !canRunSelectedAction
+                  style: {
+                    border: "1px solid var(--color-border)",
+                    borderRadius: 8,
+                    padding: "8px 10px",
+                    width: "100%"
+                  },
+                  children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", wrap: "nowrap", children: [
+                    /* @__PURE__ */ jsx(
+                      UnstyledButton,
+                      {
+                        onClick: () => openRecentRunLog(run),
+                        style: { flex: 1, minWidth: 0, textAlign: "left" },
+                        children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", wrap: "nowrap", children: [
+                          /* @__PURE__ */ jsxs(Stack, { gap: 2, style: { minWidth: 0 }, children: [
+                            /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, truncate: true, children: formatDateTime4(run.createdAt) }),
+                            /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", ff: "monospace", truncate: true, children: run.executionId })
+                          ] }),
+                          /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getRunStatusColor(run.status), children: run.status })
+                        ] })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(Tooltip, { label: "Use this run's settings", children: /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        size: "xs",
+                        variant: "subtle",
+                        leftSection: /* @__PURE__ */ jsx(IconSettings, { size: 12 }),
+                        disabled: !canUseSettings,
+                        onClick: () => loadRecentRunInput(run),
+                        children: "Use settings"
+                      }
+                    ) })
+                  ] })
                 },
-                `${selectedResourceId ?? "none"}-advanced-${stepInputResetKey}`
-              ) : void 0,
-              runs: selectedResourceId ? /* @__PURE__ */ jsxs(Stack, { gap: "xs", children: [
-                /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", children: [
-                  /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", fw: 700, tt: "uppercase", children: "Recent runs" }),
-                  recentRunsQuery.isFetching ? /* @__PURE__ */ jsx(Loader, { size: "xs" }) : null
-                ] }),
-                !recentRuns.length && !recentRunsQuery.isLoading ? /* @__PURE__ */ jsx(Text, { size: "sm", c: "dimmed", children: "No runs yet for this step." }) : /* @__PURE__ */ jsx(Stack, { gap: 4, children: recentRuns.map((run) => {
-                  const canUseSettings = hasRunInput(run);
-                  return /* @__PURE__ */ jsx(
-                    Box,
-                    {
-                      style: {
-                        border: "1px solid var(--color-border)",
-                        borderRadius: 8,
-                        padding: "8px 10px",
-                        width: "100%"
-                      },
-                      children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", wrap: "nowrap", children: [
-                        /* @__PURE__ */ jsx(
-                          UnstyledButton,
-                          {
-                            onClick: () => openRecentRunLog(run),
-                            style: { flex: 1, minWidth: 0, textAlign: "left" },
-                            children: /* @__PURE__ */ jsxs(Group, { justify: "space-between", gap: "xs", wrap: "nowrap", children: [
-                              /* @__PURE__ */ jsxs(Stack, { gap: 2, style: { minWidth: 0 }, children: [
-                                /* @__PURE__ */ jsx(Text, { size: "sm", fw: 600, truncate: true, children: formatDateTime4(run.createdAt) }),
-                                /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", ff: "monospace", truncate: true, children: run.executionId })
-                              ] }),
-                              /* @__PURE__ */ jsx(Badge, { size: "sm", variant: "light", color: getRunStatusColor(run.status), children: run.status })
-                            ] })
-                          }
-                        ),
-                        /* @__PURE__ */ jsx(Tooltip, { label: "Use this run's settings", children: /* @__PURE__ */ jsx(
-                          Button,
-                          {
-                            size: "xs",
-                            variant: "subtle",
-                            leftSection: /* @__PURE__ */ jsx(IconSettings, { size: 12 }),
-                            disabled: !canUseSettings,
-                            onClick: () => loadRecentRunInput(run),
-                            children: "Use settings"
-                          }
-                        ) })
-                      ] })
-                    },
-                    run.executionId
-                  );
-                }) })
-              ] }) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No runs available for this step." }),
-              action: /* @__PURE__ */ jsxs(Fragment, { children: [
-                stepInputError ? /* @__PURE__ */ jsx(Alert, { color: "red", icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), variant: "light", children: stepInputError }) : null,
-                /* @__PURE__ */ jsxs(Group, { gap: "xs", justify: "flex-end", wrap: "nowrap", children: [
-                  /* @__PURE__ */ jsx(
-                    Button,
-                    {
-                      leftSection: selectedActionIcon,
-                      disabled: !canRunSelectedAction,
-                      onClick: handleSelectedAction,
-                      children: selectedActionKind === "none" ? "No action" : getStepActionLabel(selectedActionKind)
-                    }
-                  ),
-                  recentRuns.length > 0 ? /* @__PURE__ */ jsx(
-                    Button,
-                    {
-                      variant: "light",
-                      leftSection: /* @__PURE__ */ jsx(IconPlayerPlay, { size: 14 }),
-                      onClick: () => onViewRuns(selectedResourceId),
-                      children: "View runs"
-                    }
-                  ) : null
-                ] })
-              ] })
-            }
-          )
-        ] }) }) : null
-      ] })
-    }
-  );
+                run.executionId
+              );
+            }) })
+          ] }) : /* @__PURE__ */ jsx(Text, { size: "xs", c: "dimmed", children: "No runs available for this step." }),
+          action: /* @__PURE__ */ jsxs(Fragment, { children: [
+            stepInputError ? /* @__PURE__ */ jsx(Alert, { color: "red", icon: /* @__PURE__ */ jsx(IconAlertCircle, { size: 16 }), variant: "light", children: stepInputError }) : null,
+            /* @__PURE__ */ jsx(Group, { gap: "xs", justify: "flex-end", wrap: "nowrap", children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                leftSection: selectedActionIcon,
+                disabled: selectedActionDisabled,
+                onClick: handleSelectedAction,
+                children: selectedActionLabel
+              }
+            ) })
+          ] })
+        }
+      )
+    ] }) }) : null
+  ] }) });
 }
 function MembersTab({
   listId,
@@ -3638,10 +4307,6 @@ function LeadGenListDetailPage({ listId }) {
                 params: { workflowId: resourceId },
                 search: { exec: executionId }
               });
-            },
-            onViewRuns: (resourceId) => {
-              setRunsResourceFilter(resourceId);
-              setActiveTab("runs");
             }
           }
         ) }),
@@ -3708,11 +4373,15 @@ function LeadGenCompaniesPage() {
   const [segmentFilter, setSegmentFilter] = useState(null);
   const [categoryFilter, setCategoryFilter] = useState(null);
   const [statusFilter, setStatusFilter] = useState(null);
-  const [selectedCompany, setSelectedCompany] = useState(null);
   const [showBatchDelete, setShowBatchDelete] = useState(false);
+  const navigate = useNavigate();
   const pagination = usePaginationState(PAGE_SIZE_DEFAULT2, [companySearch, segmentFilter, categoryFilter, statusFilter]);
   const { data: companyFacets } = useCompanyFacets();
-  const { data: pagedCompanies, isLoading: pagedCompaniesLoading, error: pagedCompaniesError } = useCompanies({
+  const {
+    data: pagedCompanies,
+    isLoading: pagedCompaniesLoading,
+    error: pagedCompaniesError
+  } = useCompanies({
     search: companySearch || void 0,
     segment: segmentFilter || void 0,
     category: categoryFilter || void 0,
@@ -3828,7 +4497,7 @@ function LeadGenCompaniesPage() {
             Table.Tr,
             {
               style: { cursor: "pointer" },
-              onClick: () => setSelectedCompany(company),
+              onClick: () => navigate({ to: "/crm/companies/$companyId", params: { companyId: company.id } }),
               children: [
                 /* @__PURE__ */ jsx(
                   Table.Td,
@@ -3870,7 +4539,6 @@ function LeadGenCompaniesPage() {
         }
       ) }) : null
     ] }) }),
-    /* @__PURE__ */ jsx(CompanyDetailModal, { company: selectedCompany, onClose: () => setSelectedCompany(null) }),
     /* @__PURE__ */ jsx(CustomModal, { opened: showBatchDelete, onClose: () => setShowBatchDelete(false), size: "sm", children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
       /* @__PURE__ */ jsxs(Group, { gap: "sm", children: [
         /* @__PURE__ */ jsx(IconAlertTriangle, { size: 20, color: "var(--mantine-color-red-6)" }),
@@ -3893,11 +4561,15 @@ function LeadGenContactsPage() {
   const [contactSearch, setContactSearch] = useState("");
   const [statusFilter, setStatusFilter] = useState(null);
   const [listFilter, setListFilter] = useState(null);
-  const [selectedContact, setSelectedContact] = useState(null);
   const [showBatchDelete, setShowBatchDelete] = useState(false);
+  const navigate = useNavigate();
   const pagination = usePaginationState(PAGE_SIZE_DEFAULT3, [contactSearch, statusFilter, listFilter]);
   const { data: lists } = useLists();
-  const { data: contacts, isLoading: contactsLoading, error: contactsError } = useContacts({
+  const {
+    data: contacts,
+    isLoading: contactsLoading,
+    error: contactsError
+  } = useContacts({
     search: contactSearch || void 0,
     contactStatus: statusFilter || void 0,
     listId: listFilter || void 0,
@@ -4000,7 +4672,7 @@ function LeadGenContactsPage() {
             Table.Tr,
             {
               style: { cursor: "pointer" },
-              onClick: () => setSelectedContact(contact),
+              onClick: () => navigate({ to: "/crm/contacts/$contactId", params: { contactId: contact.id } }),
               children: [
                 /* @__PURE__ */ jsx(
                   Table.Td,
@@ -4041,7 +4713,6 @@ function LeadGenContactsPage() {
         }
       ) }) : null
     ] }) }),
-    /* @__PURE__ */ jsx(ContactDetailModal, { contact: selectedContact, onClose: () => setSelectedContact(null) }),
     /* @__PURE__ */ jsx(CustomModal, { opened: showBatchDelete, onClose: () => setShowBatchDelete(false), size: "sm", children: /* @__PURE__ */ jsxs(Stack, { gap: "md", children: [
       /* @__PURE__ */ jsxs(Group, { gap: "sm", children: [
         /* @__PURE__ */ jsx(IconAlertTriangle, { size: 20, color: "var(--mantine-color-red-6)" }),
@@ -4060,4 +4731,4 @@ function LeadGenContactsPage() {
   ] }) });
 }
 
-export { CompanyDetailModal, ContactDetailModal, LEAD_GEN_ITEMS, LEAD_GEN_ROUTE_LINKS, LeadGenCompaniesPage, LeadGenContactsPage, LeadGenListDetailPage, LeadGenListsPage, LeadGenOverviewPage, LeadGenRouteShell, LeadGenSidebar, LeadGenSidebarMiddle, LeadGenSidebarTop, ListBuilderIndexPage, ListBuilderPage, ORPHAN_STAGE_ORDER, RunWorkflowModal, StepConfigForm, TabSection, deriveBusinessProgress, formatDate, getEnrichmentColor, getEnrichmentStatus, getStateKeyColor, getStatusColor, getStepActionLabel, leadGenManifest, resolveBuildPlanSteps, resolveBuildState, sortStageKeys, useDeleteLists };
+export { LEAD_GEN_ROUTE_LINKS, LeadGenCompaniesPage, LeadGenContactsPage, LeadGenListDetailPage, LeadGenListsPage, LeadGenOverviewPage, LeadGenRouteShell, LeadGenSidebar, LeadGenSidebarTop, ListBuilderIndexPage, ListBuilderPage, ORPHAN_STAGE_ORDER, RunWorkflowModal, StepConfigForm, TabSection, deriveBusinessProgress, formatDate, getEnrichmentColor, getEnrichmentStatus, getStateKeyColor, getStatusColor, getStepActionLabel, leadGenManifest, resolveBuildPlanSteps, resolveBuildState, sortStageKeys, useDeleteLists };