braid-ui 1.0.37 → 1.0.39

package/dist/index.js

@@ -1,10 +1,10 @@
 import * as React15 from 'react';
-import React15__default, { useState, useEffect, useCallback, useMemo } from 'react';
+import { useState, useEffect, useCallback, useMemo } from 'react';
 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, Wallet, ChevronRight, Eye, Trash2, Plus, MessageSquare, Upload, FileText, Download, Copy, LayoutDashboard, Bell, Briefcase, FileCheck, Receipt, ArrowLeftRight, Users, Building2, Shield, AlertCircle, RefreshCw, Landmark, Search, Repeat, Zap, Box, Settings, BarChart3, Key, ChevronLeft, AlertTriangle, XCircle, CheckCircle, Clock, Ban, Circle, Filter, User, Loader2, ArrowDownRight, ArrowUpRight, CheckCircle2, StickyNote, FileUp, RotateCcw, Send, PlayCircle, UserPlus, ChevronsUpDown, UserCheck, CalendarIcon, Package, FileJson, DollarSign } from 'lucide-react';
+import { ChevronDown, ChevronUp, Check, X, PanelLeft, Edit, Home, Globe, CreditCard, Building, MoreVertical, Minus, TrendingDown, TrendingUp, ChevronRight, Eye, Trash2, Plus, MessageSquare, Upload, FileText, Download, Copy, LayoutDashboard, Bell, Briefcase, FileCheck, Receipt, ArrowLeftRight, Users, Building2, Shield, AlertCircle, RefreshCw, Landmark, Search, Repeat, Zap, Box, Settings, BarChart3, Key, ChevronLeft, AlertTriangle, XCircle, CheckCircle, Clock, Ban, Circle, Wallet, Filter, User, Loader2, ArrowDownRight, ArrowUpRight, CheckCircle2, StickyNote, FileUp, RotateCcw, Send, PlayCircle, UserPlus, ChevronsUpDown, UserCheck, CalendarIcon, Package, FileJson, DollarSign } from 'lucide-react';
 import { createPortal } from 'react-dom';
 import { Slot } from '@radix-ui/react-slot';
 import * as SelectPrimitive from '@radix-ui/react-select';
@@ -18,14 +18,14 @@ import { z } from 'zod';
 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';
-import { format } from 'date-fns';
+import { parseISO, isBefore, startOfDay, isAfter, endOfDay, format } from 'date-fns';
 import { DayPicker } from 'react-day-picker';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
+import { Toaster as Toaster$1, toast as toast$1 } from 'sonner';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { useTheme } from 'next-themes';
-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';
 
@@ -524,8 +524,8 @@ var reducer = (state, action) => {
       if (toastId) {
         addToRemoveQueue(toastId);
       } else {
-        state.toasts.forEach((toast4) => {
-          addToRemoveQueue(toast4.id);
+        state.toasts.forEach((toast5) => {
+          addToRemoveQueue(toast5.id);
         });
       }
       return {
@@ -3556,24 +3556,26 @@ var BusinessProfileCard = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: /* @__PURE__ */ jsx(
-      FormInput,
-      {
-        name: "achCompanyId",
-        label: "ACH Company ID",
-        placeholder: "10-digit company ID"
-      }
-    ) }),
-    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: /* @__PURE__ */ jsx(
-      FormInput,
-      {
-        name: "productId",
-        label: "Product ID",
-        type: "number",
-        placeholder: "Product ID",
-        disabled: true
-      }
-    ) }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+      /* @__PURE__ */ jsx(
+        FormInput,
+        {
+          name: "achCompanyId",
+          label: "ACH Company ID",
+          placeholder: "10-digit company ID"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        FormInput,
+        {
+          name: "productId",
+          label: "Product ID",
+          type: "number",
+          placeholder: "Product ID",
+          disabled: true
+        }
+      )
+    ] }),
     /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-muted-foreground mt-6", children: "Contact Person" }),
     /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
       /* @__PURE__ */ jsx(
@@ -3632,6 +3634,34 @@ var BusinessProfileCard = ({
         /* @__PURE__ */ jsx(InfoField, { label: "Website", value: formValues?.website || "-", layout: "horizontal" })
       ] }),
       /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4", children: /* @__PURE__ */ jsx(InfoField, { label: "Business Phone", value: formValues?.mobilePhone || "-", layout: "horizontal" }) }),
+      /* @__PURE__ */ jsx(
+        InfoField,
+        {
+          label: "Address",
+          value: formValues?.address ? (() => {
+            const parts = [];
+            if (formValues.address.line1) parts.push(formValues.address.line1);
+            if (formValues.address.line2) parts.push(formValues.address.line2);
+            const cityStateZip = [
+              formValues.address.city,
+              formValues.address.state,
+              formValues.address.postalCode
+            ].filter(Boolean).join(" ");
+            if (cityStateZip) parts.push(cityStateZip);
+            if (formValues.address.countryCode) parts.push(formValues.address.countryCode);
+            return parts.length > 0 ? parts.join(", ") : "-";
+          })() : "-",
+          layout: "horizontal"
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+        /* @__PURE__ */ jsx(InfoField, { label: "MCC", value: formValues?.mcc || "-", layout: "horizontal" }),
+        /* @__PURE__ */ jsx(InfoField, { label: "NAICS", value: formValues?.naics || "-", layout: "horizontal" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+        /* @__PURE__ */ jsx(InfoField, { label: "ACH Company ID", value: formValues?.achCompanyId || "-", layout: "horizontal" }),
+        /* @__PURE__ */ jsx(InfoField, { label: "Product ID", value: formValues?.productId?.toString() || "-", layout: "horizontal" })
+      ] }),
       /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
         /* @__PURE__ */ jsx(
           InfoField,
@@ -3657,32 +3687,6 @@ var BusinessProfileCard = ({
           }
         )
       ] }),
-      /* @__PURE__ */ jsx(
-        InfoField,
-        {
-          label: "Address",
-          value: formValues?.address ? (() => {
-            const parts = [];
-            if (formValues.address.line1) parts.push(formValues.address.line1);
-            if (formValues.address.line2) parts.push(formValues.address.line2);
-            const cityStateZip = [
-              formValues.address.city,
-              formValues.address.state,
-              formValues.address.postalCode
-            ].filter(Boolean).join(" ");
-            if (cityStateZip) parts.push(cityStateZip);
-            if (formValues.address.countryCode) parts.push(formValues.address.countryCode);
-            return parts.length > 0 ? parts.join(", ") : "-";
-          })() : "-",
-          layout: "horizontal"
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
-        /* @__PURE__ */ jsx(InfoField, { label: "MCC", value: formValues?.mcc || "-", layout: "horizontal" }),
-        /* @__PURE__ */ jsx(InfoField, { label: "NAICS", value: formValues?.naics || "-", layout: "horizontal" })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4", children: /* @__PURE__ */ jsx(InfoField, { label: "ACH Company ID", value: formValues?.achCompanyId || "-", layout: "horizontal" }) }),
-      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4", children: /* @__PURE__ */ jsx(InfoField, { label: "Product ID", value: formValues?.productId?.toString() || "-", layout: "horizontal" }) }),
       /* @__PURE__ */ jsx("h4", { className: "text-sm font-medium text-muted-foreground mt-6", children: "Contact Person" }),
       /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
         /* @__PURE__ */ jsx(InfoField, { label: "First Name", value: formValues?.contactPersonFirstName || "-", layout: "horizontal" }),
@@ -4256,93 +4260,575 @@ var PageLayout = React15.forwardRef(
   }
 );
 PageLayout.displayName = "PageLayout";
-var UBOCard = ({ ubos, onUBOClick }) => {
-  const columns3 = [
-    {
-      key: "name",
-      title: "Name",
-      sortable: true,
-      width: "40%",
-      render: (value, row) => /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: () => onUBOClick(row.customerId),
-          className: "text-primary hover:underline font-medium text-left",
-          children: value
-        }
-      )
-    },
-    {
-      key: "title",
-      title: "Title",
-      sortable: true,
-      width: "40%"
-    },
-    {
-      key: "ownershipPercentage",
-      title: "Ownership %",
-      sortable: true,
-      width: "20%",
-      align: "right",
-      render: (value) => `${value}%`
-    }
-  ];
-  return /* @__PURE__ */ jsxs(Card, { children: [
-    /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
-      /* @__PURE__ */ jsx(CardTitle, { children: "Ultimate Beneficial Owners (UBO)" }),
-      /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", children: [
-        /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
-        "Add UBO"
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(CardContent, { children: ubos.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
-      /* @__PURE__ */ jsx(Users, { className: "h-5 w-5 opacity-50" }),
-      /* @__PURE__ */ jsx("p", { children: "No UBOs recorded" })
-    ] }) : /* @__PURE__ */ jsx(
-      DataTable,
+var FormField = React15.forwardRef(
+  ({ label, description, error, required, children, className, layout = "vertical" }, ref) => {
+    const isHorizontal = layout === "horizontal";
+    return /* @__PURE__ */ jsxs(
+      "div",
       {
-        columns: columns3,
-        data: ubos
+        ref,
+        className: cn(
+          "space-y-2",
+          isHorizontal && "grid grid-cols-1 md:grid-cols-3 gap-4 items-start space-y-0",
+          className
+        ),
+        children: [
+          label && /* @__PURE__ */ jsxs("div", { className: cn("space-y-1", isHorizontal && "pt-2"), children: [
+            /* @__PURE__ */ jsxs("label", { className: "text-sm font-medium text-foreground", children: [
+              label,
+              required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
+            ] }),
+            description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: description })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: cn(isHorizontal && "md:col-span-2"), children: [
+            children,
+            error && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive mt-1", children: error })
+          ] })
+        ]
       }
-    ) })
-  ] });
+    );
+  }
+);
+FormField.displayName = "FormField";
+var spacingClasses = {
+  sm: "space-y-3",
+  md: "space-y-4",
+  lg: "space-y-6"
 };
