braid-ui 1.0.57 → 1.0.58

package/dist/index.cjs

@@ -8257,7 +8257,7 @@ var StatementView = ({
   ] });
 };
 var ACHDetailsSection = ({ data }) => {
-  const formatCurrency3 = (value) => {
+  const formatCurrency4 = (value) => {
     return new Intl.NumberFormat("en-US", {
       style: "currency",
       currency: "USD",
@@ -8293,7 +8293,7 @@ var ACHDetailsSection = ({ data }) => {
           layout: "horizontal"
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Amount", value: formatCurrency3(data.amount), layout: "horizontal" }),
+      /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Amount", value: formatCurrency4(data.amount), layout: "horizontal" }),
       /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "SEC Code", value: data.secCode, layout: "horizontal" }),
       /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Company Entry Description", value: data.companyEntryDescription, layout: "horizontal" }),
       data.companyDiscretionaryData && /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Company Discretionary Data", value: data.companyDiscretionaryData, layout: "horizontal" }),
@@ -8460,7 +8460,6 @@ var NewTransactionView = ({
   onEditCounterparty,
   onTransactionTypeChange,
   onSubmit,
-  onCancel,
   onConfirmationClose,
   onConfirmationOpenChange,
   onNewTransaction,
@@ -8850,25 +8849,22 @@ var NewTransactionView = ({
             ] })
           }
         ) }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-3 justify-end pt-4 border-t border-border", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", onClick: onCancel, className: "w-32", children: "Cancel" }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Button,
-            {
-              type: "button",
-              onClick: onSubmit,
-              className: "w-48",
-              disabled: !transactionType || !accountNumber || requiresCounterparty && !counterpartyName || isTransfer && !receiverAccountLookedUp || isAdjustment && (!adjustmentDirection || !adjustmentType) || !amount || !form.watch("certifyInformation") || isSubmitting,
-              children: isSubmitting ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
-                "Submitting..."
-              ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "h-4 w-4 mr-2" }),
-                "Submit Transaction"
-              ] })
-            }
-          )
-        ] })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end pt-4 border-t border-border", children: /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            type: "button",
+            onClick: onSubmit,
+            className: "w-48",
+            disabled: !transactionType || !accountNumber || requiresCounterparty && !counterpartyName || isTransfer && !receiverAccountLookedUp || isAdjustment && (!adjustmentDirection || !adjustmentType) || !amount || !form.watch("certifyInformation") || isSubmitting,
+            children: isSubmitting ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 mr-2 animate-spin" }),
+              "Submitting..."
+            ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckCircle2, { className: "h-4 w-4 mr-2" }),
+              "Submit Transaction"
+            ] })
+          }
+        ) })
       ] }) })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open: confirmationOpen, onOpenChange: () => {
@@ -8930,17 +8926,11 @@ var NewTransactionView = ({
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "Please review the error message above and try again. If the problem persists, contact support." })
       ] }) }),
       /* @__PURE__ */ jsxRuntime.jsxs(DialogFooter, { className: "sm:justify-end gap-2 flex-shrink-0", children: [
-        submissionStatus === "error" && /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", onClick: () => onConfirmationOpenChange(false), children: "Edit" }),
-        submissionStatus === "success" && /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", onClick: onNewTransaction, children: "New Transaction" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            type: "button",
-            onClick: onConfirmationClose,
-            variant: submissionStatus === "success" ? "default" : "outline",
-            children: submissionStatus === "success" ? "View Transaction" : "Close"
-          }
-        )
+        submissionStatus === "error" && /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", onClick: () => onConfirmationOpenChange(false), children: "Edit" }),
+        submissionStatus === "success" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", variant: "outline", onClick: onNewTransaction, children: "New Transaction" }),
+          /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", onClick: onConfirmationClose, children: "View Transaction" })
+        ] })
       ] })
     ] }) })
   ] });
@@ -14032,7 +14022,7 @@ var TransactionHistory = () => {
     setRowsPerPage(value);
     setCurrentPage(1);
   };
