@xyo-network/react-chain-blockchain 1.20.12 → 1.20.14

package/dist/browser/index.mjs

@@ -2,13 +2,13 @@ var __defProp = Object.defineProperty;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 
 // src/components/account/BalanceHistoryFlexbox.tsx
-import { Typography as Typography7 } from "@mui/material";
+import { Typography as Typography8 } from "@mui/material";
 import { FlexCol as FlexCol3 } from "@xylabs/react-flexbox";
-import { isDefined as isDefined7 } from "@xylabs/sdk-js";
+import { isDefined as isDefined8 } from "@xylabs/sdk-js";
 import { useAccountBalanceHistory } from "@xyo-network/react-chain-provider";
 import { ErrorRender as ErrorRender3 } from "@xyo-network/react-error";
 import { AttoXL1 } from "@xyo-network/xl1-sdk";
-import React30 from "react";
+import React31 from "react";
 
 // src/components/account/helpers/formatBalanceMagnitude.ts
 import { XL1Amount } from "@xyo-network/xl1-sdk";
@@ -29,15 +29,16 @@ var formatBalance = /* @__PURE__ */ __name((balance) => {
 }, "formatBalance");
 
 // src/components/account/table/BalanceHistoryTableEx.tsx
-import { TableBody as TableBody2, TableCell as TableCell14, TableHead as TableHead2, TableRow as TableRow4 } from "@mui/material";
-import { isDefined as isDefined6 } from "@xylabs/sdk-js";
+import { TableBody as TableBody2, TableCell as TableCell15, TableHead as TableHead2, TableRow as TableRow3 } from "@mui/material";
+import { isDefined as isDefined7 } from "@xylabs/sdk-js";
 import { TableEx as TableEx2 } from "@xyo-network/react-table";
-import React29 from "react";
+import React30 from "react";
 
 // src/components/account/table/BalanceHistoryTableRow.tsx
-import { TableCell as TableCell13, TableRow as TableRow3 } from "@mui/material";
+import { TableCell as TableCell14 } from "@mui/material";
+import { isDefined as isDefined6 } from "@xylabs/sdk-js";
 import { RawInfoIconButton } from "@xyo-network/react-payload-raw-info";
-import React28, { useMemo as useMemo7 } from "react";
+import React29, { useMemo as useMemo7 } from "react";
 
 // src/components/block/BlockHeadingFlexbox.tsx
 import { FlexCol as FlexCol2, FlexRow as FlexRow2 } from "@xylabs/react-flexbox";