-var BusinessDocuments = ({ businessId, documents, onDocumentUpload }) => {
-  const [isUploading, setIsUploading] = useState(false);
-  const [showUploadDialog, setShowUploadDialog] = useState(false);
-  const [selectedFile, setSelectedFile] = useState(null);
-  const [documentName, setDocumentName] = useState("");
-  const [description, setDescription] = useState("");
-  const [documentType, setDocumentType] = useState("");
-  const handleFileSelect = (e) => {
-    const file = e.target.files?.[0];
-    if (!file) return;
-    setSelectedFile(file);
-    setDocumentName(file.name);
-  };
-  const handleUploadSubmit = async () => {
-    if (!selectedFile || !documentName || !documentType) {
-      toast({
-        title: "Missing Information",
-        description: "Please fill in all required fields",
-        variant: "destructive"
-      });
-      return;
+var gridClasses = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 md:grid-cols-2",
+  3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
+  4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
+};
+var FormSection = React15.forwardRef(
+  ({
+    title,
+    description,
+    children,
+    className,
+    spacing: spacing2 = "md",
+    layout = "vertical",
+    columns: columns3 = 2
+  }, ref) => {
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("space-y-4", className), children: [
+      (title || description) && /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+        title && /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-foreground", children: title }),
+        description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: cn(
+        layout === "grid" ? `grid gap-4 ${gridClasses[columns3]}` : spacingClasses[spacing2]
+      ), children })
+    ] });
+  }
+);
+FormSection.displayName = "FormSection";
+function Calendar({
+  className,
+  classNames,
+  showOutsideDays = true,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    DayPicker,
+    {
+      showOutsideDays,
+      className: cn("p-3 pointer-events-auto", className),
+      classNames: {
+        months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
+        month: "space-y-4",
+        caption: "flex justify-center pt-1 relative items-center",
+        caption_label: "text-sm font-medium",
+        nav: "space-x-1 flex items-center",
+        button_previous: "absolute left-1 h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100",
+        button_next: "absolute right-1 h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100",
+        month_grid: "w-full border-collapse space-y-1",
+        weekdays: "flex",
+        weekday: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
+        week: "flex w-full mt-2",
+        day: "h-9 w-9 text-center text-sm p-0 relative hover:bg-accent hover:text-accent-foreground rounded-md",
+        day_button: cn(
+          buttonVariants({ variant: "ghost" }),
+          "h-9 w-9 p-0 font-normal"
+        ),
+        selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground",
+        today: "bg-accent text-accent-foreground",
+        outside: "text-muted-foreground opacity-50",
+        disabled: "text-muted-foreground opacity-50",
+        hidden: "invisible",
+        ...classNames
+      },
+      ...props
     }
-    setIsUploading(true);
-    try {
-      await onDocumentUpload(selectedFile, {
-        name: documentName,
-        description,
-        type: documentType
-      });
-      toast({
-        title: "Upload Successful",
-        description: `${documentName} uploaded successfully`
-      });
-      setShowUploadDialog(false);
-      resetForm();
-    } catch (error) {
+  );
+}
+Calendar.displayName = "Calendar";
+var Popover = PopoverPrimitive.Root;
+var PopoverTrigger = PopoverPrimitive.Trigger;
+var PopoverContent = React15.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+  PopoverPrimitive.Content,
+  {
+    ref,
+    align,
+    sideOffset,
+    className: cn(
+      "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+function DatePicker({
+  date,
+  onDateChange,
+  placeholder = "Pick a date",
+  disabled = false,
+  className,
+  buttonClassName,
+  calendarClassName,
+  align = "start",
+  disabledDates,
+  label,
+  wrapperClassName
+}) {
+  const [open, setOpen] = React15.useState(false);
+  const handleSelect = (selectedDate) => {
+    onDateChange?.(selectedDate);
+    setOpen(false);
+  };
+  const picker = /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "outline",
+        disabled,
+        className: cn(
+          "justify-start text-left font-normal",
+          !date && "text-muted-foreground",
+          buttonClassName
+        ),
+        children: [
+          /* @__PURE__ */ jsx(CalendarIcon, { className: "mr-2 h-4 w-4" }),
+          date ? format(date, "MM/dd/yyyy") : placeholder
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(PopoverContent, { className: cn("w-auto p-0", className), align, children: /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        mode: "single",
+        selected: date,
+        onSelect: handleSelect,
+        disabled: disabledDates,
+        initialFocus: true,
+        className: cn("pointer-events-auto", calendarClassName)
+      }
+    ) })
+  ] });
+  if (label) {
+    return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", wrapperClassName), children: [
+      /* @__PURE__ */ jsx("label", { className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: label }),
+      picker
+    ] });
+  }
+  return picker;
+}
+var uboSchema = z.object({
+  legalFirstName: z.string().min(1, "Legal first name is required"),
+  legalLastName: z.string().min(1, "Legal last name is required"),
+  email: z.string().email("Invalid email address"),
+  title: z.string().min(1, "Title is required"),
+  ownershipPercentage: z.number().min(0).max(100, "Must be between 0 and 100"),
+  idNumber: z.string().min(1, "ID number is required"),
+  ssn: z.string().min(1, "SSN is required"),
+  dateOfBirth: z.date({
+    message: "Date of birth is required"
+  }),
+  street: z.string().min(1, "Street is required"),
+  apartment: z.string().optional(),
+  city: z.string().min(1, "City is required"),
+  state: z.string().min(1, "State is required"),
+  country: z.string().min(1, "Country is required")
+});
+var titleOptions = [
+  { value: "CEO", label: "CEO" },
+  { value: "CFO", label: "CFO" },
+  { value: "CTO", label: "CTO" },
+  { value: "COO", label: "COO" },
+  { value: "President", label: "President" },
+  { value: "Vice President", label: "Vice President" },
+  { value: "Director", label: "Director" },
+  { value: "Manager", label: "Manager" },
+  { value: "Board Member", label: "Board Member" },
+  { value: "Partner", label: "Partner" },
+  { value: "Other", label: "Other" }
+];
+var AddUBODialog = ({ open, onOpenChange, onSubmit }) => {
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const form = useForm({
+    resolver: zodResolver(uboSchema),
+    defaultValues: {
+      legalFirstName: "",
+      legalLastName: "",
+      email: "",
+      title: "",
+      ownershipPercentage: 0,
+      idNumber: "",
+      ssn: "",
+      street: "",
+      apartment: "",
+      city: "",
+      state: "",
+      country: "US"
+    }
+  });
+  const handleSubmit = async (data) => {
+    setIsSubmitting(true);
+    try {
+      await onSubmit(data);
+      form.reset();
+      onOpenChange(false);
+    } catch (error) {
+      console.error("Error adding UBO:", error);
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+  const handleCancel = () => {
+    form.reset();
+    onOpenChange(false);
+  };
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "max-w-3xl max-h-[90vh] overflow-y-auto", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Add Ultimate Beneficial Owner" }) }),
+    /* @__PURE__ */ jsx(FormProvider$1, { ...form, children: /* @__PURE__ */ jsxs("form", { onSubmit: form.handleSubmit(handleSubmit), className: "space-y-6", children: [
+      /* @__PURE__ */ jsxs(FormSection, { layout: "grid", columns: 2, spacing: "md", children: [
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "legalFirstName",
+            label: "Legal first name",
+            placeholder: "Enter first name"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "legalLastName",
+            label: "Legal last name",
+            placeholder: "Enter last name"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(FormSection, { layout: "vertical", spacing: "md", children: /* @__PURE__ */ jsx(
+        FormInput,
+        {
+          name: "email",
+          label: "Email",
+          type: "email",
+          placeholder: "Enter email address"
+        }
+      ) }),
+      /* @__PURE__ */ jsxs(FormSection, { layout: "grid", columns: 2, spacing: "md", children: [
+        /* @__PURE__ */ jsx(
+          FormSelect,
+          {
+            name: "title",
+            label: "Title",
+            placeholder: "Select title",
+            options: titleOptions
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "ownershipPercentage",
+            label: "Ownership %",
+            type: "number",
+            placeholder: "Enter ownership percentage"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(FormSection, { layout: "grid", columns: 2, spacing: "md", children: [
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "idNumber",
+            label: "ID Number",
+            placeholder: "Enter ID number"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "ssn",
+            label: "SSN",
+            placeholder: "Enter SSN"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(FormSection, { layout: "vertical", spacing: "md", children: /* @__PURE__ */ jsx(FormField, { label: "Date of birth", children: /* @__PURE__ */ jsx(
+        Controller,
+        {
+          name: "dateOfBirth",
+          control: form.control,
+          render: ({ field }) => /* @__PURE__ */ jsx(
+            DatePicker,
+            {
+              date: field.value,
+              onDateChange: field.onChange,
+              placeholder: "MM/DD/YYYY"
+            }
+          )
+        }
+      ) }) }),
+      /* @__PURE__ */ jsxs(FormSection, { title: "Address Details", layout: "vertical", spacing: "md", children: [
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "street",
+            label: "Street",
+            placeholder: "Enter street address"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "apartment",
+            label: "Apartment, suite, or floor",
+            placeholder: "Enter apartment, suite, or floor (optional)"
+          }
+        ),
+        /* @__PURE__ */ jsxs(FormSection, { layout: "grid", columns: 2, spacing: "md", children: [
+          /* @__PURE__ */ jsx(
+            FormInput,
+            {
+              name: "city",
+              label: "City",
+              placeholder: "Enter city"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            FormInput,
+            {
+              name: "state",
+              label: "State",
+              placeholder: "Enter state"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "country",
+            label: "Country",
+            placeholder: "Enter country"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: handleCancel, children: "Cancel" }),
+        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: isSubmitting, children: isSubmitting ? "Adding..." : "Add UBO" })
+      ] })
+    ] }) })
+  ] }) });
+};
+var UBOCard = ({ ubos, onUBOClick }) => {
+  const [isDialogOpen, setIsDialogOpen] = useState(false);
+  const handleAddUBO = (data) => {
+    console.log("New UBO data:", data);
+    toast$1.success("UBO added successfully");
+  };
+  const columns3 = [
+    {
+      key: "name",
+      title: "Name",
+      sortable: true,
+      width: "40%",
+      render: (value, row) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => onUBOClick(row.customerId),
+          className: "text-primary hover:underline font-medium text-left",
+          children: value
+        }
+      )
+    },
+    {
+      key: "title",
+      title: "Title",
+      sortable: true,
+      width: "40%"
+    },
+    {
+      key: "ownershipPercentage",
+      title: "Ownership %",
+      sortable: true,
+      width: "20%",
+      align: "right",
+      render: (value) => `${value}%`
+    }
+  ];
+  return /* @__PURE__ */ jsxs(Card, { children: [
+    /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
+      /* @__PURE__ */ jsx(CardTitle, { children: "Ultimate Beneficial Owners (UBO)" }),
+      /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", onClick: () => setIsDialogOpen(true), children: [
+        /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
+        "Add UBO"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(CardContent, { children: ubos.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
+      /* @__PURE__ */ jsx(Users, { className: "h-5 w-5 opacity-50" }),
+      /* @__PURE__ */ jsx("p", { children: "No UBOs recorded" })
+    ] }) : /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        columns: columns3,
+        data: ubos
+      }
+    ) }),
+    /* @__PURE__ */ jsx(
+      AddUBODialog,
+      {
+        open: isDialogOpen,
+        onOpenChange: setIsDialogOpen,
+        onSubmit: handleAddUBO
+      }
+    )
+  ] });
+};
+var accountSchema = z.object({
+  accountName: z.string().min(1, "Account name is required"),
+  accountType: z.string().min(1, "Account type is required"),
+  fundingFromAccount: z.string().optional(),
+  sweepToAccount: z.string().optional()
+});
+var AddAccountDialog = ({
+  open,
+  onOpenChange,
+  onSubmit,
+  existingAccounts = []
+}) => {
+  const [isLoading, setIsLoading] = useState(false);
+  const form = useForm({
+    resolver: zodResolver(accountSchema),
+    defaultValues: {
+      accountName: "",
+      accountType: void 0,
+      fundingFromAccount: "",
+      sweepToAccount: ""
+    }
+  });
+  const handleSubmit = async (data) => {
+    setIsLoading(true);
+    try {
+      await onSubmit?.(data);
+      form.reset();
+      onOpenChange(false);
+    } catch (error) {
+      console.error("Error creating account:", error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  existingAccounts.map((acc) => ({
+    value: acc.id,
+    label: `${acc.number}${acc.type ? ` (${acc.type})` : ""}`
+  }));
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: "sm:max-w-[600px] max-h-[90vh] overflow-y-auto", children: [
+    /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Add Account" }) }),
+    /* @__PURE__ */ jsx(FormProvider, { form, children: /* @__PURE__ */ jsxs("form", { onSubmit: form.handleSubmit(handleSubmit), className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs(FormSection, { spacing: "md", children: [
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "accountName",
+            label: "Account Name",
+            placeholder: "Enter account name",
+            required: true
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormSelect,
+          {
+            name: "accountType",
+            label: "Account Type",
+            placeholder: "Select account type",
+            options: [
+              { value: "CHECKING", label: "Checking" },
+              { value: "SAVINGS", label: "Savings" }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "fundingFromAccount",
+            label: "Funding from Account",
+            placeholder: "Enter funding account"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            name: "sweepToAccount",
+            label: "Sweep to Account",
+            placeholder: "Enter sweep account"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs(DialogFooter, { children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: () => onOpenChange(false),
+            disabled: isLoading,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: isLoading, children: isLoading ? "Creating..." : "Create Account" })
+      ] })
+    ] }) })
+  ] }) });
+};
+var BusinessDocuments = ({ businessId, documents, onDocumentUpload }) => {
+  const [isUploading, setIsUploading] = useState(false);
+  const [showUploadDialog, setShowUploadDialog] = useState(false);
+  const [selectedFile, setSelectedFile] = useState(null);
+  const [documentName, setDocumentName] = useState("");
+  const [description, setDescription] = useState("");
+  const [documentType, setDocumentType] = useState("");
+  const handleFileSelect = (e) => {
+    const file = e.target.files?.[0];
+    if (!file) return;
+    setSelectedFile(file);
+    setDocumentName(file.name);
+  };
+  const handleUploadSubmit = async () => {
+    if (!selectedFile || !documentName || !documentType) {
+      toast({
+        title: "Missing Information",
+        description: "Please fill in all required fields",
+        variant: "destructive"
+      });
+      return;
+    }
+    setIsUploading(true);
+    try {
+      await onDocumentUpload(selectedFile, {
+        name: documentName,
+        description,
+        type: documentType
+      });
+      toast({
+        title: "Upload Successful",
+        description: `${documentName} uploaded successfully`
+      });
+      setShowUploadDialog(false);
+      resetForm();
+    } catch (error) {
       toast({
         title: "Upload Failed",
         description: "Failed to upload document. Please try again.",
@@ -4644,7 +5130,11 @@ var BusinessDetailView = ({
   onUBOClick,
   onDocumentUpload
 }) => {
-  return /* @__PURE__ */ jsx(
+  const [showAddAccountDialog, setShowAddAccountDialog] = useState(false);
+  const handleAddAccount = (data) => {
+    console.log("New account data:", data);
+  };
+  return /* @__PURE__ */ jsxs(
     PageLayout,
     {
       title: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
@@ -4683,164 +5173,64 @@ var BusinessDetailView = ({
         }
       ],
       maxWidth: "full",
-      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-4", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
-          /* @__PURE__ */ jsx(
-            BusinessProfileCard,
-            {
-              data: businessProfile,
-              identityVerification,
-              isEditing: isEditingProfile,
-              onToggleEdit: onToggleProfileEdit,
-              onDataChange: onProfileDataChange
-            }
-          ),
-          /* @__PURE__ */ jsx(UBOCard, { ubos: businessUBOs, onUBOClick }),
-          /* @__PURE__ */ jsxs(Card, { children: [
-            /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
-              /* @__PURE__ */ jsx(CardTitle, { children: "External Accounts" }),
-              /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", onClick: onAddAccount, children: [
-                /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
-                "Account"
-              ] })
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
+            /* @__PURE__ */ jsx(
+              BusinessProfileCard,
+              {
+                data: businessProfile,
+                identityVerification,
+                isEditing: isEditingProfile,
+                onToggleEdit: onToggleProfileEdit,
+                onDataChange: onProfileDataChange
+              }
+            ),
+            /* @__PURE__ */ jsx(UBOCard, { ubos: businessUBOs, onUBOClick }),
+            /* @__PURE__ */ jsxs(Card, { children: [
+              /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
+                /* @__PURE__ */ jsx(CardTitle, { children: "External Accounts" }),
+                /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", onClick: () => setShowAddAccountDialog(true), children: [
+                  /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
+                  "Account"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(CardContent, { children: businessAccounts.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
+                /* @__PURE__ */ jsx(Wallet, { className: "h-5 w-5 opacity-50" }),
+                /* @__PURE__ */ jsx("p", { children: "No external accounts found" })
+              ] }) : /* @__PURE__ */ jsx(
+                DataTable,
+                {
+                  columns: accountColumns,
+                  data: businessAccounts
+                }
+              ) })
             ] }),
-            /* @__PURE__ */ jsx(CardContent, { children: businessAccounts.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
-              /* @__PURE__ */ jsx(Wallet, { className: "h-5 w-5 opacity-50" }),
-              /* @__PURE__ */ jsx("p", { children: "No external accounts found" })
-            ] }) : /* @__PURE__ */ jsx(
-              DataTable,
+            /* @__PURE__ */ jsx(
+              BusinessDocuments,
               {
-                columns: accountColumns,
-                data: businessAccounts
+                businessId: business.id,
+                documents: businessDocuments,
+                onDocumentUpload
               }
-            ) })
+            )
           ] }),
-          /* @__PURE__ */ jsx(
-            BusinessDocuments,
-            {
-              businessId: business.id,
-              documents: businessDocuments,
-              onDocumentUpload
-            }
-          )
+          /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(BusinessStatusCard, { isEditing: false, onToggleEdit: () => {
+          } }) })
         ] }),