-  const formatCurrency3 = (value) => {
+  const formatCurrency4 = (value) => {
     const formatted = new Intl.NumberFormat("en-US", {
       style: "currency",
       currency: "USD",
@@ -14321,7 +14311,7 @@ var TransactionHistory = () => {
             children: [
               /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 text-xs", children: transaction.created }),
               /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 text-xs", children: transaction.accountNumber }),
-              /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 text-xs text-right", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: transaction.amount < 0 ? "text-destructive" : "", children: formatCurrency3(transaction.amount) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 text-xs text-right", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: transaction.amount < 0 ? "text-destructive" : "", children: formatCurrency4(transaction.amount) }) }),
               /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 font-normal text-xs", children: transaction.customer }) }),
               /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 font-normal text-xs", children: transaction.counterparty }) }),
               /* @__PURE__ */ jsxRuntime.jsx("td", { className: "px-3 py-2 text-xs truncate", children: transaction.description }),
@@ -14804,9 +14794,6 @@ function NewTransaction() {
     setConfirmationOpen(false);
     resetForm();
   };
-  const handleCancel = () => {
-    navigate("/dashboard");
-  };
   const isReviewReady = React15.useMemo(() => {
     const data = form.watch();
     const requiresCounterparty = ["ach", "wire"].includes(data.transactionType);
@@ -14851,7 +14838,6 @@ function NewTransaction() {
       onEditCounterparty: handleEditCounterparty,
       onTransactionTypeChange: handleTransactionTypeChange,
       onSubmit: handleSubmit,
-      onCancel: handleCancel,
       onConfirmationClose: handleConfirmationClose,
       onConfirmationOpenChange: setConfirmationOpen,
       onNewTransaction: handleNewTransaction,
@@ -14862,66 +14848,60 @@ function NewTransaction() {
       onEditReceiverAccount: handleEditReceiverAccount,
       isReviewReady,
       adjustmentTypeOptions,
-      transactionTypeOptions
+      transactionTypeOptions,
+      showSuccessInfoBox: true,
+      successInfoMessage: "The transaction is being manually reviewed"
     }
   );
 }
-var TransactionDetail = () => {
-  const { id } = reactRouterDom.useParams();
-  const navigate = reactRouterDom.useNavigate();
-  const transaction = mockTransactions.find((t) => t.id === id);
-  if (!transaction) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "container mx-auto px-4 py-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold mb-2", children: "Transaction Not Found" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-muted-foreground mb-4", children: [
-        "The transaction #",
-        id,
-        " could not be found."
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: () => navigate("/transactions/history"), children: "Back to Transaction History" })
-    ] }) });
+var getStatusVariant = (status) => {
+  switch (status) {
+    case "POSTED":
+      return "success";
+    case "PENDING":
+      return "warning";
+    case "FAILED":
+      return "destructive";
+    case "CANCELLED":
+      return "outline";
+    default:
+      return "outline";
   }
-  const getStatusVariant3 = (status) => {
-    switch (status) {
-      case "POSTED":
-        return "success";
-      case "PENDING":
-        return "warning";
-      case "FAILED":
-        return "destructive";
-      case "CANCELLED":
-        return "outline";
-      default:
-        return "outline";
-    }
-  };
-  const getProcessingStatusVariant = (status) => {
-    switch (status) {
-      case "CONFIRMED":
-        return "success";
-      case "SENT":
-        return "success";
-      case "SUBMITTED":
-        return "warning";
-      case "CUSTOMER_REVIEW":
-        return "warning";
-      case "MANUAL_REVIEW":
-        return "warning";
-      case "INITIATED":
-        return "outline";
-      default:
-        return "outline";
-    }
-  };
-  const formatCurrency3 = (value) => {
-    return new Intl.NumberFormat("en-US", {
-      style: "currency",
-      currency: "USD",
-      minimumFractionDigits: 2
-    }).format(value);
-  };
-  const isWireTransfer = transaction.transactionType.toLowerCase().includes("wire");
-  const isACHTransfer = transaction.transactionType.toLowerCase().includes("ach");
+};
+var getProcessingStatusVariant = (status) => {
+  switch (status) {
+    case "CONFIRMED":
+    case "SENT":
+      return "success";
+    case "SUBMITTED":
+    case "CUSTOMER_REVIEW":
+    case "MANUAL_REVIEW":
+      return "warning";
+    case "INITIATED":
+    default:
+      return "outline";
+  }
+};
+var formatCurrency3 = (value) => {
+  return new Intl.NumberFormat("en-US", {
+    style: "currency",
+    currency: "USD",
+    minimumFractionDigits: 2
+  }).format(value);
+};
+var TransactionDetailView = ({
+  transaction,
+  timelineEvents,
+  isWireTransfer,
+  isACHTransfer,
+  onReturn,
+  onCancel,
+  onAccountClick,
+  onCustomerClick,
+  onCounterpartyClick,
+  onOFACClick,
+  onProductClick
+}) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     PageLayout,
     {
@@ -14937,7 +14917,7 @@ var TransactionDetail = () => {
             isInbound: transaction.isInbound
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getStatusVariant3(transaction.status), children: transaction.status }),
+        /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getStatusVariant(transaction.status), children: transaction.status }),
         /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getProcessingStatusVariant(transaction.processingStatus), children: transaction.processingStatus })
       ] }),
       maxWidth: "full",
