braid-ui 1.0.46 → 1.0.47

package/dist/index.cjs

@@ -6307,6 +6307,447 @@ var CounterpartyDetailView = ({
     }
   );
 };
+var SimpleACHForm = () => {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Routing Number",
+        placeholder: "Enter 9-digit routing number",
+        pattern: "[0-9]{9}",
+        maxLength: 9,
+        hint: "9-digit routing number",
+        required: true
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Account Number",
+        placeholder: "Enter account number",
+        required: true
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedSelect,
+      {
+        label: "Account Type",
+        placeholder: "Select account type",
+        options: [
+          { value: "checking", label: "Checking" },
+          { value: "savings", label: "Savings" }
+        ]
+      }
+    )
+  ] });
+};
+var SimpleWireForm = () => {
+  const [wireType, setWireType] = React15.useState("domestic");
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedSelect,
+      {
+        label: "Wire Type",
+        placeholder: "Select wire type",
+        value: wireType,
+        onValueChange: setWireType,
+        options: [
+          { value: "domestic", label: "Domestic" },
+          { value: "international", label: "International" }
+        ]
+      }
+    ),
+    wireType === "domestic" ? /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Routing Number",
+        placeholder: "Enter 9-digit routing number",
+        pattern: "[0-9]{9}",
+        maxLength: 9,
+        hint: "9-digit routing number",
+        required: true
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "BIC Number",
+        placeholder: "Enter BIC/SWIFT code",
+        hint: "Bank Identifier Code",
+        required: true
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Account Number",
+        placeholder: "Enter account number",
+        required: true
+      }
+    )
+  ] }) });
+};
+var PaymentInformationSection = ({ onPaymentMethodsChange } = {}) => {
+  const [paymentMethods, setPaymentMethods] = React15.useState([]);
+  const [showAddMenu, setShowAddMenu] = React15.useState(false);
+  const addPaymentMethod = (type) => {
+    const newMethod = {
+      id: `${type}-${Date.now()}`,
+      type,
+      name: type === "ach" ? "ACH Payment" : "Wire Transfer",
+      collapsed: false
+    };
+    const updatedMethods = [...paymentMethods, newMethod];
+    setPaymentMethods(updatedMethods);
+    onPaymentMethodsChange?.(updatedMethods);
+    setShowAddMenu(false);
+  };
+  const removePaymentMethod = (id) => {
+    const updatedMethods = paymentMethods.filter((method) => method.id !== id);
+    setPaymentMethods(updatedMethods);
+    onPaymentMethodsChange?.(updatedMethods);
+  };
+  const toggleCollapse = (id) => {
+    setPaymentMethods(paymentMethods.map(
+      (method) => method.id === id ? { ...method, collapsed: !method.collapsed } : method
+    ));
+  };
+  const renderPaymentMethodContent = (method) => {
+    if (method.type === "ach") {
+      return /* @__PURE__ */ jsxRuntime.jsx(SimpleACHForm, {});
+    } else {
+      return /* @__PURE__ */ jsxRuntime.jsx(SimpleWireForm, {});
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
+    paymentMethods.map((method) => /* @__PURE__ */ jsxRuntime.jsxs(Card, { className: "relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { className: "pb-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              onClick: () => toggleCollapse(method.id),
+              className: "h-6 w-6",
+              children: method.collapsed ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "h-4 w-4" })
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { className: "text-base", children: method.name }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs bg-muted px-2 py-1 rounded-md uppercase font-medium", children: method.type })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            onClick: () => removePaymentMethod(method.id),
+            className: "h-6 w-6 text-destructive hover:text-destructive/80 hover:bg-destructive/10",
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2, { className: "h-4 w-4" })
+          }
+        )
+      ] }) }),
+      !method.collapsed && /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: renderPaymentMethodContent(method) })
+    ] }, method.id)),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      paymentMethods.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-2", children: "At least one payment method is required *" }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        Button,
+        {
+          variant: "outline",
+          onClick: () => setShowAddMenu(!showAddMenu),
+          className: "w-full border-dashed",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4 mr-2" }),
+            "Add Payment Information"
+          ]
+        }
+      ),
+      showAddMenu && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-full left-0 right-0 mt-2 bg-background border border-border rounded-md shadow-lg z-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-2 space-y-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            variant: "ghost",
+            onClick: () => addPaymentMethod("ach"),
+            className: "w-full justify-start",
+            children: "Add ACH Payment"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            variant: "ghost",
+            onClick: () => addPaymentMethod("wire"),
+            className: "w-full justify-start",
+            children: "Add Wire Transfer"
+          }
+        )
+      ] }) })
+    ] })
+  ] });
+};
+var AddressForm = ({
+  title,
+  description,
+  fieldPrefix = "",
+  showAddressType = true,
+  addressTypeOptions = ADDRESS_TYPE_OPTIONS.FI,
+  fieldOverrides = {},
+  showApartment = false
+}) => {
+  const addressTypeLabel = fieldPrefix ? `${fieldPrefix} Address Type` : "Address Type";
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Street Address",
+        placeholder: "Enter street address",
+        hint: fieldPrefix ? `${fieldPrefix} street address` : "Primary street address",
+        ...fieldOverrides.streetAddress
+      }
+    ),
+    showApartment && /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Apt, Building etc",
+        placeholder: "Additional address information",
+        hint: "Additional address information",
+        ...fieldOverrides.apartment
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "City",
+        placeholder: "Enter city",
+        required: true,
+        ...fieldOverrides.city
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "State",
+        placeholder: "Enter state",
+        hint: "State or province",
+        ...fieldOverrides.state
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedInput,
+      {
+        label: "Postal Code",
+        placeholder: "12345",
+        ...fieldOverrides.postalCode
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedSelect,
+      {
+        label: "Country Code",
+        placeholder: "Select country",
+        options: COUNTRY_OPTIONS
+      }
+    ),
+    showAddressType && /* @__PURE__ */ jsxRuntime.jsx(
+      EnhancedSelect,
+      {
+        label: addressTypeLabel,
+        placeholder: "Select type",
+        options: addressTypeOptions
+      }
+    )
+  ] }) });
+};
+var labelVariants = classVarianceAuthority.cva(
+  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+);
+var Label = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  LabelPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(labelVariants(), className),
+    ...props
+  }
+));
+Label.displayName = LabelPrimitive__namespace.Root.displayName;
+var CounterpartyBasicInfo = ({ value = {
+  name: "",
+  type: "business",
+  email: "",
+  phone: "",
+  dateOfBirth: "",
+  idNumber: "",
+  idType: "product_id",
+  idValue: ""
+}, onDataChange }) => {
+  const handleInputChange = (field, newValue) => {
+    const updatedData = { ...value, [field]: newValue };
+    onDataChange?.(updatedData);
+  };
+  const handleTypeChange = (type) => {
+    handleInputChange("type", type);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedInput,
+        {
+          label: "Counterparty Name",
+          value: value.name,
+          onChange: (e) => handleInputChange("name", e.target.value),
+          placeholder: "Enter counterparty name",
+          required: true
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-sm font-medium", children: "Counterparty Type" }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-6 h-10 items-center", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center space-x-2 cursor-pointer", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                type: "radio",
+                name: "counterpartyType",
+                value: "business",
+                checked: value.type === "business",
+                onChange: () => handleTypeChange("business"),
+                className: "w-4 h-4 text-primary border-border focus:ring-primary focus:ring-2"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-foreground", children: "Business" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center space-x-2 cursor-pointer", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                type: "radio",
+                name: "counterpartyType",
+                value: "individual",
+                checked: value.type === "individual",
+                onChange: () => handleTypeChange("individual"),
+                className: "w-4 h-4 text-primary border-border focus:ring-primary focus:ring-2"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-foreground", children: "Individual" })
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedSelect,
+        {
+          label: "Associated with",
+          value: value.idType,
+          onValueChange: (val) => handleInputChange("idType", val),
+          options: [
+            { value: "product_id", label: "Product ID" },
+            { value: "business_id", label: "Business ID" },
+            { value: "individual_id", label: "Individual ID" },
+            { value: "account_number", label: "Account Number" }
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedInput,
+        {
+          label: value.idType === "product_id" ? "Product ID" : value.idType === "business_id" ? "Business ID" : value.idType === "individual_id" ? "Individual ID" : "Account Number",
+          value: value.idValue,
+          onChange: (e) => handleInputChange("idValue", e.target.value),
+          placeholder: `Enter ${value.idType === "product_id" ? "product ID" : value.idType === "business_id" ? "business ID" : value.idType === "individual_id" ? "individual ID" : "account number"}`,
+          required: true
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedInput,
+        {
+          label: "Email",
+          type: "email",
+          value: value.email,
+          onChange: (e) => handleInputChange("email", e.target.value),
+          placeholder: "Enter email address"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedInput,
+        {
+          label: "Phone Number",
+          type: "tel",
+          value: value.phone,
+          onChange: (e) => handleInputChange("phone", e.target.value),
+          placeholder: "Enter phone number"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedInput,
+        {
+          label: "Date of Birth",
+          type: "date",
+          value: value.dateOfBirth,
+          onChange: (e) => handleInputChange("dateOfBirth", e.target.value),
+          placeholder: "Select date of birth"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        EnhancedInput,
+        {
+          label: "ID Number",
+          value: value.idNumber,
+          onChange: (e) => handleInputChange("idNumber", e.target.value),
+          placeholder: "Enter ID number"
+        }
+      )
+    ] })
+  ] });
+};
+var CreateCounterpartyView = ({
+  counterpartyData,
+  paymentMethods,
+  onPaymentMethodsChange,
+  onBasicInfoChange,
+  onCancel,
+  onSubmit
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    PageLayout,
+    {
+      title: "Create Counterparty",
+      description: "Create a new counterparty with all required information",
+      actions: [
+        { label: "Cancel", variant: "outline", onClick: onCancel },
+        { label: "Create Counterparty", variant: "default", onClick: onSubmit }
+      ],
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(Card, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { children: "Basic Information" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(CounterpartyBasicInfo, { value: counterpartyData, onDataChange: onBasicInfoChange }) })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(Card, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(CardTitle, { children: [
+            "Address",
+            paymentMethods.some((m) => m.type === "wire") && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
+          ] }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { children: [
+            paymentMethods.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-4", children: "Optional for ACH payments, required for wire transfers" }),
+            paymentMethods.some((m) => m.type === "wire") && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-4", children: "Required because you have wire payment methods" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              AddressForm,
+              {
+                title: "",
+                description: "",
+                showApartment: true
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(Card, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { children: "Payment Configuration" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(PaymentInformationSection, { onPaymentMethodsChange }) })
+        ] })
+      ] })
+    }
+  );
+};
 
 // src/lib/mock-data/banking-data.ts
 var defaultACHBankDetails = {
@@ -6592,79 +7033,6 @@ var ACHTransferSection = ({ isEditing, onToggleEdit, className, hideActions }) =
     }
   );
 };