-        /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(BusinessStatusCard, { isEditing: false, onToggleEdit: () => {
-        } }) })
-      ] })
+        /* @__PURE__ */ jsx(
+          AddAccountDialog,
+          {
+            open: showAddAccountDialog,
+            onOpenChange: setShowAddAccountDialog,
+            onSubmit: handleAddAccount,
+            existingAccounts: businessAccounts
+          }
+        )
+      ]
     }
   );
 };
-function Calendar({
-  className,
-  classNames,
-  showOutsideDays = true,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    DayPicker,
-    {
-      showOutsideDays,
-      className: cn("p-3 pointer-events-auto", className),
-      classNames: {
-        months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
-        month: "space-y-4",
-        caption: "flex justify-center pt-1 relative items-center",
-        caption_label: "text-sm font-medium",
-        nav: "space-x-1 flex items-center",
-        button_previous: "absolute left-1 h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100",
-        button_next: "absolute right-1 h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100",
-        month_grid: "w-full border-collapse space-y-1",
-        weekdays: "flex",
-        weekday: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
-        week: "flex w-full mt-2",
-        day: "h-9 w-9 text-center text-sm p-0 relative hover:bg-accent hover:text-accent-foreground rounded-md",
-        day_button: cn(
-          buttonVariants({ variant: "ghost" }),
-          "h-9 w-9 p-0 font-normal"
-        ),
-        selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground",
-        today: "bg-accent text-accent-foreground",
-        outside: "text-muted-foreground opacity-50",
-        disabled: "text-muted-foreground opacity-50",
-        hidden: "invisible",
-        ...classNames
-      },
-      ...props
-    }
-  );
-}
-Calendar.displayName = "Calendar";
-var Popover = PopoverPrimitive.Root;
-var PopoverTrigger = PopoverPrimitive.Trigger;
-var PopoverContent = React15.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
-  PopoverPrimitive.Content,
-  {
-    ref,
-    align,
-    sideOffset,
-    className: cn(
-      "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
-    ),
-    ...props
-  }
-) }));
-PopoverContent.displayName = PopoverPrimitive.Content.displayName;
-function DatePicker({
-  date,
-  onDateChange,
-  placeholder = "Pick a date",
-  disabled = false,
-  className,
-  buttonClassName,
-  calendarClassName,
-  align = "start",
-  disabledDates,
-  label,
-  wrapperClassName
-}) {
-  const [open, setOpen] = React15.useState(false);
-  const handleSelect = (selectedDate) => {
-    onDateChange?.(selectedDate);
-    setOpen(false);
-  };
-  const picker = /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-      Button,
-      {
-        variant: "outline",
-        disabled,
-        className: cn(
-          "justify-start text-left font-normal",
-          !date && "text-muted-foreground",
-          buttonClassName
-        ),
-        children: [
-          /* @__PURE__ */ jsx(CalendarIcon, { className: "mr-2 h-4 w-4" }),
-          date ? format(date, "MM/dd/yyyy") : placeholder
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ jsx(PopoverContent, { className: cn("w-auto p-0", className), align, children: /* @__PURE__ */ jsx(
-      Calendar,
-      {
-        mode: "single",
-        selected: date,
-        onSelect: handleSelect,
-        disabled: disabledDates,
-        initialFocus: true,
-        className: cn("pointer-events-auto", calendarClassName)
-      }
-    ) })
-  ] });
-  if (label) {
-    return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", wrapperClassName), children: [
-      /* @__PURE__ */ jsx("label", { className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70", children: label }),
-      picker
-    ] });
-  }
-  return picker;
-}
 var BusinessFiltersSheet = ({
   filters,
   onFilterChange,
@@ -5223,98 +5613,137 @@ var CreateBusinessView = ({
     }
   );
 };
+var CounterpartyFiltersSheet = ({
+  filters,
+  onFilterChange,
+  onResetFilters
+}) => {
+  const [localFilters, setLocalFilters] = useState(filters);
+  const [open, setOpen] = useState(false);
+  useEffect(() => {
+    setLocalFilters(filters);
+  }, [filters]);
+  const handleLocalFilterChange = (field, value) => {
+    setLocalFilters((prev) => ({ ...prev, [field]: value }));
+  };
+  const handleApplyFilters = () => {
+    Object.entries(localFilters).forEach(([key, value]) => {
+      onFilterChange(key, value);
+    });
+    setOpen(false);
+  };
+  const handleResetFilters = () => {
+    const resetFilters = {
+      name: "",
+      type: "",
+      status: "",
+      createdDateStart: void 0,
+      createdDateEnd: void 0
+    };
+    setLocalFilters(resetFilters);
+    onResetFilters();
+    setOpen(false);
+  };
+  return /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, 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: "Counterparty Filters" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-6 py-6", children: [
+        /* @__PURE__ */ jsx(
+          EnhancedInput,
+          {
+            label: "Name",
+            value: localFilters.name,
+            onChange: (e) => handleLocalFilterChange("name", e.target.value),
+            placeholder: "Enter counterparty name"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          EnhancedSelect,
+          {
+            label: "Type",
+            value: localFilters.type,
+            onValueChange: (value) => handleLocalFilterChange("type", value),
+            placeholder: "Select type",
+            options: [
+              { value: "BUSINESS", label: "Business" },
+              { value: "INDIVIDUAL", label: "Individual" }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          EnhancedSelect,
+          {
+            label: "Status",
+            value: localFilters.status,
+            onValueChange: (value) => handleLocalFilterChange("status", value),
+            placeholder: "Select status",
+            options: [
+              { value: "ACTIVE", label: "Active" },
+              { value: "INACTIVE", label: "Inactive" },
+              { value: "PENDING", label: "Pending" },
+              { value: "SUSPENDED", label: "Suspended" }
+            ]
+          }
+        ),
+        /* @__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: "Created Date Start" }),
+            /* @__PURE__ */ jsx(
+              DatePicker,
+              {
+                date: localFilters.createdDateStart,
+                onDateChange: (date) => handleLocalFilterChange("createdDateStart", date),
+                placeholder: "MM/DD/YYYY",
+                buttonClassName: "w-full",
+                className: "bg-background z-50"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Created Date End" }),
+            /* @__PURE__ */ jsx(
+              DatePicker,
+              {
+                date: localFilters.createdDateEnd,
+                onDateChange: (date) => handleLocalFilterChange("createdDateEnd", date),
+                placeholder: "MM/DD/YYYY",
+                buttonClassName: "w-full",
+                className: "bg-background z-50"
+              }
+            )
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs(SheetFooter, { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: handleResetFilters, className: "flex-1", children: "Reset Filters" }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleApplyFilters, className: "flex-1", children: "Apply Filters" })
+      ] })
+    ] })
+  ] });
+};
 var CounterpartiesView = ({
   table,
   filters,
   onFilterChange,
   onResetFilters,
-  onApplyFilters,
   onCreateCounterparty
 }) => {
   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-6 max-w-none", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-foreground mb-2", children: "Counterparties" }) }),
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-foreground", children: "Counterparties" }) }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__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: "Counterparty Filters" }) }),
-            /* @__PURE__ */ jsxs("div", { className: "space-y-6 py-6", children: [
-              /* @__PURE__ */ jsx(
-                EnhancedInput,
-                {
-                  label: "Name",
-                  value: filters.name,
-                  onChange: (e) => onFilterChange("name", e.target.value),
-                  placeholder: "Enter counterparty name"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                EnhancedSelect,
-                {
-                  label: "Type",
-                  value: filters.type,
-                  onValueChange: (value) => onFilterChange("type", value),
-                  placeholder: "Select type",
-                  options: [
-                    { value: "BUSINESS", label: "Business" },
-                    { value: "INDIVIDUAL", label: "Individual" }
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                EnhancedSelect,
-                {
-                  label: "Status",
-                  value: filters.status,
-                  onValueChange: (value) => onFilterChange("status", value),
-                  placeholder: "Select status",
-                  options: [
-                    { value: "ACTIVE", label: "Active" },
-                    { value: "INACTIVE", label: "Inactive" },
-                    { value: "PENDING", label: "Pending" },
-                    { value: "SUSPENDED", label: "Suspended" }
-                  ]
-                }
-              ),
-              /* @__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: "Created Date Start" }),
-                  /* @__PURE__ */ jsx(
-                    DatePicker,
-                    {
-                      date: filters.createdDateStart,
-                      onDateChange: (date) => onFilterChange("createdDateStart", date),
-                      placeholder: "MM/DD/YYYY",
-                      buttonClassName: "w-full",
-                      className: "bg-background z-50"
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-                  /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: "Created Date End" }),
-                  /* @__PURE__ */ jsx(
-                    DatePicker,
-                    {
-                      date: filters.createdDateEnd,
-                      onDateChange: (date) => onFilterChange("createdDateEnd", date),
-                      placeholder: "MM/DD/YYYY",
-                      buttonClassName: "w-full",
-                      className: "bg-background z-50"
-                    }
-                  )
-                ] })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs(SheetFooter, { className: "gap-2", children: [
-              /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: onResetFilters, children: "Reset Filters" }),
-              /* @__PURE__ */ jsx(Button, { onClick: onApplyFilters, children: "Apply Filters" })
-            ] })
-          ] })
-        ] }),
+        /* @__PURE__ */ jsx(
+          CounterpartyFiltersSheet,
+          {
+            filters,
+            onFilterChange,
+            onResetFilters
+          }
+        ),
         /* @__PURE__ */ jsx(Button, { onClick: onCreateCounterparty, children: "Create Counterparty" })
       ] })
     ] }) }) }),