@@ -14945,12 +14925,12 @@ var TransactionDetail = () => {
         {
           label: "Return",
           variant: "outline",
-          onClick: () => console.log("Return transaction")
+          onClick: onReturn
         },
         {
           label: "Cancel",
           variant: "default",
-          onClick: () => console.log("Cancel transaction")
+          onClick: onCancel
         }
       ],
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col lg:flex-row items-start gap-6", children: [
@@ -14960,7 +14940,15 @@ var TransactionDetail = () => {
               InfoField,
               {
                 label: "Account Number",
-                value: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: transaction.accountNumber }),
+                value: /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "link",
+                    className: "h-auto p-0 text-sm",
+                    onClick: () => onAccountClick(transaction.accountNumber),
+                    children: transaction.accountNumber
+                  }
+                ),
                 layout: "horizontal"
               }
             ),
@@ -14968,7 +14956,15 @@ var TransactionDetail = () => {
               InfoField,
               {
                 label: "Customer",
-                value: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: transaction.customer }),
+                value: /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "link",
+                    className: "h-auto p-0 text-sm",
+                    onClick: () => onCustomerClick(transaction.customer),
+                    children: transaction.customer
+                  }
+                ),
                 layout: "horizontal"
               }
             ),
@@ -14977,12 +14973,35 @@ var TransactionDetail = () => {
               InfoField,
               {
                 label: "Counterparty",
-                value: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: transaction.counterparty }),
+                value: /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "link",
+                    className: "h-auto p-0 text-sm",
+                    onClick: () => onCounterpartyClick(transaction.counterparty),
+                    children: transaction.counterparty
+                  }
+                ),
                 layout: "horizontal"
               }
             ),
             /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Post Date", value: transaction.created.split(" ")[0], layout: "horizontal" }),
-            /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "OFAC ID", value: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: "18323208" }), layout: "horizontal" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              InfoField,
+              {
+                label: "OFAC ID",
+                value: /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "link",
+                    className: "h-auto p-0 text-sm",
+                    onClick: () => onOFACClick("18323208"),
+                    children: "18323208"
+                  }
+                ),
+                layout: "horizontal"
+              }
+            ),
             /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Original Filename", value: "-", layout: "horizontal" }),
             /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Loaded From File", value: "iso21130757012764355B7.xml.126534273Q299", layout: "horizontal" }),
             /* @__PURE__ */ jsxRuntime.jsx(InfoField, { label: "Payment ID", value: transaction.id, layout: "horizontal" }),
@@ -14998,7 +15017,15 @@ var TransactionDetail = () => {
               InfoField,
               {
                 label: "Product ID",
-                value: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "link", className: "h-auto p-0 text-sm", children: "130" }),
+                value: /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "link",
+                    className: "h-auto p-0 text-sm",
+                    onClick: () => onProductClick("130"),
+                    children: "130"
+                  }
+                ),
                 layout: "horizontal"
               }
             ),