-var AddressForm = ({
-  title,
-  description,
-  fieldPrefix = "",
-  showAddressType = true,
-  addressTypeOptions = ADDRESS_TYPE_OPTIONS.FI,
-  fieldOverrides = {},
-  showApartment = false
-}) => {
-  const addressTypeLabel = fieldPrefix ? `${fieldPrefix} Address Type` : "Address Type";
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-6", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Street Address",
-        placeholder: "Enter street address",
-        hint: fieldPrefix ? `${fieldPrefix} street address` : "Primary street address",
-        ...fieldOverrides.streetAddress
-      }
-    ),
-    showApartment && /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Apt, Building etc",
-        placeholder: "Additional address information",
-        hint: "Additional address information",
-        ...fieldOverrides.apartment
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "City",
-        placeholder: "Enter city",
-        required: true,
-        ...fieldOverrides.city
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "State",
-        placeholder: "Enter state",
-        hint: "State or province",
-        ...fieldOverrides.state
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Postal Code",
-        placeholder: "12345",
-        ...fieldOverrides.postalCode
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedSelect,
-      {
-        label: "Country Code",
-        placeholder: "Select country",
-        options: COUNTRY_OPTIONS
-      }
-    ),
-    showAddressType && /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedSelect,
-      {
-        label: addressTypeLabel,
-        placeholder: "Select type",
-        options: addressTypeOptions
-      }
-    )
-  ] }) });
-};
 var BankingDetailsCard = ({ isEditing, onToggleEdit, className }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     FormCard,
@@ -6953,178 +7321,36 @@ var ContactInfoCard = ({ isEditing, onToggleEdit, className }) => {
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
           /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "First Name", value: "", layout: "horizontal" }),
           /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Last Name", value: "", layout: "horizontal" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Email", value: "", layout: "horizontal" }),
