braid-ui 1.0.0 → 1.0.1

package/dist/index.js

@@ -6,10 +6,10 @@ import { cva } from 'class-variance-authority';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { ChevronDown, ChevronUp, Check, X, PanelLeft, Edit, Home, Globe, CreditCard, Building, MoreVertical, Minus, TrendingDown, TrendingUp, ChevronRight, Eye, Trash2, Upload, FileText, Download, Plus, MessageSquare, Copy, LayoutDashboard, Bell, Briefcase, FileCheck, Receipt, ArrowLeftRight, Users, Building2, Zap, Shield, AlertCircle, RefreshCw, Landmark, Search, Repeat, Box, Settings, BarChart3, Key, Heart, User, AlertTriangle, XCircle, CheckCircle, Clock, Circle, UserPlus, ChevronsUpDown } from 'lucide-react';
+import { ChevronDown, ChevronUp, Check, X, PanelLeft, Edit, Home, Globe, CreditCard, Building, MoreVertical, Minus, TrendingDown, TrendingUp, ChevronRight, Eye, Trash2, Upload, FileText, Download, Plus, MessageSquare, Copy, LayoutDashboard, Bell, Briefcase, FileCheck, Receipt, ArrowLeftRight, Users, Building2, Zap, Shield, AlertCircle, RefreshCw, Landmark, Search, Repeat, Box, Settings, BarChart3, Key, Heart, User, AlertTriangle, XCircle, CheckCircle, Clock, Filter, ChevronLeft, Calendar as Calendar$1, CheckCircle2, Circle, UserPlus, ChevronsUpDown } from 'lucide-react';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
-import { NavLink, useLocation } from 'react-router-dom';
+import { NavLink, useLocation, useParams, useNavigate } from 'react-router-dom';
 import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '@radix-ui/react-collapsible';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
@@ -21,10 +21,10 @@ import { DayPicker } from 'react-day-picker';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import { useTheme } from 'next-themes';
-import { Toaster as Toaster$1 } from 'sonner';
+import { Toaster as Toaster$1, toast as toast$1 } from 'sonner';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import * as ToastPrimitives from '@radix-ui/react-toast';
-import 'date-fns';
+import { format } from 'date-fns';
 
 // src/components/alerts/AlertDocuments.tsx
 function cn(...inputs) {
@@ -6072,7 +6072,1871 @@ function UIKitShowcase() {
     ] })
   ] }) }) });
 }