@@ -6418,39 +6847,6 @@ var CounterpartyBasicInfo = ({ onDataChange }) => {
     ] })
   ] });
 };
-var spacingClasses = {
-  sm: "space-y-3",
-  md: "space-y-4",
-  lg: "space-y-6"
-};
-var gridClasses = {
-  1: "grid-cols-1",
-  2: "grid-cols-1 md:grid-cols-2",
-  3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3",
-  4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
-};
-var FormSection = React15.forwardRef(
-  ({
-    title,
-    description,
-    children,
-    className,
-    spacing: spacing2 = "md",
-    layout = "vertical",
-    columns: columns3 = 2
-  }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: cn("space-y-4", className), children: [
-      (title || description) && /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-        title && /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-foreground", children: title }),
-        description && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: description })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: cn(
-        layout === "grid" ? `grid gap-4 ${gridClasses[columns3]}` : spacingClasses[spacing2]
-      ), children })
-    ] });
-  }
-);
-FormSection.displayName = "FormSection";
 var IntermediaryFI = () => {
   return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
     /* @__PURE__ */ jsxs("div", { className: "border-b border-border pb-4", children: [
@@ -7917,36 +8313,6 @@ var EntityCard = React15.forwardRef(
   }
 );
 EntityCard.displayName = "EntityCard";
-var FormField = React15.forwardRef(
-  ({ label, description, error, required, children, className, layout = "vertical" }, ref) => {
-    const isHorizontal = layout === "horizontal";
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        className: cn(
-          "space-y-2",
-          isHorizontal && "grid grid-cols-1 md:grid-cols-3 gap-4 items-start space-y-0",
-          className
-        ),
-        children: [
-          label && /* @__PURE__ */ jsxs("div", { className: cn("space-y-1", isHorizontal && "pt-2"), children: [
-            /* @__PURE__ */ jsxs("label", { className: "text-sm font-medium text-foreground", children: [
-              label,
-              required && /* @__PURE__ */ jsx("span", { className: "text-destructive ml-1", children: "*" })
-            ] }),
-            description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: description })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: cn(isHorizontal && "md:col-span-2"), children: [
-            children,
-            error && /* @__PURE__ */ jsx("p", { className: "text-xs text-destructive mt-1", children: error })
-          ] })
-        ]
-      }
-    );
-  }
-);
-FormField.displayName = "FormField";
 var variantStyles = {
   default: "",
   success: "border-success/20 bg-success/5",
@@ -9325,39 +9691,6 @@ var AccountStatusCard = ({ isEditing, onToggleEdit, className }) => {
     }
   );
 };