-          /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Phone Number", value: "", layout: "horizontal" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-medium text-muted-foreground mt-6", children: "Mailing Address" }),
-        isEditing ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 gap-3", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Street Address", value: "", layout: "horizontal" }),
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Apartment, suite, or floor", value: "", layout: "horizontal" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "City", value: "", layout: "horizontal" }),
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "State", value: "Alabama", layout: "horizontal" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Postal Code", value: "", layout: "horizontal" }),
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Country Code", value: "US", layout: "horizontal" })
-          ] })
-        ] }) : /* @__PURE__ */ jsxRuntime.jsx(
-          InfoField,
-          {
-            label: "Address",
-            value: "123 Business Avenue, Suite 100, New York, NY 10001, US",
-            layout: "horizontal"
-          }
-        )
-      ] })
-    }
-  );
-};
-var labelVariants = classVarianceAuthority.cva(
-  "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-);
-var Label = React15__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
-  LabelPrimitive__namespace.Root,
-  {
-    ref,
-    className: cn(labelVariants(), className),
-    ...props
-  }
-));
-Label.displayName = LabelPrimitive__namespace.Root.displayName;
-var CounterpartyBasicInfo = ({ value = {
-  name: "",
-  type: "business",
-  email: "",
-  phone: "",
-  dateOfBirth: "",
-  idNumber: "",
-  idType: "product_id",
-  idValue: ""
-}, onDataChange }) => {
-  const handleInputChange = (field, newValue) => {
-    const updatedData = { ...value, [field]: newValue };
-    onDataChange?.(updatedData);
-  };
-  const handleTypeChange = (type) => {
-    handleInputChange("type", type);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedInput,
-        {
-          label: "Counterparty Name",
-          value: value.name,
-          onChange: (e) => handleInputChange("name", e.target.value),
-          placeholder: "Enter counterparty name",
-          required: true
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-sm font-medium", children: "Counterparty Type" }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-6 h-10 items-center", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center space-x-2 cursor-pointer", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "input",
-              {
-                type: "radio",
-                name: "counterpartyType",
-                value: "business",
-                checked: value.type === "business",
-                onChange: () => handleTypeChange("business"),
-                className: "w-4 h-4 text-primary border-border focus:ring-primary focus:ring-2"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-foreground", children: "Business" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center space-x-2 cursor-pointer", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "input",
-              {
-                type: "radio",
-                name: "counterpartyType",
-                value: "individual",
-                checked: value.type === "individual",
-                onChange: () => handleTypeChange("individual"),
-                className: "w-4 h-4 text-primary border-border focus:ring-primary focus:ring-2"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-foreground", children: "Individual" })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedSelect,
-        {
-          label: "Associated with",
-          value: value.idType,
-          onValueChange: (val) => handleInputChange("idType", val),
-          options: [
-            { value: "product_id", label: "Product ID" },
-            { value: "business_id", label: "Business ID" },
-            { value: "individual_id", label: "Individual ID" },
-            { value: "account_number", label: "Account Number" }
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedInput,
-        {
-          label: value.idType === "product_id" ? "Product ID" : value.idType === "business_id" ? "Business ID" : value.idType === "individual_id" ? "Individual ID" : "Account Number",
-          value: value.idValue,
-          onChange: (e) => handleInputChange("idValue", e.target.value),
-          placeholder: `Enter ${value.idType === "product_id" ? "product ID" : value.idType === "business_id" ? "business ID" : value.idType === "individual_id" ? "individual ID" : "account number"}`,
-          required: true
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedInput,
-        {
-          label: "Email",
-          type: "email",
-          value: value.email,
-          onChange: (e) => handleInputChange("email", e.target.value),
-          placeholder: "Enter email address"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedInput,
-        {
-          label: "Phone Number",
-          type: "tel",
-          value: value.phone,
-          onChange: (e) => handleInputChange("phone", e.target.value),
-          placeholder: "Enter phone number"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedInput,
-        {
-          label: "Date of Birth",
-          type: "date",
-          value: value.dateOfBirth,
-          onChange: (e) => handleInputChange("dateOfBirth", e.target.value),
-          placeholder: "Select date of birth"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        EnhancedInput,
-        {
-          label: "ID Number",
-          value: value.idNumber,
-          onChange: (e) => handleInputChange("idNumber", e.target.value),
-          placeholder: "Enter ID number"
-        }
-      )
-    ] })
-  ] });
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Email", value: "", layout: "horizontal" }),
+          /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Phone Number", value: "", layout: "horizontal" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "text-sm font-medium text-muted-foreground mt-6", children: "Mailing Address" }),
+        isEditing ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 gap-3", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Street Address", value: "", layout: "horizontal" }),
+            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Apartment, suite, or floor", value: "", layout: "horizontal" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "City", value: "", layout: "horizontal" }),
+            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "State", value: "Alabama", layout: "horizontal" })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Postal Code", value: "", layout: "horizontal" }),
+            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Country Code", value: "US", layout: "horizontal" })
+          ] })
+        ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+          InfoField,
+          {
+            label: "Address",
+            value: "123 Business Avenue, Suite 100, New York, NY 10001, US",
+            layout: "horizontal"
+          }
+        )
+      ] })
+    }
+  );
 };
 var IntermediaryFI = () => {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
@@ -7338,184 +7564,6 @@ var OriginatorCard = ({ isEditing, onToggleEdit, className, hideActions }) => {
     }
   );
 };