-z.object({
+
+// src/lib/mock-data/alert-data.ts
+var mockAlerts = [
+  {
+    id: "4402",
+    createdAt: "2025-09-30 03:00:21",
+    type: "Ofac",
+    status: "Unassigned",
+    contextType: "Ofac",
+    description: "INDIVIDUAL: ali hassan is flagged for OFAC",
+    timeline: [
+      { id: "1", timestamp: "2025-09-30 03:00:21", user: "System", action: "Alert Created", status: "Unassigned" },
+      { id: "2", timestamp: "2025-09-30 09:15:32", user: "John Smith", action: "Alert Assigned", details: "Assigned to compliance team", status: "In Progress" }
+    ],
+    notes: [
+      { id: "1", timestamp: "2025-09-30 10:22:15", user: "John Smith", content: "Reviewing OFAC match. Need to verify identity documents.", type: "RFI Note" },
+      { id: "2", timestamp: "2025-09-30 11:45:30", user: "Sarah Johnson", content: "Requested additional documentation from customer. Passport and proof of address needed.", type: "RFI Note" },
+      { id: "3", timestamp: "2025-09-30 14:20:45", user: "John Smith", content: "Customer responded with requested documents. Passport appears valid, reviewing address verification now.", type: "Internal Note" },
+      { id: "4", timestamp: "2025-10-01 09:10:00", user: "Michael Chen", content: "Cross-referenced with internal records. Customer has been with us for 5 years with no prior issues. Match appears to be false positive due to common name.", type: "Internal Note" }
+    ],
+    documents: [
+      {
+        id: "1",
+        name: "passport_scan.pdf",
+        type: "ID Verification",
+        description: "Customer passport for identity verification",
+        size: "2.4 MB",
+        uploadedBy: "John Smith",
+        uploadedAt: "2025-09-30 10:25:00",
+        url: "/placeholder.svg"
+      },
+      {
+        id: "2",
+        name: "proof_of_address.jpg",
+        type: "Proof of Address",
+        description: "Utility bill showing current residential address",
+        size: "1.8 MB",
+        uploadedBy: "Sarah Johnson",
+        uploadedAt: "2025-09-30 11:50:00",
+        url: "/placeholder.svg"
+      }
+    ],
+    contextData: {
+      entityName: "Ali Hassan",
+      entityType: "Individual",
+      matchScore: "95%",
+      listName: "OFAC SDN List",
+      flaggedItems: [
+        { field: "Name", value: "Ali Hassan", matchScore: "95%" },
+        { field: "DOB", value: "1985-03-12", matchScore: "100%" }
+      ],
+      sdns: [
+        {
+          uid: 12345,
+          firstName: "Ali",
+          lastName: "Hassan",
+          sdnType: "Individual",
+          programs: ["SYRIA", "SDGT"],
+          title: "Military Commander",
+          remarks: "DOB 12 Mar 1985; POB Damascus, Syria; Passport D1234567 (Syria); alt. Passport E7654321 (Lebanon); Linked to Entity XYZ",
+          nationalities: ["Syria", "Lebanon"],
+          citizenships: ["Syria"],
+          dateOfBirthList: [
+            { dateOfBirth: "1985-03-12", mainEntry: true },
+            { dateOfBirth: "1985-03-15", mainEntry: false }
+          ],
+          placeOfBirthList: [
+            { placeOfBirth: "Damascus, Syria", mainEntry: true },
+            { placeOfBirth: "Aleppo, Syria", mainEntry: false }
+          ],
+          akaList: [
+            { category: "strong", firstName: "Ali", lastName: "Al-Hassan" },
+            { category: "weak", firstName: "Ali", lastName: "Hasan" },
+            { category: "strong", firstName: "Ali Hassan", lastName: "Mohamed" }
+          ],
+          idList: [
+            { idType: "Passport", idNumber: "D1234567", idCountry: "Syria", issueDate: "2010-01-15", expirationDate: "2020-01-15" },
+            { idType: "Passport", idNumber: "E7654321", idCountry: "Lebanon", issueDate: "2015-06-20", expirationDate: "2025-06-20" },
+            { idType: "National ID", idNumber: "SY123456789", idCountry: "Syria" }
+          ]
+        }
+      ],
+      addresses: [
+        {
+          uid: 67890,
+          address1: "Building 42, Al-Mazzeh",
+          city: "Damascus",
+          stateOrProvince: "Damascus Governorate",
+          postalCode: "12345",
+          country: "Syria",
+          addressRemarks: "Primary Residence"
+        },
+        {
+          uid: 67891,
+          address1: "Apartment 15, Hamra Street",
+          city: "Beirut",
+          country: "Lebanon",
+          addressRemarks: "Secondary Address"
+        },
+        {
+          uid: 67892,
+          address1: "Office 203, Business District",
+          city: "Aleppo",
+          stateOrProvince: "Aleppo Governorate",
+          country: "Syria",
+          addressRemarks: "Business Address - Suspected Front Company"
+        }
+      ],
+      alt_names: [
+        { uid: 54321, type: "aka", category: "strong", firstName: "Ali", lastName: "Al-Hassan" },
+        { uid: 54322, type: "aka", category: "weak", firstName: "Ali", lastName: "Hasan" },
+        { uid: 54323, type: "aka", category: "strong", firstName: "Ali Hassan", lastName: "Mohamed" },
+        { uid: 54324, type: "fka", category: "weak", firstName: "Ali", lastName: "Hassani" }
+      ],
+      sanctions_entries: [
+        {
+          program: "SYRIA",
+          effectiveDate: "2015-03-15",
+          authority: "Executive Order 13572",
+          legalBasis: "Involvement in human rights abuses in Syria"
+        },
+        {
+          program: "SDGT",
+          effectiveDate: "2016-08-22",
+          authority: "Executive Order 13224",
+          legalBasis: "Specially Designated Global Terrorist"
+        }
+      ],
+      associated_entities: [
+        {
+          entityName: "XYZ Trading Company",
+          relationship: "Director",
+          entityType: "Business"
+        },
+        {
+          entityName: "Hassan Family Trust",
+          relationship: "Beneficiary",
+          entityType: "Trust"
+        }
+      ],
+      screening_metadata: {
+        screenedAt: "2025-09-30T03:00:21Z",
+        screeningEngine: "OFAC Advanced Matcher v3.2",
+        datasetVersion: "2025-09-25",
+        totalRecordsScreened: 1,
+        matchAlgorithm: "Fuzzy + Phonetic",
+        confidenceThreshold: 0.85
+      }
+    }
+  },
+  {
+    id: "4401",
+    createdAt: "2025-09-29 15:00:45",
+    type: "Ofac",
+    status: "Closed",
+    contextType: "Ofac",
+    description: "INDIVIDUAL: ali hassan is flagged for OFAC"
+  },
+  {
+    id: "4400",
+    createdAt: "2025-09-27 03:02:34",
+    type: "Ofac",
+    status: "Unassigned",
+    contextType: "Ofac",
+    description: "BUSINESS: Randy is flagged for OFAC"
+  },
+  {
+    id: "4399",
+    createdAt: "2025-09-27 03:02:31",
+    type: "Ofac",
+    status: "Unassigned",
+    contextType: "Ofac",
+    description: "BUSINESS: test is flagged for OFAC"
+  },
+  {
+    id: "4398",
+    createdAt: "2025-09-24 10:01:58",
+    type: "Transaction Processing Error",
+    status: "Unassigned",
+    contextType: "File Record",
+    description: "Inbound WIRE for $100,000.00 can not be processed. Exception: incorrect account..."
+  },
+  {
+    id: "4397",
+    createdAt: "2025-09-22 20:33:59",
+    type: "Dual Approval",
+    status: "Unassigned",
+    contextType: "Transaction",
+    description: "Debit adjustment for $20.00 for account number 84804949"
+  },
+  {
+    id: "4396",
+    createdAt: "2025-09-22 20:33:12",
+    type: "Transaction Monitoring",
+    status: "Unassigned",
+    contextType: "Transaction",
+    description: "Transaction WIRE_INTERNATIONAL_DEBIT of $3,000.00 is flagged for velocity li..."
+  },
+  {
+    id: "4395",
+    createdAt: "2025-09-13 03:02:29",
+    type: "Ofac",
+    status: "Closed",
+    contextType: "Ofac",
+    rfiStatus: "Completed",
+    description: "BUSINESS: test is flagged for OFAC"
+  },
+  {
+    id: "4394",
+    createdAt: "2025-09-11 07:46:28",
+    type: "Dual Approval",
+    status: "Closed",
+    contextType: "Product",
+    description: "Product 2787 is set for deactivation"
+  },
+  {
+    id: "4393",
+    createdAt: "2025-09-11 07:46:17",
+    type: "Dual Approval",
+    status: "Unassigned",
+    contextType: "Product",
+    description: "Product 2787 is set for deactivation"
+  },
+  {
+    id: "4392",
+    createdAt: "2025-09-10 14:44:46",
+    type: "Transaction Monitoring",
+    status: "Closed",
+    contextType: "Transaction",
+    rfiStatus: "Provided",
+    description: "Transaction WIRE_DOMESTIC_CREDIT of $30,000.00 is flagged for velocity limit ..."
+  }
+];
+var RFI_STATUS_OPTIONS = [
+  { value: "Completed", label: "Completed" },
+  { value: "Provided", label: "Provided" },
+  { value: "Pending", label: "Pending" }
+];
+var ASSIGNEE_OPTIONS = [
+  { value: "John Smith", label: "John Smith" },
+  { value: "Sarah Johnson", label: "Sarah Johnson" },
+  { value: "Michael Chen", label: "Michael Chen" },
+  { value: "approverdev", label: "approverdev" },
+  { value: "Unassigned", label: "Unassigned" }
+];
+var AlertDetail = () => {
+  const { id } = useParams();
+  const navigate = useNavigate();
+  const alert = mockAlerts.find((a) => a.id === id);
+  const [rfiStatus, setRfiStatus] = useState(alert?.rfiStatus || "");
+  const [assignee, setAssignee] = useState(alert?.assignee || "Unassigned");
+  const handleRfiStatusChange = (newStatus) => {
+    setRfiStatus(newStatus);
+    console.log("RFI Status updated to:", newStatus);
+  };
+  const handleAssigneeChange = (newAssignee) => {
+    setAssignee(newAssignee);
+    console.log("Assignee updated to:", newAssignee);
+  };
+  if (!alert) {
+    return /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 py-8", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold mb-2", children: "Alert Not Found" }),
+      /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground mb-4", children: [
+        "The alert #",
+        id,
+        " could not be found."
+      ] }),
+      /* @__PURE__ */ jsx(Button, { onClick: () => navigate("/alerts"), children: "Back to Alerts" })
+    ] }) });
+  }
+  const getTypeBadgeVariant = (type) => {
+    switch (type) {
+      case "Ofac":
+        return "alert-ofac";
+      case "Dual Approval":
+        return "alert-dual";
+      case "Transaction Monitoring":
+        return "alert-monitoring";
+      case "Transaction Processing Error":
+        return "alert-error";
+      default:
+        return "outline";
+    }
+  };
+  const getStatusColor = (status) => {
+    switch (status) {
+      case "Unassigned":
+        return "text-destructive";
+      case "Closed":
+        return "text-success";
+      case "In Progress":
+        return "text-warning";
+      default:
+        return "";
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: `Alert #${alert.id}`,
+      description: alert.description,
+      maxWidth: "full",
+      actions: [
+        {
+          label: "Back to Alerts",
+          variant: "outline",
+          onClick: () => navigate("/alerts")
+        },
+        {
+          label: "Assign",
+          variant: "outline",
+          onClick: () => console.log("Assign alert")
+        },
+        {
+          label: "Close Alert",
+          variant: "default",
+          onClick: () => console.log("Close alert")
+        }
+      ],
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row gap-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
+          /* @__PURE__ */ jsx(
+            FormCard,
+            {
+              title: "Alert Information",
+              headerActions: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", children: /* @__PURE__ */ jsx(Edit, { className: "h-4 w-4" }) }),
+              children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+                /* @__PURE__ */ jsx(InfoField, { label: "Alert ID", value: alert.id }),
+                /* @__PURE__ */ jsx(
+                  InfoField,
+                  {
+                    label: "Type",
+                    value: /* @__PURE__ */ jsx(Badge, { variant: getTypeBadgeVariant(alert.type), children: alert.type })
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  InfoField,
+                  {
+                    label: "Status",
+                    value: /* @__PURE__ */ jsx("span", { className: cn("font-medium", getStatusColor(alert.status)), children: alert.status })
+                  }
+                ),
+                /* @__PURE__ */ jsx(InfoField, { label: "Created At", value: alert.createdAt }),
+                /* @__PURE__ */ jsx(
+                  InfoField,
+                  {
+                    label: "Context Type",
+                    value: /* @__PURE__ */ jsx(Badge, { variant: "outline", children: alert.contextType })
+                  }
+                ),
+                /* @__PURE__ */ jsx(InfoField, { label: "Context ID", value: alert.contextId || "N/A" }),
+                /* @__PURE__ */ jsx(
+                  EditableInfoField,
+                  {
+                    label: "Assignee",
+                    value: assignee,
+                    options: ASSIGNEE_OPTIONS,
+                    onChange: handleAssigneeChange,
+                    placeholder: "Unassigned"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  EditableInfoField,
+                  {
+                    label: "RFI Status",
+                    value: rfiStatus,
+                    options: RFI_STATUS_OPTIONS,
+                    onChange: handleRfiStatusChange,
+                    placeholder: "Select status",
+                    renderValue: (value) => /* @__PURE__ */ jsx(Badge, { variant: "success", children: value })
+                  }
+                ),
+                /* @__PURE__ */ jsx("div", { className: "col-span-2", children: /* @__PURE__ */ jsx(InfoField, { label: "Description", value: alert.description }) })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsx(ContextSection, { alert }),
+          /* @__PURE__ */ jsx(FormCard, { title: "Notes", children: /* @__PURE__ */ jsx(AlertNotes, { alertId: alert.id, notes: alert.notes || [] }) }),
+          /* @__PURE__ */ jsx(FormCard, { title: "Documents", children: /* @__PURE__ */ jsx(AlertDocuments, { alertId: alert.id, documents: alert.documents || [] }) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(FormCard, { title: "Status Timeline", className: "h-full", children: /* @__PURE__ */ jsx(AlertTimeline, { events: alert.timeline || [] }) }) })
+      ] })
+    }
+  );
+};
+var AlertDetail_default = AlertDetail;
+var Alerts = () => {
+  const navigate = useNavigate();
+  const [filters, setFilters] = useState({
+    alertId: "",
+    contextId: "",
+    contextType: "",
+    alertType: "",
+    alertStatus: "",
+    assignee: "",
+    rfiStatus: "",
+    startDate: "",
+    endDate: ""
+  });
+  const [filteredAlerts, setFilteredAlerts] = useState(mockAlerts);
+  const [currentPage, setCurrentPage] = useState(1);
+  const [rowsPerPage, setRowsPerPage] = useState(100);
+  const handleFilterChange = (field, value) => {
+    setFilters((prev) => ({ ...prev, [field]: value }));
+  };
+  const applyFilters = () => {
+    let filtered = mockAlerts;
+    if (filters.alertId) {
+      filtered = filtered.filter((alert) => alert.id.includes(filters.alertId));
+    }
+    if (filters.alertStatus) {
+      filtered = filtered.filter((alert) => alert.status === filters.alertStatus);
+    }
+    if (filters.alertType) {
+      filtered = filtered.filter((alert) => alert.type === filters.alertType);
+    }
+    if (filters.contextType) {
+      filtered = filtered.filter((alert) => alert.contextType === filters.contextType);
+    }
+    if (filters.rfiStatus) {
+      filtered = filtered.filter((alert) => alert.rfiStatus === filters.rfiStatus);
+    }
+    setFilteredAlerts(filtered);
+    setCurrentPage(1);
+  };
+  const resetFilters = () => {
+    setFilters({
+      alertId: "",
+      contextId: "",
+      contextType: "",
+      alertType: "",
+      alertStatus: "",
+      assignee: "",
+      rfiStatus: "",
+      startDate: "",
+      endDate: ""
+    });
+    setFilteredAlerts(mockAlerts);
+    setCurrentPage(1);
+  };
+  const getTypeBadgeVariant = (type) => {
+    switch (type) {
+      case "Ofac":
+        return "alert-ofac";
+      case "Dual Approval":
+        return "alert-dual";
+      case "Transaction Monitoring":
+        return "alert-monitoring";
+      case "Transaction Processing Error":
+        return "alert-error";
+      default:
+        return "outline";
+    }
+  };
+  const getStatusColor = (status) => {
+    switch (status) {
+      case "Unassigned":
+        return "text-destructive";
+      case "Closed":
+        return "text-success";
+      case "In Progress":
+        return "text-warning";
+      default:
+        return "";
+    }
+  };
+  const totalPages = Math.ceil(filteredAlerts.length / rowsPerPage);
+  const startIndex = (currentPage - 1) * rowsPerPage;
+  const endIndex = startIndex + rowsPerPage;
+  const paginatedAlerts = filteredAlerts.slice(startIndex, endIndex);
+  const handlePageChange = (newPage) => {
+    if (newPage >= 1 && newPage <= totalPages) {
+      setCurrentPage(newPage);
+    }
+  };
+  const handleRowsPerPageChange = (value) => {
+    setRowsPerPage(value);
+    setCurrentPage(1);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-screen bg-gradient-subtle", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex-none border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60", children: /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 py-4 max-w-none", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-foreground", children: "Alerts" }),
+      /* @__PURE__ */ jsxs(Sheet, { children: [
+        /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", className: "gap-2", children: [
+          /* @__PURE__ */ jsx(Filter, { className: "h-4 w-4" }),
+          "Filters"
+        ] }) }),
+        /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "w-full sm:max-w-xl overflow-y-auto", children: [
+          /* @__PURE__ */ jsx(SheetHeader, { children: /* @__PURE__ */ jsx(SheetTitle, { children: "Alert Filters" }) }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-6 py-6", children: [
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Alert ID",
+                value: filters.alertId,
+                onChange: (e) => handleFilterChange("alertId", e.target.value),
+                placeholder: "Enter alert ID"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Context ID",
+                value: filters.contextId,
+                onChange: (e) => handleFilterChange("contextId", e.target.value),
+                placeholder: "Enter context ID"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Context Type",
+                value: filters.contextType,
+                onValueChange: (value) => handleFilterChange("contextType", value),
+                placeholder: "Select context type",
+                options: [
+                  { value: "Ofac", label: "Ofac" },
+                  { value: "Transaction", label: "Transaction" },
+                  { value: "Product", label: "Product" },
+                  { value: "File Record", label: "File Record" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Alert Type",
+                value: filters.alertType,
+                onValueChange: (value) => handleFilterChange("alertType", value),
+                placeholder: "Select alert type",
+                options: [
+                  { value: "Ofac", label: "Ofac" },
+                  { value: "Dual Approval", label: "Dual Approval" },
+                  { value: "Transaction Monitoring", label: "Transaction Monitoring" },
+                  { value: "Transaction Processing Error", label: "Transaction Processing Error" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Alert Status",
+                value: filters.alertStatus,
+                onValueChange: (value) => handleFilterChange("alertStatus", value),
+                placeholder: "Select status",
+                options: [
+                  { value: "Unassigned", label: "Unassigned" },
+                  { value: "Closed", label: "Closed" },
+                  { value: "In Progress", label: "In Progress" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Assignee",
+                value: filters.assignee,
+                onChange: (e) => handleFilterChange("assignee", e.target.value),
+                placeholder: "Enter assignee name"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "RFI Status",
+                value: filters.rfiStatus,
+                onValueChange: (value) => handleFilterChange("rfiStatus", value),
+                placeholder: "Select RFI status",
+                options: [
+                  { value: "Completed", label: "Completed" },
+                  { value: "Provided", label: "Provided" },
+                  { value: "Pending", label: "Pending" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "Start Date",
+                  type: "date",
+                  value: filters.startDate,
+                  onChange: (e) => handleFilterChange("startDate", e.target.value)
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "End Date",
+                  type: "date",
+                  value: filters.endDate,
+                  onChange: (e) => handleFilterChange("endDate", e.target.value)
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(SheetFooter, { className: "gap-2", children: [
+            /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: resetFilters, children: "Reset Filters" }),
+            /* @__PURE__ */ jsx(Button, { onClick: applyFilters, children: "Apply Filters" })
+          ] })
+        ] })
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 h-full max-w-none flex flex-col", children: /* @__PURE__ */ jsxs("div", { className: "flex-1 mt-4 rounded-lg border bg-card overflow-hidden flex flex-col", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full table-fixed", children: [
+        /* @__PURE__ */ jsxs("colgroup", { children: [
+          /* @__PURE__ */ jsx("col", { className: "w-28" }),
+          /* @__PURE__ */ jsx("col", { className: "w-36" }),
+          /* @__PURE__ */ jsx("col", { className: "w-52" }),
+          /* @__PURE__ */ jsx("col", { className: "w-32" }),
+          /* @__PURE__ */ jsx("col", { className: "w-36" }),
+          /* @__PURE__ */ jsx("col", { className: "w-32" }),
+          /* @__PURE__ */ jsx("col", { className: "w-auto" })
+        ] }),
+        /* @__PURE__ */ jsx("thead", { className: "sticky top-0 bg-card z-10 shadow-sm", children: /* @__PURE__ */ jsxs("tr", { className: "border-b", children: [
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Alert ID" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Created At" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Type" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Status" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Context Type" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "RFI Status" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Description" })
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { children: paginatedAlerts.map((alert) => /* @__PURE__ */ jsxs(
+          "tr",
+          {
+            className: "border-b hover:bg-muted/50 transition-colors cursor-pointer",
+            onClick: () => navigate(`/alerts/${alert.id}`),
+            children: [
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs", children: alert.id }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs", children: alert.createdAt }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx(Badge, { variant: getTypeBadgeVariant(alert.type), className: "whitespace-nowrap", children: alert.type }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx("span", { className: cn("text-xs font-medium", getStatusColor(alert.status)), children: alert.status }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "whitespace-nowrap", children: alert.contextType }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: alert.rfiStatus && /* @__PURE__ */ jsx(Badge, { variant: "success", className: "whitespace-nowrap", children: alert.rfiStatus }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs truncate", children: alert.description })
+            ]
+          },
+          alert.id
+        )) })
+      ] }) }),
+      /* @__PURE__ */ jsx("div", { className: "flex-none border-t bg-background py-3 px-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Rows per page:" }),
+          /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+            /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", className: "h-8 gap-1", children: [
+              rowsPerPage,
+              /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 rotate-90" })
+            ] }) }),
+            /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", className: "bg-background z-50", children: [
+              /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => handleRowsPerPageChange(100), children: "100" }),
+              /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => handleRowsPerPageChange(200), children: "200" }),
+              /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => handleRowsPerPageChange(500), children: "500" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground", children: [
+            "Page ",
+            currentPage,
+            " of ",
+            totalPages
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "sm",
+                className: "h-8 w-8 p-0",
+                onClick: () => handlePageChange(currentPage - 1),
+                disabled: currentPage === 1,
+                children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "sm",
+                className: "h-8 w-8 p-0",
+                onClick: () => handlePageChange(currentPage + 1),
+                disabled: currentPage === totalPages,
+                children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
+              }
+            )
+          ] })
+        ] })
+      ] }) })
+    ] }) }) })
+  ] });
+};
+var Alerts_default = Alerts;
+var Business = () => {
+  return /* @__PURE__ */ jsx(
+    DetailPageLayout,
+    {
+      title: "Business Management",
+      description: "Manage business entities and their configurations",
+      cards: [
+        {
+          key: "profile",
+          component: BusinessProfileCard,
+          expandOnEdit: true
+        },
+        {
+          key: "status",
+          component: BusinessStatusCard,
+          expandOnEdit: true
+        },
+        {
+          key: "contact",
+          component: ContactInfoCard,
+          expandOnEdit: true
+        },
+        {
+          key: "banking",
+          component: BankingDetailsCard,
+          expandOnEdit: true
+        }
+      ],
+      actions: [
+        {
+          label: "Export Data",
+          variant: "outline"
+        },
+        {
+          label: "Edit Business",
+          className: "bg-gradient-primary hover:opacity-90"
+        }
+      ]
+    }
+  );
+};
+var Business_default = Business;
+var CreateBusiness = () => {
+  const [businessType, setBusinessType] = useState("");
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "Create Business",
+      description: "Create a new business entity with all required information",
+      actions: [
+        { label: "Cancel", variant: "outline", onClick: () => {
+        } },
+        { label: "Create Business", variant: "default", onClick: () => {
+        } }
+      ],
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+        /* @__PURE__ */ jsxs(Card, { className: "p-6", children: [
+          /* @__PURE__ */ jsxs("div", { className: "border-b border-border pb-4 mb-6", children: [
+            /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Business Information" }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Basic business details and identification" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: [
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Business Name",
+                placeholder: "Enter business name",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Legal Name",
+                placeholder: "Enter legal business name",
+                hint: "Official registered business name"
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+              /* @__PURE__ */ jsx(
+                EnhancedSelect,
+                {
+                  label: "Business Type",
+                  placeholder: "Select business type",
+                  value: businessType,
+                  onValueChange: setBusinessType,
+                  options: [
+                    { value: "corporation", label: "Corporation" },
+                    { value: "llc", label: "LLC" },
+                    { value: "partnership", label: "Partnership" },
+                    { value: "sole_proprietorship", label: "Sole Proprietorship" }
+                  ]
+                }
+              ),
+              businessType && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "Preview:" }),
+                /* @__PURE__ */ jsx(BusinessTypeBadge, { type: businessType })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Tax ID (EIN)",
+                placeholder: "12-3456789",
+                hint: "Employer Identification Number",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Registration Number",
+                placeholder: "Enter registration number",
+                hint: "State business registration number"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Industry",
+                placeholder: "Select industry",
+                options: [
+                  { value: "technology", label: "Technology" },
+                  { value: "finance", label: "Finance" },
+                  { value: "healthcare", label: "Healthcare" },
+                  { value: "manufacturing", label: "Manufacturing" },
+                  { value: "retail", label: "Retail" },
+                  { value: "other", label: "Other" }
+                ]
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Card, { className: "p-6", children: [
+          /* @__PURE__ */ jsxs("div", { className: "border-b border-border pb-4 mb-6", children: [
+            /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Contact Information" }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Business address and contact details" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: [
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Street Address",
+                placeholder: "Enter street address",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "City",
+                placeholder: "Enter city",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "State",
+                placeholder: "Enter state",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Postal Code",
+                placeholder: "12345",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Country",
+                placeholder: "Select country",
+                options: [
+                  { value: "US", label: "United States" },
+                  { value: "CA", label: "Canada" },
+                  { value: "GB", label: "United Kingdom" },
+                  { value: "DE", label: "Germany" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Phone Number",
+                placeholder: "+1 (555) 123-4567",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Email Address",
+                placeholder: "contact@business.com",
+                type: "email",
+                required: true
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Website",
+                placeholder: "https://www.business.com",
+                type: "url"
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(Card, { className: "p-6", children: [
+          /* @__PURE__ */ jsxs("div", { className: "border-b border-border pb-4 mb-6", children: [
+            /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Additional Information" }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Optional business description and notes" })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "space-y-6", children: /* @__PURE__ */ jsx(
+            EnhancedTextarea,
+            {
+              label: "Business Description",
+              placeholder: "Describe your business activities and services",
+              hint: "Brief description of what your business does"
+            }
+          ) })
+        ] })
+      ] })
+    }
+  );
+};
+var Create_default = CreateBusiness;
+var Cases = () => {
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "Cases",
+      description: "Manage and track investigation cases",
+      children: /* @__PURE__ */ jsx("div", { className: "text-center py-12 text-muted-foreground", children: "Cases content coming soon" })
+    }
+  );
+};
+var Cases_default = Cases;
+var CreateCounterparty = () => {
+  const [counterpartyData, setCounterpartyData] = useState(null);
+  const handleBasicInfoChange = (data) => {
+    setCounterpartyData(data);
+  };
+  const handleSubmit = () => {
+    console.log("Creating counterparty with data:", counterpartyData);
+  };
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "Create Counterparty",
+      description: "Create a new counterparty with all required information",
+      actions: [
+        { label: "Cancel", variant: "outline", onClick: () => {
+        } },
+        { label: "Create Counterparty", variant: "default", onClick: handleSubmit }
+      ],
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+        /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { className: "p-6", children: /* @__PURE__ */ jsx(CounterpartyBasicInfo, { onDataChange: handleBasicInfoChange }) }) }),
+        /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, { className: "p-6", children: /* @__PURE__ */ jsx(PaymentInformationSection, {}) }) })
+      ] })
+    }
+  );
+};
+var Create_default2 = CreateCounterparty;
+var CounterpartyDomesticWire = () => {
+  const { isEditing, handleToggleEdit, handleSave, handleCancel } = useEditState({});
+  const [transferType, setTransferType] = useState("DOMESTIC");
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "Counterparty Domestic Wire",
+      description: "Manage domestic wire transfer configurations and beneficiary information",
+      actions: !isEditing ? [
+        { label: "Cancel", variant: "outline", onClick: () => {
+        } },
+        { label: "Save Domestic Wire Configuration", variant: "default", onClick: () => {
+        } }
+      ] : void 0,
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-8", children: [
+        /* @__PURE__ */ jsx(BasicInfoCard, {}),
+        /* @__PURE__ */ jsx(Separator, { className: "my-8" }),
+        /* @__PURE__ */ jsx(
+          FormCard,
+          {
+            title: "Domestic Wire Transfer Configuration",
+            description: "Configure domestic wire transfer settings and beneficiary information",
+            headerActions: /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: isEditing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                EnhancedSelect,
+                {
+                  value: transferType,
+                  onValueChange: setTransferType,
+                  options: [
+                    { value: "DOMESTIC", label: "DOMESTIC" },
+                    { value: "INTERNATIONAL", label: "INTERNATIONAL" }
+                  ],
+                  placeholder: "Select transfer type"
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onClick: handleCancel, children: "Cancel" }),
+              /* @__PURE__ */ jsx(Button, { size: "sm", onClick: handleSave, children: "Save" })
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx("span", { className: "inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-secondary text-secondary-foreground", children: transferType }),
+              /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon", onClick: handleToggleEdit, className: "text-primary hover:text-primary/80 hover:bg-primary/10", children: /* @__PURE__ */ jsx(Edit, { className: "h-4 w-4" }) })
+            ] }) }),
+            children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
+              /* @__PURE__ */ jsx(ReceiverCard, { isEditing, hideActions: true }),
+              /* @__PURE__ */ jsx(BeneficiaryCard, { isEditing, hideActions: true })
+            ] })
+          }
+        )
+      ] })
+    }
+  );
+};
+var DomesticWire_default = CounterpartyDomesticWire;
+var CounterpartyManage = () => {
+  const {
+    isEditing: isBasicEditing,
+    handleToggleEdit: handleBasicToggleEdit
+  } = useEditState({});
+  const {
+    isEditing: isWireEditing,
+    handleToggleEdit: handleWireToggleEdit
+  } = useEditState({});
+  const {
+    isEditing: isACHEditing,
+    handleToggleEdit: handleACHToggleEdit
+  } = useEditState({});
+  const pageCards = [
+    {
+      key: "basic-info",
+      component: BasicInfoSection,
+      props: {
+        isEditing: isBasicEditing,
+        onToggleEdit: handleBasicToggleEdit
+      }
+    },
+    {
+      key: "wire-transfer",
+      component: WireTransferSection,
+      props: {
+        isEditing: isWireEditing,
+        onToggleEdit: handleWireToggleEdit
+      }
+    },
+    {
+      key: "ach-transfer",
+      component: ACHTransferSection,
+      props: {
+        isEditing: isACHEditing,
+        onToggleEdit: handleACHToggleEdit
+      }
+    }
+  ];
+  const pageActions = !isBasicEditing && !isWireEditing && !isACHEditing ? [
+    {
+      label: "Cancel",
+      variant: "outline",
+      onClick: () => {
+      }
+    },
+    {
+      label: "Save Configuration",
+      variant: "default",
+      onClick: () => {
+      }
+    }
+  ] : [];
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "Counterparty Management",
+      description: "Manage counterparty details and payment configurations",
+      mode: "cards",
+      cards: pageCards,
+      actions: pageActions,
+      maxWidth: "lg",
+      gridCols: 1
+    }
+  );
+};
+var Manage_default = CounterpartyManage;
+var Dashboard = () => {
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "Dashboard",
+      description: "Overview of your system metrics and activity",
+      children: /* @__PURE__ */ jsx("div", { className: "text-center py-12 text-muted-foreground", children: "Dashboard content coming soon" })
+    }
+  );
+};
+var Dashboard_default = Dashboard;
+var NotFound = () => {
+  const location = useLocation();
+  useEffect(() => {
+    console.error(
+      "404 Error: User attempted to access non-existent route:",
+      location.pathname
+    );
+  }, [location.pathname]);
+  return /* @__PURE__ */ jsx("div", { className: "min-h-screen flex items-center justify-center bg-gray-100", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+    /* @__PURE__ */ jsx("h1", { className: "text-4xl font-bold mb-4", children: "404" }),
+    /* @__PURE__ */ jsx("p", { className: "text-xl text-gray-600 mb-4", children: "Oops! Page not found" }),
+    /* @__PURE__ */ jsx("a", { href: "/", className: "text-blue-500 hover:text-blue-700 underline", children: "Return to Home" })
+  ] }) });
+};
+var NotFound_default = NotFound;
+
+// src/lib/mock-data/transaction-data.ts
+var mockTransactions = [
+  {
+    id: "1",
+    created: "2025-10-01 00:16",
+    accountNumber: "126713605718",
+    amount: -7293.32,
+    customer: "Rise Works Inc",
+    counterparty: "VEDANT JAYESHKUMAR PATI",
+    description: "4NnuJKyD9a8LUmkm",
+    transactionType: "Ach Originator Credit",
+    status: "PENDING",
+    updated: "2025-10-01 00:16",
+    achDetails: {
+      type: "ACH Credit",
+      originatorName: "Rise Works Inc",
+      originatorAccountNumber: "126713605718",
+      receiverName: "VEDANT JAYESHKUMAR PATI",
+      receiverAccountNumber: "9876543210",
+      receiverRoutingNumber: "021000021",
+      amount: 7293.32,
+      secCode: "CCD",
+      companyEntryDescription: "PAYROLL",
+      companyDiscretionaryData: "4NnuJKyD9a8LUmkm",
+      individualIdNumber: "1234567890",
+      individualName: "VEDANT JAYESHKUMAR PATI",
+      traceNumber: "021000021234567",
+      raw: {
+        recordType: "6",
+        transactionCode: "22",
+        receivingDFIIdentification: "02100002",
+        checkDigit: "1",
+        DFIAccountNumber: "9876543210",
+        amount: "0000729332",
+        individualIdentificationNumber: "1234567890",
+        individualName: "VEDANT JAYESHKUMAR PA",
+        discretionaryData: "  ",
+        addendaRecordIndicator: "0",
+        traceNumber: "021000021234567",
+        batchHeader: {
+          recordType: "5",
+          serviceClassCode: "200",
+          companyName: "RISE WORKS INC",
+          companyDiscretionaryData: "4NnuJKyD9a8LU",
+          companyIdentification: "1234567890",
+          standardEntryClassCode: "CCD",
+          companyEntryDescription: "PAYROLL",
+          companyDescriptiveDate: "251001",
+          effectiveEntryDate: "251001",
+          settlementDate: "   ",
+          originatorStatusCode: "1",
+          originatingDFIIdentification: "02100002",
+          batchNumber: "0000001"
+        }
+      }
+    }
+  },
+  {
+    id: "2",
+    created: "2025-10-01 00:09",
+    accountNumber: "899606565333",
+    amount: 0.5,
+    customer: "SSB Bank",
+    counterparty: "Maung Lwin",
+    description: "ACH Fee",
+    transactionType: "Fee Ach Transaction",
+    status: "POSTED",
+    updated: "2025-10-01 00:09"
+  },
+  {
+    id: "3",
+    created: "2025-09-30 23:45",
+    accountNumber: "445821903456",
+    amount: 15e3,
+    customer: "Tech Solutions LLC",
+    counterparty: "Global Suppliers Inc",
+    description: "Invoice Payment #INV-2024-089",
+    transactionType: "Wire Domestic Credit",
+    status: "POSTED",
+    updated: "2025-10-01 00:12",
+    wireDetails: {
+      type: "Domestic Wire",
+      originatorName: "Tech Solutions LLC",
+      originatorAccountNumber: "445821903456",
+      originatorAddress: "123 Tech Street, San Francisco, CA 94105",
+      beneficiaryName: "Global Suppliers Inc",
+      beneficiaryAccountNumber: "998877665544",
+      beneficiaryAddress: "456 Supply Avenue, New York, NY 10001",
+      beneficiaryFIName: "Chase Bank",
+      beneficiaryFIRoutingNumber: "021000021",
+      beneficiaryFIAddress: "270 Park Avenue, New York, NY 10017",
+      originatorFIName: "Wells Fargo Bank",
+      originatorFIRoutingNumber: "121000248",
+      originatorFIAddress: "420 Montgomery Street, San Francisco, CA 94104",
+      intermediaryFIName: "Bank of America",
+      intermediaryFIRoutingNumber: "026009593",
+      intermediaryFIAddress: "100 Federal Street, Boston, MA 02110",
+      raw: {
+        messageType: "MT103",
+        sender: "WFBIUS6SXXX",
+        receiver: "CHASUS33XXX",
+        transactionReference: "INV-2024-089-TXN-001",
+        relatedReference: "INV-2024-089",
+        bankOperationCode: "CRED",
+        instructionCode: "CHQB",
+        valueDate: "2025-09-30",
+        currency: "USD",
+        amount: "15000.00",
+        orderingCustomer: {
+          account: "445821903456",
+          name: "Tech Solutions LLC",
+          address: [
+            "123 Tech Street",
+            "San Francisco, CA 94105",
+            "United States"
+          ]
+        },
+        orderingInstitution: {
+          bic: "WFBIUS6SXXX",
+          name: "Wells Fargo Bank N.A.",
+          address: [
+            "420 Montgomery Street",
+            "San Francisco, CA 94104"
+          ]
+        },
+        intermediaryInstitution: {
+          bic: "BOFAUS3NXXX",
+          name: "Bank of America N.A.",
+          clearingCode: "026009593",
+          address: [
+            "100 Federal Street",
+            "Boston, MA 02110"
+          ]
+        },
+        beneficiaryInstitution: {
+          bic: "CHASUS33XXX",
+          name: "JPMorgan Chase Bank N.A.",
+          clearingCode: "021000021",
+          address: [
+            "270 Park Avenue",
+            "New York, NY 10017"
+          ]
+        },
+        beneficiaryCustomer: {
+          account: "998877665544",
+          name: "Global Suppliers Inc",
+          address: [
+            "456 Supply Avenue",
+            "New York, NY 10001",
+            "United States"
+          ]
+        },
+        remittanceInformation: "Invoice Payment for INV-2024-089 - Equipment Purchase",
+        regulatoryReporting: {
+          code: "BENEFRES",
+          country: "US",
+          narrative: "Payment for goods"
+        },
+        senderToReceiverInformation: [
+          "Payment for invoice INV-2024-089",
+          "Equipment and supplies purchase",
+          "Net 30 terms - On time payment"
+        ],
+        chargeDetails: "OUR"
+      }
+    }
+  },
+  {
+    id: "4",
+    created: "2025-09-30 22:18",
+    accountNumber: "778901234567",
+    amount: -2500.75,
+    customer: "Metro Business Group",
+    counterparty: "Pacific Trading Co",
+    description: "Vendor Payment",
+    transactionType: "Ach Originator Debit",
+    status: "POSTED",
+    updated: "2025-09-30 23:01"
+  },
+  {
+    id: "5",
+    created: "2025-09-30 21:05",
+    accountNumber: "334455667788",
+    amount: 500,
+    customer: "Sunrise Enterprises",
+    counterparty: "John Mitchell",
+    description: "Contractor Payment",
+    transactionType: "Ach Originator Credit",
+    status: "PENDING",
+    updated: "2025-09-30 21:05"
+  },
+  {
+    id: "6",
+    created: "2025-09-30 19:30",
+    accountNumber: "998877665544",
+    amount: -125e3,
+    customer: "Real Estate Holdings",
+    counterparty: "Property Management LLC",
+    description: "Monthly Rent Payment",
+    transactionType: "Wire Domestic Debit",
+    status: "POSTED",
+    updated: "2025-09-30 20:15"
+  },
+  {
+    id: "7",
+    created: "2025-09-30 17:22",
+    accountNumber: "556677889900",
+    amount: 3,
+    customer: "First National Bank",
+    counterparty: "Sarah Johnson",
+    description: "Wire Transfer Fee",
+    transactionType: "Fee Wire Transaction",
+    status: "POSTED",
+    updated: "2025-09-30 17:22"
+  },
+  {
+    id: "8",
+    created: "2025-09-30 15:40",
+    accountNumber: "223344556677",
+    amount: 8750.5,
+    customer: "Innovation Labs Inc",
+    counterparty: "Research Partners",
+    description: "R&D Funding Transfer",
+    transactionType: "Ach Originator Credit",
+    status: "FAILED",
+    updated: "2025-09-30 16:10"
+  }
+];
+var mockTransactionTimeline = [
+  {
+    id: "1",
+    action: "Transaction Created",
+    user: "System",
+    details: "Transaction initiated via API",
+    status: "Pending",
+    timestamp: "2025-10-01 00:16:23"
+  },
+  {
+    id: "2",
+    action: "Validation Completed",
+    user: "System",
+    details: "All validation checks passed",
+    timestamp: "2025-10-01 00:16:45"
+  },
+  {
+    id: "3",
+    action: "Assigned for Review",
+    user: "approverdev",
+    details: "Transaction assigned to compliance team",
+    status: "In Progress",
+    timestamp: "2025-10-01 00:17:12"
+  },
+  {
+    id: "4",
+    action: "Compliance Review",
+    user: "Sarah Johnson",
+    details: "AML and sanctions screening completed",
+    timestamp: "2025-10-01 00:18:30"
+  },
+  {
+    id: "5",
+    action: "Approved",
+    user: "Michael Chen",
+    details: "Transaction approved for processing",
+    status: "Closed",
+    timestamp: "2025-10-01 00:19:45"
+  }
+];
+var TransactionHistory = () => {
+  const navigate = useNavigate();
+  const [currentPage, setCurrentPage] = useState(1);
+  const [rowsPerPage, setRowsPerPage] = useState(100);
+  const [filters, setFilters] = useState({
+    accountNumber: "",
+    product: "",
+    customerId: "",
+    counterpartyId: "",
+    settlementFileName: "",
+    originalFileName: "",
+    requesterIpAddress: "",
+    requesterUsername: "",
+    wireFileHandle: "",
+    paymentId: "",
+    transactionType: "",
+    transactionStatus: "",
+    processingStatus: "",
+    direction: "",
+    minAmount: "",
+    maxAmount: "",
+    creationDateStart: void 0,
+    creationDateEnd: void 0,
+    postDateStart: void 0,
+    postDateEnd: void 0
+  });
+  const handleFilterChange = (field, value) => {
+    setFilters((prev) => ({ ...prev, [field]: value }));
+  };
+  const applyFilters = () => {
+    console.log("Applying filters:", filters);
+  };
+  const resetFilters = () => {
+    setFilters({
+      accountNumber: "",
+      product: "",
+      customerId: "",
+      counterpartyId: "",
+      settlementFileName: "",
+      originalFileName: "",
+      requesterIpAddress: "",
+      requesterUsername: "",
+      wireFileHandle: "",
+      paymentId: "",
+      transactionType: "",
+      transactionStatus: "",
+      processingStatus: "",
+      direction: "",
+      minAmount: "",
+      maxAmount: "",
+      creationDateStart: void 0,
+      creationDateEnd: void 0,
+      postDateStart: void 0,
+      postDateEnd: void 0
+    });
+  };
+  const totalPages = Math.ceil(mockTransactions.length / rowsPerPage);
+  const startIndex = (currentPage - 1) * rowsPerPage;
+  const endIndex = startIndex + rowsPerPage;
+  const paginatedTransactions = mockTransactions.slice(startIndex, endIndex);
+  const handlePageChange = (newPage) => {
+    if (newPage >= 1 && newPage <= totalPages) {
+      setCurrentPage(newPage);
+    }
+  };
+  const handleRowsPerPageChange = (value) => {
+    setRowsPerPage(value);
+    setCurrentPage(1);
+  };
+  const formatCurrency = (value) => {
+    const formatted = new Intl.NumberFormat("en-US", {
+      style: "currency",
+      currency: "USD",
+      minimumFractionDigits: 2
+    }).format(value);
+    return formatted;
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-screen bg-gradient-subtle", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex-none border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60", children: /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 py-4 max-w-none", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-foreground", children: "Transaction History" }),
+      /* @__PURE__ */ jsxs(Sheet, { children: [
+        /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", className: "gap-2", children: [
+          /* @__PURE__ */ jsx(Filter, { className: "h-4 w-4" }),
+          "Filters"
+        ] }) }),
+        /* @__PURE__ */ jsxs(SheetContent, { side: "right", className: "w-full sm:max-w-xl overflow-y-auto", children: [
+          /* @__PURE__ */ jsx(SheetHeader, { children: /* @__PURE__ */ jsx(SheetTitle, { children: "Transaction Filters" }) }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-6 py-6", children: [
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "Account Number",
+                  value: filters.accountNumber,
+                  onChange: (e) => handleFilterChange("accountNumber", e.target.value),
+                  placeholder: "Enter account number"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                EnhancedSelect,
+                {
+                  label: "Product",
+                  value: filters.product,
+                  onValueChange: (value) => handleFilterChange("product", value),
+                  placeholder: "Select product",
+                  options: [
+                    { value: "wire", label: "Wire" },
+                    { value: "ach", label: "ACH" },
+                    { value: "check", label: "Check" }
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "Customer ID",
+                  value: filters.customerId,
+                  onChange: (e) => handleFilterChange("customerId", e.target.value),
+                  placeholder: "Enter customer ID"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "Counterparty ID",
+                  value: filters.counterpartyId,
+                  onChange: (e) => handleFilterChange("counterpartyId", e.target.value),
+                  placeholder: "Enter counterparty ID"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Settlement File Name",
+                value: filters.settlementFileName,
+                onChange: (e) => handleFilterChange("settlementFileName", e.target.value),
+                placeholder: "Enter settlement file name"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Original File Name",
+                value: filters.originalFileName,
+                onChange: (e) => handleFilterChange("originalFileName", e.target.value),
+                placeholder: "Enter original file name"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Requester IP Address",
+                value: filters.requesterIpAddress,
+                onChange: (e) => handleFilterChange("requesterIpAddress", e.target.value),
+                placeholder: "Enter IP address"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Requester Username",
+                value: filters.requesterUsername,
+                onChange: (e) => handleFilterChange("requesterUsername", e.target.value),
+                placeholder: "Enter username"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Wire File Handle",
+                value: filters.wireFileHandle,
+                onChange: (e) => handleFilterChange("wireFileHandle", e.target.value),
+                placeholder: "Enter wire file handle"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedInput,
+              {
+                label: "Payment ID",
+                value: filters.paymentId,
+                onChange: (e) => handleFilterChange("paymentId", e.target.value),
+                placeholder: "Enter payment ID"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Transaction Type",
+                value: filters.transactionType,
+                onValueChange: (value) => handleFilterChange("transactionType", value),
+                placeholder: "Select transaction type",
+                options: [
+                  { value: "ach_credit", label: "ACH Credit" },
+                  { value: "ach_debit", label: "ACH Debit" },
+                  { value: "wire_domestic", label: "Wire Domestic" },
+                  { value: "wire_international", label: "Wire International" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Transaction Status",
+                value: filters.transactionStatus,
+                onValueChange: (value) => handleFilterChange("transactionStatus", value),
+                placeholder: "Select transaction status",
+                options: [
+                  { value: "PENDING", label: "Pending" },
+                  { value: "POSTED", label: "Posted" },
+                  { value: "FAILED", label: "Failed" },
+                  { value: "CANCELLED", label: "Cancelled" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Processing Status",
+                value: filters.processingStatus,
+                onValueChange: (value) => handleFilterChange("processingStatus", value),
+                placeholder: "Select processing status",
+                options: [
+                  { value: "processing", label: "Processing" },
+                  { value: "completed", label: "Completed" },
+                  { value: "error", label: "Error" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              EnhancedSelect,
+              {
+                label: "Direction",
+                value: filters.direction,
+                onValueChange: (value) => handleFilterChange("direction", value),
+                placeholder: "Select direction",
+                options: [
+                  { value: "credit", label: "Credit" },
+                  { value: "debit", label: "Debit" }
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "Min Amount",
+                  type: "number",
+                  value: filters.minAmount,
+                  onChange: (e) => handleFilterChange("minAmount", e.target.value),
+                  placeholder: "0.00"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                EnhancedInput,
+                {
+                  label: "Max Amount",
+                  type: "number",
+                  value: filters.maxAmount,
+                  onChange: (e) => handleFilterChange("maxAmount", e.target.value),
+                  placeholder: "0.00"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Creation Date Start" }),
+                /* @__PURE__ */ jsxs(Popover, { children: [
+                  /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "outline",
+                      className: cn(
+                        "w-full justify-start text-left font-normal",
+                        !filters.creationDateStart && "text-muted-foreground"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4" }),
+                        filters.creationDateStart ? format(filters.creationDateStart, "MM/dd/yyyy") : /* @__PURE__ */ jsx("span", { children: "MM/DD/YYYY" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0 bg-background z-50", align: "start", children: /* @__PURE__ */ jsx(
+                    Calendar,
+                    {
+                      mode: "single",
+                      selected: filters.creationDateStart,
+                      onSelect: (date) => handleFilterChange("creationDateStart", date),
+                      initialFocus: true,
+                      className: "pointer-events-auto"
+                    }
+                  ) })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Creation Date End" }),
+                /* @__PURE__ */ jsxs(Popover, { children: [
+                  /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "outline",
+                      className: cn(
+                        "w-full justify-start text-left font-normal",
+                        !filters.creationDateEnd && "text-muted-foreground"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4" }),
+                        filters.creationDateEnd ? format(filters.creationDateEnd, "MM/dd/yyyy") : /* @__PURE__ */ jsx("span", { children: "MM/DD/YYYY" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0 bg-background z-50", align: "start", children: /* @__PURE__ */ jsx(
+                    Calendar,
+                    {
+                      mode: "single",
+                      selected: filters.creationDateEnd,
+                      onSelect: (date) => handleFilterChange("creationDateEnd", date),
+                      initialFocus: true,
+                      className: "pointer-events-auto"
+                    }
+                  ) })
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Post Date Start" }),
+                /* @__PURE__ */ jsxs(Popover, { children: [
+                  /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "outline",
+                      className: cn(
+                        "w-full justify-start text-left font-normal",
+                        !filters.postDateStart && "text-muted-foreground"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4" }),
+                        filters.postDateStart ? format(filters.postDateStart, "MM/dd/yyyy") : /* @__PURE__ */ jsx("span", { children: "MM/DD/YYYY" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0 bg-background z-50", align: "start", children: /* @__PURE__ */ jsx(
+                    Calendar,
+                    {
+                      mode: "single",
+                      selected: filters.postDateStart,
+                      onSelect: (date) => handleFilterChange("postDateStart", date),
+                      initialFocus: true,
+                      className: "pointer-events-auto"
+                    }
+                  ) })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Post Date End" }),
+                /* @__PURE__ */ jsxs(Popover, { children: [
+                  /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "outline",
+                      className: cn(
+                        "w-full justify-start text-left font-normal",
+                        !filters.postDateEnd && "text-muted-foreground"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx(Calendar$1, { className: "mr-2 h-4 w-4" }),
+                        filters.postDateEnd ? format(filters.postDateEnd, "MM/dd/yyyy") : /* @__PURE__ */ jsx("span", { children: "MM/DD/YYYY" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0 bg-background z-50", align: "start", children: /* @__PURE__ */ jsx(
+                    Calendar,
+                    {
+                      mode: "single",
+                      selected: filters.postDateEnd,
+                      onSelect: (date) => handleFilterChange("postDateEnd", date),
+                      initialFocus: true,
+                      className: "pointer-events-auto"
+                    }
+                  ) })
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs(SheetFooter, { className: "gap-2", children: [
+            /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: resetFilters, children: "Reset Filters" }),
+            /* @__PURE__ */ jsx(Button, { onClick: applyFilters, children: "Apply Filters" })
+          ] })
+        ] })
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 h-full max-w-none flex flex-col", children: /* @__PURE__ */ jsxs("div", { className: "flex-1 mt-4 rounded-lg border bg-card overflow-hidden flex flex-col", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full table-fixed", children: [
+        /* @__PURE__ */ jsxs("colgroup", { children: [
+          /* @__PURE__ */ jsx("col", { className: "w-28" }),
+          /* @__PURE__ */ jsx("col", { className: "w-28" }),
+          /* @__PURE__ */ jsx("col", { className: "w-24" }),
+          /* @__PURE__ */ jsx("col", { className: "w-36" }),
+          /* @__PURE__ */ jsx("col", { className: "w-36" }),
+          /* @__PURE__ */ jsx("col", { className: "w-auto" }),
+          /* @__PURE__ */ jsx("col", { className: "w-36" }),
+          /* @__PURE__ */ jsx("col", { className: "w-24" }),
+          /* @__PURE__ */ jsx("col", { className: "w-28" })
+        ] }),
+        /* @__PURE__ */ jsx("thead", { className: "sticky top-0 bg-card z-10 shadow-sm", children: /* @__PURE__ */ jsxs("tr", { className: "border-b", children: [
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Created" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Account Number" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-right text-xs font-medium bg-muted/50", children: "Amount" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Customer" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Counterparty" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Description" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Transaction Type" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Status" }),
+          /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left text-xs font-medium bg-muted/50", children: "Updated" })
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { children: paginatedTransactions.map((transaction) => /* @__PURE__ */ jsxs(
+          "tr",
+          {
+            onClick: () => navigate(`/transactions/${transaction.id}`),
+            className: "border-b hover:bg-muted/50 transition-colors cursor-pointer",
+            children: [
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs", children: transaction.created }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs", children: transaction.accountNumber }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs text-right", children: /* @__PURE__ */ jsx("span", { className: transaction.amount < 0 ? "text-destructive" : "", children: formatCurrency(transaction.amount) }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx(Button, { variant: "link", className: "h-auto p-0 font-normal text-xs", children: transaction.customer }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx(Button, { variant: "link", className: "h-auto p-0 font-normal text-xs", children: transaction.counterparty }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs truncate", children: transaction.description }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "font-normal whitespace-nowrap text-xs", children: transaction.transactionType }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsx(StatusBadge, { status: transaction.status }) }),
+              /* @__PURE__ */ jsx("td", { className: "px-3 py-2 text-xs", children: transaction.updated })
+            ]
+          },
+          transaction.id
+        )) })
+      ] }) }),
+      /* @__PURE__ */ jsx("div", { className: "flex-none border-t bg-background py-3 px-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "Rows per page:" }),
+          /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+            /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", size: "sm", className: "h-8 gap-1", children: [
+              rowsPerPage,
+              /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 rotate-90" })
+            ] }) }),
+            /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", className: "bg-background z-50", children: [
+              /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => handleRowsPerPageChange(100), children: "100" }),
+              /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => handleRowsPerPageChange(200), children: "200" }),
+              /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: () => handleRowsPerPageChange(500), children: "500" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
+          /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground", children: [
+            "Page ",
+            currentPage,
+            " of ",
+            totalPages
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "sm",
+                className: "h-8 w-8 p-0",
+                onClick: () => handlePageChange(currentPage - 1),
+                disabled: currentPage === 1,
+                children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "sm",
+                className: "h-8 w-8 p-0",
+                onClick: () => handlePageChange(currentPage + 1),
+                disabled: currentPage === totalPages,
+                children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
+              }
+            )
+          ] })
+        ] })
+      ] }) })
+    ] }) }) })
+  ] });
+};
+var TransactionHistory_default = TransactionHistory;
+var newTransactionSchema = z.object({
   transactionType: z.string().min(1, "Transaction type is required"),
   accountNumber: z.string().min(1, "Account number is required"),
   counterpartyName: z.string().min(1, "Counterparty name is required"),
@@ -6080,7 +7944,649 @@ z.object({
   currency: z.string().min(1, "Currency is required"),
   description: z.string().optional()
 });
+var TRANSACTION_TYPES = [
+  { value: "transfer", label: "Transfer", icon: ArrowLeftRight },
+  { value: "adjustment", label: "Adjustment", icon: Settings },
+  { value: "ach", label: "ACH", icon: Building2 },
+  { value: "wire", label: "Wire", icon: Zap }
+];
+var CURRENCY_OPTIONS = [
+  { value: "USD", label: "USD - US Dollar" },
+  { value: "EUR", label: "EUR - Euro" },
+  { value: "GBP", label: "GBP - British Pound" },
+  { value: "JPY", label: "JPY - Japanese Yen" },
+  { value: "CAD", label: "CAD - Canadian Dollar" },
+  { value: "AUD", label: "AUD - Australian Dollar" },
+  { value: "CHF", label: "CHF - Swiss Franc" },
+  { value: "CNY", label: "CNY - Chinese Yuan" }
+];
+var mockAccountData = {
+  accountNumber: "****1234",
+  accountName: "Business Checking",
+  accountType: "Checking",
+  balance: "$125,450.00",
+  customerName: "Acme Corporation",
+  customerId: "CUST-001",
+  customerType: "Business"
+};
+var mockCounterpartyData = {
+  counterpartyName: "Global Tech Solutions Inc.",
+  counterpartyId: "CP-5678",
+  counterpartyType: "Business",
+  status: "Active",
+  taxId: "98-7654321",
+  primaryContact: "Sarah Johnson",
+  contactEmail: "sarah.johnson@globaltech.com",
+  contactPhone: "+1 (555) 987-6543",
+  address: "456 Innovation Drive, San Francisco, CA 94105"
+};
+function NewTransaction() {
+  const navigate = useNavigate();
+  const [accountLookedUp, setAccountLookedUp] = useState(false);
+  const [accountData, setAccountData] = useState(null);
+  const [counterpartyLookedUp, setCounterpartyLookedUp] = useState(false);
+  const [counterpartyData, setCounterpartyData] = useState(null);
+  const [confirmationOpen, setConfirmationOpen] = useState(false);
+  const [submissionStatus, setSubmissionStatus] = useState(null);
+  const [errorMessage, setErrorMessage] = useState("");
+  const [transactionId, setTransactionId] = useState("");
+  const form = useForm({
+    resolver: zodResolver(newTransactionSchema),
+    defaultValues: {
+      transactionType: "",
+      accountNumber: "",
+      counterpartyName: "",
+      amount: "",
+      currency: "USD",
+      description: ""
+    }
+  });
+  const transactionType = form.watch("transactionType");
+  const accountNumber = form.watch("accountNumber");
+  const counterpartyName = form.watch("counterpartyName");
+  const amount = form.watch("amount");
+  const handleAccountLookup = () => {
+    const accNum = form.getValues("accountNumber");
+    if (!accNum) {
+      toast$1.error("Please enter an account number");
+      return;
+    }
+    setAccountData(mockAccountData);
+    setAccountLookedUp(true);
+    toast$1.success("Account found");
+  };
+  const handleCounterpartyLookup = () => {
+    const cpName = form.getValues("counterpartyName");
+    if (!cpName) {
+      toast$1.error("Please enter a counterparty name");
+      return;
+    }
+    setCounterpartyData(mockCounterpartyData);
+    setCounterpartyLookedUp(true);
+    toast$1.success("Counterparty found");
+  };
+  const handleEditAccount = () => {
+    setAccountLookedUp(false);
+    setAccountData(null);
+    form.setValue("transactionType", "");
+    setCounterpartyLookedUp(false);
+    setCounterpartyData(null);
+    form.setValue("counterpartyName", "");
+    form.setValue("amount", "");
+    form.setValue("description", "");
+  };
+  const handleEditCounterparty = () => {
+    setCounterpartyLookedUp(false);
+    setCounterpartyData(null);
+    form.setValue("amount", "");
+    form.setValue("description", "");
+  };
+  const handleSubmit = () => {
+    const data = form.getValues();
+    if (!data.transactionType || !data.accountNumber || !data.counterpartyName || !data.amount) {
+      toast$1.error("Please complete all required fields");
+      return;
+    }
+    if (!accountLookedUp || !counterpartyLookedUp) {
+      toast$1.error("Please lookup both account and counterparty");
+      return;
+    }
+    const amount2 = parseFloat(data.amount);
+    const hasError = Math.random() > 0.7;
+    if (hasError) {
+      const errorScenarios = [
+        "Insufficient funds. Current balance: $125,450.00, Required: $" + amount2.toFixed(2),
+        "Transaction limit exceeded. Daily limit: $50,000.00",
+        "Counterparty account is temporarily unavailable. Please try again later.",
+        "Invalid routing number for the selected transaction type."
+      ];
+      setSubmissionStatus("error");
+      setErrorMessage(errorScenarios[Math.floor(Math.random() * errorScenarios.length)]);
+      setConfirmationOpen(true);
+    } else {
+      const txId = "TXN-" + Math.random().toString(36).substr(2, 9).toUpperCase();
+      setTransactionId(txId);
+      setSubmissionStatus("success");
+      setConfirmationOpen(true);
+    }
+  };
+  const handleConfirmationClose = () => {
+    setConfirmationOpen(false);
+    if (submissionStatus === "success") {
+      navigate("/transactions/history");
+    }
+  };
+  const handleCancel = () => {
+    navigate("/dashboard");
+  };
+  const accountDataGrid = accountData ? [
+    {
+      title: "Account Information",
+      items: [
+        { label: "Account Number", value: accountData.accountNumber },
+        { label: "Account Name", value: accountData.accountName },
+        { label: "Account Type", value: accountData.accountType },
+        { label: "Balance", value: accountData.balance },
+        { label: "Customer Name", value: accountData.customerName },
+        { label: "Customer ID", value: accountData.customerId }
+      ]
+    }
+  ] : [];
+  const counterpartyDataGrid = counterpartyData ? [
+    {
+      title: "Counterparty Information",
+      items: [
+        { label: "Counterparty Name", value: counterpartyData.counterpartyName },
+        { label: "Counterparty ID", value: counterpartyData.counterpartyId },
+        { label: "Type", value: counterpartyData.counterpartyType },
+        { label: "Status", value: counterpartyData.status },
+        { label: "Tax ID", value: counterpartyData.taxId },
+        { label: "Primary Contact", value: counterpartyData.primaryContact },
+        { label: "Contact Email", value: counterpartyData.contactEmail },
+        { label: "Contact Phone", value: counterpartyData.contactPhone },
+        { label: "Address", value: counterpartyData.address }
+      ]
+    }
+  ] : [];
+  const reviewData = [
+    {
+      title: "Transaction Summary",
+      items: [
+        { label: "Transaction Type", value: TRANSACTION_TYPES.find((t) => t.value === transactionType)?.label || "-" },
+        { label: "Account Number", value: accountNumber || "-" },
+        { label: "Counterparty", value: counterpartyName || "-" },
+        { label: "Amount", value: amount ? `$${amount}` : "-" },
+        { label: "Description", value: form.watch("description") || "N/A" }
+      ]
+    }
+  ];
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: "New Transaction",
+      description: "Complete the form below to initiate a new transaction",
+      children: /* @__PURE__ */ jsxs("div", { className: "max-w-4xl mx-auto space-y-6", children: [
+        /* @__PURE__ */ jsx(FormProvider, { form, children: /* @__PURE__ */ jsxs("form", { onSubmit: (e) => e.preventDefault(), children: [
+          !accountLookedUp ? /* @__PURE__ */ jsx(
+            FormCard,
+            {
+              title: "Account Lookup",
+              variant: "default",
+              children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+                /* @__PURE__ */ jsx(
+                  FormInput,
+                  {
+                    name: "accountNumber",
+                    label: "Account Number",
+                    placeholder: "Enter account number"
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    onClick: handleAccountLookup,
+                    className: "w-full sm:w-auto",
+                    disabled: !accountNumber,
+                    children: [
+                      /* @__PURE__ */ jsx(Search, { className: "h-4 w-4 mr-2" }),
+                      "Lookup Account"
+                    ]
+                  }
+                )
+              ] })
+            }
+          ) : (
+            /* Account Information (Read-only) */
+            /* @__PURE__ */ jsx(
+              FormCard,
+              {
+                title: "Account Information",
+                variant: "subtle",
+                headerActions: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(CheckCircle2, { className: "h-5 w-5 text-success" }),
+                  /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "ghost",
+                      size: "sm",
+                      onClick: handleEditAccount,
+                      children: [
+                        /* @__PURE__ */ jsx(Edit, { className: "h-4 w-4 mr-1" }),
+                        "Edit"
+                      ]
+                    }
+                  )
+                ] }),
+                children: /* @__PURE__ */ jsx(DataGrid, { data: accountDataGrid, columns: 2 })
+              }
+            )
+          ),
+          /* @__PURE__ */ jsx(
+            FormCard,
+            {
+              title: "Transaction Type",
+              variant: "default",
+              className: cn(!accountLookedUp && "opacity-50 pointer-events-none"),
+              children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 lg:grid-cols-4 gap-3 lg:gap-4", children: TRANSACTION_TYPES.map((type) => {
+                const Icon2 = type.icon;
+                const isSelected = transactionType === type.value;
+                return /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => form.setValue("transactionType", type.value),
+                    disabled: !accountLookedUp,
+                    className: cn(
+                      "flex flex-col items-center justify-center p-4 lg:p-3 rounded-lg border-2 transition-all",
+                      "hover:border-primary/50 hover:shadow-md",
+                      isSelected ? "border-primary bg-primary/5 shadow-sm" : "border-border bg-card"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsx(Icon2, { className: cn(
+                        "h-6 w-6 lg:h-5 lg:w-5 mb-2",
+                        isSelected ? "text-primary" : "text-muted-foreground"
+                      ) }),
+                      /* @__PURE__ */ jsx("span", { className: cn(
+                        "text-sm font-medium",
+                        isSelected ? "text-primary" : "text-foreground"
+                      ), children: type.label })
+                    ]
+                  },
+                  type.value
+                );
+              }) })
+            }
+          ),
+          !counterpartyLookedUp ? /* @__PURE__ */ jsx(
+            FormCard,
+            {
+              title: "Counterparty Lookup",
+              variant: "default",
+              className: cn(!transactionType && "opacity-50 pointer-events-none"),
+              children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+                /* @__PURE__ */ jsx(
+                  FormInput,
+                  {
+                    name: "counterpartyName",
+                    label: "Counterparty Name",
+                    placeholder: "Enter counterparty name",
+                    disabled: !transactionType
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    onClick: handleCounterpartyLookup,
+                    className: "w-full sm:w-auto",
+                    disabled: !transactionType || !counterpartyName,
+                    children: [
+                      /* @__PURE__ */ jsx(Search, { className: "h-4 w-4 mr-2" }),
+                      "Lookup Counterparty"
+                    ]
+                  }
+                )
+              ] })
+            }
+          ) : (
+            /* Counterparty Information (Read-only) */
+            /* @__PURE__ */ jsx(
+              FormCard,
+              {
+                title: "Counterparty Information",
+                variant: "subtle",
+                headerActions: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(CheckCircle2, { className: "h-5 w-5 text-success" }),
+                  /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      variant: "ghost",
+                      size: "sm",
+                      onClick: handleEditCounterparty,
+                      children: [
+                        /* @__PURE__ */ jsx(Edit, { className: "h-4 w-4 mr-1" }),
+                        "Edit"
+                      ]
+                    }
+                  )
+                ] }),
+                children: /* @__PURE__ */ jsx(DataGrid, { data: counterpartyDataGrid, columns: 2 })
+              }
+            )
+          ),
+          /* @__PURE__ */ jsx(
+            FormCard,
+            {
+              title: "Transaction Details",
+              variant: "default",
+              className: cn(!counterpartyLookedUp && "opacity-50 pointer-events-none"),
+              children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-[1fr_auto] gap-4", children: [
+                  /* @__PURE__ */ jsx(
+                    FormInput,
+                    {
+                      name: "amount",
+                      label: "Amount",
+                      placeholder: "0.00",
+                      type: "number",
+                      disabled: !counterpartyLookedUp
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    FormSelect,
+                    {
+                      name: "currency",
+                      label: "Currency",
+                      options: CURRENCY_OPTIONS,
+                      disabled: !counterpartyLookedUp
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx(
+                  FormInput,
+                  {
+                    name: "description",
+                    label: "Description (Optional)",
+                    placeholder: "Enter transaction description",
+                    disabled: !counterpartyLookedUp
+                  }
+                )
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            FormCard,
+            {
+              title: "Review & Submit",
+              variant: "default",
+              children: /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+                /* @__PURE__ */ jsx(DataGrid, { data: reviewData, columns: 2 }),
+                /* @__PURE__ */ jsxs("div", { className: "flex gap-3 justify-end pt-4 border-t border-border", children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      type: "button",
+                      variant: "outline",
+                      onClick: handleCancel,
+                      className: "w-32",
+                      children: "Cancel"
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Button,
+                    {
+                      type: "button",
+                      onClick: handleSubmit,
+                      className: "w-48",
+                      disabled: !transactionType || !accountNumber || !counterpartyName || !amount,
+                      children: [
+                        /* @__PURE__ */ jsx(CheckCircle2, { className: "h-4 w-4 mr-2" }),
+                        "Submit Transaction"
+                      ]
+                    }
+                  )
+                ] })
+              ] })
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsx(Dialog, { open: confirmationOpen, onOpenChange: setConfirmationOpen, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-md", children: [
+          /* @__PURE__ */ jsxs(DialogHeader, { children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 mb-2", children: [
+              submissionStatus === "success" ? /* @__PURE__ */ jsx("div", { className: "h-12 w-12 rounded-full bg-success/10 flex items-center justify-center", children: /* @__PURE__ */ jsx(CheckCircle2, { className: "h-6 w-6 text-success" }) }) : /* @__PURE__ */ jsx("div", { className: "h-12 w-12 rounded-full bg-destructive/10 flex items-center justify-center", children: /* @__PURE__ */ jsx(XCircle, { className: "h-6 w-6 text-destructive" }) }),
+              /* @__PURE__ */ jsx(DialogTitle, { className: "text-xl", children: submissionStatus === "success" ? "Transaction Successful" : "Transaction Failed" })
+            ] }),
+            /* @__PURE__ */ jsx(DialogDescription, { className: "text-left", children: submissionStatus === "success" ? /* @__PURE__ */ jsxs("div", { className: "space-y-4 pt-2", children: [
+              /* @__PURE__ */ jsx("p", { className: "text-foreground", children: "Your transaction has been successfully submitted and is being processed." }),
+              /* @__PURE__ */ jsxs("div", { className: "bg-muted/50 rounded-lg p-4 space-y-2", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Transaction ID:" }),
+                  /* @__PURE__ */ jsx("span", { className: "font-mono font-medium", children: transactionId })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Amount:" }),
+                  /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+                    "$",
+                    amount
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Type:" }),
+                  /* @__PURE__ */ jsx("span", { className: "font-medium", children: TRANSACTION_TYPES.find((t) => t.value === transactionType)?.label })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex justify-between text-sm", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Counterparty:" }),
+                  /* @__PURE__ */ jsx("span", { className: "font-medium", children: counterpartyName })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 p-3 bg-blue-500/10 border border-blue-500/20 rounded-lg", children: [
+                /* @__PURE__ */ jsx(AlertCircle, { className: "h-5 w-5 text-blue-500 mt-0.5 flex-shrink-0" }),
+                /* @__PURE__ */ jsx("p", { className: "text-sm text-blue-700 dark:text-blue-300", children: "You will receive a confirmation email once the transaction is completed." })
+              ] })
+            ] }) : /* @__PURE__ */ jsxs("div", { className: "space-y-4 pt-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 p-4 bg-destructive/10 border border-destructive/20 rounded-lg", children: [
+                /* @__PURE__ */ jsx(XCircle, { className: "h-5 w-5 text-destructive mt-0.5 flex-shrink-0" }),
+                /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                  /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-destructive", children: "Error Processing Transaction" }),
+                  /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: errorMessage })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "Please review the error message above and try again. If the problem persists, contact support." })
+            ] }) })
+          ] }),
+          /* @__PURE__ */ jsxs(DialogFooter, { className: "sm:justify-end gap-2", children: [
+            submissionStatus === "error" && /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                variant: "outline",
+                onClick: () => setConfirmationOpen(false),
+                children: "Try Again"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                onClick: handleConfirmationClose,
+                variant: submissionStatus === "success" ? "default" : "outline",
+                children: submissionStatus === "success" ? "View Transactions" : "Close"
+              }
+            )
+          ] })
+        ] }) })
+      ] })
+    }
+  );
+}
+var TransactionDetail = () => {
+  const { id } = useParams();
+  const navigate = useNavigate();
+  const transaction = mockTransactions.find((t) => t.id === id);
+  if (!transaction) {
+    return /* @__PURE__ */ jsx("div", { className: "container mx-auto px-4 py-8", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold mb-2", children: "Transaction Not Found" }),
+      /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground mb-4", children: [
+        "The transaction #",
+        id,
+        " could not be found."
+      ] }),
+      /* @__PURE__ */ jsx(Button, { onClick: () => navigate("/transactions/history"), children: "Back to Transaction History" })
+    ] }) });
+  }
+  const getStatusVariant = (status) => {
+    switch (status) {
+      case "POSTED":
+        return "success";
+      case "PENDING":
+        return "warning";
+      case "FAILED":
+        return "destructive";
+      case "CANCELLED":
+        return "outline";
+      default:
+        return "outline";
+    }
+  };
+  const formatCurrency = (value) => {
+    return new Intl.NumberFormat("en-US", {
+      style: "currency",
+      currency: "USD",
+      minimumFractionDigits: 2
+    }).format(value);
+  };
+  const isWireTransfer = transaction.transactionType.toLowerCase().includes("wire");
+  const isACHTransfer = transaction.transactionType.toLowerCase().includes("ach");
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: `Transaction #${transaction.id}`,
+      maxWidth: "full",
+      actions: [
+        {
+          label: "Return",
+          variant: "outline",
+          onClick: () => console.log("Return transaction")
+        },
+        {
+          label: "Cancel",
+          variant: "default",
+          onClick: () => console.log("Cancel transaction")
+        }
+      ],
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-6", children: [
+          /* @__PURE__ */ jsx(FormCard, { title: "Details", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-x-8 gap-y-4", children: [
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Transaction Type",
+                value: /* @__PURE__ */ jsx(Badge, { variant: "outline", children: transaction.transactionType }),
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Status",
+                value: /* @__PURE__ */ jsx(Badge, { variant: getStatusVariant(transaction.status), children: transaction.status }),
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Amount",
+                value: /* @__PURE__ */ jsx("span", { className: cn(
+                  "font-semibold",
+                  transaction.amount < 0 ? "text-destructive" : "text-success"
+                ), children: formatCurrency(transaction.amount) }),
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Account Number",
+                value: /* @__PURE__ */ jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: transaction.accountNumber }),
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Customer Name",
+                value: /* @__PURE__ */ jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: transaction.customer }),
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(InfoField, { label: "Description", value: transaction.description, layout: "horizontal" }),
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Direction",
+                value: transaction.amount < 0 ? "DEBIT" : "CREDIT",
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(InfoField, { label: "Counterparty Name", value: transaction.counterparty, layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Post Date", value: transaction.created.split(" ")[0], layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "OFAC ID", value: /* @__PURE__ */ jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: "18323208" }), layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Original Filename", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Loaded From File", value: "iso21130757012764355B7.xml.126534273Q299", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Payment ID", value: transaction.id, layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Linked Payment ID", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Is Inbound", value: "True", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Pending until Date", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Processing Status", value: "Sent", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Further Credit To", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Balance Available Date", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Requester Username", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Requester IP Address", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Settlement Filename", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Duplicate of Payment ID", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(
+              InfoField,
+              {
+                label: "Product ID",
+                value: /* @__PURE__ */ jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: "130" }),
+                layout: "horizontal"
+              }
+            ),
+            /* @__PURE__ */ jsx(InfoField, { label: "Returned In File", value: "-", layout: "horizontal" }),
+            /* @__PURE__ */ jsx(InfoField, { label: "Alerts", value: "-", layout: "horizontal" })
+          ] }) }),
+          isACHTransfer && transaction.achDetails && /* @__PURE__ */ jsx(ACHDetailsSection, { data: transaction.achDetails }),
+          isWireTransfer && transaction.wireDetails && /* @__PURE__ */ jsx(WireDetailsSection, { data: transaction.wireDetails })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(FormCard, { title: "Transaction Timeline", children: /* @__PURE__ */ jsx(AlertTimeline, { events: mockTransactionTimeline }) }) })
+      ] })
+    }
+  );
+};
+var TransactionDetail_default = TransactionDetail;
+function UIKit() {
+  const breadcrumbs = [
+    { label: "UI Kit" }
+  ];
+  return /* @__PURE__ */ jsx("div", { className: "min-h-screen bg-gradient-subtle", children: /* @__PURE__ */ jsx(Container, { size: "xl", children: /* @__PURE__ */ jsxs(Stack, { spacing: "lg", children: [
+    /* @__PURE__ */ jsx(Breadcrumb, { items: breadcrumbs }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-foreground", children: "UI Kit" }),
+      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground mt-2", children: "Complete collection of reusable components, layouts, and patterns" })
+    ] }),
+    /* @__PURE__ */ jsxs(Tabs, { defaultValue: "showcase", className: "w-full", children: [
+      /* @__PURE__ */ jsxs(TabsList, { className: "grid w-full grid-cols-3", children: [
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "showcase", children: "Component Showcase" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "patterns", children: "Pattern Library" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "demo", children: "Dashboard Demo" })
+      ] }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "showcase", className: "mt-6", children: /* @__PURE__ */ jsx(UIKitShowcase, {}) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "patterns", className: "mt-6", children: /* @__PURE__ */ jsx(PatternLibrary, {}) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "demo", className: "mt-6", children: /* @__PURE__ */ jsx(DashboardDemo, {}) })
+    ] })
+  ] }) }) });
+}
 