-var AccountBalanceCard = React15__default.forwardRef(
-  ({ balance, availableBalance, accountNumber, accountType, className }, ref) => {
-    return /* @__PURE__ */ jsx(
-      Card,
-      {
-        ref,
-        className: cn(
-          "border-primary/20 bg-gradient-to-br from-primary/5 via-primary/3 to-background",
-          className
-        ),
-        children: /* @__PURE__ */ jsx(CardContent, { className: "p-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx(Wallet, { className: "h-4 w-4 text-primary" }),
-            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: accountNumber }),
-            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2022" }),
-            /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground capitalize", children: accountType })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-8", children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Account Balance" }),
-              /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold text-foreground tracking-tight", children: balance })
-            ] }),
-            availableBalance && /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Available Balance" }),
-              /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold text-foreground tracking-tight", children: availableBalance })
-            ] })
-          ] })
-        ] }) })
-      }
-    );
-  }
-);
-AccountBalanceCard.displayName = "AccountBalanceCard";
 var accountInfoSchema = z.object({
   accountName: z.string().trim().min(1, "Account name is required").max(100, "Account name must be less than 100 characters"),
   canAcceptSweep: z.enum(["Yes", "No"]),
@@ -9387,7 +9720,7 @@ var AccountDetail = () => {
   }
   const formValues = form.watch();
   const customerPath = account.customerType === "business" ? `/business/${account.customerId}` : `/individual/${account.customerId}`;
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     PageLayout,
     {
       title: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
@@ -9430,29 +9763,37 @@ var AccountDetail = () => {
         }
       ],
       maxWidth: "full",
-      children: [
-        /* @__PURE__ */ jsx(
-          AccountBalanceCard,
-          {
-            balance: account.balance,
-            availableBalance: account.balance,
-            accountNumber: account.number,
-            accountType: account.type,
-            className: "mb-4"
-          }
-        ),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-4", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
-            /* @__PURE__ */ jsx(
-              EditableFormCard,
-              {
-                title: "Account Information",
-                variant: "subtle",
-                isEditing: form.isEditing,
-                onToggleEdit: form.handleToggleEdit,
-                onSave: form.handleSave,
-                onCancel: form.handleCancel,
-                viewContent: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
+          /* @__PURE__ */ jsx(
+            EditableFormCard,
+            {
+              title: "Account Information",
+              variant: "subtle",
+              isEditing: form.isEditing,
+              onToggleEdit: form.handleToggleEdit,
+              onSave: form.handleSave,
+              onCancel: form.handleCancel,
+              viewContent: /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs("div", { className: "mb-6 p-6 rounded-lg bg-gradient-to-br from-primary/10 via-primary/5 to-background border border-primary/20", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-4", children: [
+                    /* @__PURE__ */ jsx(Wallet, { className: "h-4 w-4 text-primary" }),
+                    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: account.number }),
+                    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2022" }),
+                    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground capitalize", children: account.type })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-8", children: [
+                    /* @__PURE__ */ jsxs("div", { children: [
+                      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Account Balance" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold text-foreground tracking-tight", children: account.balance })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { children: [
+                      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Available Balance" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold text-foreground tracking-tight", children: account.balance })
+                    ] })
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
                   /* @__PURE__ */ jsx(
                     InfoField,
                     {
@@ -9516,8 +9857,28 @@ var AccountDetail = () => {
                       value: formValues.sweepAccountNumber || "-"
                     }
                   )
+                ] })
+              ] }),
+              editContent: /* @__PURE__ */ jsx(FormProvider, { form, children: /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs("div", { className: "mb-6 p-6 rounded-lg bg-gradient-to-br from-primary/10 via-primary/5 to-background border border-primary/20", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-4", children: [
+                    /* @__PURE__ */ jsx(Wallet, { className: "h-4 w-4 text-primary" }),
+                    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: account.number }),
+                    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2022" }),
+                    /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground capitalize", children: account.type })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-8", children: [
+                    /* @__PURE__ */ jsxs("div", { children: [
+                      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Account Balance" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold text-foreground tracking-tight", children: account.balance })
+                    ] }),
+                    /* @__PURE__ */ jsxs("div", { children: [
+                      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Available Balance" }),
+                      /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold text-foreground tracking-tight", children: account.balance })
+                    ] })
+                  ] })
                 ] }),