-var SimpleACHForm = () => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Routing Number",
-        placeholder: "Enter 9-digit routing number",
-        pattern: "[0-9]{9}",
-        maxLength: 9,
-        hint: "9-digit routing number",
-        required: true
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Account Number",
-        placeholder: "Enter account number",
-        required: true
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedSelect,
-      {
-        label: "Account Type",
-        placeholder: "Select account type",
-        options: [
-          { value: "checking", label: "Checking" },
-          { value: "savings", label: "Savings" }
-        ]
-      }
-    )
-  ] });
-};
-var SimpleWireForm = () => {
-  const [wireType, setWireType] = React15.useState("domestic");
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedSelect,
-      {
-        label: "Wire Type",
-        placeholder: "Select wire type",
-        value: wireType,
-        onValueChange: setWireType,
-        options: [
-          { value: "domestic", label: "Domestic" },
-          { value: "international", label: "International" }
-        ]
-      }
-    ),
-    wireType === "domestic" ? /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Routing Number",
-        placeholder: "Enter 9-digit routing number",
-        pattern: "[0-9]{9}",
-        maxLength: 9,
-        hint: "9-digit routing number",
-        required: true
-      }
-    ) : /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "BIC Number",
-        placeholder: "Enter BIC/SWIFT code",
-        hint: "Bank Identifier Code",
-        required: true
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      EnhancedInput,
-      {
-        label: "Account Number",
-        placeholder: "Enter account number",
-        required: true
-      }
-    )
-  ] }) });
-};
-var PaymentInformationSection = ({ onPaymentMethodsChange } = {}) => {
-  const [paymentMethods, setPaymentMethods] = React15.useState([]);
-  const [showAddMenu, setShowAddMenu] = React15.useState(false);
-  const addPaymentMethod = (type) => {
-    const newMethod = {
-      id: `${type}-${Date.now()}`,
-      type,
-      name: type === "ach" ? "ACH Payment" : "Wire Transfer",
-      collapsed: false
-    };
-    const updatedMethods = [...paymentMethods, newMethod];
-    setPaymentMethods(updatedMethods);
-    onPaymentMethodsChange?.(updatedMethods);
-    setShowAddMenu(false);
-  };
-  const removePaymentMethod = (id) => {
-    const updatedMethods = paymentMethods.filter((method) => method.id !== id);
-    setPaymentMethods(updatedMethods);
-    onPaymentMethodsChange?.(updatedMethods);
-  };
-  const toggleCollapse = (id) => {
-    setPaymentMethods(paymentMethods.map(
-      (method) => method.id === id ? { ...method, collapsed: !method.collapsed } : method
-    ));
-  };
-  const renderPaymentMethodContent = (method) => {
-    if (method.type === "ach") {
-      return /* @__PURE__ */ jsxRuntime.jsx(SimpleACHForm, {});
-    } else {
-      return /* @__PURE__ */ jsxRuntime.jsx(SimpleWireForm, {});
-    }
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
-    paymentMethods.map((method) => /* @__PURE__ */ jsxRuntime.jsxs(Card, { className: "relative", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { className: "pb-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Button,
-            {
-              variant: "ghost",
-              size: "icon",
-              onClick: () => toggleCollapse(method.id),
-              className: "h-6 w-6",
-              children: method.collapsed ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "h-4 w-4" })
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { className: "text-base", children: method.name }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs bg-muted px-2 py-1 rounded-md uppercase font-medium", children: method.type })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            variant: "ghost",
-            size: "icon",
-            onClick: () => removePaymentMethod(method.id),
-            className: "h-6 w-6 text-destructive hover:text-destructive/80 hover:bg-destructive/10",
-            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2, { className: "h-4 w-4" })
-          }
-        )
-      ] }) }),
-      !method.collapsed && /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: renderPaymentMethodContent(method) })
-    ] }, method.id)),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-      paymentMethods.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-2", children: "At least one payment method is required *" }),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        Button,
-        {
-          variant: "outline",
-          onClick: () => setShowAddMenu(!showAddMenu),
-          className: "w-full border-dashed",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4 mr-2" }),
-            "Add Payment Information"
-          ]
-        }
-      ),
-      showAddMenu && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-full left-0 right-0 mt-2 bg-background border border-border rounded-md shadow-lg z-10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-2 space-y-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            variant: "ghost",
-            onClick: () => addPaymentMethod("ach"),
-            className: "w-full justify-start",
-            children: "Add ACH Payment"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            variant: "ghost",
-            onClick: () => addPaymentMethod("wire"),
-            className: "w-full justify-start",
-            children: "Add Wire Transfer"
-          }
-        )
-      ] }) })
-    ] })
-  ] });
-};
 var receiverSchema = zod.z.object({
   routingNumber: zod.z.string().min(9, "Routing number must be 9 digits").max(9, "Routing number must be 9 digits"),
   bankShortName: zod.z.string().min(1, "Bank short name is required")
@@ -11704,54 +11752,6 @@ var CounterpartyDetail = () => {
   );
 };
 var CounterpartyDetail_default = CounterpartyDetail;
-var CreateCounterpartyView = ({
-  counterpartyData,
-  paymentMethods,
-  onPaymentMethodsChange,
-  onBasicInfoChange,
-  onCancel,
-  onSubmit
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    PageLayout,
-    {
-      title: "Create Counterparty",
-      description: "Create a new counterparty with all required information",
-      actions: [
-        { label: "Cancel", variant: "outline", onClick: onCancel },
-        { label: "Create Counterparty", variant: "default", onClick: onSubmit }
-      ],
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(Card, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { children: "Basic Information" }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(CounterpartyBasicInfo, { value: counterpartyData, onDataChange: onBasicInfoChange }) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(Card, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(CardTitle, { children: [
-            "Address",
-            paymentMethods.some((m) => m.type === "wire") && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
-          ] }) }),
-          /* @__PURE__ */ jsxRuntime.jsxs(CardContent, { children: [
-            paymentMethods.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-4", children: "Optional for ACH payments, required for wire transfers" }),
-            paymentMethods.some((m) => m.type === "wire") && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mb-4", children: "Required because you have wire payment methods" }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              AddressForm,
-              {
-                title: "",
-                description: "",
-                showApartment: true
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(Card, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(CardTitle, { children: "Payment Configuration" }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(PaymentInformationSection, { onPaymentMethodsChange }) })
-        ] })
-      ] })
-    }
-  );
-};
 var CreateCounterparty = () => {
   const navigate = reactRouterDom.useNavigate();
   const [counterpartyData, setCounterpartyData] = React15.useState({
@@ -16437,6 +16437,7 @@ exports.CounterpartyTypeBadge = CounterpartyTypeBadge;
 exports.CreateBusiness = Create_default;
 exports.CreateBusinessView = CreateBusinessView;
 exports.CreateCounterparty = Create_default2;
+exports.CreateCounterpartyView = CreateCounterpartyView;
 exports.CreateIndividual = Create_default3;
 exports.CreateVelocityLimit = CreateVelocityLimit;
 exports.Dashboard = Dashboard_default;