@@ -15008,11 +15035,66 @@ var TransactionDetail = () => {
           isACHTransfer && transaction.achDetails && /* @__PURE__ */ jsxRuntime.jsx(ACHDetailsSection, { data: transaction.achDetails }),
           isWireTransfer && transaction.wireDetails && /* @__PURE__ */ jsxRuntime.jsx(WireDetailsSection, { data: transaction.wireDetails })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsxRuntime.jsx(FormCard, { title: "Transaction Timeline", children: /* @__PURE__ */ jsxRuntime.jsx(AlertTimeline, { events: mockTransactionTimeline }) }) })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:w-64", children: /* @__PURE__ */ jsxRuntime.jsx(FormCard, { title: "Transaction Timeline", children: /* @__PURE__ */ jsxRuntime.jsx(AlertTimeline, { events: timelineEvents }) }) })
       ] })
     }
   );
 };
+var TransactionDetail = () => {
+  const { id } = reactRouterDom.useParams();
+  const navigate = reactRouterDom.useNavigate();
+  const transaction = mockTransactions.find((t) => t.id === id);
+  if (!transaction) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "container mx-auto px-4 py-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold mb-2", children: "Transaction Not Found" }),
+      /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-muted-foreground mb-4", children: [
+        "The transaction #",
+        id,
+        " could not be found."
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Button, { onClick: () => navigate("/transactions/history"), children: "Back to Transaction History" })
+    ] }) });
+  }
+  const isWireTransfer = transaction.transactionType.toLowerCase().includes("wire");
+  const isACHTransfer = transaction.transactionType.toLowerCase().includes("ach");
+  const handleReturn = () => {
+    console.log("Return transaction");
+  };
+  const handleCancel = () => {
+    console.log("Cancel transaction");
+  };
+  const handleAccountClick = (accountNumber) => {
+    navigate(`/accounts/${accountNumber}`);
+  };
+  const handleCustomerClick = (customer) => {
+    console.log("Navigate to customer:", customer);
+  };
+  const handleCounterpartyClick = (counterparty) => {
+    console.log("Navigate to counterparty:", counterparty);
+  };
+  const handleOFACClick = (ofacId) => {
+    navigate(`/compliance/ofac/${ofacId}`);
+  };
+  const handleProductClick = (productId) => {
+    console.log("Navigate to product:", productId);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TransactionDetailView,
+    {
+      transaction,
+      timelineEvents: mockTransactionTimeline,
+      isWireTransfer,
+      isACHTransfer,
+      onReturn: handleReturn,
+      onCancel: handleCancel,
+      onAccountClick: handleAccountClick,
+      onCustomerClick: handleCustomerClick,
+      onCounterpartyClick: handleCounterpartyClick,
+      onOFACClick: handleOFACClick,
+      onProductClick: handleProductClick
+    }
+  );
+};
 var TransactionDetail_default = TransactionDetail;
 function UIKit() {
   const breadcrumbs = [
@@ -15331,7 +15413,7 @@ var mockVelocityLimits = [
     comparisonMethod: "fuzzy"
   }
 ];
-var getStatusVariant = (status) => {
+var getStatusVariant2 = (status) => {
   switch (status) {
     case "ACTIVE":
       return "success";
@@ -15447,7 +15529,7 @@ function VelocityLimits() {
       key: "status",
       title: "Status",
       sortable: true,
-      render: (value) => /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getStatusVariant(value), children: value })
+      render: (value) => /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getStatusVariant2(value), children: value })
     },
     {
       key: "associatedEntity",
@@ -15830,7 +15912,7 @@ function CreateVelocityLimit() {
     ] }) }) }) }) })
   ] });
 }
-var getStatusVariant2 = (status) => {
+var getStatusVariant3 = (status) => {
   switch (status) {
     case "ACTIVE":
       return "success";
@@ -16067,7 +16149,7 @@ function VelocityLimitDetail() {
     {
       title: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { children: limit.limitName }),
-        /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getStatusVariant2(limit.status), children: limit.status })
+        /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: getStatusVariant3(limit.status), children: limit.status })
       ] }),
       cards: [
         {