-                editContent: /* @__PURE__ */ jsx(FormProvider, { form, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
                   /* @__PURE__ */ jsx(
                     InfoField,
                     {
@@ -9589,18 +9950,18 @@ var AccountDetail = () => {
                       placeholder: "Enter sweep account number"
                     }
                   )
-                ] }) })
-              }
-            ),
-            /* @__PURE__ */ jsxs(Card, { children: [
-              /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Fees" }) }),
-              /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", { className: "text-center py-8 text-muted-foreground", children: /* @__PURE__ */ jsx("p", { children: "Fees information coming soon" }) }) })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(AccountStatusCard, { isEditing: false, onToggleEdit: () => {
-          } }) })
-        ] })
-      ]
+                ] })
+              ] }) })
+            }
+          ),
+          /* @__PURE__ */ jsxs(Card, { children: [
+            /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Fees" }) }),
+            /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", { className: "text-center py-8 text-muted-foreground", children: /* @__PURE__ */ jsx("p", { children: "Fees information coming soon" }) }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(AccountStatusCard, { isEditing: false, onToggleEdit: () => {
+        } }) })
+      ] })
     }
   );
 };
@@ -10835,8 +11196,6 @@ var Counterparties = () => {
       createdDateEnd: void 0
     });
   }, []);
-  const handleApplyFilters = useCallback(() => {
-  }, []);
   const handleSort = useCallback((key) => {
     if (sortBy === key) {
       setSortDirection((prev) => prev === "asc" ? "desc" : "asc");
@@ -10921,7 +11280,6 @@ var Counterparties = () => {
       filters,
       onFilterChange: handleFilterChange,
       onResetFilters: handleResetFilters,
-      onApplyFilters: handleApplyFilters,
       onCreateCounterparty: handleCreateCounterparty
     }
   );
@@ -11048,8 +11406,83 @@ var PaymentMethodCard = ({
           intermediaryBankId && /* @__PURE__ */ jsx(InfoField, { label: "Intermediary Bank ID", value: intermediaryBankId })
         ] })
       ] })
-    ] })
-  ] });
+    ] })
+  ] });
+};
+var CounterpartyDetailView = ({
+  counterpartyName,
+  counterpartyType,
+  currentStatus,
+  isEditingProfile,
+  mockPaymentMethods: mockPaymentMethods2,
+  documentsTable,
+  onStatusChange,
+  onToggleProfileEdit,
+  onAddPaymentMethod,
+  onAddDocument
+}) => {
+  return /* @__PURE__ */ jsx(
+    PageLayout,
+    {
+      title: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx("span", { children: counterpartyName }),
+        /* @__PURE__ */ jsx(
+          EditableInfoField,
+          {
+            label: "",
+            value: currentStatus,
+            options: [
+              { value: "ACTIVE", label: "Active" },
+              { value: "INACTIVE", label: "Inactive" },
+              { value: "PENDING", label: "Pending" },
+              { value: "SUSPENDED", label: "Suspended" }
+            ],
+            onChange: onStatusChange,
+            renderValue: (value) => /* @__PURE__ */ jsx(StatusBadge, { status: value }),
+            className: "inline-block"
+          }
+        ),
+        /* @__PURE__ */ jsx(CounterpartyTypeBadge, { type: counterpartyType })
+      ] }),
+      maxWidth: "full",
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
+          /* @__PURE__ */ jsx(
+            CounterpartyProfileCard,
+            {
+              isEditing: isEditingProfile,
+              onToggleEdit: onToggleProfileEdit
+            }
+          ),
+          /* @__PURE__ */ jsxs(Card, { children: [
+            /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
+              /* @__PURE__ */ jsx(CardTitle, { children: "Payment Methods" }),
+              /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", onClick: onAddPaymentMethod, children: [
+                /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
+                "Method"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(CardContent, { children: mockPaymentMethods2.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
+              /* @__PURE__ */ jsx(Wallet, { className: "h-5 w-5 opacity-50" }),
+              /* @__PURE__ */ jsx("p", { children: "No payment methods configured" })
+            ] }) : /* @__PURE__ */ jsx(ResponsiveGrid, { type: "forms", gap: "md", children: mockPaymentMethods2.map((method, index) => /* @__PURE__ */ jsx(PaymentMethodCard, { ...method }, index)) }) })
+          ] }),
+          /* @__PURE__ */ jsxs(Card, { children: [
+            /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
+              /* @__PURE__ */ jsx(CardTitle, { children: "Documents" }),
+              /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", onClick: onAddDocument, children: [
+                /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
+                "Document"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(CardContent, { children: documentsTable })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(CounterpartyStatusCard, { isEditing: false, onToggleEdit: () => {
+        } }) })
+      ] })
+    }
+  );
 };
 var mockPaymentMethods = [
   {
@@ -11109,6 +11542,33 @@ var CounterpartyDetail = () => {
       render: (value) => /* @__PURE__ */ jsx("span", { className: "capitalize", children: value })
     }
   ];
+  const handleStatusChange = (newStatus) => {
+    setCurrentStatus(newStatus);
+  };
+  const handleToggleProfileEdit = () => {
+    setIsEditingProfile(!isEditingProfile);
+  };
+  const handleAddPaymentMethod = () => {
+    console.log("Add payment method");
+  };
+  const handleAddDocument = () => {
+    console.log("Add document");
+  };
+  const documentsTable = useMemo(() => {
+    if (counterpartyDocuments.length === 0) {
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
+        /* @__PURE__ */ jsx(FileText, { className: "h-5 w-5 opacity-50" }),
+        /* @__PURE__ */ jsx("p", { children: "No documents found" })
+      ] });
+    }
+    return /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        columns: documentColumns,
+        data: counterpartyDocuments
+      }
+    );
+  }, [counterpartyDocuments, documentColumns]);
   if (!counterparty) {
     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: "Counterparty Not Found" }),
@@ -11116,74 +11576,18 @@ var CounterpartyDetail = () => {
     ] }) });
   }
   return /* @__PURE__ */ jsx(
-    PageLayout,
+    CounterpartyDetailView,
     {
-      title: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsx("span", { children: counterparty.name }),
-        /* @__PURE__ */ jsx(
-          EditableInfoField,
-          {
-            label: "",
-            value: currentStatus,
-            options: [
-              { value: "ACTIVE", label: "Active" },
-              { value: "INACTIVE", label: "Inactive" },
-              { value: "PENDING", label: "Pending" },
-              { value: "SUSPENDED", label: "Suspended" }
-            ],
-            onChange: (newStatus) => setCurrentStatus(newStatus),
-            renderValue: (value) => /* @__PURE__ */ jsx(StatusBadge, { status: value }),
-            className: "inline-block"
-          }
-        ),
-        /* @__PURE__ */ jsx(CounterpartyTypeBadge, { type: counterparty.type })
-      ] }),
-      maxWidth: "full",
-      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-4", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-4", children: [
-          /* @__PURE__ */ jsx(
-            CounterpartyProfileCard,
-            {
-              isEditing: isEditingProfile,
-              onToggleEdit: () => setIsEditingProfile(!isEditingProfile)
-            }
-          ),
-          /* @__PURE__ */ jsxs(Card, { children: [
-            /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
-              /* @__PURE__ */ jsx(CardTitle, { children: "Payment Methods" }),
-              /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", children: [
-                /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
-                "Method"
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx(CardContent, { children: mockPaymentMethods.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
-              /* @__PURE__ */ jsx(Wallet, { className: "h-5 w-5 opacity-50" }),
-              /* @__PURE__ */ jsx("p", { children: "No payment methods configured" })
-            ] }) : /* @__PURE__ */ jsx(ResponsiveGrid, { type: "forms", gap: "md", children: mockPaymentMethods.map((method, index) => /* @__PURE__ */ jsx(PaymentMethodCard, { ...method }, index)) }) })
-          ] }),
-          /* @__PURE__ */ jsxs(Card, { children: [
-            /* @__PURE__ */ jsxs(CardHeader, { className: "flex flex-row items-center justify-between space-y-0 pb-4", children: [
-              /* @__PURE__ */ jsx(CardTitle, { children: "Documents" }),
-              /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "ghost", children: [
-                /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4 mr-1" }),
-                "Document"
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx(CardContent, { children: counterpartyDocuments.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-2 py-4 text-sm text-muted-foreground", children: [
-              /* @__PURE__ */ jsx(FileText, { className: "h-5 w-5 opacity-50" }),
-              /* @__PURE__ */ jsx("p", { children: "No documents found" })
-            ] }) : /* @__PURE__ */ jsx(
-              DataTable,
-              {
-                columns: documentColumns,
-                data: counterpartyDocuments
-              }
-            ) })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsx(CounterpartyStatusCard, { isEditing: false, onToggleEdit: () => {
-        } }) })
-      ] })
+      counterpartyName: counterparty.name,
+      counterpartyType: counterparty.type,
+      currentStatus,
+      isEditingProfile,
+      mockPaymentMethods,
+      documentsTable,
+      onStatusChange: handleStatusChange,
+      onToggleProfileEdit: handleToggleProfileEdit,
+      onAddPaymentMethod: handleAddPaymentMethod,
+      onAddDocument: handleAddDocument
     }
   );
 };