@@ -650,19 +651,43 @@ var BlockHeadingFlexbox = /* @__PURE__ */ __name(({ block, defaultExpanded, tran
 
 // src/components/block/table/cell/BlockNumber.tsx
 import { Link, TableCell, Tooltip, Typography as Typography3 } from "@mui/material";
-import { useEvent as useEvent2 } from "@xyo-network/react-event";
 import React13 from "react";
-var BlockNumberTableCell = /* @__PURE__ */ __name(({ block, linked, ...props }) => {
+
+// src/components/block/table/cell/hooks/useLinkedBlockItem.tsx
+import { useEvent as useEvent2 } from "@xyo-network/react-event";
+var useLinkedBlockItem = /* @__PURE__ */ __name((noun, data) => {
+  const [ref, dispatch] = useEvent2();
+  const handleClick = /* @__PURE__ */ __name((event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (noun === void 0) {
+      console.warn("useLinkedBlockItem: noun is required");
+      return;
+    }
+    const selection = globalThis.getSelection();
+    const isTextSelected = selection && selection.toString().length > 0;
+    if (!isTextSelected) {
+      dispatch(noun, "click", data, event.nativeEvent);
+    }
+  }, "handleClick");
+  return [
+    ref,
+    handleClick
+  ];
+}, "useLinkedBlockItem");
+
+// src/components/block/table/cell/BlockNumber.tsx
+var BlockNumberTableCell = /* @__PURE__ */ __name(({ block, eventNoun = "block-number", linked, ...props }) => {
   const blockNumber = block?.[0].block;
   return /* @__PURE__ */ React13.createElement(BlockNumberTableCellInner, {
     blockNumber,
+    eventNoun,
     linked,
     ...props
   });
 }, "BlockNumberTableCell");
-var BlockNumberTableCellInner = /* @__PURE__ */ __name(({ blockNumber, linked, ...props }) => {
-  const [ref, dispatch] = useEvent2();
-  const handleClick = /* @__PURE__ */ __name((event) => dispatch("block-number", "click", blockNumber?.toString() ?? "", event.nativeEvent), "handleClick");
+var BlockNumberTableCellInner = /* @__PURE__ */ __name(({ blockNumber, eventNoun = "block-number", linked, ...props }) => {
+  const [ref, handleClick] = useLinkedBlockItem(eventNoun, blockNumber?.toLocaleString());
   return /* @__PURE__ */ React13.createElement(TableCell, {
     ref,
     ...props
@@ -783,29 +808,6 @@ var FeatureNotAvailable = /* @__PURE__ */ __name(({ featureName = "Feature", ...
   onClick: /* @__PURE__ */ __name((e) => props.onClose?.(e, "backdropClick"), "onClick")
 }, "Close"))), "FeatureNotAvailable");
 
-// src/components/block/table/cell/hooks/useLinkedBlockItem.tsx
-import { useEvent as useEvent3 } from "@xyo-network/react-event";
-var useLinkedBlockItem = /* @__PURE__ */ __name((noun, data) => {
-  const [ref, dispatch] = useEvent3();
-  const handleClick = /* @__PURE__ */ __name((event) => {
-    event.preventDefault();
-    event.stopPropagation();
-    if (noun === void 0) {
-      console.warn("useLinkedBlockItem: noun is required");
-      return;
-    }
-    const selection = globalThis.getSelection();
-    const isTextSelected = selection && selection.toString().length > 0;
-    if (!isTextSelected) {
-      dispatch(noun, "click", data, event.nativeEvent);
-    }
-  }, "handleClick");
-  return [
-    ref,
-    handleClick
-  ];
-}, "useLinkedBlockItem");
-
 // src/components/block/table/cell/Hash.tsx
 var BlockHashTableCell = /* @__PURE__ */ __name(({ block, notAvailableDialog, linked, ...props }) => {
   const hash = usePayloadRootHash(block?.[0]);
@@ -1051,11 +1053,24 @@ var BlockchainTableEx = /* @__PURE__ */ __name(({ ref, children, ...props }) =>
 BlockchainTableEx.displayName = "BlockchainTableEx";
 
 // src/components/block/table/row/TableRow.tsx
-import { TableRow as TableRow2, useTheme } from "@mui/material";
-import { alphaCss } from "@xylabs/react-theme";
 import { usePayloadRootHash as usePayloadRootHash3 } from "@xyo-network/react-shared";
 import React24, { useMemo as useMemo6 } from "react";
-var BlockChainTableRow = /* @__PURE__ */ __name(({ block, deepValidation, defaultExpanded, linked, sx, ...props }) => {
+
+// src/components/table/StyledLinkableTableRow.tsx
+import { styled, TableRow as TableRow2 } from "@mui/material";
+import { alphaCss } from "@xylabs/react-theme";
+var StyledLinkableTableRow = styled(TableRow2, {
+  shouldForwardProp: /* @__PURE__ */ __name((prop) => prop !== "linked", "shouldForwardProp")
+})(({ theme, linked }) => ({
+  "cursor": linked ? "pointer" : "default",
+  "overflowY": "scroll",
+  "&:hover": {
+    backgroundColor: alphaCss(theme.vars.palette.secondary.light, 0.15)
+  }
+}));
+
+// src/components/block/table/row/TableRow.tsx
+var BlockChainTableRow = /* @__PURE__ */ __name(({ block, deepValidation, defaultExpanded, linked, ...props }) => {
   const linkedTableCellProps = useMemo6(() => ({
     block,
     linked
@@ -1070,18 +1085,10 @@ var BlockChainTableRow = /* @__PURE__ */ __name(({ block, deepValidation, defaul
   ]);
   const hash = usePayloadRootHash3(block?.[0]);
   const [ref, handleClick] = useLinkedBlockItem("block-hash", hash);
-  const theme = useTheme();
-  return /* @__PURE__ */ React24.createElement(TableRow2, {
+  return /* @__PURE__ */ React24.createElement(StyledLinkableTableRow, {
     onClick: linked ? handleClick : void 0,
     ref,
-    sx: {
-      "cursor": linked ? "pointer" : "default",
-      "overflowY": "scroll",
-      "&:hover": {
-        backgroundColor: alphaCss(theme.vars.palette.secondary.light, 0.15)
-      },
-      ...sx
-    },
+    linked,
     ...props
   }, /* @__PURE__ */ React24.createElement(BlockNumberTableCell, {
     align: "left",
@@ -1109,11 +1116,34 @@ var BlockChainTableRow = /* @__PURE__ */ __name(({ block, deepValidation, defaul
 
 // src/components/account/table/cell/AddressTableCell.tsx
 import { TableCell as TableCell10, Tooltip as Tooltip8 } from "@mui/material";
-import { useEvent as useEvent4 } from "@xyo-network/react-event";
 import React25 from "react";
-var AddressTableCell = /* @__PURE__ */ __name(({ address, linked, toolTipTitle, sx, ...props }) => {
-  const [ref, dispatch] = useEvent4();
-  const handleClick = /* @__PURE__ */ __name((event) => dispatch("address", "click", address, event.nativeEvent), "handleClick");
+
+// src/components/account/table/hooks/useLinkedBalanceHistoryItem.tsx
+import { useEvent as useEvent3 } from "@xyo-network/react-event";
+var useLinkedBalanceHistoryItem = /* @__PURE__ */ __name(() => {
+  const [ref, dispatch] = useEvent3();
+  const handleClick = /* @__PURE__ */ __name((event, noun, data) => {
+    event.preventDefault();
+    event.stopPropagation();
+    if (noun === void 0) {
+      console.warn("useLinkedBalanceHistoryItem: noun is required");
+      return;
+    }
+    const selection = globalThis.getSelection();
+    const isTextSelected = selection && selection.toString().length > 0;
+    if (!isTextSelected) {
+      dispatch(noun, "click", data, event.nativeEvent);
+    }
+  }, "handleClick");
+  return [
+    ref,
+    handleClick
+  ];
+}, "useLinkedBalanceHistoryItem");
+
+// src/components/account/table/cell/AddressTableCell.tsx
+var AddressTableCell = /* @__PURE__ */ __name(({ address, eventNoun, linked, toolTipTitle, sx, ...props }) => {
+  const [ref, handleClick] = useLinkedBalanceHistoryItem();
   return /* @__PURE__ */ React25.createElement(TableCell10, {
     ref,
     sx: {
@@ -1125,29 +1155,57 @@ var AddressTableCell = /* @__PURE__ */ __name(({ address, linked, toolTipTitle,
     title: toolTipTitle
   }, /* @__PURE__ */ React25.createElement(BlockAddressChip, {
     address,
-    onClick: handleClick
+    onClick: linked ? (e) => handleClick(e, eventNoun, address) : void 0
   })));
 }, "AddressTableCell");
 
-// src/components/account/table/cell/HashTableCell.tsx
+// src/components/account/table/cell/BlockNumber.tsx
 import { Link as Link5, TableCell as TableCell11, Tooltip as Tooltip9, Typography as Typography6 } from "@mui/material";
-import { ellipsize as ellipsize2, isDefined as isDefined4 } from "@xylabs/sdk-js";
-import { useEvent as useEvent5 } from "@xyo-network/react-event";
 import React26 from "react";
-var HashTableCell = /* @__PURE__ */ __name(({ hash, linked, toolTipTitle, sx, ...props }) => {
-  const [ref, dispatch] = useEvent5();
-  const handleClick = /* @__PURE__ */ __name((event) => dispatch("tx-hash", "click", hash, event.nativeEvent), "handleClick");
-  const shortenedHash = isDefined4(hash) ? ellipsize2(hash, 6) : "N/A";
+var BalanceHistoryBlockNumberTableCell = /* @__PURE__ */ __name(({ block, eventNoun = "block-number", linked, ...props }) => {
+  const blockNumber = block?.[0].block;
+  return /* @__PURE__ */ React26.createElement(BalanceHistoryBlockNumberTableCellInner, {
+    blockNumber,
+    eventNoun,
+    linked,
+    ...props
+  });
+}, "BalanceHistoryBlockNumberTableCell");
+var BalanceHistoryBlockNumberTableCellInner = /* @__PURE__ */ __name(({ blockNumber, eventNoun = "block-number", linked, ...props }) => {
+  const [ref, handleClick] = useLinkedBalanceHistoryItem();
   return /* @__PURE__ */ React26.createElement(TableCell11, {
     ref,
     ...props
-  }, hash ? /* @__PURE__ */ React26.createElement(Tooltip9, {
-    title: toolTipTitle
+  }, /* @__PURE__ */ React26.createElement(Tooltip9, {
+    title: `Block Number: ${blockNumber}`
   }, /* @__PURE__ */ React26.createElement(Typography6, {
     component: "span",
     variant: "body1"
   }, linked ? /* @__PURE__ */ React26.createElement(Link5, {
-    onClick: handleClick,
+    onClick: /* @__PURE__ */ __name((e) => handleClick(e, eventNoun, blockNumber?.toString() ?? ""), "onClick"),
+    sx: {
+      cursor: "pointer"
+    }
+  }, blockNumber) : blockNumber)));
+}, "BalanceHistoryBlockNumberTableCellInner");
+
+// src/components/account/table/cell/HashTableCell.tsx
+import { Link as Link6, TableCell as TableCell12, Tooltip as Tooltip10, Typography as Typography7 } from "@mui/material";
+import { ellipsize as ellipsize2, isDefined as isDefined4 } from "@xylabs/sdk-js";
+import React27 from "react";
+var HashTableCell = /* @__PURE__ */ __name(({ eventData, eventNoun = "tx-hash", hash, linked, toolTipTitle, sx, ...props }) => {
+  const [ref, handleClick] = useLinkedBalanceHistoryItem();
+  const shortenedHash = isDefined4(hash) ? ellipsize2(hash, 6) : "N/A";
+  return /* @__PURE__ */ React27.createElement(TableCell12, {
+    ref,
+    ...props
+  }, hash ? /* @__PURE__ */ React27.createElement(Tooltip10, {
+    title: toolTipTitle
+  }, /* @__PURE__ */ React27.createElement(Typography7, {
+    component: "span",
+    variant: "body1"
+  }, linked ? /* @__PURE__ */ React27.createElement(Link6, {
+    onClick: /* @__PURE__ */ __name((e) => handleClick(e, eventNoun, eventData), "onClick"),
     sx: {
       cursor: "pointer"
     }
@@ -1155,14 +1213,12 @@ var HashTableCell = /* @__PURE__ */ __name(({ hash, linked, toolTipTitle, sx, ..
 }, "HashTableCell");
 
 // src/components/account/table/RawAmountTableCell.tsx
-import { Link as Link6, TableCell as TableCell12, Tooltip as Tooltip10 } from "@mui/material";
+import { Link as Link7, TableCell as TableCell13, Tooltip as Tooltip11 } from "@mui/material";
 import { isDefined as isDefined5, toHex as toHex2 } from "@xylabs/sdk-js";
-import { useEvent as useEvent6 } from "@xyo-network/react-event";
 import { XL1Amount as XL1Amount2 } from "@xyo-network/xl1-sdk";
-import React27 from "react";
-var RawAmountTableCell = /* @__PURE__ */ __name(({ amount, linked, sx, type, ...props }) => {
-  const [ref, dispatch] = useEvent6();
-  const handleClick = /* @__PURE__ */ __name((event) => dispatch("amount", "click", isDefined5(amount) ? toHex2(amount) : "", event.nativeEvent), "handleClick");
+import React28 from "react";
+var RawAmountTableCell = /* @__PURE__ */ __name(({ amount, eventNoun = "amount", linked, sx, type, ...props }) => {
+  const [ref, handleClick] = useLinkedBalanceHistoryItem();
   const formatAmount = /* @__PURE__ */ __name((amount2) => {
     if (!isDefined5(amount2)) {
       return "N/A";
@@ -1176,52 +1232,69 @@ var RawAmountTableCell = /* @__PURE__ */ __name(({ amount, linked, sx, type, ...
       locale: navigator.language
     });
   }, "formatAmount");
-  return /* @__PURE__ */ React27.createElement(TableCell12, {
+  return /* @__PURE__ */ React28.createElement(TableCell13, {
     ref,
     ...props
-  }, /* @__PURE__ */ React27.createElement(Tooltip10, {
+  }, /* @__PURE__ */ React28.createElement(Tooltip11, {
     title: `Raw Amount: ${amount}`
-  }, linked ? /* @__PURE__ */ React27.createElement(Link6, {
-    onClick: handleClick,
+  }, linked ? /* @__PURE__ */ React28.createElement(Link7, {
+    onClick: /* @__PURE__ */ __name((e) => handleClick(e, eventNoun, isDefined5(amount) ? toHex2(amount) : ""), "onClick"),
     sx: {
       cursor: "pointer"
     }
-  }, type === "send" ? "-" : "", formatAmount(amount)) : /* @__PURE__ */ React27.createElement("span", null, type === "send" ? "-" : "", formatAmount(amount))));
+  }, type === "send" ? "-" : "", formatAmount(amount)) : /* @__PURE__ */ React28.createElement("span", null, type === "send" ? "-" : "", formatAmount(amount))));
 }, "RawAmountTableCell");
 
 // src/components/account/table/BalanceHistoryTableRow.tsx
 var BalanceHistoryTableRow = /* @__PURE__ */ __name(({ linked, row, ...props }) => {
-  const { amount, blockNumber, debug, from, key, timestamp, to, type, txHash } = row ?? {};
+  const { amount, blockNumber, debug, from, key, timestamp, to, type, txHash, transferHash } = row ?? {};
   const linkedTableCallProps = useMemo7(() => ({
     linked
   }), [
     linked
   ]);
-  return /* @__PURE__ */ React28.createElement(TableRow3, {
+  const [ref, handleClick] = useLinkedBalanceHistoryItem();
+  const noun = isDefined6(txHash) ? "tx-hash|transfer-hash" : "block-number|transfer-hash";
+  const data = isDefined6(txHash) ? `${txHash}|${transferHash}` : `${blockNumber}|${transferHash}`;
+  return /* @__PURE__ */ React29.createElement(StyledLinkableTableRow, {
+    linked,
     key,
+    onClick: linked ? (e) => handleClick(e, noun, data) : void 0,
+    ref,
     ...props
-  }, /* @__PURE__ */ React28.createElement(HashTableCell, {
+  }, /* @__PURE__ */ React29.createElement(HashTableCell, {
     hash: txHash,
     toolTipTitle: `Transaction Hash: ${txHash}`,
+    eventNoun: "tx-hash",
     ...linkedTableCallProps
-  }), /* @__PURE__ */ React28.createElement(BlockNumberTableCellInner, {
+  }), /* @__PURE__ */ React29.createElement(BalanceHistoryBlockNumberTableCellInner, {
     blockNumber,
+    eventNoun: "block-number",
     ...linkedTableCallProps
-  }), /* @__PURE__ */ React28.createElement(BlockEpochTableCellInner, {
+  }), /* @__PURE__ */ React29.createElement(BlockEpochTableCellInner, {
     epoch: timestamp,
     ...linkedTableCallProps
-  }), /* @__PURE__ */ React28.createElement(AddressTableCell, {
+  }), /* @__PURE__ */ React29.createElement(AddressTableCell, {
     address: from,
     toolTipTitle: `From Address: ${from}`,
+    eventNoun: "from-address",
     ...linkedTableCallProps
-  }), /* @__PURE__ */ React28.createElement(AddressTableCell, {
+  }), /* @__PURE__ */ React29.createElement(AddressTableCell, {
     address: to,
     toolTipTitle: `To Address: ${to}`,
+    eventNoun: "to-address",
     ...linkedTableCallProps
-  }), /* @__PURE__ */ React28.createElement(RawAmountTableCell, {
+  }), /* @__PURE__ */ React29.createElement(RawAmountTableCell, {
     amount,
-    type
-  }), /* @__PURE__ */ React28.createElement(TableCell13, null, /* @__PURE__ */ React28.createElement(RawInfoIconButton, {
+    type,
+    eventNoun: "amount"
+  }), /* @__PURE__ */ React29.createElement(HashTableCell, {
+    hash: transferHash,
+    toolTipTitle: `Transfer Hash: ${transferHash}`,
+    eventNoun: noun,
+    eventData: data,
+    ...linkedTableCallProps
+  }), /* @__PURE__ */ React29.createElement(TableCell14, null, /* @__PURE__ */ React29.createElement(RawInfoIconButton, {
     rawValue: debug
   })));
 }, "BalanceHistoryTableRow");
@@ -1234,14 +1307,15 @@ var TableHeadingLabels = [
   "From",
   "To",
   "Amount",
+  "TransferHash",
   "Debug"
 ];
 
 // src/components/account/table/BalanceHistoryTableEx.tsx
 var AccountBalanceHistoryTableEx = /* @__PURE__ */ __name(({ history, linked, ...props }) => {
-  return isDefined6(history) ? /* @__PURE__ */ React29.createElement(TableEx2, props, /* @__PURE__ */ React29.createElement(TableHead2, null, /* @__PURE__ */ React29.createElement(TableRow4, null, TableHeadingLabels.map((heading) => /* @__PURE__ */ React29.createElement(TableCell14, {
+  return isDefined7(history) ? /* @__PURE__ */ React30.createElement(TableEx2, props, /* @__PURE__ */ React30.createElement(TableHead2, null, /* @__PURE__ */ React30.createElement(TableRow3, null, TableHeadingLabels.map((heading) => /* @__PURE__ */ React30.createElement(TableCell15, {
     key: heading
-  }, heading)))), /* @__PURE__ */ React29.createElement(TableBody2, null, history?.map((row) => /* @__PURE__ */ React29.createElement(BalanceHistoryTableRow, {
+  }, heading)))), /* @__PURE__ */ React30.createElement(TableBody2, null, history?.map((row) => /* @__PURE__ */ React30.createElement(BalanceHistoryTableRow, {
     key: row.key,
     linked,
     row
@@ -1258,22 +1332,22 @@ var AccountBalanceHistoryFlexBox = /* @__PURE__ */ __name(({ address, refresh, v
     ],
     history: void 0
   };
-  return isDefined7(history) && isDefined7(address) ? /* @__PURE__ */ React30.createElement(FlexCol3, props, /* @__PURE__ */ React30.createElement(ErrorRender3, {
+  return isDefined8(history) && isDefined8(address) ? /* @__PURE__ */ React31.createElement(FlexCol3, props, /* @__PURE__ */ React31.createElement(ErrorRender3, {
     error,
     scope: "AccountBalanceHistoryTable"
-  }), /* @__PURE__ */ React30.createElement(Typography7, {
+  }), /* @__PURE__ */ React31.createElement(Typography8, {
     variant: "h6",
     gutterBottom: true
-  }, formatBalanceMagnitude(balance)), truncated ? /* @__PURE__ */ React30.createElement(Typography7, {
+  }, formatBalanceMagnitude(balance)), truncated ? /* @__PURE__ */ React31.createElement(Typography8, {
     variant: "caption",
     gutterBottom: true
-  }, "Ranged Balance from", " ", history.at(-1).blockNumber, " ", "-", " ", history[0].blockNumber) : null, /* @__PURE__ */ React30.createElement(AccountBalanceHistoryTableEx, {
+  }, "Ranged Balance from", " ", history.at(-1).blockNumber, " ", "-", " ", history[0].blockNumber) : null, /* @__PURE__ */ React31.createElement(AccountBalanceHistoryTableEx, {
     history
   })) : null;
 }, "AccountBalanceHistoryFlexBox");
 
 // src/components/account/hooks/usePagedAccountBalanceHistory.ts
-import { isDefined as isDefined8 } from "@xylabs/sdk-js";
+import { isDefined as isDefined9 } from "@xylabs/sdk-js";
 import { useAccountBalanceHistory as useAccountBalanceHistory2 } from "@xyo-network/react-chain-provider";
 import { useCallback, useState as useState9 } from "react";
 var usePagedAccountBalanceHistory = /* @__PURE__ */ __name((address, viewer, maxPage = 1) => {
@@ -1282,17 +1356,17 @@ var usePagedAccountBalanceHistory = /* @__PURE__ */ __name((address, viewer, max
   const [results, error, loading] = useAccountBalanceHistory2(address, viewer, maxPage, updatedBlockRange);
   const { history, truncated } = results || {};
   const [previousHistory, setPreviousHistory] = useState9(history);
-  if (isDefined8(history) && history !== previousHistory) {
+  if (isDefined9(history) && history !== previousHistory) {
     setPagedHistory([
       ...pagedHistory ?? [],
       ...history
     ]);
     setPreviousHistory(history);
   }
-  const lastBlock = isDefined8(history) ? history.at(-1)?.blockNumber : void 0;
-  const historyComplete = isDefined8(history) && history.length === 0 || lastBlock === 0;
+  const lastBlock = isDefined9(history) ? history.at(-1)?.blockNumber : void 0;
+  const historyComplete = isDefined9(history) && history.length === 0 || lastBlock === 0;
   const updateRange = useCallback(() => {
-    if (isDefined8(lastBlock) && lastBlock > 0 && truncated) {
+    if (isDefined9(lastBlock) && lastBlock > 0 && truncated) {
       const newEndBlock = lastBlock - 1;
       setUpdatedBlockRange([
         0,
@@ -1314,31 +1388,31 @@ var usePagedAccountBalanceHistory = /* @__PURE__ */ __name((address, viewer, max
 
 // src/components/chain/controls/PollingControlsFlexbox.tsx
 import { Autorenew, Pause } from "@mui/icons-material";
-import { Alert as Alert3, AlertTitle as AlertTitle2, Grow, Icon as Icon2, IconButton as IconButton4, Tooltip as Tooltip11 } from "@mui/material";
+import { Alert as Alert3, AlertTitle as AlertTitle2, Grow, Icon as Icon2, IconButton as IconButton4, Tooltip as Tooltip12 } from "@mui/material";
 import { FlexRow as FlexRow6 } from "@xylabs/react-flexbox";
-import React35, { memo } from "react";
+import React36, { memo } from "react";
 
 // src/components/chain/stats/Dialog.tsx
 import { QueryStats } from "@mui/icons-material";
 import { Dialog as Dialog3, DialogContent as DialogContent3, DialogTitle as DialogTitle3, IconButton as IconButton3 } from "@mui/material";
-import React33, { useState as useState10 } from "react";
+import React34, { useState as useState10 } from "react";
 
 // src/components/chain/stats/producer/ProducerFlexbox.tsx
-import { Typography as Typography8 } from "@mui/material";
+import { Typography as Typography9 } from "@mui/material";
 import { ErrorRender as ErrorRender4 } from "@xylabs/react-error";
 import { FlexCol as FlexCol4 } from "@xylabs/react-flexbox";
 import { isChainSummaryProducers } from "@xyo-network/chain-analyze";
-import React32, { useMemo as useMemo8 } from "react";
+import React33, { useMemo as useMemo8 } from "react";
 
 // src/components/chain/stats/producer/Table.tsx
-import { Table, TableBody as TableBody3, TableCell as TableCell15, TableHead as TableHead3, TableRow as TableRow5, useTheme as useTheme2 } from "@mui/material";
+import { Table, TableBody as TableBody3, TableCell as TableCell16, TableHead as TableHead3, TableRow as TableRow4, useTheme } from "@mui/material";
 import { BlockiesAvatar as BlockiesAvatar2 } from "@xyo-network/react-chain-blockies";
-import React31 from "react";
+import React32 from "react";
 var ChainProducerStatsTable = /* @__PURE__ */ __name(({ producers, ...props }) => {
-  const theme = useTheme2();
-  return /* @__PURE__ */ React31.createElement(Table, props, /* @__PURE__ */ React31.createElement(TableHead3, null, /* @__PURE__ */ React31.createElement(TableRow5, null, /* @__PURE__ */ React31.createElement(TableCell15, null, "Address"), /* @__PURE__ */ React31.createElement(TableCell15, null, "Blocks Produced"), /* @__PURE__ */ React31.createElement(TableCell15, null, "Rewards Earned Produced"))), /* @__PURE__ */ React31.createElement(TableBody3, null, producers?.map((producer) => /* @__PURE__ */ React31.createElement(TableRow5, {
+  const theme = useTheme();
+  return /* @__PURE__ */ React32.createElement(Table, props, /* @__PURE__ */ React32.createElement(TableHead3, null, /* @__PURE__ */ React32.createElement(TableRow4, null, /* @__PURE__ */ React32.createElement(TableCell16, null, "Address"), /* @__PURE__ */ React32.createElement(TableCell16, null, "Blocks Produced"), /* @__PURE__ */ React32.createElement(TableCell16, null, "Rewards Earned Produced"))), /* @__PURE__ */ React32.createElement(TableBody3, null, producers?.map((producer) => /* @__PURE__ */ React32.createElement(TableRow4, {
     key: producer.address
-  }, /* @__PURE__ */ React31.createElement(TableCell15, null, /* @__PURE__ */ React31.createElement(BlockiesAvatar2, {
+  }, /* @__PURE__ */ React32.createElement(TableCell16, null, /* @__PURE__ */ React32.createElement(BlockiesAvatar2, {
     blockiesOptions: {
       seed: producer.address
     },
@@ -1346,7 +1420,7 @@ var ChainProducerStatsTable = /* @__PURE__ */ __name(({ producers, ...props }) =
       height: theme.spacing(2.75),
       width: theme.spacing(2.75)
     }
-  })), /* @__PURE__ */ React31.createElement(TableCell15, null, producer.blocksProduced.toString()), /* @__PURE__ */ React31.createElement(TableCell15, null, producer.rewardsEarned.toString())))));
+  })), /* @__PURE__ */ React32.createElement(TableCell16, null, producer.blocksProduced.toString()), /* @__PURE__ */ React32.createElement(TableCell16, null, producer.rewardsEarned.toString())))));
 }, "ChainProducerStatsTable");
 
 // src/components/chain/stats/producer/ProducerFlexbox.tsx
@@ -1368,16 +1442,16 @@ var BlockProducerStatsFlexbox = /* @__PURE__ */ __name(({ payload, ...props }) =
   const producersArray = useMemo8(() => Object.values(producer?.producers ?? {}), [
     producer
   ]);
-  return /* @__PURE__ */ React32.createElement(FlexCol4, {
+  return /* @__PURE__ */ React33.createElement(FlexCol4, {
     alignItems: "start",
     gap: 1,
     ...props
-  }, /* @__PURE__ */ React32.createElement(ErrorRender4, {
+  }, /* @__PURE__ */ React33.createElement(ErrorRender4, {
     error: producerError,
     scope: "BlockProducerStatsFlexbox"
-  }), /* @__PURE__ */ React32.createElement(Typography8, {
+  }), /* @__PURE__ */ React33.createElement(Typography9, {
     fontSize: "1rem"
-  }, "Block Producers"), /* @__PURE__ */ React32.createElement(ChainProducerStatsTable, {
+  }, "Block Producers"), /* @__PURE__ */ React33.createElement(ChainProducerStatsTable, {
     producers: producersArray
   }));
 }, "BlockProducerStatsFlexbox");
@@ -1385,18 +1459,18 @@ var BlockProducerStatsFlexbox = /* @__PURE__ */ __name(({ payload, ...props }) =
 // src/components/chain/stats/Dialog.tsx
 var ChainAnalyzerStatsDialog = /* @__PURE__ */ __name((props) => {
   const { analyzers, statsUpdated } = useChainAnalyzersContext();
-  return /* @__PURE__ */ React33.createElement(Dialog3, props, /* @__PURE__ */ React33.createElement(DialogTitle3, null, "Chain Analysis"), /* @__PURE__ */ React33.createElement(DialogContent3, null, statsUpdated > 0 ? Object.entries(analyzers).map(([id2, analyzer]) => /* @__PURE__ */ React33.createElement("div", {
+  return /* @__PURE__ */ React34.createElement(Dialog3, props, /* @__PURE__ */ React34.createElement(DialogTitle3, null, "Chain Analysis"), /* @__PURE__ */ React34.createElement(DialogContent3, null, statsUpdated > 0 ? Object.entries(analyzers).map(([id2, analyzer]) => /* @__PURE__ */ React34.createElement("div", {
     key: id2
-  }, id2 === "producers" ? /* @__PURE__ */ React33.createElement(BlockProducerStatsFlexbox, {
+  }, id2 === "producers" ? /* @__PURE__ */ React34.createElement(BlockProducerStatsFlexbox, {
     payload: analyzer.result()
   }) : null)) : null));
 }, "ChainAnalyzerStatsDialog");
 var ChainAnalyzerStatsDialogFromContext = /* @__PURE__ */ __name((props) => {
   const [open, setOpen] = useState10(false);
   const handleClose = /* @__PURE__ */ __name(() => setOpen(false), "handleClose");
-  return /* @__PURE__ */ React33.createElement(React33.Fragment, null, /* @__PURE__ */ React33.createElement(IconButton3, {
+  return /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement(IconButton3, {
     onClick: /* @__PURE__ */ __name(() => setOpen(true), "onClick")
-  }, /* @__PURE__ */ React33.createElement(QueryStats, null)), /* @__PURE__ */ React33.createElement(ChainAnalyzerStatsDialog, {
+  }, /* @__PURE__ */ React34.createElement(QueryStats, null)), /* @__PURE__ */ React34.createElement(ChainAnalyzerStatsDialog, {
     onClose: handleClose,
     open,
     ...props
@@ -1404,20 +1478,20 @@ var ChainAnalyzerStatsDialogFromContext = /* @__PURE__ */ __name((props) => {
 }, "ChainAnalyzerStatsDialogFromContext");
 
 // src/components/chain/controls/PulseSvgIcon.tsx
-import { createSvgIcon, keyframes, styled } from "@mui/material";
-import React34 from "react";
-var PulseSvgIcon = createSvgIcon(/* @__PURE__ */ React34.createElement("svg", {
+import { createSvgIcon, keyframes, styled as styled2 } from "@mui/material";
+import React35 from "react";
+var PulseSvgIcon = createSvgIcon(/* @__PURE__ */ React35.createElement("svg", {
   viewBox: "0 0 80 80",
   version: "1.1",
   xmlns: "http://www.w3.org/2000/svg"
-}, /* @__PURE__ */ React34.createElement("g", {
+}, /* @__PURE__ */ React35.createElement("g", {
   transform: "translate(34,34)"
-}, /* @__PURE__ */ React34.createElement("circle", {
+}, /* @__PURE__ */ React35.createElement("circle", {
   className: "core",
   cx: "0",
   cy: "0",
   r: "6"
-}), /* @__PURE__ */ React34.createElement("circle", {
+}), /* @__PURE__ */ React35.createElement("circle", {
   className: "radar",
   cx: "0",
   cy: "0",
@@ -1454,7 +1528,7 @@ var pulse2 = keyframes`
     opacity: 0;
   }
 `;
-var StyledPulseSvgIcon = styled(PulseSvgIcon)(({ theme }) => {
+var StyledPulseSvgIcon = styled2(PulseSvgIcon)(({ theme }) => {
   return {
     "& .core": {
       animation: `${pulse1} 1.25s ease-in-out infinite`,
@@ -1481,24 +1555,24 @@ var StyledPulseSvgIcon = styled(PulseSvgIcon)(({ theme }) => {
 var PollingControlsFlexbox = /* @__PURE__ */ __name(({ blocksBehind, pollingState, setPollingState }) => {
   const paused = pollingState === "paused";
   const running = pollingState === "running";
-  return /* @__PURE__ */ React35.createElement(FlexRow6, {
+  return /* @__PURE__ */ React36.createElement(FlexRow6, {
     justifyContent: "space-between",
     width: "100%"
-  }, /* @__PURE__ */ React35.createElement(FlexRow6, {
+  }, /* @__PURE__ */ React36.createElement(FlexRow6, {
     gap: 2
-  }, running ? /* @__PURE__ */ React35.createElement(IconButton4, {
+  }, running ? /* @__PURE__ */ React36.createElement(IconButton4, {
     onClick: /* @__PURE__ */ __name(() => setPollingState?.("paused"), "onClick"),
     title: "Pause Block Stream"
-  }, /* @__PURE__ */ React35.createElement(Pause, null)) : null, paused ? /* @__PURE__ */ React35.createElement(IconButton4, {
+  }, /* @__PURE__ */ React36.createElement(Pause, null)) : null, paused ? /* @__PURE__ */ React36.createElement(IconButton4, {
     onClick: /* @__PURE__ */ __name(() => setPollingState?.("running"), "onClick"),
     title: "Re-Sync Block Stream"
-  }, /* @__PURE__ */ React35.createElement(Autorenew, null)) : null, /* @__PURE__ */ React35.createElement(ChainAnalyzerStatsDialogFromContext, null)), /* @__PURE__ */ React35.createElement(FlexRow6, {
+  }, /* @__PURE__ */ React36.createElement(Autorenew, null)) : null, /* @__PURE__ */ React36.createElement(ChainAnalyzerStatsDialogFromContext, null)), /* @__PURE__ */ React36.createElement(FlexRow6, {
     gap: 2
-  }, /* @__PURE__ */ React35.createElement(Grow, {
+  }, /* @__PURE__ */ React36.createElement(Grow, {
     in: (blocksBehind ?? 0) > 0
-  }, /* @__PURE__ */ React35.createElement(Tooltip11, {
+  }, /* @__PURE__ */ React36.createElement(Tooltip12, {
     title: "Click to Re-Sync"
-  }, /* @__PURE__ */ React35.createElement(Alert3, {
+  }, /* @__PURE__ */ React36.createElement(Alert3, {
     sx: {
       py: 0,
       px: 1,
@@ -1506,11 +1580,11 @@ var PollingControlsFlexbox = /* @__PURE__ */ __name(({ blocksBehind, pollingStat
     },
     severity: "warning",
     onClick: /* @__PURE__ */ __name(() => setPollingState?.("running"), "onClick")
-  }, /* @__PURE__ */ React35.createElement(AlertTitle2, {
+  }, /* @__PURE__ */ React36.createElement(AlertTitle2, {
     sx: {
       mb: 0
     }
-  }, "Behind:", " ", blocksBehind)))), /* @__PURE__ */ React35.createElement(Icon2, null, /* @__PURE__ */ React35.createElement(StyledPulseSvgIcon, {
+  }, "Behind:", " ", blocksBehind)))), /* @__PURE__ */ React36.createElement(Icon2, null, /* @__PURE__ */ React36.createElement(StyledPulseSvgIcon, {
     className: running ? "" : "paused"
   }))));
 }, "PollingControlsFlexbox");
@@ -1518,12 +1592,12 @@ var MemoizedPollingControlsFlexbox = /* @__PURE__ */ memo(PollingControlsFlexbox
 
 // src/components/chain/dialog/Dialog.tsx
 import { Button as Button4, Dialog as Dialog4, DialogActions as DialogActions3, DialogContent as DialogContent4 } from "@mui/material";
-import React36 from "react";
+import React37 from "react";
 var TransactionsDialog = /* @__PURE__ */ __name(({ onClose, ...props }) => {
-  return /* @__PURE__ */ React36.createElement(Dialog4, {
+  return /* @__PURE__ */ React37.createElement(Dialog4, {
     onClose,
     ...props
-  }, /* @__PURE__ */ React36.createElement(DialogContent4, null, "Transactions Dialog"), /* @__PURE__ */ React36.createElement(DialogActions3, null, /* @__PURE__ */ React36.createElement(Button4, {
+  }, /* @__PURE__ */ React37.createElement(DialogContent4, null, "Transactions Dialog"), /* @__PURE__ */ React37.createElement(DialogActions3, null, /* @__PURE__ */ React37.createElement(Button4, {
     variant: "outlined",
     onClick: /* @__PURE__ */ __name((e) => onClose?.(e, "escapeKeyDown"), "onClick")
   }, "Close")));
@@ -1565,9 +1639,9 @@ var useOnBlock = /* @__PURE__ */ __name((initialHeadNumber, onAddBlock, liveHead
 
 // src/components/chain/pagination/BlockChainPagination.tsx
 import { TablePaginationActions } from "@xyo-network/react-payload-table";
-import React37 from "react";
+import React38 from "react";
 var BlockChainPagination = /* @__PURE__ */ __name(({ count = 0, onPageChange, page, rowsPerPage = 10 }) => {
-  return /* @__PURE__ */ React37.createElement(TablePaginationActions, {
+  return /* @__PURE__ */ React38.createElement(TablePaginationActions, {
     count,
     onPageChange,
     page,
@@ -1599,9 +1673,9 @@ var useChainPagination = /* @__PURE__ */ __name((pageSize, blockComponents) => {
 }, "useChainPagination");
 
 // src/components/chain/styled/BlockListWrapperFlexbox.tsx
-import { styled as styled2 } from "@mui/material";
+import { styled as styled3 } from "@mui/material";
 import { FlexCol as FlexCol5 } from "@xylabs/react-flexbox";
-var BlockListWrapperFlexBox = styled2(FlexCol5, {
+var BlockListWrapperFlexBox = styled3(FlexCol5, {
   name: "BlockListWrapperFlexbox"
 })(() => ({
   "& > div:nth-of-type(2) .block-heading-flexbox .divider-spacer": {
@@ -1618,19 +1692,19 @@ var BlockListWrapperFlexBox = styled2(FlexCol5, {
 // src/components/payload/builder/Flexbox.tsx
 import { FlexCol as FlexCol6 } from "@xylabs/react-flexbox";
 import { JsonViewerEx as JsonViewerEx2 } from "@xyo-network/react-payload-raw-info";
-import React38, { useState as useState12 } from "react";
+import React39, { useState as useState12 } from "react";
 var PayloadBuilderFlexbox = /* @__PURE__ */ __name(({ BuilderComponent, onBuild, ...props }) => {
   const [payload, setPayload] = useState12();
   const onBuildLocal = /* @__PURE__ */ __name((payload2) => {
     onBuild?.(payload2);
     setPayload(payload2);
   }, "onBuildLocal");
-  return /* @__PURE__ */ React38.createElement(FlexCol6, {
+  return /* @__PURE__ */ React39.createElement(FlexCol6, {
     gap: 2,
     ...props
-  }, /* @__PURE__ */ React38.createElement(BuilderComponent, {
+  }, /* @__PURE__ */ React39.createElement(BuilderComponent, {
     onBuild: onBuildLocal
-  }), payload ? /* @__PURE__ */ React38.createElement(JsonViewerEx2, {
+  }), payload ? /* @__PURE__ */ React39.createElement(JsonViewerEx2, {
     value: payload
   }) : null);
 }, "PayloadBuilderFlexbox");
@@ -1639,12 +1713,12 @@ var PayloadBuilderFlexbox = /* @__PURE__ */ __name(({ BuilderComponent, onBuild,
 import { Button as Button5, FormControl as FormControl5 } from "@mui/material";
 import { usePromise as usePromise3 } from "@xylabs/react-promise";
 import { createProducerChainStakeIntent } from "@xyo-network/chain-protocol";
-import React41, { useState as useState15 } from "react";
+import React42, { useState as useState15 } from "react";
 
 // src/components/payload/fields/BlockNumberTextField.tsx
 import { FormControl as FormControl3, FormHelperText as FormHelperText2, TextField as TextField3 } from "@mui/material";
 import { toXL1BlockNumber as toXL1BlockNumber2 } from "@xyo-network/xl1-sdk";
-import React39, { useState as useState13 } from "react";
+import React40, { useState as useState13 } from "react";
 var BlockNumberTextField = /* @__PURE__ */ __name(({ errorMessage, onBlockNumberChanged, onChange, ...props }) => {
   const [blockNumber, setBlockNumber] = useState13();
   const handleChange = /* @__PURE__ */ __name((e) => {
@@ -1654,15 +1728,15 @@ var BlockNumberTextField = /* @__PURE__ */ __name(({ errorMessage, onBlockNumber
     onChange?.(e);
   }, "handleChange");
   const errored = errorMessage !== void 0;
-  return /* @__PURE__ */ React39.createElement(FormControl3, {
+  return /* @__PURE__ */ React40.createElement(FormControl3, {
     fullWidth: true
-  }, /* @__PURE__ */ React39.createElement(TextField3, {
+  }, /* @__PURE__ */ React40.createElement(TextField3, {
     error: errored,
     onChange: handleChange,
     type: "number",
     value: blockNumber ?? "",
     ...props
-  }), errored ? /* @__PURE__ */ React39.createElement(FormHelperText2, {
+  }), errored ? /* @__PURE__ */ React40.createElement(FormHelperText2, {
     sx: {
       color: "error.main"
     }
@@ -1671,13 +1745,13 @@ var BlockNumberTextField = /* @__PURE__ */ __name(({ errorMessage, onBlockNumber
 
 // src/components/payload/fields/XyoAddressTextField.tsx
 import { FormControl as FormControl4, FormHelperText as FormHelperText3, TextField as TextField4 } from "@mui/material";
-import { asAddress, isAddress, isDefined as isDefined9 } from "@xylabs/sdk-js";
-import React40, { useState as useState14 } from "react";
+import { asAddress, isAddress, isDefined as isDefined10 } from "@xylabs/sdk-js";
+import React41, { useState as useState14 } from "react";
 var XyoAddressTextField = /* @__PURE__ */ __name(({ onAddressChanged, onChange, resetValue, ...props }) => {
   const [address, setAddress] = useState14("");
   const [addressError, setAddressError] = useState14();
   const [previousResetValue, setPreviousResetValue] = useState14(resetValue);
-  if (isDefined9(resetValue) && resetValue !== previousResetValue) {
+  if (isDefined10(resetValue) && resetValue !== previousResetValue) {
     setPreviousResetValue(resetValue);
     setAddress("");
   }
@@ -1702,15 +1776,15 @@ var XyoAddressTextField = /* @__PURE__ */ __name(({ onAddressChanged, onChange,
       onAddressChanged?.();
     }
   }, "handleBlur");
-  return /* @__PURE__ */ React40.createElement(FormControl4, {
+  return /* @__PURE__ */ React41.createElement(FormControl4, {
     fullWidth: true
-  }, /* @__PURE__ */ React40.createElement(TextField4, {
+  }, /* @__PURE__ */ React41.createElement(TextField4, {
     error: !!addressError,
     onBlur: handleBlur,
     onChange: handleChange,
     value: address,
     ...props
-  }), addressError ? /* @__PURE__ */ React40.createElement(FormHelperText3, {
+  }), addressError ? /* @__PURE__ */ React41.createElement(FormHelperText3, {
     sx: {
       color: "error.main"
     }
@@ -1743,33 +1817,33 @@ var ProducerIntentBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
   const onBuildLocal = /* @__PURE__ */ __name(() => {
     if (onBuild && intentPayload) onBuild?.(intentPayload);
   }, "onBuildLocal");
-  return /* @__PURE__ */ React41.createElement(React41.Fragment, null, /* @__PURE__ */ React41.createElement(FormControl5, {
+  return /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(FormControl5, {
     fullWidth: true
-  }, /* @__PURE__ */ React41.createElement(XyoAddressTextField, {
+  }, /* @__PURE__ */ React42.createElement(XyoAddressTextField, {
     label: "Delegate",
     name: "delegate",
     onAddressChanged: setDelegate,
     required: true,
     size: "small"
-  })), /* @__PURE__ */ React41.createElement(FormControl5, {
+  })), /* @__PURE__ */ React42.createElement(FormControl5, {
     fullWidth: true
-  }, /* @__PURE__ */ React41.createElement(BlockNumberTextField, {
+  }, /* @__PURE__ */ React42.createElement(BlockNumberTextField, {
     errorMessage: blockRangeError?.message,
     label: "Expires",
     name: "exp",
     onBlockNumberChanged: setExp,
     required: true,
     size: "small"
-  })), /* @__PURE__ */ React41.createElement(FormControl5, {
+  })), /* @__PURE__ */ React42.createElement(FormControl5, {
     fullWidth: true
-  }, /* @__PURE__ */ React41.createElement(BlockNumberTextField, {
+  }, /* @__PURE__ */ React42.createElement(BlockNumberTextField, {
     errorMessage: blockRangeError?.message,
     label: "Not Before",
     name: "nbf",
     onBlockNumberChanged: setNbf,
     required: true,
     size: "small"
-  })), /* @__PURE__ */ React41.createElement(Button5, {
+  })), /* @__PURE__ */ React42.createElement(Button5, {
     disabled: !intentPayload,
     variant: "contained",
     onClick: onBuildLocal
@@ -1777,13 +1851,13 @@ var ProducerIntentBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
 }, "ProducerIntentBuilderForm");
 
 // src/components/payload/builder/transfer/Flexbox.tsx
-import React44 from "react";
+import React45 from "react";
 
 // src/components/payload/builder/transfer/Form.tsx
 import { Button as Button6, FormControl as FormControl7 } from "@mui/material";
 import { isAddress as isAddress3 } from "@xylabs/sdk-js";
 import { TransferSchema } from "@xyo-network/xl1-sdk";
-import React43, { useMemo as useMemo10, useState as useState17 } from "react";
+import React44, { useMemo as useMemo10, useState as useState17 } from "react";
 
 // src/components/payload/builder/transfer/builder/SingleFlexbox.tsx
 import { RemoveCircle } from "@mui/icons-material";
@@ -1791,7 +1865,7 @@ import { FormControl as FormControl6, Icon as Icon3, IconButton as IconButton5 }
 import { FlexRow as FlexRow7 } from "@xylabs/react-flexbox";
 import { isAddress as isAddress2, isDefinedNotNull, toHex as toHex3 } from "@xylabs/sdk-js";
 import { BigIntInput } from "@xyo-network/react-shared";
-import React42, { useEffect as useEffect2, useState as useState16 } from "react";
+import React43, { useEffect as useEffect2, useState as useState16 } from "react";
 var SingleTransferBuilderFlexbox = /* @__PURE__ */ __name(({ onTransferUpdated, onRemoveTransfer, singleTransfer, ...props }) => {
   const [toAddress3, setToAddress] = useState16();
   const [amount, setAmount] = useState16();
@@ -1808,29 +1882,29 @@ var SingleTransferBuilderFlexbox = /* @__PURE__ */ __name(({ onTransferUpdated,
     singleTransfer,
     toAddress3
   ]);
-  return /* @__PURE__ */ React42.createElement(FlexRow7, {
+  return /* @__PURE__ */ React43.createElement(FlexRow7, {
     alignItems: "start",
     gap: 1,
     ...props
-  }, /* @__PURE__ */ React42.createElement(FormControl6, {
+  }, /* @__PURE__ */ React43.createElement(FormControl6, {
     fullWidth: true
-  }, /* @__PURE__ */ React42.createElement(XyoAddressTextField, {
+  }, /* @__PURE__ */ React43.createElement(XyoAddressTextField, {
     label: "To",
     name: "to",
     onAddressChanged: setToAddress,
     required: true,
     size: "small"
-  })), /* @__PURE__ */ React42.createElement(FormControl6, {
+  })), /* @__PURE__ */ React43.createElement(FormControl6, {
     fullWidth: true
-  }, /* @__PURE__ */ React42.createElement(BigIntInput.TextField, {
+  }, /* @__PURE__ */ React43.createElement(BigIntInput.TextField, {
     label: "Amount",
     name: "amount",
     onChangeFixedPoint: setAmount,
     required: true,
     size: "small"
-  })), /* @__PURE__ */ React42.createElement(IconButton5, {
+  })), /* @__PURE__ */ React43.createElement(IconButton5, {
     onClick: /* @__PURE__ */ __name(() => onRemoveTransfer?.(singleTransfer.transferId), "onClick")
-  }, /* @__PURE__ */ React42.createElement(Icon3, null, /* @__PURE__ */ React42.createElement(RemoveCircle, null))));
+  }, /* @__PURE__ */ React43.createElement(Icon3, null, /* @__PURE__ */ React43.createElement(RemoveCircle, null))));
 }, "SingleTransferBuilderFlexbox");
 
 // src/components/payload/builder/transfer/Form.tsx
@@ -1881,19 +1955,19 @@ var TransferBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
       return transfer;
     }));
   }, "onTransferUpdated");
-  return /* @__PURE__ */ React43.createElement(React43.Fragment, null, /* @__PURE__ */ React43.createElement(FormControl7, {
+  return /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement(FormControl7, {
     fullWidth: true
-  }, /* @__PURE__ */ React43.createElement(XyoAddressTextField, {
+  }, /* @__PURE__ */ React44.createElement(XyoAddressTextField, {
     label: "From",
     name: "from",
     onAddressChanged: setFromAddress,
     required: true,
     size: "small"
-  })), /* @__PURE__ */ React43.createElement(Button6, {
+  })), /* @__PURE__ */ React44.createElement(Button6, {
     onClick: onTransferAdded,
     size: "small",
     variant: "contained"
-  }, "Add Transfer"), transfers.map((transfer) => /* @__PURE__ */ React43.createElement(SingleTransferBuilderFlexbox, {
+  }, "Add Transfer"), transfers.map((transfer) => /* @__PURE__ */ React44.createElement(SingleTransferBuilderFlexbox, {
     key: transfer.transferId,
     onTransferUpdated,
     onRemoveTransfer: onTransferRemoved,
@@ -1901,7 +1975,7 @@ var TransferBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
     sx: {
       width: "100%"
     }
-  })), /* @__PURE__ */ React43.createElement(Button6, {
+  })), /* @__PURE__ */ React44.createElement(Button6, {
     disabled: !transferPayload,
     variant: "contained",
     onClick: onBuildLocal
@@ -1909,7 +1983,7 @@ var TransferBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
 }, "TransferBuilderForm");
 
 // src/components/payload/builder/transfer/Flexbox.tsx
-var TransferBuilderFlexbox = /* @__PURE__ */ __name(({ onBuild, ...props }) => /* @__PURE__ */ React44.createElement(PayloadBuilderFlexbox, {
+var TransferBuilderFlexbox = /* @__PURE__ */ __name(({ onBuild, ...props }) => /* @__PURE__ */ React45.createElement(PayloadBuilderFlexbox, {
   gap: 4,
   alignItems: "start",
   BuilderComponent: TransferBuilderForm,
@@ -1919,7 +1993,7 @@ var TransferBuilderFlexbox = /* @__PURE__ */ __name(({ onBuild, ...props }) => /
 
 // src/components/rate/flexbox/FlexBox.tsx
 import { FlexCol as FlexCol7 } from "@xylabs/react-flexbox";
-import { isDefined as isDefined10 } from "@xylabs/sdk-js";
+import { isDefined as isDefined11 } from "@xylabs/sdk-js";
 
 // src/helpers/rate/rateUnitToLabel.ts
 var rateUnitToLabel = /* @__PURE__ */ __name((rateUnit) => {
@@ -1950,10 +2024,10 @@ var rateUnitToLabel = /* @__PURE__ */ __name((rateUnit) => {
 
 // src/components/rate/SpanTypography.tsx
 import { ViewAgendaOutlined } from "@mui/icons-material";
-import { Tooltip as Tooltip12 } from "@mui/material";
+import { Tooltip as Tooltip13 } from "@mui/material";
 
 // src/components/rate/support/MetricTypography.tsx
-import { Icon as Icon4, Typography as Typography9 } from "@mui/material";
+import { Icon as Icon4, Typography as Typography10 } from "@mui/material";
 import { isUndefined as isUndefined2 } from "@xylabs/sdk-js";
 import { useEffect as useEffect3, useState as useState18 } from "react";
 var MetricTypography = /* @__PURE__ */ __name(({ animationDurationMs = 1e3, disableAnimation, icon, label, metric, sx, ...props }) => {
@@ -1988,7 +2062,7 @@ var MetricTypography = /* @__PURE__ */ __name(({ animationDurationMs = 1e3, disa
     minimumFractionDigits: 0,
     maximumFractionDigits: isWholeNumber ? 0 : 2
   });
-  return /* @__PURE__ */ React.createElement(Typography9, {
+  return /* @__PURE__ */ React.createElement(Typography10, {
     variant: "h4",
     mb: 1,
     sx: {
@@ -2000,7 +2074,7 @@ var MetricTypography = /* @__PURE__ */ __name(({ animationDurationMs = 1e3, disa
     ...props
   }, /* @__PURE__ */ React.createElement(Icon4, {
     fontSize: "large"
-  }, icon), formattedValue, " ", /* @__PURE__ */ React.createElement(Typography9, {
+  }, icon), formattedValue, " ", /* @__PURE__ */ React.createElement(Typography10, {
     component: "span",
     variant: "caption",
     lineHeight: 1.86
@@ -2009,7 +2083,7 @@ var MetricTypography = /* @__PURE__ */ __name(({ animationDurationMs = 1e3, disa
 
 // src/components/rate/SpanTypography.tsx
 var BlockRateSpanTypography = /* @__PURE__ */ __name(({ range, span, sx, ...props }) => {
-  return /* @__PURE__ */ React.createElement(Tooltip12, {
+  return /* @__PURE__ */ React.createElement(Tooltip13, {
     title: `Block Range: ${range?.join(" - ")}`
   }, /* @__PURE__ */ React.createElement(MetricTypography, {
     icon: /* @__PURE__ */ React.createElement(ViewAgendaOutlined, {
@@ -2050,7 +2124,7 @@ var BlockRateTimeTypography = /* @__PURE__ */ __name(({ timeUnit, timeDifference
 // src/components/rate/flexbox/FlexBox.tsx
 var BlockRateFlexBox = /* @__PURE__ */ __name(({ blockRate, ...flexBoxProps }) => {
   const { range, span, rate, timeUnit, timeDifference } = blockRate ?? {};
-  const rateUnitLabel = isDefined10(timeUnit) ? rateUnitToLabel(timeUnit) : "";
+  const rateUnitLabel = isDefined11(timeUnit) ? rateUnitToLabel(timeUnit) : "";
   return /* @__PURE__ */ React.createElement(FlexCol7, {
     alignItems: "start",
     ...flexBoxProps
@@ -2070,7 +2144,7 @@ var BlockRateFlexBox = /* @__PURE__ */ __name(({ blockRate, ...flexBoxProps }) =
 import { GaugeContainer, GaugeReferenceArc, GaugeValueArc } from "@mui/x-charts";
 
 // src/components/rate/gauge/helpers/blockRateConversions.ts
-import { isDefined as isDefined11, isUndefined as isUndefined3 } from "@xylabs/sdk-js";
+import { isDefined as isDefined12, isUndefined as isUndefined3 } from "@xylabs/sdk-js";
 var toBlocksPerMillisecond = /* @__PURE__ */ __name((rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
@@ -2081,7 +2155,7 @@ var toBlocksPerMillisecond = /* @__PURE__ */ __name((rateValue, unit) => {
     days: 864e5,
     weeks: 6048e5
   };
-  return rateValue * (isDefined11(conversions[unit]) ? conversions[unit] : 1);
+  return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
 }, "toBlocksPerMillisecond");
 var toBlocksPerSecond = /* @__PURE__ */ __name((rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
@@ -2093,7 +2167,7 @@ var toBlocksPerSecond = /* @__PURE__ */ __name((rateValue, unit) => {
     days: 86400,
     weeks: 604800
   };
-  return rateValue * (isDefined11(conversions[unit]) ? conversions[unit] : 1);
+  return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
 }, "toBlocksPerSecond");
 var toBlocksPerMinute = /* @__PURE__ */ __name((rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
@@ -2105,7 +2179,7 @@ var toBlocksPerMinute = /* @__PURE__ */ __name((rateValue, unit) => {
     days: 1 / 1440,
     weeks: 1 / 10080
   };
-  return rateValue * (isDefined11(conversions[unit]) ? conversions[unit] : 1);
+  return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
 }, "toBlocksPerMinute");
 var toBlocksPerHour = /* @__PURE__ */ __name((rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
@@ -2117,7 +2191,7 @@ var toBlocksPerHour = /* @__PURE__ */ __name((rateValue, unit) => {
     days: 1 / 24,
     weeks: 1 / 168
   };
-  return rateValue * (isDefined11(conversions[unit]) ? conversions[unit] : 1);
+  return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
 }, "toBlocksPerHour");
 var toBlocksPerDay = /* @__PURE__ */ __name((rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
@@ -2129,7 +2203,7 @@ var toBlocksPerDay = /* @__PURE__ */ __name((rateValue, unit) => {
     days: 1,
     weeks: 1 / 7
   };
-  return rateValue * (isDefined11(conversions[unit]) ? conversions[unit] : 1);
+  return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
 }, "toBlocksPerDay");
 var toBlocksPerWeek = /* @__PURE__ */ __name((rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
@@ -2141,7 +2215,7 @@ var toBlocksPerWeek = /* @__PURE__ */ __name((rateValue, unit) => {
     days: 7,
     weeks: 1
   };
-  return rateValue * (isDefined11(conversions[unit]) ? conversions[unit] : 1);
+  return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
 }, "toBlocksPerWeek");
 var BlockRateConversions = {
   millis: toBlocksPerMillisecond,
@@ -2153,13 +2227,13 @@ var BlockRateConversions = {
 };
 
 // src/components/rate/gauge/Pointer.tsx
-import { useTheme as useTheme3 } from "@mui/material";
+import { useTheme as useTheme2 } from "@mui/material";
 import { useGaugeState } from "@mui/x-charts/Gauge";
-import { isDefined as isDefined12 } from "@xylabs/sdk-js";
+import { isDefined as isDefined13 } from "@xylabs/sdk-js";
 import { useEffect as useEffect4, useState as useState19 } from "react";
 var GaugePointer = /* @__PURE__ */ __name(({ pointerColor, startAngle = 0 }) => {
-  const theme = useTheme3();
-  const strokeColor = isDefined12(pointerColor) ? pointerColor : theme.palette.error.dark;
+  const theme = useTheme2();
+  const strokeColor = isDefined13(pointerColor) ? pointerColor : theme.palette.error.dark;
   const { valueAngle, outerRadius, cx, cy } = useGaugeState();
   const [currentAngle, setCurrentAngle] = useState19(startAngle);
   useEffect4(() => {
@@ -2206,13 +2280,13 @@ var GaugePointer = /* @__PURE__ */ __name(({ pointerColor, startAngle = 0 }) =>
 }, "GaugePointer");
 
 // src/components/rate/gauge/Ticks.tsx
-import { useTheme as useTheme4 } from "@mui/material";
+import { useTheme as useTheme3 } from "@mui/material";
 import { useGaugeState as useGaugeState2 } from "@mui/x-charts/Gauge";
-import { isDefined as isDefined13 } from "@xylabs/sdk-js";
+import { isDefined as isDefined14 } from "@xylabs/sdk-js";
 var GaugeTicks = /* @__PURE__ */ __name(({ numTicks = 11, minorTicksPerMajor = 4, majorTickLength = 0.2, minorTickLength = 0.15, majorTickWidth = 2, minorTickWidth = 1, tickColor }) => {
-  const theme = useTheme4();
+  const theme = useTheme3();
   const { startAngle, endAngle, outerRadius, cx, cy } = useGaugeState2();
-  const color = isDefined13(tickColor) ? tickColor : theme.vars.palette.text.secondary;
+  const color = isDefined14(tickColor) ? tickColor : theme.vars.palette.text.secondary;
   if (startAngle === null || endAngle === null) {
     return null;
   }
@@ -2290,9 +2364,9 @@ var BlockRateSpeedGaugeContainer = /* @__PURE__ */ __name(({ blockRate, children
 
 // src/components/rate/gauge/WithLabel.tsx
 import { FlexCol as FlexCol8 } from "@xylabs/react-flexbox";
-import { isDefined as isDefined14 } from "@xylabs/sdk-js";
+import { isDefined as isDefined15 } from "@xylabs/sdk-js";
 var BlockRateSpeedGaugeWithLabel = /* @__PURE__ */ __name(({ blockRate, ...props }) => {
-  const rateUnitLabel = isDefined14(blockRate?.rate) ? rateUnitToLabel(blockRate?.timeUnit) : "";
+  const rateUnitLabel = isDefined15(blockRate?.rate) ? rateUnitToLabel(blockRate?.timeUnit) : "";
   return /* @__PURE__ */ React.createElement(FlexCol8, null, /* @__PURE__ */ React.createElement(BlockRateSpeedGaugeContainer, {
     blockRate,
     ...props
@@ -2308,7 +2382,7 @@ import { usePromise as usePromise4 } from "@xylabs/react-promise";
 import { buildRandomBlockChain } from "@xyo-network/react-chain-shared";
 import { ArchivistConfigSchema, MemoryArchivist } from "@xyo-network/sdk-js";
 import { flattenHydratedBlocks } from "@xyo-network/xl1-sdk";
-import React45, { useEffect as useEffect5 } from "react";
+import React46, { useEffect as useEffect5 } from "react";
 
 // src/lib/getChainId.ts
 import { toAddress as toAddress2 } from "@xylabs/sdk-js";
@@ -2357,7 +2431,7 @@ var ChainArchivistDecorator = /* @__PURE__ */ __name((Story, { args, ...context
       }
     }
   };
-  return blockChainRenderProps?.chainArchivist ? /* @__PURE__ */ React45.createElement(Story, props) : /* @__PURE__ */ React45.createElement(CircularProgress, null);
+  return blockChainRenderProps?.chainArchivist ? /* @__PURE__ */ React46.createElement(Story, props) : /* @__PURE__ */ React46.createElement(CircularProgress, null);
 }, "ChainArchivistDecorator");
 
 // src/stories/ChainArchivistDelayedInsertDecorator.tsx
@@ -2367,7 +2441,7 @@ import { delay } from "@xylabs/sdk-js";
 import { buildRandomBlockChain as buildRandomBlockChain2 } from "@xyo-network/react-chain-shared";
 import { ArchivistConfigSchema as ArchivistConfigSchema2, MemoryArchivist as MemoryArchivist2 } from "@xyo-network/sdk-js";
 import { flattenHydratedBlock } from "@xyo-network/xl1-sdk";
-import React46, { useEffect as useEffect6, useState as useState20 } from "react";
+import React47, { useEffect as useEffect6, useState as useState20 } from "react";
 var chainArchivistRef;
 var ChainArchivistDelayedInsertDecorator = /* @__PURE__ */ __name((Story, context) => {
   const [firstBlock, setFirstBlock] = useState20();
@@ -2426,12 +2500,14 @@ var ChainArchivistDelayedInsertDecorator = /* @__PURE__ */ __name((Story, contex
       }
     }
   };
-  return firstBlock ? /* @__PURE__ */ React46.createElement(Story, props) : /* @__PURE__ */ React46.createElement(CircularProgress2, null);
+  return firstBlock ? /* @__PURE__ */ React47.createElement(Story, props) : /* @__PURE__ */ React47.createElement(CircularProgress2, null);
 }, "ChainArchivistDelayedInsertDecorator");
 export {
   AccountBalanceHistoryFlexBox,
   AccountBalanceHistoryTableEx,
   AddressTableCell,
+  BalanceHistoryBlockNumberTableCell,
+  BalanceHistoryBlockNumberTableCellInner,
   BalanceHistoryTableRow,
   BlockAddressChip,
   BlockChainPagination,
@@ -2496,6 +2572,7 @@ export {
   useBlockProducer,
   useChainIteratorParams,
   useChainPagination,
+  useLinkedBalanceHistoryItem,
   useOnBlock,
   usePagedAccountBalanceHistory,
   usePayloadCountsFromBlock,