-export { ACHBankCard, ACHBasicInfoCard, ACHDetailsSection, ACHTransferSection, AccountCard, AddressForm, AlertDocuments, AlertNotes, AlertTimeline, AppSidebar, Badge, BankAddressCard, BankingDetailsCard, BasicInfoCard, BasicInfoSection, BeneficiaryAddress, BeneficiaryCard, BeneficiaryDomesticWire, Breadcrumb, BusinessProfileCard, BusinessStatusCard, BusinessTypeBadge, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ContactInfoCard, Container, ContextSection, CounterpartyBasicInfo, CounterpartyProfileCard, CounterpartyRecordsCard, CounterpartyTypeBadge, DashboardDemo, DataGrid, DataTable, DetailPageLayout, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EditableFormCard, EditableInfoField, EnhancedInput, EnhancedSelect, EnhancedTextarea, EntityCard, FormCard, FormField, FormInput, FormProvider, FormSection, FormSelect, InfoField, IntermediaryCard, IntermediaryFI, IntermediaryFIAddress, JsonViewer, Label, ListPage, MainLayout, MetricCard, OriginatorCard, OriginatorFI, OriginatorFIAddress, PageLayout, PatternLibrary, PaymentInformationSection, Popover, PopoverContent, PopoverTrigger, ReceiverCard, ResponsiveGrid, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Stack, StatusBadge, Tabs, TabsContent, TabsList, TabsTrigger, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, UIKitShowcase, WireDetailsSection, WireTransferSection, badgeVariants, buttonVariants, cardVariants, inputVariants, reducer, textareaVariants, toast, useEditState, useFormWithEditState, useIsMobile, useSidebar, useToast };
+export { ACHBankCard, ACHBasicInfoCard, ACHDetailsSection, ACHTransferSection, AccountCard, AddressForm, AlertDetail_default as AlertDetail, AlertDocuments, AlertNotes, AlertTimeline, Alerts_default as Alerts, AppSidebar, Badge, BankAddressCard, BankingDetailsCard, BasicInfoCard, BasicInfoSection, BeneficiaryAddress, BeneficiaryCard, BeneficiaryDomesticWire, Breadcrumb, Business_default as Business, BusinessProfileCard, BusinessStatusCard, BusinessTypeBadge, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cases_default as Cases, ContactInfoCard, Container, ContextSection, CounterpartyBasicInfo, DomesticWire_default as CounterpartyDomesticWire, Manage_default as CounterpartyManage, CounterpartyProfileCard, CounterpartyRecordsCard, CounterpartyTypeBadge, Create_default as CreateBusiness, Create_default2 as CreateCounterparty, Dashboard_default as Dashboard, DashboardDemo, DataGrid, DataTable, DetailPageLayout, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EditableFormCard, EditableInfoField, EnhancedInput, EnhancedSelect, EnhancedTextarea, EntityCard, FormCard, FormField, FormInput, FormProvider, FormSection, FormSelect, InfoField, IntermediaryCard, IntermediaryFI, IntermediaryFIAddress, JsonViewer, Label, ListPage, MainLayout, MetricCard, NewTransaction, NotFound_default as NotFound, OriginatorCard, OriginatorFI, OriginatorFIAddress, PageLayout, PatternLibrary, PaymentInformationSection, Popover, PopoverContent, PopoverTrigger, ReceiverCard, ResponsiveGrid, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Stack, StatusBadge, Tabs, TabsContent, TabsList, TabsTrigger, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransactionDetail_default as TransactionDetail, TransactionHistory_default as TransactionHistory, UIKit, UIKitShowcase, WireDetailsSection, WireTransferSection, badgeVariants, buttonVariants, cardVariants, inputVariants, reducer, textareaVariants, toast, useEditState, useFormWithEditState, useIsMobile, useSidebar, useToast };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map