@@ -13821,7 +14225,7 @@ var TransactionDetail = () => {
       /* @__PURE__ */ jsx(Button, { onClick: () => navigate("/transactions/history"), children: "Back to Transaction History" })
     ] }) });
   }
-  const getStatusVariant = (status) => {
+  const getStatusVariant2 = (status) => {
     switch (status) {
       case "POSTED":
         return "success";
@@ -13877,7 +14281,7 @@ var TransactionDetail = () => {
             isInbound: transaction.isInbound
           }
         ),
-        /* @__PURE__ */ jsx(Badge, { variant: getStatusVariant(transaction.status), children: transaction.status }),
+        /* @__PURE__ */ jsx(Badge, { variant: getStatusVariant2(transaction.status), children: transaction.status }),
         /* @__PURE__ */ jsx(Badge, { variant: getProcessingStatusVariant(transaction.processingStatus), children: transaction.processingStatus })
       ] }),
       maxWidth: "full",
@@ -13976,7 +14380,342 @@ function UIKit() {
     ] })
   ] }) }) });
 }
+function OFACFiltersSheet({
+  filters,
+  onFilterChange,
+  onResetFilters
+}) {
+  const hasActiveFilters = filters.status !== "" || filters.entityType !== "" || filters.startDate !== void 0 || filters.endDate !== void 0;
+  return /* @__PURE__ */ jsxs(Sheet, { children: [
+    /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "outline", children: [
+      /* @__PURE__ */ jsx(Filter, { className: "mr-2 h-4 w-4" }),
+      "Filters",
+      hasActiveFilters && /* @__PURE__ */ jsx("span", { className: "ml-2 flex h-5 w-5 items-center justify-center rounded-full bg-primary text-xs text-primary-foreground", children: [filters.status, filters.entityType, filters.startDate, filters.endDate].filter(Boolean).length })
+    ] }) }),
+    /* @__PURE__ */ jsxs(SheetContent, { className: "w-full sm:max-w-md overflow-y-auto", children: [
+      /* @__PURE__ */ jsxs(SheetHeader, { children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx(SheetTitle, { children: "Filter OFAC Checks" }),
+          hasActiveFilters && /* @__PURE__ */ jsxs(
+            Button,
+            {
+              variant: "ghost",
+              size: "sm",
+              onClick: onResetFilters,
+              className: "h-8 px-2",
+              children: [
+                /* @__PURE__ */ jsx(X, { className: "mr-1 h-4 w-4" }),
+                "Clear all"
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(SheetDescription, { children: "Filter OFAC screening results by status, entity type, and date range" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-6 mt-6", children: [
+        /* @__PURE__ */ jsx(
+          EnhancedSelect,
+          {
+            label: "Status",
+            placeholder: "All statuses",
+            options: [
+              { value: "all", label: "All statuses" },
+              { value: "NO MATCH", label: "No Match" },
+              { value: "REVIEW", label: "Review" },
+              { value: "CLEARED", label: "Cleared" },
+              { value: "CONFIRMED", label: "Confirmed" }
+            ],
+            value: filters.status || "all",
+            onValueChange: (value) => onFilterChange("status", value === "all" ? "" : value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          EnhancedSelect,
+          {
+            label: "Entity Type",
+            placeholder: "All entity types",
+            options: [
+              { value: "all", label: "All entity types" },
+              { value: "Business", label: "Business" },
+              { value: "Individual", label: "Individual" },
+              { value: "Counterparty", label: "Counterparty" }
+            ],
+            value: filters.entityType || "all",
+            onValueChange: (value) => onFilterChange("entityType", value === "all" ? "" : value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            date: filters.startDate,
+            onDateChange: (date) => onFilterChange("startDate", date),
+            label: "Start Date",
+            placeholder: "MM/DD/YYYY"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          DatePicker,
+          {
+            date: filters.endDate,
+            onDateChange: (date) => onFilterChange("endDate", date),
+            label: "End Date",
+            placeholder: "MM/DD/YYYY",
+            disabledDates: (date) => filters.startDate ? date < filters.startDate : false
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+
+// src/lib/mock-data/ofac-data.ts
+var mockOFACChecks = [
+  {
+    id: "ofac-001",
+    created: "2024-01-15T10:30:00Z",
+    entityId: "8112488",
+    entityName: "Acme Corporation",
+    entityType: "Business",
+    alertId: "ALT-001",
+    status: "CLEARED"
+  },
+  {
+    id: "ofac-002",
+    created: "2024-01-14T14:22:00Z",
+    entityId: "8111609",
+    entityName: "Global Tech Industries",
+    entityType: "Business",
+    alertId: "ALT-002",
+    status: "REVIEW"
+  },
+  {
+    id: "ofac-003",
+    created: "2024-01-14T09:15:00Z",
+    entityId: "IND-001",
+    entityName: "John Smith",
+    entityType: "Individual",
+    alertId: null,
+    status: "NO MATCH"
+  },
+  {
+    id: "ofac-004",
+    created: "2024-01-13T16:45:00Z",
+    entityId: "8111026",
+    entityName: "Innovation Partners LLC",
+    entityType: "Business",
+    alertId: "ALT-003",
+    status: "CONFIRMED"
+  },
+  {
+    id: "ofac-005",
+    created: "2024-01-13T11:20:00Z",
+    entityId: "IND-002",
+    entityName: "Jane Doe",
+    entityType: "Individual",
+    alertId: null,
+    status: "NO MATCH"
+  },
+  {
+    id: "ofac-006",
+    created: "2024-01-12T13:30:00Z",
+    entityId: "CP-001",
+    entityName: "International Suppliers Inc",
+    entityType: "Counterparty",
+    alertId: "ALT-004",
+    status: "REVIEW"
+  },
+  {
+    id: "ofac-007",
+    created: "2024-01-12T08:00:00Z",
+    entityId: "8110892",
+    entityName: "NextGen Solutions",
+    entityType: "Business",
+    alertId: null,
+    status: "NO MATCH"
+  },
+  {
+    id: "ofac-008",
+    created: "2024-01-11T15:10:00Z",
+    entityId: "IND-003",
+    entityName: "Robert Johnson",
+    entityType: "Individual",
+    alertId: "ALT-005",
+    status: "CLEARED"
+  },
+  {
+    id: "ofac-009",
+    created: "2024-01-11T10:45:00Z",
+    entityId: "CP-002",
+    entityName: "Overseas Trading Company",
+    entityType: "Counterparty",
+    alertId: "ALT-006",
+    status: "REVIEW"
+  },
+  {
+    id: "ofac-010",
+    created: "2024-01-10T14:25:00Z",
+    entityId: "8110654",
+    entityName: "Digital Ventures Group",
+    entityType: "Business",
+    alertId: null,
+    status: "NO MATCH"
+  }
+];
+var getStatusVariant = (status) => {
+  switch (status) {
+    case "NO MATCH":
+      return "success";
+    case "REVIEW":
+      return "warning";
+    case "CLEARED":
+      return "active";
+    case "CONFIRMED":
+      return "destructive";
+    default:
+      return "secondary";
+  }
+};
+var getEntityUrl = (entityType, entityId) => {
+  switch (entityType) {
+    case "Business":
+      return `/business/${entityId}`;
+    case "Individual":
+      return `/individual/${entityId}`;
+    case "Counterparty":
+      return `/counterparty/${entityId}`;
+    default:
+      return "#";
+  }
+};
+function OFAC() {
+  const navigate = useNavigate();
+  const [sortField, setSortField] = useState("created");
+  const [sortDirection, setSortDirection] = useState("desc");
+  const [filters, setFilters] = useState({
+    status: "",
+    entityType: "",
+    startDate: void 0,
+    endDate: void 0
+  });
+  const handleFilterChange = (field, value) => {
+    setFilters((prev) => ({ ...prev, [field]: value }));
+  };
+  const handleResetFilters = () => {
+    setFilters({
+      status: "",
+      entityType: "",
+      startDate: void 0,
+      endDate: void 0
+    });
+  };
+  const handleSort = (field) => {
+    if (sortField === field) {
+      setSortDirection(sortDirection === "asc" ? "desc" : "asc");
+    } else {
+      setSortField(field);
+      setSortDirection("desc");
+    }
+  };
+  const filteredChecks = useMemo(() => {
+    return mockOFACChecks.filter((check) => {
+      if (filters.status && check.status !== filters.status) {
+        return false;
+      }
+      if (filters.entityType && check.entityType !== filters.entityType) {
+        return false;
+      }
+      if (filters.startDate || filters.endDate) {
+        const checkDate = parseISO(check.created);
+        if (filters.startDate && isBefore(checkDate, startOfDay(filters.startDate))) {
+          return false;
+        }
+        if (filters.endDate && isAfter(checkDate, endOfDay(filters.endDate))) {
+          return false;
+        }
+      }
+      return true;
+    });
+  }, [filters]);
+  const sortedChecks = [...filteredChecks].sort((a, b) => {
+    const aValue = a[sortField];
+    const bValue = b[sortField];
+    if (aValue == null) return 1;
+    if (bValue == null) return -1;
+    if (sortDirection === "asc") {
+      return aValue > bValue ? 1 : -1;
+    } else {
+      return aValue < bValue ? 1 : -1;
+    }
+  });
+  const columns3 = [
+    {
+      key: "created",
+      title: "Created",
+      sortable: true,
+      render: (value) => /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: format(parseISO(value), "MMM d, yyyy h:mm a") })
+    },
+    {
+      key: "entityName",
+      title: "Entity",
+      render: (value, row) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => navigate(getEntityUrl(row.entityType, row.entityId)),
+          className: "text-sm text-primary hover:underline font-medium",
+          children: value
+        }
+      )
+    },
+    {
+      key: "entityType",
+      title: "Entity Type",
+      sortable: true,
+      render: (value) => /* @__PURE__ */ jsx("span", { className: "text-sm", children: value })
+    },
+    {
+      key: "alertId",
+      title: "Alert ID",
+      render: (value) => value ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => navigate(`/alerts/${value}`),
+          className: "text-sm text-primary hover:underline font-medium",
+          children: value
+        }
+      ) : /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" })
+    },
+    {
+      key: "status",
+      title: "Status",
+      sortable: true,
+      render: (value) => /* @__PURE__ */ jsx(Badge, { variant: getStatusVariant(value), children: value })
+    }
+  ];
+  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-6 max-w-none", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold text-foreground", children: "OFAC Checks" }) }),
+      /* @__PURE__ */ jsx(
+        OFACFiltersSheet,
+        {
+          filters,
+          onFilterChange: handleFilterChange,
+          onResetFilters: handleResetFilters
+        }
+      )
+    ] }) }) }),
+    /* @__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__ */ jsx("div", { className: "flex-1 mt-4 overflow-auto", children: /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        columns: columns3,
+        data: sortedChecks,
+        sortBy: sortField,
+        sortDirection,
+        onSort: handleSort
+      }
+    ) }) }) })
+  ] });
+}
 
-export { ACHBankCard, ACHBasicInfoCard, ACHDetailsSection, ACHTransferSection, AccountCard, AccountDetail_default as AccountDetail, Accounts_default as Accounts, AddressForm, AlertDetail_default as AlertDetail, AlertDetailRouter, AlertDocuments, AlertHeaderControls, AlertNotes, AlertTimeline, Alerts_default as Alerts, AppSidebar, Badge, BankAddressCard, BankingDetailsCard, BasicInfoCard, BasicInfoSection, BeneficiaryAddress, BeneficiaryCard, BeneficiaryDomesticWire, Breadcrumb, BusinessDetail_default as BusinessDetail, BusinessDetailView, BusinessFiltersSheet, BusinessProfileCard, BusinessStatusCard, BusinessTypeBadge, Businesses_default as Businesses, Button, CIPStatusBadge, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cases_default as Cases, Checkbox, ContactInfoCard, Container, ContextSection, Counterparties_default as Counterparties, CounterpartiesView, CounterpartyBasicInfo, CounterpartyDetail_default as CounterpartyDetail, CounterpartyProfileCard, CounterpartyRecordsCard, CounterpartyTypeBadge, Create_default as CreateBusiness, CreateBusinessView, Create_default2 as CreateCounterparty, Create_default3 as CreateIndividual, 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, IndividualDetail_default as IndividualDetail, Individuals_default as Individuals, InfoField, IntermediaryCard, IntermediaryFI, IntermediaryFIAddress, JsonViewer, Label, ListPage, MainLayout, MetricCard, NewTransaction, NotFound_default as NotFound, OFACAlertView, OriginatorCard, OriginatorFI, OriginatorFIAddress, PageLayout, PatternLibrary, PaymentInformationSection, Popover, PopoverContent, PopoverTrigger, ReceiverCard, ResolveAlertDialog, ResponsiveGrid, ScrollArea, ScrollBar, 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, Statement, StatementHeader, StatementView, StatusBadge, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransactionDetail_default as TransactionDetail, TransactionHistory_default as TransactionHistory, TransactionTypeBadge, UIKit, UIKitShowcase, WireDetailsSection, WireTransferSection, badgeVariants, buttonVariants, cardVariants, downloadCSV, generateStatementCSV, inputVariants, reducer, textareaVariants, toast, useAlertDetail, useCounterpartyEntity, useEditState, useFormWithEditState, useIsMobile, useSidebar, useToast };
+export { ACHBankCard, ACHBasicInfoCard, ACHDetailsSection, ACHTransferSection, AccountCard, AccountDetail_default as AccountDetail, Accounts_default as Accounts, AddressForm, AlertDetail_default as AlertDetail, AlertDetailRouter, AlertDocuments, AlertHeaderControls, AlertNotes, AlertTimeline, Alerts_default as Alerts, AppSidebar, Badge, BankAddressCard, BankingDetailsCard, BasicInfoCard, BasicInfoSection, BeneficiaryAddress, BeneficiaryCard, BeneficiaryDomesticWire, Breadcrumb, BusinessDetail_default as BusinessDetail, BusinessDetailView, BusinessFiltersSheet, BusinessProfileCard, BusinessStatusCard, BusinessTypeBadge, Businesses_default as Businesses, Button, CIPStatusBadge, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Cases_default as Cases, Checkbox, ContactInfoCard, Container, ContextSection, Counterparties_default as Counterparties, CounterpartiesView, CounterpartyBasicInfo, CounterpartyDetail_default as CounterpartyDetail, CounterpartyProfileCard, CounterpartyRecordsCard, CounterpartyTypeBadge, Create_default as CreateBusiness, CreateBusinessView, Create_default2 as CreateCounterparty, Create_default3 as CreateIndividual, 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, IndividualDetail_default as IndividualDetail, Individuals_default as Individuals, InfoField, IntermediaryCard, IntermediaryFI, IntermediaryFIAddress, JsonViewer, Label, ListPage, MainLayout, MetricCard, NewTransaction, NotFound_default as NotFound, OFAC, OFACAlertView, OriginatorCard, OriginatorFI, OriginatorFIAddress, PageLayout, PatternLibrary, PaymentInformationSection, Popover, PopoverContent, PopoverTrigger, ReceiverCard, ResolveAlertDialog, ResponsiveGrid, ScrollArea, ScrollBar, 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, Statement, StatementHeader, StatementView, StatusBadge, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TransactionDetail_default as TransactionDetail, TransactionHistory_default as TransactionHistory, TransactionTypeBadge, UIKit, UIKitShowcase, WireDetailsSection, WireTransferSection, badgeVariants, buttonVariants, cardVariants, downloadCSV, generateStatementCSV, inputVariants, reducer, textareaVariants, toast, useAlertDetail, useCounterpartyEntity, useEditState, useFormWithEditState, useIsMobile, useSidebar, useToast };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map