@xyo-network/react-chain-blockchain 1.23.0 → 1.23.2

package/dist/browser/index.mjs

@@ -1,6 +1,3 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-
 // src/components/account/BalanceHistoryFlexbox.tsx
 import { Typography as Typography8 } from "@mui/material";
 import { FlexCol as FlexCol3 } from "@xylabs/react-flexbox";
@@ -8,16 +5,15 @@ 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 React31 from "react";
 
 // src/components/account/helpers/formatBalanceMagnitude.ts
 import { XL1Amount } from "@xyo-network/xl1-sdk";
-var formatBalanceMagnitude = /* @__PURE__ */ __name((set) => {
+var formatBalanceMagnitude = (set) => {
   const [received, sent] = set;
   const netBalance = received - sent;
   return netBalance < 0n ? `-${formatBalance(sent - received)}` : formatBalance(netBalance);
-}, "formatBalanceMagnitude");
-var formatBalance = /* @__PURE__ */ __name((balance) => {
+};
+var formatBalance = (balance) => {
   const xl1Amount = new XL1Amount(balance);
   return xl1Amount.toString(void 0, {
     places: 18,
@@ -26,25 +22,30 @@ var formatBalance = /* @__PURE__ */ __name((balance) => {
     minDecimals: 1,
     locale: navigator.language
   });
-}, "formatBalance");
+};
 
 // src/components/account/table/BalanceHistoryTableEx.tsx
-import { TableBody as TableBody2, TableCell as TableCell15, TableHead as TableHead2, TableRow as TableRow3 } from "@mui/material";
+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 React30 from "react";
 
 // src/components/account/table/BalanceHistoryTableRow.tsx
-import { TableCell as TableCell14 } 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 React29, { useMemo as useMemo7 } from "react";
+import { useMemo as useMemo7 } from "react";
 
 // src/components/block/BlockHeadingFlexbox.tsx
 import { FlexCol as FlexCol2, FlexRow as FlexRow2 } from "@xylabs/react-flexbox";
 import { BWVerification, HashHeadingPaper } from "@xyo-network/react-boundwitness-plugin";
 import { usePayloadHash } from "@xyo-network/react-shared";
-import React12 from "react";
 
 // src/context/analyzer/context.ts
 import { createContextEx } from "@xylabs/react-shared";
@@ -52,7 +53,7 @@ var ChainAnalyzersContext = createContextEx();
 
 // src/context/analyzer/use.ts
 import { useContextEx } from "@xylabs/react-shared";
-var useChainAnalyzersContext = /* @__PURE__ */ __name((required = false) => useContextEx(ChainAnalyzersContext, "ChainAnalyzers", required), "useChainAnalyzersContext");
+var useChainAnalyzersContext = (required = false) => useContextEx(ChainAnalyzersContext, "ChainAnalyzers", required);
 
 // src/context/polling/context.ts
 import { createContextEx as createContextEx2 } from "@xylabs/react-shared";
@@ -60,16 +61,20 @@ var ChainPollingContext = createContextEx2();
 
 // src/context/polling/use.ts
 import { useContextEx as useContextEx2 } from "@xylabs/react-shared";
-var useChainPollingContext = /* @__PURE__ */ __name((required = false) => useContextEx2(ChainPollingContext, "ChainPolling", required), "useChainPollingContext");
+var useChainPollingContext = (required = false) => useContextEx2(ChainPollingContext, "ChainPolling", required);
 
 // src/components/transactions/submit/Builder.tsx
-import { Button, FormControl, TextField } from "@mui/material";
+import {
+  Button,
+  FormControl,
+  TextField
+} from "@mui/material";
 import { FlexCol } from "@xylabs/react-flexbox";
 import { toHex } from "@xylabs/sdk-js";
 import { defaultTransactionFees, toXL1BlockNumber } from "@xyo-network/xl1-sdk";
-import React2 from "react";
-var ChainTransactionBuilder = /* @__PURE__ */ __name(({ onSubmitTx }) => {
-  const handleSubmit = /* @__PURE__ */ __name(async (event) => {
+import { jsx, jsxs } from "react/jsx-runtime";
+var ChainTransactionBuilder = ({ onSubmitTx }) => {
+  const handleSubmit = async (event) => {
     event.preventDefault();
     const formData = new FormData(event.currentTarget);
     const chainTx = {
@@ -84,52 +89,31 @@ var ChainTransactionBuilder = /* @__PURE__ */ __name(({ onSubmitTx }) => {
       }
     };
     await onSubmitTx?.(chainTx);
-  }, "handleSubmit");
-  return /* @__PURE__ */ React2.createElement("form", {
-    onSubmit: /* @__PURE__ */ __name((event) => void handleSubmit(event), "onSubmit"),
-    style: {
-      width: "100%"
-    }
-  }, /* @__PURE__ */ React2.createElement(FlexCol, {
-    sx: {
-      gap: 2
-    }
-  }, /* @__PURE__ */ React2.createElement(FormControl, {
-    fullWidth: true
-  }, /* @__PURE__ */ React2.createElement(TextField, {
-    label: "Chain Address",
-    name: "chain",
-    required: true
-  })), /* @__PURE__ */ React2.createElement(FormControl, {
-    fullWidth: true
-  }, /* @__PURE__ */ React2.createElement(TextField, {
-    label: "Gas",
-    name: "gas",
-    required: true
-  })), /* @__PURE__ */ React2.createElement(FormControl, {
-    fullWidth: true
-  }, /* @__PURE__ */ React2.createElement(TextField, {
-    label: "Not Before Block",
-    name: "nbf",
-    required: true
-  })), /* @__PURE__ */ React2.createElement(FormControl, {
-    fullWidth: true
-  }, /* @__PURE__ */ React2.createElement(TextField, {
-    label: "Not After Block",
-    name: "exp",
-    required: true
-  })), /* @__PURE__ */ React2.createElement(Button, {
-    type: "submit",
-    variant: "contained"
-  }, "Submit")));
-}, "ChainTransactionBuilder");
+  };
+  return /* @__PURE__ */ jsx("form", { onSubmit: (event) => void handleSubmit(event), style: { width: "100%" }, children: /* @__PURE__ */ jsxs(FlexCol, { sx: { gap: 2 }, children: [
+    /* @__PURE__ */ jsx(FormControl, { fullWidth: true, children: /* @__PURE__ */ jsx(TextField, { label: "Chain Address", name: "chain", required: true }) }),
+    /* @__PURE__ */ jsx(FormControl, { fullWidth: true, children: /* @__PURE__ */ jsx(TextField, { label: "Gas", name: "gas", required: true }) }),
+    /* @__PURE__ */ jsx(FormControl, { fullWidth: true, children: /* @__PURE__ */ jsx(TextField, { label: "Not Before Block", name: "nbf", required: true }) }),
+    /* @__PURE__ */ jsx(FormControl, { fullWidth: true, children: /* @__PURE__ */ jsx(TextField, { label: "Not After Block", name: "exp", required: true }) }),
+    /* @__PURE__ */ jsx(Button, { type: "submit", variant: "contained", children: "Submit" })
+  ] }) });
+};
 
 // src/components/transactions/submit/Network.tsx
-import { FormControl as FormControl2, FormHelperText, TextField as TextField2 } from "@mui/material";
-import React3, { useState } from "react";
-var ChainTransactionNetwork = /* @__PURE__ */ __name(({ network, onNetworkChange, ...props }) => {
+import {
+  FormControl as FormControl2,
+  FormHelperText,
+  TextField as TextField2
+} from "@mui/material";
+import { useState } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var ChainTransactionNetwork = ({
+  network,
+  onNetworkChange,
+  ...props
+}) => {
   const [error, setError] = useState();
-  const handleChange = /* @__PURE__ */ __name((event) => {
+  const handleChange = (event) => {
     try {
       const url = new URL(event.target.value);
       setError(void 0);
@@ -138,55 +122,54 @@ var ChainTransactionNetwork = /* @__PURE__ */ __name(({ network, onNetworkChange
       console.error(error2);
       setError(error2);
     }
-  }, "handleChange");
-  return /* @__PURE__ */ React3.createElement(FormControl2, {
-    fullWidth: true
-  }, /* @__PURE__ */ React3.createElement(TextField2, {
-    label: "Network",
-    name: "network",
-    onChange: handleChange,
-    required: true,
-    value: network,
-    ...props
-  }), /* @__PURE__ */ React3.createElement(FormHelperText, {
-    sx: {
-      color: error ? "red" : void 0
-    }
-  }, error ? "Not a valid url" : "Enter full url of archivist"));
-}, "ChainTransactionNetwork");
+  };
+  return /* @__PURE__ */ jsxs2(FormControl2, { fullWidth: true, children: [
+    /* @__PURE__ */ jsx2(TextField2, { label: "Network", name: "network", onChange: handleChange, required: true, value: network, ...props }),
+    /* @__PURE__ */ jsx2(FormHelperText, { sx: { color: error ? "red" : void 0 }, children: error ? "Not a valid url" : "Enter full url of archivist" })
+  ] });
+};
 
 // src/components/transactions/submit/SubmitChain.tsx
-import { Alert, Grid, Typography } from "@mui/material";
+import {
+  Alert,
+  Grid,
+  Typography
+} from "@mui/material";
 import { ErrorRender } from "@xylabs/react-error";
 import { FlexGrowCol } from "@xylabs/react-flexbox";
 import { FetchJsonClient } from "@xylabs/sdk-js";
-import { Account, ArchivistInsertQuerySchema, PayloadBuilder, QueryBoundWitnessBuilder } from "@xyo-network/sdk-js";
+import {
+  Account,
+  ArchivistInsertQuerySchema,
+  PayloadBuilder,
+  QueryBoundWitnessBuilder
+} from "@xyo-network/sdk-js";
 import { buildTransaction } from "@xyo-network/xl1-sdk";
-import React4, { useState as useState2 } from "react";
+import { useState as useState2 } from "react";
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var BETA_PENDING_TRANSACTIONS_ARCHIVIST = "https://beta.api.chain.xyo.network/8050fee682a2762f504d5449d8269a6f17f0b693";
 var defaultNetwork = new URL(BETA_PENDING_TRANSACTIONS_ARCHIVIST);
-var SubmitChainTransaction = /* @__PURE__ */ __name(() => {
+var SubmitChainTransaction = () => {
   const [network, setNetwork] = useState2(defaultNetwork);
   const [result, setResult] = useState2();
   const [error, setError] = useState2();
-  const onSubmitTx = /* @__PURE__ */ __name(async (chainTx) => {
+  const onSubmitTx = async (chainTx) => {
     if (network) {
       const randomAccount = await Account.random();
-      const [transactionBoundWitness] = await buildTransaction(chainTx.chain, [], [], randomAccount, chainTx.nbf, chainTx.exp);
-      const insertQuery = new PayloadBuilder({
-        schema: ArchivistInsertQuerySchema
-      }).build();
-      const [queryBoundWitness] = await new QueryBoundWitnessBuilder().payloads([
-        transactionBoundWitness
-      ]).query(insertQuery).signer(randomAccount).build();
-      const response = await new FetchJsonClient().post(network.href, [
-        queryBoundWitness,
-        [
-          insertQuery,
-          transactionBoundWitness,
-          chainTx
-        ]
-      ]);
+      const [transactionBoundWitness] = await buildTransaction(
+        chainTx.chain,
+        [],
+        [],
+        randomAccount,
+        chainTx.nbf,
+        chainTx.exp
+      );
+      const insertQuery = new PayloadBuilder({ schema: ArchivistInsertQuerySchema }).build();
+      const [queryBoundWitness] = await new QueryBoundWitnessBuilder().payloads([transactionBoundWitness]).query(insertQuery).signer(randomAccount).build();
+      const response = await new FetchJsonClient().post(
+        network.href,
+        [queryBoundWitness, [insertQuery, transactionBoundWitness, chainTx]]
+      );
       const envelope = response.data;
       if (!envelope) {
         setError(new Error("Empty response from archivist"));
@@ -196,72 +179,91 @@ var SubmitChainTransaction = /* @__PURE__ */ __name(() => {
         setResult(envelope.data);
       }
     }
-  }, "onSubmitTx");
-  const onNetworkChange = /* @__PURE__ */ __name((url) => {
+  };
+  const onNetworkChange = (url) => {
     setNetwork(url);
-  }, "onNetworkChange");
-  return /* @__PURE__ */ React4.createElement(Grid, {
-    container: true
-  }, /* @__PURE__ */ React4.createElement(Grid, {
-    size: {
-      xs: 12,
-      sm: 6,
-      md: 4
-    }
-  }, /* @__PURE__ */ React4.createElement(FlexGrowCol, {
-    sx: {
-      alignItems: "start",
-      gap: 2
+  };
+  return /* @__PURE__ */ jsx3(Grid, { container: true, children: /* @__PURE__ */ jsx3(
+    Grid,
+    {
+      size: {
+        xs: 12,
+        sm: 6,
+        md: 4
+      },
+      children: /* @__PURE__ */ jsxs3(
+        FlexGrowCol,
+        {
+          sx: {
+            alignItems: "start",
+            gap: 2
+          },
+          children: [
+            /* @__PURE__ */ jsx3(ChainTransactionNetwork, { network, onNetworkChange }),
+            network ? /* @__PURE__ */ jsx3(ChainTransactionBuilder, { onSubmitTx }) : null,
+            result?.[2].length === 0 ? /* @__PURE__ */ jsx3(Alert, { severity: "success", children: "Success" }) : null,
+            error ? /* @__PURE__ */ jsx3(ErrorRender, { error }) : null,
+            result?.[2] && result?.[2].length > 0 ? /* @__PURE__ */ jsx3(ErrorRender, { error: new Error("Failed insert...see result below") }) : null,
+            result ? /* @__PURE__ */ jsxs3(Fragment, { children: [
+              /* @__PURE__ */ jsx3(Typography, { variant: "h6", children: "Result:" }),
+              /* @__PURE__ */ jsx3("pre", { children: JSON.stringify(result, null, 2) })
+            ] }) : null
+          ]
+        }
+      )
     }
-  }, /* @__PURE__ */ React4.createElement(ChainTransactionNetwork, {
-    network,
-    onNetworkChange
-  }), network ? /* @__PURE__ */ React4.createElement(ChainTransactionBuilder, {
-    onSubmitTx
-  }) : null, result?.[2].length === 0 ? /* @__PURE__ */ React4.createElement(Alert, {
-    severity: "success"
-  }, "Success") : null, error ? /* @__PURE__ */ React4.createElement(ErrorRender, {
-    error
-  }) : null, result?.[2] && result?.[2].length > 0 ? /* @__PURE__ */ React4.createElement(ErrorRender, {
-    error: new Error("Failed insert...see result below")
-  }) : null, result ? /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(Typography, {
-    variant: "h6"
-  }, "Result:"), /* @__PURE__ */ React4.createElement("pre", null, JSON.stringify(result, null, 2))) : null)));
-}, "SubmitChainTransaction");
+  ) });
+};
 
 // src/components/transactions/TransactionCountChip.tsx
 import CompareArrowsIcon from "@mui/icons-material/CompareArrows";
 import { Chip, Icon } from "@mui/material";
-import React5, { useMemo } from "react";
-var TransactionCountChip = /* @__PURE__ */ __name(({ transactions, sx, ...props }) => {
+import { useMemo } from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var TransactionCountChip = ({
+  transactions,
+  sx,
+  ...props
+}) => {
   const label = useMemo(() => {
     if (!transactions) return "0";
     return transactions?.length > 10 ? "+10" : transactions.length;
-  }, [
-    transactions
-  ]);
-  return /* @__PURE__ */ React5.createElement(Chip, {
-    avatar: /* @__PURE__ */ React5.createElement(Icon, null, /* @__PURE__ */ React5.createElement(CompareArrowsIcon, null)),
-    label,
-    title: transactions ? `Block contains ${transactions.length} transactions` : void 0,
-    sx: {
-      display: "inline-flex",
-      alignItems: "center",
-      justifyContent: "center",
-      ...sx
-    },
-    ...props
-  });
-}, "TransactionCountChip");
+  }, [transactions]);
+  return /* @__PURE__ */ jsx4(
+    Chip,
+    {
+      avatar: /* @__PURE__ */ jsx4(Icon, { children: /* @__PURE__ */ jsx4(CompareArrowsIcon, {}) }),
+      label,
+      title: transactions ? `Block contains ${transactions.length} transactions` : void 0,
+      sx: {
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        ...sx
+      },
+      ...props
+    }
+  );
+};
 
 // src/components/transactions/TransactionsQuickTipButton.tsx
 import { ContentCopy as ContentCopyIcon, Paid } from "@mui/icons-material";
-import { Alert as Alert2, AlertTitle, Collapse, Snackbar, Typography as Typography2 } from "@mui/material";
+import {
+  Alert as Alert2,
+  AlertTitle,
+  Collapse,
+  Snackbar,
+  Typography as Typography2
+} from "@mui/material";
 import { ErrorRender as ErrorRender2 } from "@xylabs/react-error";
-import { FlexGrowCol as FlexGrowCol2, FlexGrowRow, FlexRow } from "@xylabs/react-flexbox";
+import {
+  FlexGrowCol as FlexGrowCol2,
+  FlexGrowRow,
+  FlexRow
+} from "@xylabs/react-flexbox";
 import { QuickTipButton } from "@xylabs/react-quick-tip-button";
 import { isDefined as isDefined2 } from "@xylabs/sdk-js";
-import React6, { Fragment, useState as useState4 } from "react";
+import { Fragment as Fragment2, useState as useState4 } from "react";
 
 // src/hooks/chain-iterator/useChainIteratorParams.ts
 import { usePromise } from "@xylabs/react-promise";
@@ -269,23 +271,29 @@ import { isHash } from "@xylabs/sdk-js";
 import { assertEx, isDefined } from "@xylabs/sdk-js";
 import { BoundWitnessBuilder } from "@xyo-network/sdk-js";
 import { ConfigZod, isBlockBoundWitness } from "@xyo-network/xl1-sdk";
-var resolveDefinedHead = /* @__PURE__ */ __name(async (head, chainArchivist) => {
-  const [headPayload] = await chainArchivist.get([
-    head
-  ]);
+var resolveDefinedHead = async (head, chainArchivist) => {
+  const [headPayload] = await chainArchivist.get([head]);
   if (headPayload === void 0) {
     const [currentHead] = await new BoundWitnessBuilder().build();
     return currentHead;
   } else {
     return assertEx(isBlockBoundWitness(headPayload) ? headPayload : void 0, () => `Expected a block bound witness: ${JSON.stringify(headPayload)}`);
   }
-}, "resolveDefinedHead");
-var useChainIteratorParams = /* @__PURE__ */ __name(({ chainMap, chainId, head, name }) => {
+};
+var useChainIteratorParams = ({
+  chainMap,
+  chainId,
+  head,
+  name
+}) => {
   return usePromise(async () => {
     if (isDefined(chainMap) && isDefined(chainId) && isHash(head)) {
       const result = await chainMap.get(head);
       const foundResult = assertEx(result, () => `Head not found: ${head}`);
-      const resolvedHead = assertEx(isBlockBoundWitness(foundResult) ? foundResult : void 0, () => `Head is not a boundwitness: ${JSON.stringify(foundResult)}`);
+      const resolvedHead = assertEx(
+        isBlockBoundWitness(foundResult) ? foundResult : void 0,
+        () => `Head is not a boundwitness: ${JSON.stringify(foundResult)}`
+      );
       const config = ConfigZod.parse({});
       config.chain.id = chainId;
       return {
@@ -296,22 +304,15 @@ var useChainIteratorParams = /* @__PURE__ */ __name(({ chainMap, chainId, head,
         name
       };
     }
-  }, [
-    chainMap,
-    chainId,
-    head
-  ]);
-}, "useChainIteratorParams");
+  }, [chainMap, chainId, head]);
+};
 
 // src/hooks/useBaseContext.ts
 import { useState as useState3 } from "react";
-var useBaseContext = /* @__PURE__ */ __name(() => {
-  const [context] = useState3({
-    caches: {},
-    singletons: {}
-  });
+var useBaseContext = () => {
+  const [context] = useState3({ caches: {}, singletons: {} });
   return context;
-}, "useBaseContext");
+};
 
 // src/hooks/useTxsFromBlock.ts
 import { usePromise as usePromise2 } from "@xylabs/react-promise";
@@ -319,26 +320,25 @@ import { usePromise as usePromise2 } from "@xylabs/react-promise";
 // src/helpers/txsFromBlock.ts
 import { HydratedBlockWrapper } from "@xyo-network/chain-wrappers";
 import { PayloadBuilder as PayloadBuilder2 } from "@xyo-network/sdk-js";
-var txsFromBlock = /* @__PURE__ */ __name(async (block) => {
+var txsFromBlock = async (block) => {
   const wrapper = await HydratedBlockWrapper.parse(block);
   const txs = wrapper.transactions;
   const txPayloads = txs.map((tx) => tx.boundWitness);
   return await PayloadBuilder2.hashPairs(txPayloads);
-}, "txsFromBlock");
+};
 
 // src/hooks/useTxsFromBlock.ts
-var useTxsFromBlock = /* @__PURE__ */ __name((block) => {
+var useTxsFromBlock = (block) => {
   return usePromise2(async () => {
     if (block) {
       return await txsFromBlock(block);
     }
-  }, [
-    block
-  ]);
-}, "useTxsFromBlock");
+  }, [block]);
+};
 
 // src/components/transactions/TransactionsQuickTipButton.tsx
-var TransactionsQuickTipButton = /* @__PURE__ */ __name(({ block, ...props }) => {
+import { Fragment as Fragment3, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var TransactionsQuickTipButton = ({ block, ...props }) => {
   const [transactions, transactionsError] = useTxsFromBlock(block);
   const [copied, setCopied] = useState4(false);
   const [closeDialog, setCloseDialog] = useState4(false);
@@ -348,70 +348,76 @@ var TransactionsQuickTipButton = /* @__PURE__ */ __name(({ block, ...props }) =>
     setPreviousTransactionError(transactionsError);
     setCloseDialog(false);
   }
-  const onCopy = /* @__PURE__ */ __name(async (transactionHash) => {
+  const onCopy = async (transactionHash) => {
     await navigator.clipboard.writeText(transactionHash);
     setCopied(true);
     setTimeout(() => {
       setCopied(false);
     }, 5e3);
-  }, "onCopy");
-  return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(QuickTipButton, {
-    Icon: Paid,
-    disabled: transactions?.length === 0,
-    hoverText: `Transaction Count: ${transactions?.length ?? 0}`,
-    disableDialog: transactions?.length === 0,
-    dialogProps: {
-      fullWidth: true,
-      maxWidth: "md"
-    },
-    ...props
-  }, transactions?.length === 0 ? null : /* @__PURE__ */ React6.createElement(FlexGrowCol2, {
-    sx: {
-      gap: 1,
-      alignItems: "stretch"
-    }
-  }, transactions?.map(([_transaction, hash]) => /* @__PURE__ */ React6.createElement(Fragment, {
-    key: hash
-  }, /* @__PURE__ */ React6.createElement(FlexGrowRow, {
-    sx: {
-      gap: 2,
-      justifyContent: "start"
-    }
-  }, /* @__PURE__ */ React6.createElement(ContentCopyIcon, {
-    sx: {
-      cursor: "pointer"
-    },
-    onClick: /* @__PURE__ */ __name(() => void onCopy(hash), "onClick")
-  }), /* @__PURE__ */ React6.createElement(Typography2, {
-    sx: {
-      overflow: "hidden",
-      textOverflow: "ellipsis",
-      whiteSpace: "nowrap"
-    }
-  }, hash)), /* @__PURE__ */ React6.createElement(FlexRow, null, /* @__PURE__ */ React6.createElement(Collapse, {
-    in: copied,
-    unmountOnExit: true
-  }, /* @__PURE__ */ React6.createElement(Alert2, null, /* @__PURE__ */ React6.createElement(AlertTitle, null, "Previous hash copied to clipboard")))))))), /* @__PURE__ */ React6.createElement(Snackbar, {
-    open: open && closeDialog === false,
-    onClose: /* @__PURE__ */ __name(() => setCloseDialog(true), "onClose")
-  }, /* @__PURE__ */ React6.createElement(ErrorRender2, {
-    error: transactionsError,
-    scope: "TransactionsQuickTipButton"
-  })));
-}, "TransactionsQuickTipButton");
+  };
+  return /* @__PURE__ */ jsxs4(Fragment3, { children: [
+    /* @__PURE__ */ jsx5(
+      QuickTipButton,
+      {
+        Icon: Paid,
+        disabled: transactions?.length === 0,
+        hoverText: `Transaction Count: ${transactions?.length ?? 0}`,
+        disableDialog: transactions?.length === 0,
+        dialogProps: { fullWidth: true, maxWidth: "md" },
+        ...props,
+        children: transactions?.length === 0 ? null : /* @__PURE__ */ jsx5(
+          FlexGrowCol2,
+          {
+            sx: {
+              gap: 1,
+              alignItems: "stretch"
+            },
+            children: transactions?.map(([_transaction, hash]) => /* @__PURE__ */ jsxs4(Fragment2, { children: [
+              /* @__PURE__ */ jsxs4(
+                FlexGrowRow,
+                {
+                  sx: {
+                    gap: 2,
+                    justifyContent: "start"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx5(ContentCopyIcon, { sx: { cursor: "pointer" }, onClick: () => void onCopy(hash) }),
+                    /* @__PURE__ */ jsx5(
+                      Typography2,
+                      {
+                        sx: {
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          whiteSpace: "nowrap"
+                        },
+                        children: hash
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx5(FlexRow, { children: /* @__PURE__ */ jsx5(Collapse, { in: copied, unmountOnExit: true, children: /* @__PURE__ */ jsx5(Alert2, { children: /* @__PURE__ */ jsx5(AlertTitle, { children: "Previous hash copied to clipboard" }) }) }) })
+            ] }, hash))
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx5(Snackbar, { open: open && closeDialog === false, onClose: () => setCloseDialog(true), children: /* @__PURE__ */ jsx5(ErrorRender2, { error: transactionsError, scope: "TransactionsQuickTipButton" }) })
+  ] });
+};
 
 // src/components/block/hooks/useAnchorElement.ts
 import { useRef, useState as useState5 } from "react";
-var useAnchorElement = /* @__PURE__ */ __name(() => {
+var useAnchorElement = () => {
   const [anchorEl, setAnchorEl] = useState5(null);
   const anchorRef = useRef(null);
   const open = Boolean(anchorEl);
-  const handleClick = /* @__PURE__ */ __name((event) => {
+  const handleClick = (event) => {
     setAnchorEl(event.currentTarget);
-  }, "handleClick");
-  const handleClose = /* @__PURE__ */ __name(() => {
+  };
+  const handleClose = () => {
     setAnchorEl(null);
-  }, "handleClose");
+  };
   return {
     anchorEl,
     anchorRef,
@@ -419,260 +425,262 @@ var useAnchorElement = /* @__PURE__ */ __name(() => {
     handleClick,
     handleClose
   };
-}, "useAnchorElement");
+};
 
 // src/components/block/hooks/useBlockHeadingEvents.ts
 import { useEvent } from "@xyo-network/react-event";
-var useBlockHeadingEvents = /* @__PURE__ */ __name((...args) => {
+var useBlockHeadingEvents = (...args) => {
   return useEvent(...args);
-}, "useBlockHeadingEvents");
+};
 
 // src/components/block/hooks/useBlockProducer.ts
 import { useMemo as useMemo2 } from "react";
-var useBlockProducer = /* @__PURE__ */ __name((block) => {
+var useBlockProducer = (block) => {
   return useMemo2(() => {
     if (block) {
       const producer = block[0].addresses[0];
       return producer;
     }
-  }, [
-    block
-  ]);
-}, "useBlockProducer");
+  }, [block]);
+};
 
 // src/components/block/hooks/usePayloadCountsFromBlock.ts
 import { useMemo as useMemo3 } from "react";
 
 // src/components/block/helpers/blockProducer.ts
-var blockProducer = /* @__PURE__ */ __name((block) => {
+var blockProducer = (block) => {
   return block.addresses[0];
-}, "blockProducer");
+};
 
 // src/components/block/helpers/buildBlockChainRenderComponent.tsx
-import React7 from "react";
-var buildBlockChainRenderComponent = /* @__PURE__ */ __name(async (context, BlockComponent, blockComponentProps) => {
+import { jsx as jsx6 } from "react/jsx-runtime";
+var buildBlockChainRenderComponent = async (context, BlockComponent, blockComponentProps) => {
   const { block, ...remainingProps } = blockComponentProps;
   const blockTxs = await txsFromBlock(block);
   const txHashes = blockTxs.map(([_, hash]) => hash);
   const item = {
-    child: /* @__PURE__ */ React7.createElement(BlockComponent, {
-      block,
-      transactions: txHashes,
-      ...remainingProps
-    }),
+    child: /* @__PURE__ */ jsx6(
+      BlockComponent,
+      {
+        block,
+        transactions: txHashes,
+        ...remainingProps
+      }
+    ),
     key: block[0].block.toString(),
     block
   };
   return item;
-}, "buildBlockChainRenderComponent");
+};
 
 // src/components/block/helpers/payloadCountsFromBlock.ts
 import { BoundWitnessSchema } from "@xyo-network/boundwitness-model";
 import { isTransactionBoundWitness } from "@xyo-network/xl1-sdk";
-var payloadCountsFromBlock = /* @__PURE__ */ __name(([block, payloads]) => {
+var payloadCountsFromBlock = ([block, payloads]) => {
   const publicPayloads = block.payload_schemas.filter((schema) => schema !== BoundWitnessSchema);
   const transactionHashes = payloads.filter((payload) => isTransactionBoundWitness(payload)).flatMap((payload) => payload.payload_hashes);
   const privateHashes = transactionHashes.filter((hash) => !payloads.some((payload) => payload._hash === hash));
-  return [
-    publicPayloads.length,
-    privateHashes.length
-  ];
-}, "payloadCountsFromBlock");
+  return [publicPayloads.length, privateHashes.length];
+};
 
 // src/components/block/hooks/usePayloadCountsFromBlock.ts
-var usePayloadCountsFromBlock = /* @__PURE__ */ __name((block) => {
+var usePayloadCountsFromBlock = (block) => {
   return useMemo3(() => {
     if (block) {
-      return [
-        ...payloadCountsFromBlock(block),
-        void 0
-      ];
+      return [...payloadCountsFromBlock(block), void 0];
     }
-    return [
-      void 0,
-      void 0,
-      void 0
-    ];
-  }, [
-    block
-  ]);
-}, "usePayloadCountsFromBlock");
+    return [void 0, void 0, void 0];
+  }, [block]);
+};
 
 // src/components/block/LinkedDivider.tsx
 import { Divider, Stack } from "@mui/material";
-import React8 from "react";
-var LinkedDivider = /* @__PURE__ */ __name(() => {
-  return /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement(Stack, {
-    className: "divider-spacer",
-    sx: {
-      justifyContent: "end",
-      width: "50%",
-      height: 24
-    }
-  }, /* @__PURE__ */ React8.createElement(Divider, {
-    className: "divider",
-    orientation: "vertical",
-    flexItem: true,
-    sx: {
-      borderRightWidth: 2,
-      height: 24,
-      transition: "height 1s"
+import { Fragment as Fragment4, jsx as jsx7 } from "react/jsx-runtime";
+var LinkedDivider = () => {
+  return /* @__PURE__ */ jsx7(Fragment4, { children: /* @__PURE__ */ jsx7(
+    Stack,
+    {
+      className: "divider-spacer",
+      sx: {
+        justifyContent: "end",
+        width: "50%",
+        height: 24
+      },
+      children: /* @__PURE__ */ jsx7(
+        Divider,
+        {
+          className: "divider",
+          orientation: "vertical",
+          flexItem: true,
+          sx: {
+            borderRightWidth: 2,
+            height: 24,
+            transition: "height 1s"
+          }
+        }
+      )
     }
-  })));
-}, "LinkedDivider");
+  ) });
+};
 
 // src/components/block/menu/Expanded.tsx
 import { MoreVert } from "@mui/icons-material";
 import { IconButton, Menu } from "@mui/material";
 import { BWJsonMenuItem, BWPreviousHashMenuItem } from "@xyo-network/react-boundwitness-plugin";
-import React9 from "react";
-var BlockMenuExpanded = /* @__PURE__ */ __name(({ block }) => {
-  const { anchorEl, anchorRef, open, handleClick, handleClose } = useAnchorElement();
-  return /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(IconButton, {
-    ref: anchorRef,
-    size: "small",
-    onClick: handleClick
-  }, /* @__PURE__ */ React9.createElement(MoreVert, {
-    fontSize: "inherit"
-  })), /* @__PURE__ */ React9.createElement(Menu, {
-    open,
+import { Fragment as Fragment5, jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
+var BlockMenuExpanded = ({ block }) => {
+  const {
     anchorEl,
-    anchorOrigin: {
-      horizontal: "left",
-      vertical: "bottom"
-    },
-    onClose: handleClose
-  }, /* @__PURE__ */ React9.createElement(BWPreviousHashMenuItem, {
-    boundwitness: block?.[0],
-    dense: true,
-    onDialogClose: handleClose
-  }), /* @__PURE__ */ React9.createElement(BWJsonMenuItem, {
-    boundwitness: block?.[0],
-    dense: true,
-    onDialogClose: handleClose
-  })));
-}, "BlockMenuExpanded");
+    anchorRef,
+    open,
+    handleClick,
+    handleClose
+  } = useAnchorElement();
+  return /* @__PURE__ */ jsxs5(Fragment5, { children: [
+    /* @__PURE__ */ jsx8(IconButton, { ref: anchorRef, size: "small", onClick: handleClick, children: /* @__PURE__ */ jsx8(MoreVert, { fontSize: "inherit" }) }),
+    /* @__PURE__ */ jsxs5(
+      Menu,
+      {
+        open,
+        anchorEl,
+        anchorOrigin: { horizontal: "left", vertical: "bottom" },
+        onClose: handleClose,
+        children: [
+          /* @__PURE__ */ jsx8(BWPreviousHashMenuItem, { boundwitness: block?.[0], dense: true, onDialogClose: handleClose }),
+          /* @__PURE__ */ jsx8(BWJsonMenuItem, { boundwitness: block?.[0], dense: true, onDialogClose: handleClose })
+        ]
+      }
+    )
+  ] });
+};
 
 // src/components/block/ProducerChip.tsx
 import { Chip as Chip2 } from "@mui/material";
-import { EthAddressWrapper, isString, isUndefined, toAddress } from "@xylabs/sdk-js";
+import {
+  EthAddressWrapper,
+  isString,
+  isUndefined,
+  toAddress
+} from "@xylabs/sdk-js";
 import { BlockiesAvatar } from "@xyo-network/xl1-blockies";
-import React11, { useMemo as useMemo4 } from "react";
+import { useMemo as useMemo4 } from "react";
 
 // src/components/block/ChipSkeleton.tsx
 import { Skeleton } from "@mui/material";
-import React10 from "react";
-var ChipSkeleton = /* @__PURE__ */ __name((props) => {
-  return /* @__PURE__ */ React10.createElement(Skeleton, {
-    width: 100,
-    ...props
-  });
-}, "ChipSkeleton");
+import { jsx as jsx9 } from "react/jsx-runtime";
+var ChipSkeleton = (props) => {
+  return /* @__PURE__ */ jsx9(Skeleton, { width: 100, ...props });
+};
 
 // src/components/block/ProducerChip.tsx
-var formatProducerAddress = /* @__PURE__ */ __name((address) => {
+import { jsx as jsx10 } from "react/jsx-runtime";
+var formatProducerAddress = (address) => {
   if (isUndefined(address) || !isString(address)) return void 0;
   const formattedAddress = toAddress(address);
   return EthAddressWrapper.parse(formattedAddress)?.toShortString(4);
-}, "formatProducerAddress");
-var BlockProducerChip = /* @__PURE__ */ __name(({ block, ...props }) => {
+};
+var BlockProducerChip = ({ block, ...props }) => {
   const blockProducer2 = block?.[0].addresses[0];
-  return /* @__PURE__ */ React11.createElement(BlockAddressChip, {
-    address: blockProducer2,
-    toolTipTitle: `Block producer: ${blockProducer2}`,
-    ...props
-  });
-}, "BlockProducerChip");
-var BlockAddressChip = /* @__PURE__ */ __name(({ address, sx, toolTipTitle, ...props }) => {
+  return /* @__PURE__ */ jsx10(BlockAddressChip, { address: blockProducer2, toolTipTitle: `Block producer: ${blockProducer2}`, ...props });
+};
+var BlockAddressChip = ({
+  address,
+  sx,
+  toolTipTitle,
+  ...props
+}) => {
   const shortedBlockProducer = address === void 0 ? null : formatProducerAddress(address);
-  const avatar = useMemo4(() => address === "" ? void 0 : /* @__PURE__ */ React11.createElement(BlockiesAvatar, {
-    blockiesOptions: {
-      seed: address
+  const avatar = useMemo4(() => address === "" ? void 0 : /* @__PURE__ */ jsx10(BlockiesAvatar, { blockiesOptions: { seed: address } }), [address]);
+  return /* @__PURE__ */ jsx10(
+    Chip2,
+    {
+      avatar,
+      label: shortedBlockProducer ?? /* @__PURE__ */ jsx10(ChipSkeleton, { width: 115 }),
+      title: toolTipTitle,
+      sx: {
+        fontFamily: "monospace",
+        cursor: "pointer",
+        ...sx
+      },
+      ...props
     }
-  }), [
-    address
-  ]);
-  return /* @__PURE__ */ React11.createElement(Chip2, {
-    avatar,
-    label: shortedBlockProducer ?? /* @__PURE__ */ React11.createElement(ChipSkeleton, {
-      width: 115
-    }),
-    title: toolTipTitle,
-    sx: {
-      fontFamily: "monospace",
-      cursor: "pointer",
-      ...sx
-    },
-    ...props
-  });
-}, "BlockAddressChip");
+  );
+};
 
 // src/components/block/BlockHeadingFlexbox.tsx
-var BlockHeadingFlexbox = /* @__PURE__ */ __name(({ block, defaultExpanded, transactions }) => {
+import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+var BlockHeadingFlexbox = ({
+  block,
+  defaultExpanded,
+  transactions
+}) => {
   const hash = usePayloadHash(block?.[0]);
   const [blockHeadingRef, blockHeadingListener] = useBlockHeadingEvents();
   const { pollingState } = useChainPollingContext();
   const expanded = pollingState === "paused" || defaultExpanded;
-  const handleTransactionCountClick = /* @__PURE__ */ __name((event, transactions2) => {
+  const handleTransactionCountClick = (event, transactions2) => {
     event.stopPropagation();
     blockHeadingListener("transaction-count", "click", JSON.stringify(transactions2), event.nativeEvent);
-  }, "handleTransactionCountClick");
-  return /* @__PURE__ */ React12.createElement(FlexCol2, {
-    className: "block-heading-flexbox",
-    ref: blockHeadingRef,
-    onClick: /* @__PURE__ */ __name(() => blockHeadingListener("block-hash", "click", hash), "onClick"),
-    sx: {
-      alignItems: "stretch"
-    }
-  }, /* @__PURE__ */ React12.createElement(LinkedDivider, null), /* @__PURE__ */ React12.createElement(HashHeadingPaper, {
-    hash,
-    heading: block?.[0].block === void 0 ? "" : block?.[0].block.toString(),
-    paperProps: {
-      sx: {
-        p: 1,
-        width: "100%"
-      }
-    },
-    AdornmentEnd: /* @__PURE__ */ React12.createElement(FlexRow2, {
-      sx: {
-        gap: 1
-      }
-    }, /* @__PURE__ */ React12.createElement(BlockProducerChip, {
-      block
-    }), /* @__PURE__ */ React12.createElement(TransactionCountChip, {
-      onClick: /* @__PURE__ */ __name((e) => handleTransactionCountClick(e, transactions ?? []), "onClick"),
-      transactions
-    }), /* @__PURE__ */ React12.createElement(BWVerification, {
-      iconColors: true,
-      boundwitness: block?.[0]
-    }), /* @__PURE__ */ React12.createElement("span", {
-      style: {
-        // maxWidth is required for css animation to work and 28px is the width of the icon button
-        display: "flex",
-        transition: "max-width .5s",
-        maxWidth: expanded ? "28px" : 0
-      }
-    }, /* @__PURE__ */ React12.createElement(BlockMenuExpanded, {
-      block
-    }))),
-    identiconProps: {
-      sx: {
-        p: 0.75
-      },
-      size: 18
+  };
+  return /* @__PURE__ */ jsxs6(
+    FlexCol2,
+    {
+      className: "block-heading-flexbox",
+      ref: blockHeadingRef,
+      onClick: () => blockHeadingListener("block-hash", "click", hash),
+      sx: { alignItems: "stretch" },
+      children: [
+        /* @__PURE__ */ jsx11(LinkedDivider, {}),
+        /* @__PURE__ */ jsx11(
+          HashHeadingPaper,
+          {
+            hash,
+            heading: block?.[0].block === void 0 ? "" : block?.[0].block.toString(),
+            paperProps: { sx: { p: 1, width: "100%" } },
+            AdornmentEnd: /* @__PURE__ */ jsxs6(FlexRow2, { sx: { gap: 1 }, children: [
+              /* @__PURE__ */ jsx11(BlockProducerChip, { block }),
+              /* @__PURE__ */ jsx11(
+                TransactionCountChip,
+                {
+                  onClick: (e) => handleTransactionCountClick(e, transactions ?? []),
+                  transactions
+                }
+              ),
+              /* @__PURE__ */ jsx11(BWVerification, { iconColors: true, boundwitness: block?.[0] }),
+              /* @__PURE__ */ jsx11(
+                "span",
+                {
+                  style: {
+                    // maxWidth is required for css animation to work and 28px is the width of the icon button
+                    display: "flex",
+                    transition: "max-width .5s",
+                    maxWidth: expanded ? "28px" : 0
+                  },
+                  children: /* @__PURE__ */ jsx11(BlockMenuExpanded, { block })
+                }
+              )
+            ] }),
+            identiconProps: { sx: { p: 0.75 }, size: 18 }
+          }
+        )
+      ]
     }
-  }));
-}, "BlockHeadingFlexbox");
+  );
+};
 
 // src/components/block/table/cell/BlockNumber.tsx
-import { Link, TableCell, Tooltip, Typography as Typography3 } from "@mui/material";
-import React13 from "react";
+import {
+  Link,
+  TableCell,
+  Tooltip,
+  Typography as Typography3
+} from "@mui/material";
 
 // src/components/block/table/cell/hooks/useLinkedBlockItem.tsx
 import { useEvent as useEvent2 } from "@xyo-network/react-event";
-var useLinkedBlockItem = /* @__PURE__ */ __name((noun, data) => {
+var useLinkedBlockItem = (noun, data) => {
   const [ref, dispatch] = useEvent2();
-  const handleClick = /* @__PURE__ */ __name((event) => {
+  const handleClick = (event) => {
     event.preventDefault();
     event.stopPropagation();
     if (noun === void 0) {
@@ -684,45 +692,39 @@ var useLinkedBlockItem = /* @__PURE__ */ __name((noun, data) => {
     if (!isTextSelected) {
       dispatch(noun, "click", data, event.nativeEvent);
     }
-  }, "handleClick");
-  return [
-    ref,
-    handleClick
-  ];
-}, "useLinkedBlockItem");
+  };
+  return [ref, handleClick];
+};
 
 // src/components/block/table/cell/BlockNumber.tsx
-var BlockNumberTableCell = /* @__PURE__ */ __name(({ block, eventNoun = "block-number", linked, ...props }) => {
+import { jsx as jsx12 } from "react/jsx-runtime";
+var BlockNumberTableCell = ({
+  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, eventNoun = "block-number", linked, ...props }) => {
+  return /* @__PURE__ */ jsx12(BlockNumberTableCellInner, { blockNumber, eventNoun, linked, ...props });
+};
+var BlockNumberTableCellInner = ({
+  blockNumber,
+  eventNoun = "block-number",
+  linked,
+  ...props
+}) => {
   const [ref, handleClick] = useLinkedBlockItem(eventNoun, blockNumber?.toLocaleString());
-  return /* @__PURE__ */ React13.createElement(TableCell, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React13.createElement(Tooltip, {
-    title: `Block Number: ${blockNumber}`
-  }, /* @__PURE__ */ React13.createElement(Typography3, {
-    component: "span",
-    variant: "body1"
-  }, linked ? /* @__PURE__ */ React13.createElement(Link, {
-    onClick: handleClick,
-    sx: {
-      cursor: "pointer"
-    }
-  }, blockNumber) : blockNumber)));
-}, "BlockNumberTableCellInner");
+  return /* @__PURE__ */ jsx12(TableCell, { ref, ...props, children: /* @__PURE__ */ jsx12(Tooltip, { title: `Block Number: ${blockNumber}`, children: /* @__PURE__ */ jsx12(Typography3, { component: "span", variant: "body1", children: linked ? /* @__PURE__ */ jsx12(Link, { onClick: handleClick, sx: { cursor: "pointer" }, children: blockNumber }) : blockNumber }) }) });
+};
 
 // src/components/block/table/cell/Epoch.tsx
-import { Skeleton as Skeleton2, TableCell as TableCell2, Tooltip as Tooltip2, Typography as Typography4 } from "@mui/material";
+import {
+  Skeleton as Skeleton2,
+  TableCell as TableCell2,
+  Tooltip as Tooltip2,
+  Typography as Typography4
+} from "@mui/material";
 import { isDefined as isDefined3 } from "@xylabs/sdk-js";
-import React14 from "react";
 
 // src/components/block/table/cell/helpers/timeFunctions.ts
 var dateFormat = Intl.DateTimeFormat(globalThis.navigator.language ?? "en-US", {
@@ -733,7 +735,7 @@ var dateFormat = Intl.DateTimeFormat(globalThis.navigator.language ?? "en-US", {
   minute: "2-digit",
   second: "2-digit"
 });
-var timeAgo = /* @__PURE__ */ __name((epoch, locale = navigator.language ?? "en-US") => {
+var timeAgo = (epoch, locale = navigator.language ?? "en-US") => {
   const now = Date.now();
   const diffInSeconds = Math.floor((now - epoch) / 1e3);
   const units = [
@@ -776,118 +778,138 @@ var timeAgo = /* @__PURE__ */ __name((epoch, locale = navigator.language ?? "en-
   for (const unit of units) {
     if (Math.abs(diffInSeconds) < unit.max) {
       const value = Math.round(diffInSeconds / unit.value);
-      return new Intl.RelativeTimeFormat(locale, {
-        numeric: "auto"
-      }).format(-value, unit.name);
+      return new Intl.RelativeTimeFormat(locale, { numeric: "auto" }).format(-value, unit.name);
     }
   }
-}, "timeAgo");
+};
 
 // src/components/block/table/cell/Epoch.tsx
-var BlockEpochTableCell = /* @__PURE__ */ __name(({ block, linked, ...props }) => {
+import { jsx as jsx13 } from "react/jsx-runtime";
+var BlockEpochTableCell = ({
+  block,
+  linked,
+  ...props
+}) => {
   const epoch = block?.[0]?.$epoch;
   const dateTime = dateFormat.format(epoch);
   const age = isDefined3(epoch) ? timeAgo(epoch) : void 0;
-  return /* @__PURE__ */ React14.createElement(TableCell2, props, /* @__PURE__ */ React14.createElement(Tooltip2, {
-    title: `Block Epoch: ${dateTime}`
-  }, /* @__PURE__ */ React14.createElement(Typography4, {
-    component: "span",
-    variant: "body1"
-  }, age ?? /* @__PURE__ */ React14.createElement(Skeleton2, {
-    width: 115
-  }))));
-}, "BlockEpochTableCell");
-var BlockEpochTableCellInner = /* @__PURE__ */ __name(({ epoch, linked, ...props }) => {
+  return /* @__PURE__ */ jsx13(TableCell2, { ...props, children: /* @__PURE__ */ jsx13(Tooltip2, { title: `Block Epoch: ${dateTime}`, children: /* @__PURE__ */ jsx13(Typography4, { component: "span", variant: "body1", children: age ?? /* @__PURE__ */ jsx13(Skeleton2, { width: 115 }) }) }) });
+};
+var BlockEpochTableCellInner = ({
+  epoch,
+  linked,
+  ...props
+}) => {
   const dateTime = dateFormat.format(epoch);
   const age = isDefined3(epoch) ? timeAgo(epoch) : void 0;
-  return /* @__PURE__ */ React14.createElement(TableCell2, props, /* @__PURE__ */ React14.createElement(Tooltip2, {
-    title: `Block Epoch: ${dateTime}`
-  }, /* @__PURE__ */ React14.createElement(Typography4, {
-    component: "span",
-    variant: "body1"
-  }, age ?? /* @__PURE__ */ React14.createElement(Skeleton2, {
-    width: 115
-  }))));
-}, "BlockEpochTableCellInner");
+  return /* @__PURE__ */ jsx13(TableCell2, { ...props, children: /* @__PURE__ */ jsx13(Tooltip2, { title: `Block Epoch: ${dateTime}`, children: /* @__PURE__ */ jsx13(Typography4, { component: "span", variant: "body1", children: age ?? /* @__PURE__ */ jsx13(Skeleton2, { width: 115 }) }) }) });
+};
 
 // src/components/block/table/cell/Hash.tsx
-import { Link as Link2, TableCell as TableCell3, Tooltip as Tooltip3 } from "@mui/material";
+import {
+  Link as Link2,
+  TableCell as TableCell3,
+  Tooltip as Tooltip3
+} from "@mui/material";
 import { isHash as isHash2 } from "@xylabs/sdk-js";
 import { usePayloadRootHash } from "@xyo-network/react-shared";
-import React16, { useState as useState6 } from "react";
+import { useState as useState6 } from "react";
 
 // src/components/FeatureNotAvailable.tsx
-import { Button as Button2, Dialog, DialogActions, DialogContent, DialogTitle } from "@mui/material";
-import React15 from "react";
-var FeatureNotAvailable = /* @__PURE__ */ __name(({ featureName = "Feature", ...props }) => /* @__PURE__ */ React15.createElement(Dialog, props, /* @__PURE__ */ React15.createElement(DialogTitle, null, `${featureName} Not Available`), /* @__PURE__ */ React15.createElement(DialogContent, null, "This feature is not currently available.  Either you do not have access to it or it is currently undergoing maintenance."), /* @__PURE__ */ React15.createElement(DialogActions, null, /* @__PURE__ */ React15.createElement(Button2, {
-  onClick: /* @__PURE__ */ __name((e) => props.onClose?.(e, "backdropClick"), "onClick")
-}, "Close"))), "FeatureNotAvailable");
+import {
+  Button as Button2,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle
+} from "@mui/material";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+var FeatureNotAvailable = ({ featureName = "Feature", ...props }) => /* @__PURE__ */ jsxs7(Dialog, { ...props, children: [
+  /* @__PURE__ */ jsx14(DialogTitle, { children: `${featureName} Not Available` }),
+  /* @__PURE__ */ jsx14(DialogContent, { children: "This feature is not currently available.  Either you do not have access to it or it is currently undergoing maintenance." }),
+  /* @__PURE__ */ jsx14(DialogActions, { children: /* @__PURE__ */ jsx14(Button2, { onClick: (e) => props.onClose?.(e, "backdropClick"), children: "Close" }) })
+] });
 
 // src/components/block/table/cell/Hash.tsx
-var BlockHashTableCell = /* @__PURE__ */ __name(({ block, notAvailableDialog, linked, ...props }) => {
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+var BlockHashTableCell = ({
+  block,
+  notAvailableDialog,
+  linked,
+  ...props
+}) => {
   const hash = usePayloadRootHash(block?.[0]);
   const [ref, handleClick] = useLinkedBlockItem("block-hash", hash);
   const [notAvailable, setNotAvailable] = useState6(false);
   const shortenedHash = isHash2(hash) ? `${hash.slice(0, 4)}...${hash.slice(-5, -1)}` : void 0;
-  return /* @__PURE__ */ React16.createElement(TableCell3, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React16.createElement(Tooltip3, {
-    title: `Block Hash: ${hash}`
-  }, linked ? /* @__PURE__ */ React16.createElement(Link2, {
-    sx: {
-      cursor: "pointer"
-    },
-    onClick: linked ? handleClick : () => setNotAvailable(true)
-  }, shortenedHash ?? /* @__PURE__ */ React16.createElement(ChipSkeleton, null)) : /* @__PURE__ */ React16.createElement("span", null, shortenedHash ?? /* @__PURE__ */ React16.createElement(ChipSkeleton, null))), notAvailableDialog && notAvailable ? /* @__PURE__ */ React16.createElement(FeatureNotAvailable, {
-    featureName: "Block Details",
-    open: notAvailable,
-    onClick: /* @__PURE__ */ __name(() => setNotAvailable(false), "onClick")
-  }) : null);
-}, "BlockHashTableCell");
+  return /* @__PURE__ */ jsxs8(TableCell3, { ref, ...props, children: [
+    /* @__PURE__ */ jsx15(Tooltip3, { title: `Block Hash: ${hash}`, children: linked ? /* @__PURE__ */ jsx15(
+      Link2,
+      {
+        sx: { cursor: "pointer" },
+        onClick: linked ? handleClick : () => setNotAvailable(true),
+        children: shortenedHash ?? /* @__PURE__ */ jsx15(ChipSkeleton, {})
+      }
+    ) : /* @__PURE__ */ jsx15("span", { children: shortenedHash ?? /* @__PURE__ */ jsx15(ChipSkeleton, {}) }) }),
+    notAvailableDialog && notAvailable ? /* @__PURE__ */ jsx15(FeatureNotAvailable, { featureName: "Block Details", open: notAvailable, onClick: () => setNotAvailable(false) }) : null
+  ] });
+};
 
 // src/components/block/table/cell/JsonView.tsx
 import { DataObject } from "@mui/icons-material";
-import { Button as Button3, Dialog as Dialog2, DialogActions as DialogActions2, DialogContent as DialogContent2, DialogTitle as DialogTitle2, IconButton as IconButton2, TableCell as TableCell4 } from "@mui/material";
+import {
+  Button as Button3,
+  Dialog as Dialog2,
+  DialogActions as DialogActions2,
+  DialogContent as DialogContent2,
+  DialogTitle as DialogTitle2,
+  IconButton as IconButton2,
+  TableCell as TableCell4
+} from "@mui/material";
 import { FlexRow as FlexRow3 } from "@xylabs/react-flexbox";
 import { ellipsize, isHash as isHash3 } from "@xylabs/sdk-js";
 import { JsonViewerEx } from "@xyo-network/react-payload-raw-info";
 import { usePayloadRootHash as usePayloadRootHash2 } from "@xyo-network/react-shared";
-import React17, { useState as useState7 } from "react";
-var BlockJsonViewTableCell = /* @__PURE__ */ __name(({ block, ...props }) => {
+import { useState as useState7 } from "react";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+var BlockJsonViewTableCell = ({ block, ...props }) => {
   const [open, setOpen] = useState7(false);
-  const onClose = /* @__PURE__ */ __name(() => setOpen(false), "onClose");
+  const onClose = () => setOpen(false);
   const hash = usePayloadRootHash2(block?.[0]);
   const title = isHash3(hash) ? `JSON for ${ellipsize(hash, 5)}` : "JSON";
-  return /* @__PURE__ */ React17.createElement(TableCell4, props, /* @__PURE__ */ React17.createElement(FlexRow3, {
-    onClick: /* @__PURE__ */ __name((e) => e.stopPropagation(), "onClick"),
-    sx: {
-      width: "100%"
-    }
-  }, /* @__PURE__ */ React17.createElement(IconButton2, {
-    onClick: /* @__PURE__ */ __name(() => setOpen(true), "onClick")
-  }, /* @__PURE__ */ React17.createElement(DataObject, null)), /* @__PURE__ */ React17.createElement(Dialog2, {
-    open,
-    onClose
-  }, /* @__PURE__ */ React17.createElement(DialogTitle2, null, title), /* @__PURE__ */ React17.createElement(DialogContent2, null, /* @__PURE__ */ React17.createElement(JsonViewerEx, {
-    value: block
-  })), /* @__PURE__ */ React17.createElement(DialogActions2, {
-    sx: {
-      display: "flex",
-      flexDirection: "row",
-      justifyContent: "end"
-    }
-  }, /* @__PURE__ */ React17.createElement(Button3, {
-    variant: "contained",
-    onClick: onClose
-  }, "Close")))));
-}, "BlockJsonViewTableCell");
+  return /* @__PURE__ */ jsx16(TableCell4, { ...props, children: /* @__PURE__ */ jsxs9(FlexRow3, { onClick: (e) => e.stopPropagation(), sx: { width: "100%" }, children: [
+    /* @__PURE__ */ jsx16(IconButton2, { onClick: () => setOpen(true), children: /* @__PURE__ */ jsx16(DataObject, {}) }),
+    /* @__PURE__ */ jsxs9(Dialog2, { open, onClose, children: [
+      /* @__PURE__ */ jsx16(DialogTitle2, { children: title }),
+      /* @__PURE__ */ jsx16(DialogContent2, { children: /* @__PURE__ */ jsx16(JsonViewerEx, { value: block }) }),
+      /* @__PURE__ */ jsx16(
+        DialogActions2,
+        {
+          sx: {
+            display: "flex",
+            flexDirection: "row",
+            justifyContent: "end"
+          },
+          children: /* @__PURE__ */ jsx16(Button3, { variant: "contained", onClick: onClose, children: "Close" })
+        }
+      )
+    ] })
+  ] }) });
+};
 
 // src/components/block/table/cell/PayloadCounts.tsx
 import { Error as Error2 } from "@mui/icons-material";
-import { Link as Link3, TableCell as TableCell5, Tooltip as Tooltip4 } from "@mui/material";
-import React18 from "react";
-var BlockPayloadCountsTableCell = /* @__PURE__ */ __name(({ block, linked, ...props }) => {
+import {
+  Link as Link3,
+  TableCell as TableCell5,
+  Tooltip as Tooltip4
+} from "@mui/material";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+var BlockPayloadCountsTableCell = ({
+  block,
+  linked,
+  ...props
+}) => {
   const [publicPayloads, privatePayloads, error] = usePayloadCountsFromBlock(block);
   const data = block && privatePayloads !== void 0 && publicPayloads !== void 0 ? {
     publicPayloads,
@@ -896,256 +918,228 @@ var BlockPayloadCountsTableCell = /* @__PURE__ */ __name(({ block, linked, ...pr
   } : void 0;
   const payloadCount = (publicPayloads ?? 0) + (privatePayloads ?? 0);
   const [ref, handleClick] = useLinkedBlockItem("payload-counts", data);
-  return /* @__PURE__ */ React18.createElement(TableCell5, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React18.createElement("span", null, error ? /* @__PURE__ */ React18.createElement(Tooltip4, {
-    title: error.message
-  }, /* @__PURE__ */ React18.createElement(Error2, {
-    sx: {
-      color: "error"
-    }
-  })) : null, linked ? /* @__PURE__ */ React18.createElement(Tooltip4, {
-    title: `Public Payloads: ${publicPayloads ?? "--"} Private Payloads: ${privatePayloads ?? "--"}`
-  }, /* @__PURE__ */ React18.createElement(Link3, {
-    onClick: handleClick,
-    sx: {
-      cursor: "pointer"
-    }
-  }, payloadCount)) : /* @__PURE__ */ React18.createElement(Tooltip4, {
-    title: `Public Payloads: ${publicPayloads ?? "--"} Private Payloads: ${privatePayloads ?? "--"}`
-  }, /* @__PURE__ */ React18.createElement("span", null, payloadCount))));
-}, "BlockPayloadCountsTableCell");
+  return /* @__PURE__ */ jsx17(TableCell5, { ref, ...props, children: /* @__PURE__ */ jsxs10("span", { children: [
+    error ? /* @__PURE__ */ jsx17(Tooltip4, { title: error.message, children: /* @__PURE__ */ jsx17(Error2, { sx: { color: "error" } }) }) : null,
+    linked ? /* @__PURE__ */ jsx17(Tooltip4, { title: `Public Payloads: ${publicPayloads ?? "--"} Private Payloads: ${privatePayloads ?? "--"}`, children: /* @__PURE__ */ jsx17(
+      Link3,
+      {
+        onClick: handleClick,
+        sx: { cursor: "pointer" },
+        children: payloadCount
+      }
+    ) }) : /* @__PURE__ */ jsx17(Tooltip4, { title: `Public Payloads: ${publicPayloads ?? "--"} Private Payloads: ${privatePayloads ?? "--"}`, children: /* @__PURE__ */ jsx17("span", { children: payloadCount }) })
+  ] }) });
+};
 
 // src/components/block/table/cell/Producer.tsx
 import { TableCell as TableCell6, Tooltip as Tooltip5 } from "@mui/material";
-import React19, { useState as useState8 } from "react";
-var BlockProducerTableCell = /* @__PURE__ */ __name(({ block, linked, notAvailableDialog, producerChipProps, ...props }) => {
+import { useState as useState8 } from "react";
+import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+var BlockProducerTableCell = ({
+  block,
+  linked,
+  notAvailableDialog,
+  producerChipProps,
+  ...props
+}) => {
   const [ref, handleClick] = useLinkedBlockItem("block-producer", JSON.stringify(block));
   const producer = useBlockProducer(block);
-  return /* @__PURE__ */ React19.createElement(BlockProducerTableCellInner, {
-    address: producer,
-    handleClick,
-    linked,
-    notAvailableDialog,
-    producerChipProps,
-    ...props,
-    ref
-  });
-}, "BlockProducerTableCell");
-var BlockProducerTableCellInner = /* @__PURE__ */ __name(({ address, handleClick, linked, notAvailableDialog, producerChipProps, ...props }) => {
+  return /* @__PURE__ */ jsx18(
+    BlockProducerTableCellInner,
+    {
+      address: producer,
+      handleClick,
+      linked,
+      notAvailableDialog,
+      producerChipProps,
+      ...props,
+      ref
+    }
+  );
+};
+var BlockProducerTableCellInner = ({
+  address,
+  handleClick,
+  linked,
+  notAvailableDialog,
+  producerChipProps,
+  ...props
+}) => {
   const [notAvailable, setNotAvailable] = useState8(false);
-  return /* @__PURE__ */ React19.createElement(TableCell6, props, /* @__PURE__ */ React19.createElement(Tooltip5, {
-    title: `Block Producer: ${address}`
-  }, /* @__PURE__ */ React19.createElement(BlockAddressChip, {
-    sx: {
-      cursor: "pointer"
-    },
-    onClick: linked ? handleClick : () => setNotAvailable(true),
-    address,
-    toolTipTitle: `Block Producer: ${address}`,
-    ...producerChipProps
-  })), notAvailableDialog && notAvailable ? /* @__PURE__ */ React19.createElement(FeatureNotAvailable, {
-    featureName: "Producer Details",
-    open: notAvailable,
-    onClick: /* @__PURE__ */ __name(() => setNotAvailable(false), "onClick")
-  }) : null);
-}, "BlockProducerTableCellInner");
+  return /* @__PURE__ */ jsxs11(TableCell6, { ...props, children: [
+    /* @__PURE__ */ jsx18(Tooltip5, { title: `Block Producer: ${address}`, children: /* @__PURE__ */ jsx18(
+      BlockAddressChip,
+      {
+        sx: { cursor: "pointer" },
+        onClick: linked ? handleClick : () => setNotAvailable(true),
+        address,
+        toolTipTitle: `Block Producer: ${address}`,
+        ...producerChipProps
+      }
+    ) }),
+    notAvailableDialog && notAvailable ? /* @__PURE__ */ jsx18(FeatureNotAvailable, { featureName: "Producer Details", open: notAvailable, onClick: () => setNotAvailable(false) }) : null
+  ] });
+};
 
 // src/components/block/table/cell/TransactionCount.tsx
 import { Error as Error3 } from "@mui/icons-material";
-import { Link as Link4, TableCell as TableCell7, Tooltip as Tooltip6 } from "@mui/material";
-import React20, { useMemo as useMemo5 } from "react";
-var BlockTransactionCountTableCell = /* @__PURE__ */ __name(({ block, linked, ...props }) => {
+import {
+  Link as Link4,
+  TableCell as TableCell7,
+  Tooltip as Tooltip6
+} from "@mui/material";
+import { useMemo as useMemo5 } from "react";
+import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
+var BlockTransactionCountTableCell = ({
+  block,
+  linked,
+  ...props
+}) => {
   const [transactions, error] = useTxsFromBlock(block);
-  const txHashes = useMemo5(() => transactions?.map(([, hash]) => hash), [
-    transactions
-  ]);
+  const txHashes = useMemo5(() => transactions?.map(([, hash]) => hash), [transactions]);
   const data = block && transactions !== void 0 ? {
     transactions: transactions.length,
     block: block[0]._hash
   } : void 0;
   const [ref, handleClick] = useLinkedBlockItem("transaction-count", data);
-  return /* @__PURE__ */ React20.createElement(TableCell7, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React20.createElement("span", null, error ? /* @__PURE__ */ React20.createElement(Tooltip6, {
-    title: error.message
-  }, /* @__PURE__ */ React20.createElement(Error3, {
-    sx: {
-      color: "error"
-    }
-  })) : null, linked ? /* @__PURE__ */ React20.createElement(Link4, {
-    onClick: handleClick,
-    sx: {
-      cursor: "pointer"
-    }
-  }, txHashes?.length) : txHashes?.length));
-}, "BlockTransactionCountTableCell");
+  return /* @__PURE__ */ jsx19(TableCell7, { ref, ...props, children: /* @__PURE__ */ jsxs12("span", { children: [
+    error ? /* @__PURE__ */ jsx19(Tooltip6, { title: error.message, children: /* @__PURE__ */ jsx19(Error3, { sx: { color: "error" } }) }) : null,
+    linked ? /* @__PURE__ */ jsx19(Link4, { onClick: handleClick, sx: { cursor: "pointer" }, children: txHashes?.length }) : txHashes?.length
+  ] }) });
+};
 
 // src/components/block/table/cell/Verification.tsx
 import { CheckCircleOutlineRounded } from "@mui/icons-material";
 import { TableCell as TableCell8 } from "@mui/material";
 import { FlexRow as FlexRow4 } from "@xylabs/react-flexbox";
 import { BWVerification as BWVerification2 } from "@xyo-network/react-boundwitness-plugin";
-import React21 from "react";
-var BlockVerificationTableCell = /* @__PURE__ */ __name(({ block, linked, deepValidation, ...props }) => {
-  return /* @__PURE__ */ React21.createElement(TableCell8, props, /* @__PURE__ */ React21.createElement(FlexRow4, {
-    onClick: /* @__PURE__ */ __name((e) => e.stopPropagation(), "onClick"),
-    sx: {
-      width: "100%"
-    }
-  }, deepValidation ? /* @__PURE__ */ React21.createElement(BWVerification2, {
-    iconColors: true,
-    boundwitness: block?.[0]
-  }) : /* @__PURE__ */ React21.createElement(CheckCircleOutlineRounded, {
-    color: "success"
-  })));
-}, "BlockVerificationTableCell");
+import { jsx as jsx20 } from "react/jsx-runtime";
+var BlockVerificationTableCell = ({
+  block,
+  linked,
+  deepValidation,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx20(TableCell8, { ...props, children: /* @__PURE__ */ jsx20(FlexRow4, { onClick: (e) => e.stopPropagation(), sx: { width: "100%" }, children: deepValidation ? /* @__PURE__ */ jsx20(BWVerification2, { iconColors: true, boundwitness: block?.[0] }) : /* @__PURE__ */ jsx20(CheckCircleOutlineRounded, { color: "success" }) }) });
+};
 
 // src/components/block/table/Ex.tsx
 import { TableBody } from "@mui/material";
 import { TableEx } from "@xyo-network/react-table";
-import React23 from "react";
 
 // src/components/block/table/head/TableHead.tsx
 import { InfoOutlined } from "@mui/icons-material";
-import { TableCell as TableCell9, TableHead, TableRow, Tooltip as Tooltip7, Typography as Typography5 } from "@mui/material";
+import {
+  TableCell as TableCell9,
+  TableHead,
+  TableRow,
+  Tooltip as Tooltip7,
+  Typography as Typography5
+} from "@mui/material";
 import { FlexRow as FlexRow5 } from "@xylabs/react-flexbox";
-import React22 from "react";
-var ToolTipTableCell = /* @__PURE__ */ __name(({ children, align, title, ...props }) => {
-  return /* @__PURE__ */ React22.createElement(TableCell9, {
-    title,
-    ...props
-  }, /* @__PURE__ */ React22.createElement(FlexRow5, {
-    sx: {
-      justifyContent: align
-    }
-  }, /* @__PURE__ */ React22.createElement(Typography5, {
-    variant: "body2"
-  }, children), "\xA0", /* @__PURE__ */ React22.createElement(Tooltip7, {
-    title
-  }, /* @__PURE__ */ React22.createElement(InfoOutlined, {
-    sx: {
-      fontSize: "small"
-    }
-  }))));
-}, "ToolTipTableCell");
-var BlockchainTableHead = /* @__PURE__ */ __name(() => {
-  return /* @__PURE__ */ React22.createElement(TableHead, null, /* @__PURE__ */ React22.createElement(TableRow, null, /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    align: "left",
-    title: "The block number that is included in the block"
-  }, "Block"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    title: "The hash of the block",
-    sx: {
-      width: "20%"
-    }
-  }, "Hash"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    title: "The epoch of the block",
-    sx: {
-      width: "20%"
-    }
-  }, "Epoch"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    align: "left",
-    title: "The address of the block producer that produced the block",
-    sx: {
-      width: "20%"
-    }
-  }, "Block Producer"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    align: "left",
-    title: "Count of transactions that are included in the block"
-  }, "Transactions"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    align: "left",
-    title: "Count of public and private payload counts for the block"
-  }, "Payloads"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    align: "center",
-    title: "The result of the local validation check for the block"
-  }, "Valid"), /* @__PURE__ */ React22.createElement(ToolTipTableCell, {
-    align: "center",
-    title: "Link to display the raw JSON of the block"
-  }, "JSON")));
-}, "BlockchainTableHead");
+import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
+var ToolTipTableCell = ({
+  children,
+  align,
+  title,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx21(TableCell9, { title, ...props, children: /* @__PURE__ */ jsxs13(FlexRow5, { sx: { justifyContent: align }, children: [
+    /* @__PURE__ */ jsx21(Typography5, { variant: "body2", children }),
+    "\xA0",
+    /* @__PURE__ */ jsx21(Tooltip7, { title, children: /* @__PURE__ */ jsx21(InfoOutlined, { sx: { fontSize: "small" } }) })
+  ] }) });
+};
+var BlockchainTableHead = () => {
+  return /* @__PURE__ */ jsx21(TableHead, { children: /* @__PURE__ */ jsxs13(TableRow, { children: [
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { align: "left", title: "The block number that is included in the block", children: "Block" }),
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { title: "The hash of the block", sx: { width: "20%" }, children: "Hash" }),
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { title: "The epoch of the block", sx: { width: "20%" }, children: "Epoch" }),
+    /* @__PURE__ */ jsx21(
+      ToolTipTableCell,
+      {
+        align: "left",
+        title: "The address of the block producer that produced the block",
+        sx: { width: "20%" },
+        children: "Block Producer"
+      }
+    ),
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { align: "left", title: "Count of transactions that are included in the block", children: "Transactions" }),
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { align: "left", title: "Count of public and private payload counts for the block", children: "Payloads" }),
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { align: "center", title: "The result of the local validation check for the block", children: "Valid" }),
+    /* @__PURE__ */ jsx21(ToolTipTableCell, { align: "center", title: "Link to display the raw JSON of the block", children: "JSON" })
+  ] }) });
+};
 
 // src/components/block/table/Ex.tsx
-var BlockchainTableEx = /* @__PURE__ */ __name(({ ref, children, ...props }) => {
-  return /* @__PURE__ */ React23.createElement(TableEx, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React23.createElement(BlockchainTableHead, null), /* @__PURE__ */ React23.createElement(TableBody, null, children));
-}, "BlockchainTableEx");
+import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
+var BlockchainTableEx = ({
+  ref,
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs14(TableEx, { ref, ...props, children: [
+    /* @__PURE__ */ jsx22(BlockchainTableHead, {}),
+    /* @__PURE__ */ jsx22(TableBody, { children })
+  ] });
+};
 BlockchainTableEx.displayName = "BlockchainTableEx";
 
 // src/components/block/table/row/TableRow.tsx
 import { usePayloadRootHash as usePayloadRootHash3 } from "@xyo-network/react-shared";
-import React24, { useMemo as useMemo6 } from "react";
+import { useMemo as useMemo6 } from "react";
 
 // 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 }) => ({
+var StyledLinkableTableRow = styled(TableRow2, { shouldForwardProp: (prop) => prop !== "linked" })(({ theme, linked }) => ({
   "cursor": linked ? "pointer" : "default",
   "overflowY": "scroll",
-  "&:hover": {
-    backgroundColor: alphaCss(theme.vars.palette.secondary.light, 0.15)
-  }
+  "&: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
-  }), [
-    block,
-    linked
-  ]);
-  const defaultTableCellProps = useMemo6(() => ({
-    block
-  }), [
-    block
-  ]);
+import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
+var BlockChainTableRow = ({
+  block,
+  deepValidation,
+  defaultExpanded,
+  linked,
+  ...props
+}) => {
+  const linkedTableCellProps = useMemo6(() => ({ block, linked }), [block, linked]);
+  const defaultTableCellProps = useMemo6(() => ({ block }), [block]);
   const hash = usePayloadRootHash3(block?.[0]);
   const [ref, handleClick] = useLinkedBlockItem("block-hash", hash);
-  return /* @__PURE__ */ React24.createElement(StyledLinkableTableRow, {
-    onClick: linked ? handleClick : void 0,
-    ref,
-    linked,
-    ...props
-  }, /* @__PURE__ */ React24.createElement(BlockNumberTableCell, {
-    align: "left",
-    ...linkedTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockHashTableCell, {
-    align: "left",
-    ...linkedTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockEpochTableCell, {
-    align: "left",
-    ...linkedTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockProducerTableCell, {
-    align: "left",
-    ...linkedTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockTransactionCountTableCell, {
-    align: "left",
-    ...linkedTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockPayloadCountsTableCell, {
-    align: "left",
-    ...linkedTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockVerificationTableCell, {
-    deepValidation,
-    ...defaultTableCellProps
-  }), /* @__PURE__ */ React24.createElement(BlockJsonViewTableCell, defaultTableCellProps));
-}, "BlockChainTableRow");
+  return /* @__PURE__ */ jsxs15(
+    StyledLinkableTableRow,
+    {
+      onClick: linked ? handleClick : void 0,
+      ref,
+      linked,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx23(BlockNumberTableCell, { align: "left", ...linkedTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockHashTableCell, { align: "left", ...linkedTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockEpochTableCell, { align: "left", ...linkedTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockProducerTableCell, { align: "left", ...linkedTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockTransactionCountTableCell, { align: "left", ...linkedTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockPayloadCountsTableCell, { align: "left", ...linkedTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockVerificationTableCell, { deepValidation, ...defaultTableCellProps }),
+        /* @__PURE__ */ jsx23(BlockJsonViewTableCell, { ...defaultTableCellProps })
+      ]
+    }
+  );
+};
 
 // src/components/account/table/cell/AddressTableCell.tsx
 import { TableCell as TableCell10, Tooltip as Tooltip8 } from "@mui/material";
-import React25 from "react";
 
 // src/components/account/table/hooks/useLinkedBalanceHistoryItem.tsx
 import { useEvent as useEvent3 } from "@xyo-network/react-event";
-var useLinkedBalanceHistoryItem = /* @__PURE__ */ __name(() => {
+var useLinkedBalanceHistoryItem = () => {
   const [ref, dispatch] = useEvent3();
-  const handleClick = /* @__PURE__ */ __name((event, noun, data) => {
+  const handleClick = (event, noun, data) => {
     event.preventDefault();
     event.stopPropagation();
     if (noun === void 0) {
@@ -1157,92 +1151,96 @@ var useLinkedBalanceHistoryItem = /* @__PURE__ */ __name(() => {
     if (!isTextSelected) {
       dispatch(noun, "click", data, event.nativeEvent);
     }
-  }, "handleClick");
-  return [
-    ref,
-    handleClick
-  ];
-}, "useLinkedBalanceHistoryItem");
+  };
+  return [ref, handleClick];
+};
 
 // src/components/account/table/cell/AddressTableCell.tsx
-var AddressTableCell = /* @__PURE__ */ __name(({ address, eventNoun, linked, toolTipTitle, sx, ...props }) => {
+import { jsx as jsx24 } from "react/jsx-runtime";
+var AddressTableCell = ({
+  address,
+  eventNoun,
+  linked,
+  toolTipTitle,
+  sx,
+  ...props
+}) => {
   const [ref, handleClick] = useLinkedBalanceHistoryItem();
-  return /* @__PURE__ */ React25.createElement(TableCell10, {
-    ref,
-    sx: {
-      cursor: linked ? "pointer" : "default",
-      ...sx
-    },
-    ...props
-  }, /* @__PURE__ */ React25.createElement(Tooltip8, {
-    title: toolTipTitle
-  }, /* @__PURE__ */ React25.createElement(BlockAddressChip, {
-    address,
-    onClick: linked ? (e) => handleClick(e, eventNoun, address) : void 0
-  })));
-}, "AddressTableCell");
+  return /* @__PURE__ */ jsx24(TableCell10, { ref, sx: { cursor: linked ? "pointer" : "default", ...sx }, ...props, children: /* @__PURE__ */ jsx24(Tooltip8, { title: toolTipTitle, children: /* @__PURE__ */ jsx24(BlockAddressChip, { address, onClick: linked ? (e) => handleClick(e, eventNoun, address) : void 0 }) }) });
+};
 
 // src/components/account/table/cell/BlockNumber.tsx
-import { Link as Link5, TableCell as TableCell11, Tooltip as Tooltip9, Typography as Typography6 } from "@mui/material";
-import React26 from "react";
-var BalanceHistoryBlockNumberTableCell = /* @__PURE__ */ __name(({ block, eventNoun = "block-number", linked, ...props }) => {
+import {
+  Link as Link5,
+  TableCell as TableCell11,
+  Tooltip as Tooltip9,
+  Typography as Typography6
+} from "@mui/material";
+import { jsx as jsx25 } from "react/jsx-runtime";
+var BalanceHistoryBlockNumberTableCell = ({
+  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 }) => {
+  return /* @__PURE__ */ jsx25(BalanceHistoryBlockNumberTableCellInner, { blockNumber, eventNoun, linked, ...props });
+};
+var BalanceHistoryBlockNumberTableCellInner = ({
+  blockNumber,
+  eventNoun = "block-number",
+  linked,
+  ...props
+}) => {
   const [ref, handleClick] = useLinkedBalanceHistoryItem();
-  return /* @__PURE__ */ React26.createElement(TableCell11, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React26.createElement(Tooltip9, {
-    title: `Block Number: ${blockNumber}`
-  }, /* @__PURE__ */ React26.createElement(Typography6, {
-    component: "span",
-    variant: "body1"
-  }, linked ? /* @__PURE__ */ React26.createElement(Link5, {
-    onClick: /* @__PURE__ */ __name((e) => handleClick(e, eventNoun, blockNumber?.toString() ?? ""), "onClick"),
-    sx: {
-      cursor: "pointer"
-    }
-  }, blockNumber) : blockNumber)));
-}, "BalanceHistoryBlockNumberTableCellInner");
+  return /* @__PURE__ */ jsx25(TableCell11, { ref, ...props, children: /* @__PURE__ */ jsx25(Tooltip9, { title: `Block Number: ${blockNumber}`, children: /* @__PURE__ */ jsx25(Typography6, { component: "span", variant: "body1", children: linked ? /* @__PURE__ */ jsx25(Link5, { onClick: (e) => handleClick(e, eventNoun, blockNumber?.toString() ?? ""), sx: { cursor: "pointer" }, children: blockNumber }) : blockNumber }) }) });
+};
 
 // 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 }) => {
+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 { jsx as jsx26 } from "react/jsx-runtime";
+var HashTableCell = ({
+  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"
-    }
-  }, shortenedHash) : shortenedHash)) : "N/A");
-}, "HashTableCell");
+  return /* @__PURE__ */ jsx26(TableCell12, { ref, ...props, children: hash ? /* @__PURE__ */ jsx26(Tooltip10, { title: toolTipTitle, children: /* @__PURE__ */ jsx26(Typography7, { component: "span", variant: "body1", children: linked ? /* @__PURE__ */ jsx26(Link6, { onClick: (e) => handleClick(e, eventNoun, eventData), sx: { cursor: "pointer" }, children: shortenedHash }) : shortenedHash }) }) : "N/A" });
+};
 
 // src/components/account/table/RawAmountTableCell.tsx
-import { Link as Link7, TableCell as TableCell13, Tooltip as Tooltip11 } 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 { XL1Amount as XL1Amount2 } from "@xyo-network/xl1-sdk";
-import React28 from "react";
-var RawAmountTableCell = /* @__PURE__ */ __name(({ amount, eventNoun = "amount", linked, sx, type, ...props }) => {
+import { jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
+var RawAmountTableCell = ({
+  amount,
+  eventNoun = "amount",
+  linked,
+  sx,
+  type,
+  ...props
+}) => {
   const [ref, handleClick] = useLinkedBalanceHistoryItem();
-  const formatAmount = /* @__PURE__ */ __name((amount2) => {
+  const formatAmount = (amount2) => {
     if (!isDefined5(amount2)) {
       return "N/A";
     }
@@ -1254,73 +1252,61 @@ var RawAmountTableCell = /* @__PURE__ */ __name(({ amount, eventNoun = "amount",
       minDecimals: 1,
       locale: navigator.language
     });
-  }, "formatAmount");
-  return /* @__PURE__ */ React28.createElement(TableCell13, {
-    ref,
-    ...props
-  }, /* @__PURE__ */ React28.createElement(Tooltip11, {
-    title: `Raw Amount: ${amount}`
-  }, 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__ */ React28.createElement("span", null, type === "send" ? "-" : "", formatAmount(amount))));
-}, "RawAmountTableCell");
+  };
+  return /* @__PURE__ */ jsx27(TableCell13, { ref, ...props, children: /* @__PURE__ */ jsx27(Tooltip11, { title: `Raw Amount: ${amount}`, children: linked ? /* @__PURE__ */ jsxs16(Link7, { onClick: (e) => handleClick(e, eventNoun, isDefined5(amount) ? toHex2(amount) : ""), sx: { cursor: "pointer" }, children: [
+    type === "send" ? "-" : "",
+    formatAmount(amount)
+  ] }) : /* @__PURE__ */ jsxs16("span", { children: [
+    type === "send" ? "-" : "",
+    formatAmount(amount)
+  ] }) }) });
+};
 
 // src/components/account/table/BalanceHistoryTableRow.tsx
-var BalanceHistoryTableRow = /* @__PURE__ */ __name(({ linked, row, ...props }) => {
-  const { amount, blockHash, blockNumber, debug, from, key, timestamp, to, type, txHash, transferHash } = row ?? {};
-  const linkedTableCallProps = useMemo7(() => ({
-    linked
-  }), [
-    linked
-  ]);
+import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
+var BalanceHistoryTableRow = ({
+  linked,
+  row,
+  ...props
+}) => {
+  const {
+    amount,
+    blockHash,
+    blockNumber,
+    debug,
+    from,
+    key,
+    timestamp,
+    to,
+    type,
+    txHash,
+    transferHash
+  } = row ?? {};
+  const linkedTableCallProps = useMemo7(() => ({ linked }), [linked]);
   const [ref, handleClick] = useLinkedBalanceHistoryItem();
   const noun = isDefined6(txHash) ? "tx-hash|transfer-hash" : "block-hash|transfer-hash";
   const data = isDefined6(txHash) ? `${txHash}|${transferHash}` : `${blockHash}|${transferHash}`;
-  return /* @__PURE__ */ React29.createElement(StyledLinkableTableRow, {
-    linked,
-    key,
-    onClick: linked ? (e) => handleClick(e, noun, data) : void 0,
-    ref,
-    ...props
-  }, /* @__PURE__ */ React29.createElement(HashTableCell, {
-    hash: txHash,
-    toolTipTitle: `Transaction Hash: ${txHash}`,
-    eventNoun: "tx-hash",
-    ...linkedTableCallProps
-  }), /* @__PURE__ */ React29.createElement(BalanceHistoryBlockNumberTableCellInner, {
-    blockNumber,
-    eventNoun: "block-number",
-    ...linkedTableCallProps
-  }), /* @__PURE__ */ React29.createElement(BlockEpochTableCellInner, {
-    epoch: timestamp,
-    ...linkedTableCallProps
-  }), /* @__PURE__ */ React29.createElement(AddressTableCell, {
-    address: from,
-    toolTipTitle: `From Address: ${from}`,
-    eventNoun: "from-address",
-    ...linkedTableCallProps
-  }), /* @__PURE__ */ React29.createElement(AddressTableCell, {
-    address: to,
-    toolTipTitle: `To Address: ${to}`,
-    eventNoun: "to-address",
-    ...linkedTableCallProps
-  }), /* @__PURE__ */ React29.createElement(RawAmountTableCell, {
-    amount,
-    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");
+  return /* @__PURE__ */ jsxs17(
+    StyledLinkableTableRow,
+    {
+      linked,
+      onClick: linked ? (e) => handleClick(e, noun, data) : void 0,
+      ref,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx28(HashTableCell, { hash: txHash, toolTipTitle: `Transaction Hash: ${txHash}`, eventNoun: "tx-hash", ...linkedTableCallProps }),
+        /* @__PURE__ */ jsx28(BalanceHistoryBlockNumberTableCellInner, { blockNumber, eventNoun: "block-number", ...linkedTableCallProps }),
+        /* @__PURE__ */ jsx28(BlockEpochTableCellInner, { epoch: timestamp, ...linkedTableCallProps }),
+        /* @__PURE__ */ jsx28(AddressTableCell, { address: from, toolTipTitle: `From Address: ${from}`, eventNoun: "from-address", ...linkedTableCallProps }),
+        /* @__PURE__ */ jsx28(AddressTableCell, { address: to, toolTipTitle: `To Address: ${to}`, eventNoun: "to-address", ...linkedTableCallProps }),
+        /* @__PURE__ */ jsx28(RawAmountTableCell, { amount, type, eventNoun: "amount" }),
+        /* @__PURE__ */ jsx28(HashTableCell, { hash: transferHash, toolTipTitle: `Transfer Hash: ${transferHash}`, eventNoun: noun, eventData: data, ...linkedTableCallProps }),
+        /* @__PURE__ */ jsx28(TableCell14, { children: /* @__PURE__ */ jsx28(RawInfoIconButton, { rawValue: debug }) })
+      ]
+    },
+    key
+  );
+};
 
 // src/components/account/table/types/index.ts
 var TableHeadingLabels = [
@@ -1335,55 +1321,60 @@ var TableHeadingLabels = [
 ];
 
 // src/components/account/table/BalanceHistoryTableEx.tsx
-var AccountBalanceHistoryTableEx = /* @__PURE__ */ __name(({ history, linked, ...props }) => {
-  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__ */ React30.createElement(TableBody2, null, history?.map((row) => /* @__PURE__ */ React30.createElement(BalanceHistoryTableRow, {
-    key: row.key,
-    linked,
-    row
-  })))) : null;
-}, "AccountBalanceHistoryTableEx");
+import { jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
+var AccountBalanceHistoryTableEx = ({
+  history,
+  linked,
+  ...props
+}) => {
+  return isDefined7(history) ? /* @__PURE__ */ jsxs18(TableEx2, { ...props, children: [
+    /* @__PURE__ */ jsx29(TableHead2, { children: /* @__PURE__ */ jsx29(TableRow3, { children: TableHeadingLabels.map((heading) => /* @__PURE__ */ jsx29(TableCell15, { children: heading }, heading)) }) }),
+    /* @__PURE__ */ jsx29(TableBody2, { children: history?.map((row) => /* @__PURE__ */ jsx29(BalanceHistoryTableRow, { linked, row }, row.key)) })
+  ] }) : null;
+};
 
 // src/components/account/BalanceHistoryFlexbox.tsx
-var AccountBalanceHistoryFlexBox = /* @__PURE__ */ __name(({ address, refresh, viewer, ...props }) => {
+import { jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
+var AccountBalanceHistoryFlexBox = ({
+  address,
+  refresh,
+  viewer,
+  ...props
+}) => {
   const [results, error] = useAccountBalanceHistory(address, viewer, void 0, void 0, refresh);
-  const { history, balance, truncated } = results || {
-    balance: [
-      AttoXL1(0n),
-      AttoXL1(0n)
-    ],
-    history: void 0
-  };
-  return isDefined8(history) && isDefined8(address) ? /* @__PURE__ */ React31.createElement(FlexCol3, props, /* @__PURE__ */ React31.createElement(ErrorRender3, {
-    error,
-    scope: "AccountBalanceHistoryTable"
-  }), /* @__PURE__ */ React31.createElement(Typography8, {
-    variant: "h6",
-    gutterBottom: true
-  }, formatBalanceMagnitude(balance)), truncated ? /* @__PURE__ */ React31.createElement(Typography8, {
-    variant: "caption",
-    gutterBottom: true
-  }, "Ranged Balance from", " ", history.at(-1).blockNumber, " ", "-", " ", history[0].blockNumber) : null, /* @__PURE__ */ React31.createElement(AccountBalanceHistoryTableEx, {
-    history
-  })) : null;
-}, "AccountBalanceHistoryFlexBox");
+  const {
+    history,
+    balance,
+    truncated
+  } = results || { balance: [AttoXL1(0n), AttoXL1(0n)], history: void 0 };
+  return isDefined8(history) && isDefined8(address) ? /* @__PURE__ */ jsxs19(FlexCol3, { ...props, children: [
+    /* @__PURE__ */ jsx30(ErrorRender3, { error, scope: "AccountBalanceHistoryTable" }),
+    /* @__PURE__ */ jsx30(Typography8, { variant: "h6", gutterBottom: true, children: formatBalanceMagnitude(balance) }),
+    truncated ? /* @__PURE__ */ jsxs19(Typography8, { variant: "caption", gutterBottom: true, children: [
+      "Ranged Balance from",
+      " ",
+      history.at(-1).blockNumber,
+      " ",
+      "-",
+      " ",
+      history[0].blockNumber
+    ] }) : null,
+    /* @__PURE__ */ jsx30(AccountBalanceHistoryTableEx, { history })
+  ] }) : null;
+};
 
 // src/components/account/hooks/usePagedAccountBalanceHistory.ts
 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) => {
+var usePagedAccountBalanceHistory = (address, viewer, maxPage = 1) => {
   const [updatedBlockRange, setUpdatedBlockRange] = useState9();
   const [pagedHistory, setPagedHistory] = useState9();
   const [results, error, loading] = useAccountBalanceHistory2(address, viewer, maxPage, updatedBlockRange);
   const { history, truncated } = results || {};
   const [previousHistory, setPreviousHistory] = useState9(history);
   if (isDefined9(history) && history !== previousHistory) {
-    setPagedHistory([
-      ...pagedHistory ?? [],
-      ...history
-    ]);
+    setPagedHistory([...pagedHistory ?? [], ...history]);
     setPreviousHistory(history);
   }
   const lastBlock = isDefined9(history) ? history.at(-1)?.blockNumber : void 0;
@@ -1391,15 +1382,9 @@ var usePagedAccountBalanceHistory = /* @__PURE__ */ __name((address, viewer, max
   const updateRange = useCallback(() => {
     if (isDefined9(lastBlock) && lastBlock > 0 && truncated) {
       const newEndBlock = lastBlock - 1;
-      setUpdatedBlockRange([
-        0,
-        newEndBlock
-      ]);
+      setUpdatedBlockRange([0, newEndBlock]);
     }
-  }, [
-    lastBlock,
-    truncated
-  ]);
+  }, [lastBlock, truncated]);
   return {
     pagedHistory,
     historyComplete,
@@ -1407,123 +1392,125 @@ var usePagedAccountBalanceHistory = /* @__PURE__ */ __name((address, viewer, max
     error,
     loading
   };
-}, "usePagedAccountBalanceHistory");
+};
 
 // 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 Tooltip12 } from "@mui/material";
+import {
+  Autorenew,
+  Pause
+} from "@mui/icons-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 React36, { memo } from "react";
+import { 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 React34, { useState as useState10 } from "react";
+import {
+  Dialog as Dialog3,
+  DialogContent as DialogContent3,
+  DialogTitle as DialogTitle3,
+  IconButton as IconButton3
+} from "@mui/material";
+import { useState as useState10 } from "react";
 
 // src/components/chain/stats/producer/ProducerFlexbox.tsx
 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 React33, { useMemo as useMemo8 } from "react";
+import { useMemo as useMemo8 } from "react";
 
 // src/components/chain/stats/producer/Table.tsx
-import { Table, TableBody as TableBody3, TableCell as TableCell16, TableHead as TableHead3, TableRow as TableRow4, useTheme } 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/xl1-blockies";
-import React32 from "react";
-var ChainProducerStatsTable = /* @__PURE__ */ __name(({ producers, ...props }) => {
+import { jsx as jsx31, jsxs as jsxs20 } from "react/jsx-runtime";
+var ChainProducerStatsTable = ({ producers, ...props }) => {
   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__ */ React32.createElement(TableCell16, null, /* @__PURE__ */ React32.createElement(BlockiesAvatar2, {
-    blockiesOptions: {
-      seed: producer.address
-    },
-    sx: {
-      height: theme.spacing(2.75),
-      width: theme.spacing(2.75)
-    }
-  })), /* @__PURE__ */ React32.createElement(TableCell16, null, producer.blocksProduced.toString()), /* @__PURE__ */ React32.createElement(TableCell16, null, producer.rewardsEarned.toString())))));
-}, "ChainProducerStatsTable");
+  return /* @__PURE__ */ jsxs20(Table, { ...props, children: [
+    /* @__PURE__ */ jsx31(TableHead3, { children: /* @__PURE__ */ jsxs20(TableRow4, { children: [
+      /* @__PURE__ */ jsx31(TableCell16, { children: "Address" }),
+      /* @__PURE__ */ jsx31(TableCell16, { children: "Blocks Produced" }),
+      /* @__PURE__ */ jsx31(TableCell16, { children: "Rewards Earned Produced" })
+    ] }) }),
+    /* @__PURE__ */ jsx31(TableBody3, { children: producers?.map((producer) => /* @__PURE__ */ jsxs20(TableRow4, { children: [
+      /* @__PURE__ */ jsx31(TableCell16, { children: /* @__PURE__ */ jsx31(BlockiesAvatar2, { blockiesOptions: { seed: producer.address }, sx: { height: theme.spacing(2.75), width: theme.spacing(2.75) } }) }),
+      /* @__PURE__ */ jsx31(TableCell16, { children: producer.blocksProduced.toString() }),
+      /* @__PURE__ */ jsx31(TableCell16, { children: producer.rewardsEarned.toString() })
+    ] }, producer.address)) })
+  ] });
+};
 
 // src/components/chain/stats/producer/ProducerFlexbox.tsx
-var BlockProducerStatsFlexbox = /* @__PURE__ */ __name(({ payload, ...props }) => {
+import { jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
+var BlockProducerStatsFlexbox = ({ payload, ...props }) => {
   const [producer, producerError] = useMemo8(() => {
     if (payload) {
-      return isChainSummaryProducers(payload) ? [
-        payload
-      ] : [
-        void 0,
-        new Error("Payload is not a Chain Producer")
-      ];
+      return isChainSummaryProducers(payload) ? [payload] : [void 0, new Error("Payload is not a Chain Producer")];
     } else {
       return [];
     }
-  }, [
-    payload
-  ]);
-  const producersArray = useMemo8(() => Object.values(producer?.producers ?? {}), [
-    producer
-  ]);
-  return /* @__PURE__ */ React33.createElement(FlexCol4, {
-    ...props,
-    sx: {
-      alignItems: "start",
-      gap: 1
-    }
-  }, /* @__PURE__ */ React33.createElement(ErrorRender4, {
-    error: producerError,
-    scope: "BlockProducerStatsFlexbox"
-  }), /* @__PURE__ */ React33.createElement(Typography9, {
-    sx: {
-      fontSize: "1rem"
+  }, [payload]);
+  const producersArray = useMemo8(() => Object.values(producer?.producers ?? {}), [producer]);
+  return /* @__PURE__ */ jsxs21(
+    FlexCol4,
+    {
+      ...props,
+      sx: { alignItems: "start", gap: 1 },
+      children: [
+        /* @__PURE__ */ jsx32(ErrorRender4, { error: producerError, scope: "BlockProducerStatsFlexbox" }),
+        /* @__PURE__ */ jsx32(Typography9, { sx: { fontSize: "1rem" }, children: "Block Producers" }),
+        /* @__PURE__ */ jsx32(ChainProducerStatsTable, { producers: producersArray })
+      ]
     }
-  }, "Block Producers"), /* @__PURE__ */ React33.createElement(ChainProducerStatsTable, {
-    producers: producersArray
-  }));
-}, "BlockProducerStatsFlexbox");
+  );
+};
 
 // src/components/chain/stats/Dialog.tsx
-var ChainAnalyzerStatsDialog = /* @__PURE__ */ __name((props) => {
+import { Fragment as Fragment6, jsx as jsx33, jsxs as jsxs22 } from "react/jsx-runtime";
+var ChainAnalyzerStatsDialog = (props) => {
   const { analyzers, statsUpdated } = useChainAnalyzersContext();
-  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__ */ React34.createElement(BlockProducerStatsFlexbox, {
-    payload: analyzer.result()
-  }) : null)) : null));
-}, "ChainAnalyzerStatsDialog");
-var ChainAnalyzerStatsDialogFromContext = /* @__PURE__ */ __name((props) => {
+  return /* @__PURE__ */ jsxs22(Dialog3, { ...props, children: [
+    /* @__PURE__ */ jsx33(DialogTitle3, { children: "Chain Analysis" }),
+    /* @__PURE__ */ jsx33(DialogContent3, { children: statsUpdated > 0 ? Object.entries(analyzers).map(([id2, analyzer]) => /* @__PURE__ */ jsx33("div", { children: id2 === "producers" ? /* @__PURE__ */ jsx33(BlockProducerStatsFlexbox, { payload: analyzer.result() }) : null }, id2)) : null })
+  ] });
+};
+var ChainAnalyzerStatsDialogFromContext = (props) => {
   const [open, setOpen] = useState10(false);
-  const handleClose = /* @__PURE__ */ __name(() => setOpen(false), "handleClose");
-  return /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement(IconButton3, {
-    onClick: /* @__PURE__ */ __name(() => setOpen(true), "onClick")
-  }, /* @__PURE__ */ React34.createElement(QueryStats, null)), /* @__PURE__ */ React34.createElement(ChainAnalyzerStatsDialog, {
-    onClose: handleClose,
-    open,
-    ...props
-  }));
-}, "ChainAnalyzerStatsDialogFromContext");
+  const handleClose = () => setOpen(false);
+  return /* @__PURE__ */ jsxs22(Fragment6, { children: [
+    /* @__PURE__ */ jsx33(IconButton3, { onClick: () => setOpen(true), children: /* @__PURE__ */ jsx33(QueryStats, {}) }),
+    /* @__PURE__ */ jsx33(ChainAnalyzerStatsDialog, { onClose: handleClose, open, ...props })
+  ] });
+};
 
 // src/components/chain/controls/PulseSvgIcon.tsx
-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__ */ React35.createElement("g", {
-  transform: "translate(34,34)"
-}, /* @__PURE__ */ React35.createElement("circle", {
-  className: "core",
-  cx: "0",
-  cy: "0",
-  r: "6"
-}), /* @__PURE__ */ React35.createElement("circle", {
-  className: "radar",
-  cx: "0",
-  cy: "0",
-  r: "6"
-}))), "PulseSvgIcon");
+import {
+  createSvgIcon,
+  keyframes,
+  styled as styled2
+} from "@mui/material";
+import { jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
+var PulseSvgIcon = createSvgIcon(
+  /* @__PURE__ */ jsx34("svg", { viewBox: "0 0 80 80", version: "1.1", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxs23("g", { transform: "translate(34,34)", children: [
+    /* @__PURE__ */ jsx34("circle", { className: "core", cx: "0", cy: "0", r: "6" }),
+    /* @__PURE__ */ jsx34("circle", { className: "radar", cx: "0", cy: "0", r: "6" })
+  ] }) }),
+  "PulseSvgIcon"
+);
 var pulse1 = keyframes`
   0% {
     opacity: 0;
@@ -1579,66 +1566,71 @@ var StyledPulseSvgIcon = styled2(PulseSvgIcon)(({ theme }) => {
 });
 
 // src/components/chain/controls/PollingControlsFlexbox.tsx
-var PollingControlsFlexbox = /* @__PURE__ */ __name(({ blocksBehind, pollingState, setPollingState }) => {
+import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
+var PollingControlsFlexbox = ({
+  blocksBehind,
+  pollingState,
+  setPollingState
+}) => {
   const paused = pollingState === "paused";
   const running = pollingState === "running";
-  return /* @__PURE__ */ React36.createElement(FlexRow6, {
-    sx: {
-      justifyContent: "space-between",
-      width: "100%"
-    }
-  }, /* @__PURE__ */ React36.createElement(FlexRow6, {
-    sx: {
-      gap: 2
-    }
-  }, running ? /* @__PURE__ */ React36.createElement(IconButton4, {
-    onClick: /* @__PURE__ */ __name(() => setPollingState?.("paused"), "onClick"),
-    title: "Pause Block Stream"
-  }, /* @__PURE__ */ React36.createElement(Pause, null)) : null, paused ? /* @__PURE__ */ React36.createElement(IconButton4, {
-    onClick: /* @__PURE__ */ __name(() => setPollingState?.("running"), "onClick"),
-    title: "Re-Sync Block Stream"
-  }, /* @__PURE__ */ React36.createElement(Autorenew, null)) : null, /* @__PURE__ */ React36.createElement(ChainAnalyzerStatsDialogFromContext, null)), /* @__PURE__ */ React36.createElement(FlexRow6, {
-    sx: {
-      gap: 2
-    }
-  }, /* @__PURE__ */ React36.createElement(Grow, {
-    in: (blocksBehind ?? 0) > 0
-  }, /* @__PURE__ */ React36.createElement(Tooltip12, {
-    title: "Click to Re-Sync"
-  }, /* @__PURE__ */ React36.createElement(Alert3, {
-    sx: {
-      py: 0,
-      px: 1,
-      cursor: "pointer"
-    },
-    severity: "warning",
-    onClick: /* @__PURE__ */ __name(() => setPollingState?.("running"), "onClick")
-  }, /* @__PURE__ */ React36.createElement(AlertTitle2, {
-    sx: {
-      mb: 0
+  return /* @__PURE__ */ jsxs24(
+    FlexRow6,
+    {
+      sx: {
+        justifyContent: "space-between",
+        width: "100%"
+      },
+      children: [
+        /* @__PURE__ */ jsxs24(FlexRow6, { sx: { gap: 2 }, children: [
+          running ? /* @__PURE__ */ jsx35(IconButton4, { onClick: () => setPollingState?.("paused"), title: "Pause Block Stream", children: /* @__PURE__ */ jsx35(Pause, {}) }) : null,
+          paused ? /* @__PURE__ */ jsx35(IconButton4, { onClick: () => setPollingState?.("running"), title: "Re-Sync Block Stream", children: /* @__PURE__ */ jsx35(Autorenew, {}) }) : null,
+          /* @__PURE__ */ jsx35(ChainAnalyzerStatsDialogFromContext, {})
+        ] }),
+        /* @__PURE__ */ jsxs24(FlexRow6, { sx: { gap: 2 }, children: [
+          /* @__PURE__ */ jsx35(Grow, { in: (blocksBehind ?? 0) > 0, children: /* @__PURE__ */ jsx35(Tooltip12, { title: "Click to Re-Sync", children: /* @__PURE__ */ jsx35(
+            Alert3,
+            {
+              sx: {
+                py: 0,
+                px: 1,
+                cursor: "pointer"
+              },
+              severity: "warning",
+              onClick: () => setPollingState?.("running"),
+              children: /* @__PURE__ */ jsxs24(AlertTitle2, { sx: { mb: 0 }, children: [
+                "Behind:",
+                " ",
+                blocksBehind
+              ] })
+            }
+          ) }) }),
+          /* @__PURE__ */ jsx35(Icon2, { children: /* @__PURE__ */ jsx35(StyledPulseSvgIcon, { className: running ? "" : "paused" }) })
+        ] })
+      ]
     }
-  }, "Behind:", " ", blocksBehind)))), /* @__PURE__ */ React36.createElement(Icon2, null, /* @__PURE__ */ React36.createElement(StyledPulseSvgIcon, {
-    className: running ? "" : "paused"
-  }))));
-}, "PollingControlsFlexbox");
-var MemoizedPollingControlsFlexbox = /* @__PURE__ */ memo(PollingControlsFlexbox);
+  );
+};
+var MemoizedPollingControlsFlexbox = 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 React37 from "react";
-var TransactionsDialog = /* @__PURE__ */ __name(({ onClose, ...props }) => {
-  return /* @__PURE__ */ React37.createElement(Dialog4, {
-    onClose,
-    ...props
-  }, /* @__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")));
-}, "TransactionsDialog");
+import {
+  Button as Button4,
+  Dialog as Dialog4,
+  DialogActions as DialogActions3,
+  DialogContent as DialogContent4
+} from "@mui/material";
+import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
+var TransactionsDialog = ({ onClose, ...props }) => {
+  return /* @__PURE__ */ jsxs25(Dialog4, { onClose, ...props, children: [
+    /* @__PURE__ */ jsx36(DialogContent4, { children: "Transactions Dialog" }),
+    /* @__PURE__ */ jsx36(DialogActions3, { children: /* @__PURE__ */ jsx36(Button4, { variant: "outlined", onClick: (e) => onClose?.(e, "escapeKeyDown"), children: "Close" }) })
+  ] });
+};
 
 // src/components/chain/hooks/useOnBlock.ts
 import { useEffect, useRef as useRef2 } from "react";
-var useOnBlock = /* @__PURE__ */ __name((initialHeadNumber, onAddBlock, liveHead, pollingState) => {
+var useOnBlock = (initialHeadNumber, onAddBlock, liveHead, pollingState) => {
   const blocksWhilePausedRef = useRef2([]);
   const lastLiveHeadRef = useRef2(liveHead);
   useEffect(() => {
@@ -1661,56 +1653,45 @@ var useOnBlock = /* @__PURE__ */ __name((initialHeadNumber, onAddBlock, liveHead
         void onAddBlock(liveHead);
       }
     }
-  }, [
-    initialHeadNumber,
-    liveHead,
-    onAddBlock,
-    pollingState
-  ]);
+  }, [initialHeadNumber, liveHead, onAddBlock, pollingState]);
   return blocksWhilePausedRef;
-}, "useOnBlock");
+};
 
 // src/components/chain/pagination/BlockChainPagination.tsx
 import { TablePaginationActions } from "@xyo-network/react-payload-table";
-import React38 from "react";
-var BlockChainPagination = /* @__PURE__ */ __name(({ count = 0, onPageChange, page, rowsPerPage = 10 }) => {
-  return /* @__PURE__ */ React38.createElement(TablePaginationActions, {
-    count,
-    onPageChange,
-    page,
-    rowsPerPage
-  });
-}, "BlockChainPagination");
+import { jsx as jsx37 } from "react/jsx-runtime";
+var BlockChainPagination = ({
+  count = 0,
+  onPageChange,
+  page,
+  rowsPerPage = 10
+}) => {
+  return /* @__PURE__ */ jsx37(TablePaginationActions, { count, onPageChange, page, rowsPerPage });
+};
 
 // src/components/chain/pagination/hooks/usePagination.tsx
 import { useMemo as useMemo9, useState as useState11 } from "react";
-var useChainPagination = /* @__PURE__ */ __name((pageSize, blockComponents) => {
+var useChainPagination = (pageSize, blockComponents) => {
   const [page, setPage] = useState11(0);
   const paginatedBlockComponents = useMemo9(() => {
     const startIndex = page * pageSize;
     const endIndex = startIndex + pageSize;
     return blockComponents?.slice(startIndex, endIndex);
-  }, [
-    blockComponents,
-    page,
-    pageSize
-  ]);
-  const onPageChange = /* @__PURE__ */ __name((_event, newPage) => {
+  }, [blockComponents, page, pageSize]);
+  const onPageChange = (_event, newPage) => {
     setPage(newPage);
-  }, "onPageChange");
+  };
   return {
     onPageChange,
     page,
     paginatedBlockComponents
   };
-}, "useChainPagination");
+};
 
 // src/components/chain/styled/BlockListWrapperFlexbox.tsx
 import { styled as styled3 } from "@mui/material";
 import { FlexCol as FlexCol5 } from "@xylabs/react-flexbox";
-var BlockListWrapperFlexBox = styled3(FlexCol5, {
-  name: "BlockListWrapperFlexbox"
-})(() => ({
+var BlockListWrapperFlexBox = styled3(FlexCol5, { name: "BlockListWrapperFlexbox" })(() => ({
   "& > div:nth-of-type(2) .block-heading-flexbox .divider-spacer": {
     // hide the spacer for the first element
     visibility: "hidden"
@@ -1725,69 +1706,94 @@ var BlockListWrapperFlexBox = styled3(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 React39, { useState as useState12 } from "react";
-var PayloadBuilderFlexbox = /* @__PURE__ */ __name(({ BuilderComponent, onBuild, ...props }) => {
+import { useState as useState12 } from "react";
+import { jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime";
+var PayloadBuilderFlexbox = ({
+  BuilderComponent,
+  onBuild,
+  ...props
+}) => {
   const [payload, setPayload] = useState12();
-  const onBuildLocal = /* @__PURE__ */ __name((payload2) => {
+  const onBuildLocal = (payload2) => {
     onBuild?.(payload2);
     setPayload(payload2);
-  }, "onBuildLocal");
-  return /* @__PURE__ */ React39.createElement(FlexCol6, {
-    ...props,
-    sx: [
-      {
-        gap: 2
-      },
-      ...Array.isArray(props.sx) ? props.sx : [
-        props.sx
+  };
+  return /* @__PURE__ */ jsxs26(
+    FlexCol6,
+    {
+      ...props,
+      sx: [{ gap: 2 }, ...Array.isArray(props.sx) ? props.sx : [props.sx]],
+      children: [
+        /* @__PURE__ */ jsx38(BuilderComponent, { onBuild: onBuildLocal }),
+        payload ? /* @__PURE__ */ jsx38(JsonViewerEx2, { value: payload }) : null
       ]
-    ]
-  }, /* @__PURE__ */ React39.createElement(BuilderComponent, {
-    onBuild: onBuildLocal
-  }), payload ? /* @__PURE__ */ React39.createElement(JsonViewerEx2, {
-    value: payload
-  }) : null);
-}, "PayloadBuilderFlexbox");
+    }
+  );
+};
 
 // src/components/payload/builder/producer-intent/Form.tsx
 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 React42, { useState as useState15 } from "react";
+import { 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 {
+  FormControl as FormControl3,
+  FormHelperText as FormHelperText2,
+  TextField as TextField3
+} from "@mui/material";
 import { toXL1BlockNumber as toXL1BlockNumber2 } from "@xyo-network/xl1-sdk";
-import React40, { useState as useState13 } from "react";
-var BlockNumberTextField = /* @__PURE__ */ __name(({ errorMessage, onBlockNumberChanged, onChange, ...props }) => {
+import { useState as useState13 } from "react";
+import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
+var BlockNumberTextField = ({
+  errorMessage,
+  onBlockNumberChanged,
+  onChange,
+  ...props
+}) => {
   const [blockNumber, setBlockNumber] = useState13();
-  const handleChange = /* @__PURE__ */ __name((e) => {
+  const handleChange = (e) => {
     const value = e.target.value.replaceAll(/\D/g, "");
     setBlockNumber(value.length > 0 ? Number(value) : void 0);
     onBlockNumberChanged?.(toXL1BlockNumber2(value));
     onChange?.(e);
-  }, "handleChange");
+  };
   const errored = errorMessage !== void 0;
-  return /* @__PURE__ */ React40.createElement(FormControl3, {
-    fullWidth: true
-  }, /* @__PURE__ */ React40.createElement(TextField3, {
-    error: errored,
-    onChange: handleChange,
-    type: "number",
-    value: blockNumber ?? "",
-    ...props
-  }), errored ? /* @__PURE__ */ React40.createElement(FormHelperText2, {
-    sx: {
-      color: "error.main"
-    }
-  }, errorMessage) : null);
-}, "BlockNumberTextField");
+  return /* @__PURE__ */ jsxs27(FormControl3, { fullWidth: true, children: [
+    /* @__PURE__ */ jsx39(
+      TextField3,
+      {
+        error: errored,
+        onChange: handleChange,
+        type: "number",
+        value: blockNumber ?? "",
+        ...props
+      }
+    ),
+    errored ? /* @__PURE__ */ jsx39(FormHelperText2, { sx: { color: "error.main" }, children: errorMessage }) : null
+  ] });
+};
 
 // src/components/payload/fields/XyoAddressTextField.tsx
-import { FormControl as FormControl4, FormHelperText as FormHelperText3, TextField as TextField4 } from "@mui/material";
-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 }) => {
+import {
+  FormControl as FormControl4,
+  FormHelperText as FormHelperText3,
+  TextField as TextField4
+} from "@mui/material";
+import {
+  asAddress,
+  isAddress,
+  isDefined as isDefined10
+} from "@xylabs/sdk-js";
+import { useState as useState14 } from "react";
+import { jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime";
+var XyoAddressTextField = ({
+  onAddressChanged,
+  onChange,
+  resetValue,
+  ...props
+}) => {
   const [address, setAddress] = useState14("");
   const [addressError, setAddressError] = useState14();
   const [previousResetValue, setPreviousResetValue] = useState14(resetValue);
@@ -1795,7 +1801,7 @@ var XyoAddressTextField = /* @__PURE__ */ __name(({ onAddressChanged, onChange,
     setPreviousResetValue(resetValue);
     setAddress("");
   }
-  const handleChange = /* @__PURE__ */ __name((event) => {
+  const handleChange = (event) => {
     const { value } = event.target;
     onChange?.(event);
     const xyoAddress = asAddress(value);
@@ -1808,31 +1814,32 @@ var XyoAddressTextField = /* @__PURE__ */ __name(({ onAddressChanged, onChange,
       setAddressError(new Error("Invalid address"));
     }
     setAddress(value);
-  }, "handleChange");
-  const handleBlur = /* @__PURE__ */ __name(() => {
+  };
+  const handleBlur = () => {
     const xyoAddress = asAddress(address);
     if (!isAddress(xyoAddress)) {
       setAddressError(new Error("Invalid address"));
       onAddressChanged?.();
     }
-  }, "handleBlur");
-  return /* @__PURE__ */ React41.createElement(FormControl4, {
-    fullWidth: true
-  }, /* @__PURE__ */ React41.createElement(TextField4, {
-    error: !!addressError,
-    onBlur: handleBlur,
-    onChange: handleChange,
-    value: address,
-    ...props
-  }), addressError ? /* @__PURE__ */ React41.createElement(FormHelperText3, {
-    sx: {
-      color: "error.main"
-    }
-  }, addressError.message) : null);
-}, "XyoAddressTextField");
+  };
+  return /* @__PURE__ */ jsxs28(FormControl4, { fullWidth: true, children: [
+    /* @__PURE__ */ jsx40(
+      TextField4,
+      {
+        error: !!addressError,
+        onBlur: handleBlur,
+        onChange: handleChange,
+        value: address,
+        ...props
+      }
+    ),
+    addressError ? /* @__PURE__ */ jsx40(FormHelperText3, { sx: { color: "error.main" }, children: addressError.message }) : null
+  ] });
+};
 
 // src/components/payload/builder/producer-intent/Form.tsx
-var ProducerIntentBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
+import { Fragment as Fragment7, jsx as jsx41, jsxs as jsxs29 } from "react/jsx-runtime";
+var ProducerIntentBuilderForm = ({ onBuild }) => {
   const [delegate, setDelegate] = useState15();
   const [exp, setExp] = useState15();
   const [nbf, setNbf] = useState15();
@@ -1849,64 +1856,66 @@ var ProducerIntentBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
         }
       }
     }
-  }, [
-    delegate,
-    exp,
-    nbf
-  ]);
-  const onBuildLocal = /* @__PURE__ */ __name(() => {
+  }, [delegate, exp, nbf]);
+  const onBuildLocal = () => {
     if (onBuild && intentPayload) onBuild?.(intentPayload);
-  }, "onBuildLocal");
-  return /* @__PURE__ */ React42.createElement(React42.Fragment, null, /* @__PURE__ */ React42.createElement(FormControl5, {
-    fullWidth: true
-  }, /* @__PURE__ */ React42.createElement(XyoAddressTextField, {
-    label: "Delegate",
-    name: "delegate",
-    onAddressChanged: setDelegate,
-    required: true,
-    size: "small"
-  })), /* @__PURE__ */ React42.createElement(FormControl5, {
-    fullWidth: true
-  }, /* @__PURE__ */ React42.createElement(BlockNumberTextField, {
-    errorMessage: blockRangeError?.message,
-    label: "Expires",
-    name: "exp",
-    onBlockNumberChanged: setExp,
-    required: true,
-    size: "small"
-  })), /* @__PURE__ */ React42.createElement(FormControl5, {
-    fullWidth: true
-  }, /* @__PURE__ */ React42.createElement(BlockNumberTextField, {
-    errorMessage: blockRangeError?.message,
-    label: "Not Before",
-    name: "nbf",
-    onBlockNumberChanged: setNbf,
-    required: true,
-    size: "small"
-  })), /* @__PURE__ */ React42.createElement(Button5, {
-    disabled: !intentPayload,
-    variant: "contained",
-    onClick: onBuildLocal
-  }, "Build"));
-}, "ProducerIntentBuilderForm");
-
-// src/components/payload/builder/transfer/Flexbox.tsx
-import React45 from "react";
+  };
+  return /* @__PURE__ */ jsxs29(Fragment7, { children: [
+    /* @__PURE__ */ jsx41(FormControl5, { fullWidth: true, children: /* @__PURE__ */ jsx41(XyoAddressTextField, { label: "Delegate", name: "delegate", onAddressChanged: setDelegate, required: true, size: "small" }) }),
+    /* @__PURE__ */ jsx41(FormControl5, { fullWidth: true, children: /* @__PURE__ */ jsx41(
+      BlockNumberTextField,
+      {
+        errorMessage: blockRangeError?.message,
+        label: "Expires",
+        name: "exp",
+        onBlockNumberChanged: setExp,
+        required: true,
+        size: "small"
+      }
+    ) }),
+    /* @__PURE__ */ jsx41(FormControl5, { fullWidth: true, children: /* @__PURE__ */ jsx41(
+      BlockNumberTextField,
+      {
+        errorMessage: blockRangeError?.message,
+        label: "Not Before",
+        name: "nbf",
+        onBlockNumberChanged: setNbf,
+        required: true,
+        size: "small"
+      }
+    ) }),
+    /* @__PURE__ */ jsx41(Button5, { disabled: !intentPayload, variant: "contained", onClick: onBuildLocal, children: "Build" })
+  ] });
+};
 
 // 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 React44, { useMemo as useMemo10, useState as useState17 } from "react";
+import { useMemo as useMemo10, useState as useState17 } from "react";
 
 // src/components/payload/builder/transfer/builder/SingleFlexbox.tsx
 import { RemoveCircle } from "@mui/icons-material";
-import { FormControl as FormControl6, Icon as Icon3, IconButton as IconButton5 } from "@mui/material";
+import {
+  FormControl as FormControl6,
+  Icon as Icon3,
+  IconButton as IconButton5
+} from "@mui/material";
 import { FlexRow as FlexRow7 } from "@xylabs/react-flexbox";
-import { isAddress as isAddress2, isDefinedNotNull, toHex as toHex3 } from "@xylabs/sdk-js";
+import {
+  isAddress as isAddress2,
+  isDefinedNotNull,
+  toHex as toHex3
+} from "@xylabs/sdk-js";
 import { BigIntInput } from "@xyo-network/react-shared";
-import React43, { useEffect as useEffect2, useState as useState16 } from "react";
-var SingleTransferBuilderFlexbox = /* @__PURE__ */ __name(({ onTransferUpdated, onRemoveTransfer, singleTransfer, ...props }) => {
+import { useEffect as useEffect2, useState as useState16 } from "react";
+import { jsx as jsx42, jsxs as jsxs30 } from "react/jsx-runtime";
+var SingleTransferBuilderFlexbox = ({
+  onTransferUpdated,
+  onRemoveTransfer,
+  singleTransfer,
+  ...props
+}) => {
   const [toAddress3, setToAddress] = useState16();
   const [amount, setAmount] = useState16();
   useEffect2(() => {
@@ -1916,46 +1925,27 @@ var SingleTransferBuilderFlexbox = /* @__PURE__ */ __name(({ onTransferUpdated,
       to: toAddress3
     } : void 0;
     if (transferAmount) onTransferUpdated?.(transferAmount);
-  }, [
-    amount,
-    onTransferUpdated,
-    singleTransfer,
-    toAddress3
-  ]);
-  return /* @__PURE__ */ React43.createElement(FlexRow7, {
-    ...props,
-    sx: [
-      {
+  }, [amount, onTransferUpdated, singleTransfer, toAddress3]);
+  return /* @__PURE__ */ jsxs30(
+    FlexRow7,
+    {
+      ...props,
+      sx: [{
         alignItems: "start",
         gap: 1
-      },
-      ...Array.isArray(props.sx) ? props.sx : [
-        props.sx
+      }, ...Array.isArray(props.sx) ? props.sx : [props.sx]],
+      children: [
+        /* @__PURE__ */ jsx42(FormControl6, { fullWidth: true, children: /* @__PURE__ */ jsx42(XyoAddressTextField, { label: "To", name: "to", onAddressChanged: setToAddress, required: true, size: "small" }) }),
+        /* @__PURE__ */ jsx42(FormControl6, { fullWidth: true, children: /* @__PURE__ */ jsx42(BigIntInput.TextField, { label: "Amount", name: "amount", onChangeFixedPoint: setAmount, required: true, size: "small" }) }),
+        /* @__PURE__ */ jsx42(IconButton5, { onClick: () => onRemoveTransfer?.(singleTransfer.transferId), children: /* @__PURE__ */ jsx42(Icon3, { children: /* @__PURE__ */ jsx42(RemoveCircle, {}) }) })
       ]
-    ]
-  }, /* @__PURE__ */ React43.createElement(FormControl6, {
-    fullWidth: true
-  }, /* @__PURE__ */ React43.createElement(XyoAddressTextField, {
-    label: "To",
-    name: "to",
-    onAddressChanged: setToAddress,
-    required: true,
-    size: "small"
-  })), /* @__PURE__ */ React43.createElement(FormControl6, {
-    fullWidth: true
-  }, /* @__PURE__ */ React43.createElement(BigIntInput.TextField, {
-    label: "Amount",
-    name: "amount",
-    onChangeFixedPoint: setAmount,
-    required: true,
-    size: "small"
-  })), /* @__PURE__ */ React43.createElement(IconButton5, {
-    onClick: /* @__PURE__ */ __name(() => onRemoveTransfer?.(singleTransfer.transferId), "onClick")
-  }, /* @__PURE__ */ React43.createElement(Icon3, null, /* @__PURE__ */ React43.createElement(RemoveCircle, null))));
-}, "SingleTransferBuilderFlexbox");
+    }
+  );
+};
 
 // src/components/payload/builder/transfer/Form.tsx
-var TransferBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
+import { Fragment as Fragment8, jsx as jsx43, jsxs as jsxs31 } from "react/jsx-runtime";
+var TransferBuilderForm = ({ onBuild }) => {
   const [fromAddress, setFromAddress] = useState17();
   const [transfers, setTransfers] = useState17([]);
   const [epoch] = useState17(() => Date.now());
@@ -1972,80 +1962,64 @@ var TransferBuilderForm = /* @__PURE__ */ __name(({ onBuild }) => {
         epoch
       };
     }
-  }, [
-    fromAddress,
-    transfers,
-    epoch
-  ]);
-  const onBuildLocal = /* @__PURE__ */ __name(() => {
+  }, [fromAddress, transfers, epoch]);
+  const onBuildLocal = () => {
     if (onBuild && transferPayload) onBuild?.(transferPayload);
-  }, "onBuildLocal");
-  const onTransferAdded = /* @__PURE__ */ __name(() => {
+  };
+  const onTransferAdded = () => {
     const transferAmount = {
       amount: "",
       transferId: Date.now(),
       to: ""
     };
-    setTransfers((prev) => [
-      ...prev,
-      transferAmount
-    ]);
-  }, "onTransferAdded");
-  const onTransferRemoved = /* @__PURE__ */ __name((transferId) => {
+    setTransfers((prev) => [...prev, transferAmount]);
+  };
+  const onTransferRemoved = (transferId) => {
     setTransfers((prev) => prev.filter((transfer) => transfer.transferId !== transferId));
-  }, "onTransferRemoved");
-  const onTransferUpdated = /* @__PURE__ */ __name((singleTransfer) => {
+  };
+  const onTransferUpdated = (singleTransfer) => {
     setTransfers((prev) => prev.map((transfer) => {
       if (transfer.transferId === singleTransfer.transferId) {
         return singleTransfer;
       }
       return transfer;
     }));
-  }, "onTransferUpdated");
-  return /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement(FormControl7, {
-    fullWidth: true
-  }, /* @__PURE__ */ React44.createElement(XyoAddressTextField, {
-    label: "From",
-    name: "from",
-    onAddressChanged: setFromAddress,
-    required: true,
-    size: "small"
-  })), /* @__PURE__ */ React44.createElement(Button6, {
-    onClick: onTransferAdded,
-    size: "small",
-    variant: "contained"
-  }, "Add Transfer"), transfers.map((transfer) => /* @__PURE__ */ React44.createElement(SingleTransferBuilderFlexbox, {
-    key: transfer.transferId,
-    onTransferUpdated,
-    onRemoveTransfer: onTransferRemoved,
-    singleTransfer: transfer,
-    sx: {
-      width: "100%"
-    }
-  })), /* @__PURE__ */ React44.createElement(Button6, {
-    disabled: !transferPayload,
-    variant: "contained",
-    onClick: onBuildLocal
-  }, "Build"));
-}, "TransferBuilderForm");
+  };
+  return /* @__PURE__ */ jsxs31(Fragment8, { children: [
+    /* @__PURE__ */ jsx43(FormControl7, { fullWidth: true, children: /* @__PURE__ */ jsx43(XyoAddressTextField, { label: "From", name: "from", onAddressChanged: setFromAddress, required: true, size: "small" }) }),
+    /* @__PURE__ */ jsx43(Button6, { onClick: onTransferAdded, size: "small", variant: "contained", children: "Add Transfer" }),
+    transfers.map((transfer) => /* @__PURE__ */ jsx43(
+      SingleTransferBuilderFlexbox,
+      {
+        onTransferUpdated,
+        onRemoveTransfer: onTransferRemoved,
+        singleTransfer: transfer,
+        sx: { width: "100%" }
+      },
+      transfer.transferId
+    )),
+    /* @__PURE__ */ jsx43(Button6, { disabled: !transferPayload, variant: "contained", onClick: onBuildLocal, children: "Build" })
+  ] });
+};
 
 // src/components/payload/builder/transfer/Flexbox.tsx
-var TransferBuilderFlexbox = /* @__PURE__ */ __name(({ onBuild, ...props }) => /* @__PURE__ */ React45.createElement(PayloadBuilderFlexbox, {
-  BuilderComponent: TransferBuilderForm,
-  onBuild,
-  ...props,
-  sx: {
-    gap: 4,
-    alignItems: "start"
+import { jsx as jsx44 } from "react/jsx-runtime";
+var TransferBuilderFlexbox = ({ onBuild, ...props }) => /* @__PURE__ */ jsx44(
+  PayloadBuilderFlexbox,
+  {
+    BuilderComponent: TransferBuilderForm,
+    onBuild,
+    ...props,
+    sx: { gap: 4, alignItems: "start" }
   }
-}), "TransferBuilderFlexbox");
+);
 
 // src/components/rate/flexbox/FlexBox.tsx
 import { FlexCol as FlexCol7 } from "@xylabs/react-flexbox";
 import { isDefined as isDefined11 } from "@xylabs/sdk-js";
 
 // src/helpers/rate/rateUnitToLabel.ts
-var rateUnitToLabel = /* @__PURE__ */ __name((rateUnit) => {
+var rateUnitToLabel = (rateUnit) => {
   switch (rateUnit) {
     case "millis": {
       return "b/ms";
@@ -2069,7 +2043,7 @@ var rateUnitToLabel = /* @__PURE__ */ __name((rateUnit) => {
       return rateUnit;
     }
   }
-}, "rateUnitToLabel");
+};
 
 // src/components/rate/SpanTypography.tsx
 import { ViewAgendaOutlined } from "@mui/icons-material";
@@ -2079,7 +2053,16 @@ import { Tooltip as Tooltip13 } 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 }) => {
+import { jsx as jsx45, jsxs as jsxs32 } from "react/jsx-runtime";
+var MetricTypography = ({
+  animationDurationMs = 1e3,
+  disableAnimation,
+  icon,
+  label,
+  metric,
+  sx,
+  ...props
+}) => {
   const [displayValue, setDisplayValue] = useState18(0);
   if (isUndefined2(metric) && displayValue !== 0) {
     setDisplayValue(0);
@@ -2090,7 +2073,7 @@ var MetricTypography = /* @__PURE__ */ __name(({ animationDurationMs = 1e3, disa
     const startTime = Date.now();
     const startValue = 0;
     const endValue = metric;
-    const animate = /* @__PURE__ */ __name(() => {
+    const animate = () => {
       const now = Date.now();
       const elapsed = now - startTime;
       const progress = Math.min(elapsed / duration, 1);
@@ -2100,187 +2083,222 @@ var MetricTypography = /* @__PURE__ */ __name(({ animationDurationMs = 1e3, disa
       if (progress < 1) {
         requestAnimationFrame(animate);
       }
-    }, "animate");
+    };
     globalThis.requestAnimationFrame(animate);
-  }, [
-    animationDurationMs,
-    metric
-  ]);
+  }, [animationDurationMs, metric]);
   const isWholeNumber = metric !== void 0 && Number.isInteger(metric);
   const formattedValue = disableAnimation ? metric : displayValue.toLocaleString(navigator.language, {
     minimumFractionDigits: 0,
     maximumFractionDigits: isWholeNumber ? 0 : 2
   });
-  return /* @__PURE__ */ React.createElement(Typography10, {
-    variant: "h4",
-    ...props,
-    sx: [
-      {
+  return /* @__PURE__ */ jsxs32(
+    Typography10,
+    {
+      variant: "h4",
+      ...props,
+      sx: [{
         mb: 1,
         display: "flex",
         alignItems: "end",
         gap: 0.5
-      },
-      ...Array.isArray(sx) ? sx : sx ? [
-        sx
-      ] : []
-    ]
-  }, /* @__PURE__ */ React.createElement(Icon4, {
-    sx: {
-      fontSize: "large"
-    }
-  }, icon), formattedValue, " ", /* @__PURE__ */ React.createElement(Typography10, {
-    component: "span",
-    variant: "caption",
-    sx: {
-      lineHeight: 1.86
+      }, ...Array.isArray(sx) ? sx : sx ? [sx] : []],
+      children: [
+        /* @__PURE__ */ jsx45(Icon4, { sx: { fontSize: "large" }, children: icon }),
+        formattedValue,
+        " ",
+        /* @__PURE__ */ jsx45(
+          Typography10,
+          {
+            component: "span",
+            variant: "caption",
+            sx: { lineHeight: 1.86 },
+            children: label
+          }
+        )
+      ]
     }
-  }, label));
-}, "MetricTypography");
+  );
+};
 
 // src/components/rate/SpanTypography.tsx
-var BlockRateSpanTypography = /* @__PURE__ */ __name(({ range, span, sx, ...props }) => {
-  return /* @__PURE__ */ React.createElement(Tooltip13, {
-    title: `Block Range: ${range?.join(" - ")}`
-  }, /* @__PURE__ */ React.createElement(MetricTypography, {
-    icon: /* @__PURE__ */ React.createElement(ViewAgendaOutlined, {
-      fontSize: "large"
-    }),
-    metric: span,
-    label: "blocks",
-    ...props
-  }));
-}, "BlockRateSpanTypography");
+import { jsx as jsx46 } from "react/jsx-runtime";
+var BlockRateSpanTypography = ({
+  range,
+  span,
+  sx,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx46(Tooltip13, { title: `Block Range: ${range?.join(" - ")}`, children: /* @__PURE__ */ jsx46(MetricTypography, { icon: /* @__PURE__ */ jsx46(ViewAgendaOutlined, { fontSize: "large" }), metric: span, label: "blocks", ...props }) });
+};
 
 // src/components/rate/SpeedTypography.tsx
 import { SpeedOutlined } from "@mui/icons-material";
-var BlockRateSpeedTypography = /* @__PURE__ */ __name(({ rate, rateUnitLabel, ...props }) => {
-  return /* @__PURE__ */ React.createElement(MetricTypography, {
-    icon: /* @__PURE__ */ React.createElement(SpeedOutlined, {
-      fontSize: "large"
-    }),
-    metric: rate,
-    label: rateUnitLabel,
-    ...props
-  });
-}, "BlockRateSpeedTypography");
+import { jsx as jsx47 } from "react/jsx-runtime";
+var BlockRateSpeedTypography = ({
+  rate,
+  rateUnitLabel,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx47(MetricTypography, { icon: /* @__PURE__ */ jsx47(SpeedOutlined, { fontSize: "large" }), metric: rate, label: rateUnitLabel, ...props });
+};
 
 // src/components/rate/TimeTypography.tsx
 import { TimelapseOutlined } from "@mui/icons-material";
-var BlockRateTimeTypography = /* @__PURE__ */ __name(({ timeUnit, timeDifference, sx, ...props }) => {
-  return /* @__PURE__ */ React.createElement(MetricTypography, {
-    icon: /* @__PURE__ */ React.createElement(TimelapseOutlined, {
-      fontSize: "large"
-    }),
-    metric: timeDifference,
-    label: timeUnit,
-    ...props
-  });
-}, "BlockRateTimeTypography");
+import { jsx as jsx48 } from "react/jsx-runtime";
+var BlockRateTimeTypography = ({
+  timeUnit,
+  timeDifference,
+  sx,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx48(MetricTypography, { icon: /* @__PURE__ */ jsx48(TimelapseOutlined, { fontSize: "large" }), metric: timeDifference, label: timeUnit, ...props });
+};
 
 // src/components/rate/flexbox/FlexBox.tsx
-var BlockRateFlexBox = /* @__PURE__ */ __name(({ blockRate, ...flexBoxProps }) => {
-  const { range, span, rate, timeUnit, timeDifference } = blockRate ?? {};
-  const rateUnitLabel = isDefined11(timeUnit) ? rateUnitToLabel(timeUnit) : "";
-  return /* @__PURE__ */ React.createElement(FlexCol7, {
-    ...flexBoxProps,
-    sx: [
-      {
-        alignItems: "start"
-      },
-      ...Array.isArray(flexBoxProps.sx) ? flexBoxProps.sx : [
-        flexBoxProps.sx
-      ]
-    ]
-  }, /* @__PURE__ */ React.createElement(BlockRateSpeedTypography, {
-    rate,
-    rateUnitLabel
-  }), /* @__PURE__ */ React.createElement(BlockRateSpanTypography, {
+import { jsx as jsx49, jsxs as jsxs33 } from "react/jsx-runtime";
+var BlockRateFlexBox = ({
+  blockRate,
+  ...flexBoxProps
+}) => {
+  const {
     range,
-    span
-  }), /* @__PURE__ */ React.createElement(BlockRateTimeTypography, {
+    span,
+    rate,
     timeUnit,
     timeDifference
-  }));
-}, "BlockRateFlexBox");
+  } = blockRate ?? {};
+  const rateUnitLabel = isDefined11(timeUnit) ? rateUnitToLabel(timeUnit) : "";
+  return /* @__PURE__ */ jsxs33(
+    FlexCol7,
+    {
+      ...flexBoxProps,
+      sx: [{ alignItems: "start" }, ...Array.isArray(flexBoxProps.sx) ? flexBoxProps.sx : [flexBoxProps.sx]],
+      children: [
+        /* @__PURE__ */ jsx49(BlockRateSpeedTypography, { rate, rateUnitLabel }),
+        /* @__PURE__ */ jsx49(BlockRateSpanTypography, { range, span }),
+        /* @__PURE__ */ jsx49(BlockRateTimeTypography, { timeUnit, timeDifference })
+      ]
+    }
+  );
+};
 
 // src/components/rate/gauge/Container.tsx
-import { GaugeContainer, GaugeReferenceArc, GaugeValueArc } from "@mui/x-charts";
+import {
+  GaugeContainer,
+  GaugeReferenceArc,
+  GaugeValueArc
+} from "@mui/x-charts";
 
 // src/components/rate/gauge/helpers/blockRateConversions.ts
 import { isDefined as isDefined12, isUndefined as isUndefined3 } from "@xylabs/sdk-js";
-var toBlocksPerMillisecond = /* @__PURE__ */ __name((rateValue, unit) => {
+var toBlocksPerMillisecond = (rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
     millis: 1,
+    // already in milliseconds
     seconds: 1e3,
+    // 1 second = 1000 milliseconds
     minutes: 6e4,
+    // 1 minute = 60000 milliseconds
     hours: 36e5,
+    // 1 hour = 3600000 milliseconds
     days: 864e5,
+    // 1 day = 86400000 milliseconds
     weeks: 6048e5
+    // 1 week = 604800000 milliseconds
   };
   return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
-}, "toBlocksPerMillisecond");
-var toBlocksPerSecond = /* @__PURE__ */ __name((rateValue, unit) => {
+};
+var toBlocksPerSecond = (rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
     millis: 1e-3,
+    // 1 millisecond = 0.001 seconds
     seconds: 1,
+    // already in seconds
     minutes: 60,
+    // 1 minute = 60 seconds
     hours: 3600,
+    // 1 hour = 3600 seconds
     days: 86400,
+    // 1 day = 86400 seconds
     weeks: 604800
+    // 1 week = 604800 seconds
   };
   return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
-}, "toBlocksPerSecond");
-var toBlocksPerMinute = /* @__PURE__ */ __name((rateValue, unit) => {
+};
+var toBlocksPerMinute = (rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
     millis: 6e4,
+    // 1 minute = 60000 milliseconds
     seconds: 60,
+    // 1 minute = 60 seconds
     minutes: 1,
+    // already in minutes
     hours: 1 / 60,
+    // 1 hour = 60 minutes
     days: 1 / 1440,
+    // 1 day = 1440 minutes
     weeks: 1 / 10080
+    // 1 week = 10080 minutes
   };
   return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
-}, "toBlocksPerMinute");
-var toBlocksPerHour = /* @__PURE__ */ __name((rateValue, unit) => {
+};
+var toBlocksPerHour = (rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
     millis: 36e5,
+    // 1 hour = 3600000 milliseconds
     seconds: 3600,
+    // 1 hour = 3600 seconds
     minutes: 60,
+    // 1 hour = 60 minutes
     hours: 1,
+    // already in hours
     days: 1 / 24,
+    // 1 day = 24 hours
     weeks: 1 / 168
+    // 1 week = 168 hours
   };
   return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
-}, "toBlocksPerHour");
-var toBlocksPerDay = /* @__PURE__ */ __name((rateValue, unit) => {
+};
+var toBlocksPerDay = (rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
     millis: 864e5,
+    // 1 day = 86400000 milliseconds
     seconds: 86400,
+    // 1 day = 86400 seconds
     minutes: 1440,
+    // 1 day = 1440 minutes
     hours: 24,
+    // 1 day = 24 hours
     days: 1,
+    // already in days
     weeks: 1 / 7
+    // 1 week = 7 days
   };
   return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
-}, "toBlocksPerDay");
-var toBlocksPerWeek = /* @__PURE__ */ __name((rateValue, unit) => {
+};
+var toBlocksPerWeek = (rateValue, unit) => {
   if (isUndefined3(unit)) return rateValue;
   const conversions = {
     millis: 6048e5,
+    // 1 week = 604800000 milliseconds
     seconds: 604800,
+    // 1 week = 604800 seconds
     minutes: 10080,
+    // 1 week = 10080 minutes
     hours: 168,
+    // 1 week = 168 hours
     days: 7,
+    // 1 week = 7 days
     weeks: 1
+    // already in weeks
   };
   return rateValue * (isDefined12(conversions[unit]) ? conversions[unit] : 1);
-}, "toBlocksPerWeek");
+};
 var BlockRateConversions = {
   millis: toBlocksPerMillisecond,
   seconds: toBlocksPerSecond,
@@ -2295,10 +2313,16 @@ import { useTheme as useTheme2 } from "@mui/material";
 import { useGaugeState } from "@mui/x-charts/Gauge";
 import { isDefined as isDefined13 } from "@xylabs/sdk-js";
 import { useEffect as useEffect4, useState as useState19 } from "react";
-var GaugePointer = /* @__PURE__ */ __name(({ pointerColor, startAngle = 0 }) => {
+import { jsx as jsx50, jsxs as jsxs34 } from "react/jsx-runtime";
+var GaugePointer = ({ pointerColor, startAngle = 0 }) => {
   const theme = useTheme2();
   const strokeColor = isDefined13(pointerColor) ? pointerColor : theme.palette.error.dark;
-  const { valueAngle, outerRadius, cx, cy } = useGaugeState();
+  const {
+    valueAngle,
+    outerRadius,
+    cx,
+    cy
+  } = useGaugeState();
   const [currentAngle, setCurrentAngle] = useState19(startAngle);
   useEffect4(() => {
     if (valueAngle === null) return;
@@ -2306,7 +2330,7 @@ var GaugePointer = /* @__PURE__ */ __name(({ pointerColor, startAngle = 0 }) =>
     const startTime = Date.now();
     const animationStartAngle = currentAngle;
     const endAngle = valueAngle;
-    const animate = /* @__PURE__ */ __name(() => {
+    const animate = () => {
       const now = Date.now();
       const elapsed = now - startTime;
       const progress = Math.min(elapsed / duration, 1);
@@ -2316,12 +2340,9 @@ var GaugePointer = /* @__PURE__ */ __name(({ pointerColor, startAngle = 0 }) =>
       if (progress < 1) {
         globalThis.requestAnimationFrame(animate);
       }
-    }, "animate");
+    };
     globalThis.requestAnimationFrame(animate);
-  }, [
-    currentAngle,
-    valueAngle
-  ]);
+  }, [currentAngle, valueAngle]);
   if (valueAngle === null) {
     return null;
   }
@@ -2329,27 +2350,41 @@ var GaugePointer = /* @__PURE__ */ __name(({ pointerColor, startAngle = 0 }) =>
     x: cx + outerRadius * Math.sin(currentAngle),
     y: cy - outerRadius * Math.cos(currentAngle)
   };
-  return /* @__PURE__ */ React.createElement("g", {
-    className: "GaugePointer"
-  }, /* @__PURE__ */ React.createElement("circle", {
-    cx,
-    cy,
-    r: 5,
-    fill: strokeColor
-  }), /* @__PURE__ */ React.createElement("path", {
-    d: `M ${cx} ${cy} L ${target.x} ${target.y}`,
-    stroke: strokeColor,
-    strokeWidth: 3
-  }));
-}, "GaugePointer");
+  return /* @__PURE__ */ jsxs34("g", { className: "GaugePointer", children: [
+    /* @__PURE__ */ jsx50("circle", { cx, cy, r: 5, fill: strokeColor }),
+    /* @__PURE__ */ jsx50(
+      "path",
+      {
+        d: `M ${cx} ${cy} L ${target.x} ${target.y}`,
+        stroke: strokeColor,
+        strokeWidth: 3
+      }
+    )
+  ] });
+};
 
 // src/components/rate/gauge/Ticks.tsx
 import { useTheme as useTheme3 } from "@mui/material";
 import { useGaugeState as useGaugeState2 } from "@mui/x-charts/Gauge";
 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 }) => {
+import { jsx as jsx51 } from "react/jsx-runtime";
+var GaugeTicks = ({
+  numTicks = 11,
+  minorTicksPerMajor = 4,
+  majorTickLength = 0.2,
+  minorTickLength = 0.15,
+  majorTickWidth = 2,
+  minorTickWidth = 1,
+  tickColor
+}) => {
   const theme = useTheme3();
-  const { startAngle, endAngle, outerRadius, cx, cy } = useGaugeState2();
+  const {
+    startAngle,
+    endAngle,
+    outerRadius,
+    cx,
+    cy
+  } = useGaugeState2();
   const color = isDefined14(tickColor) ? tickColor : theme.vars.palette.text.secondary;
   if (startAngle === null || endAngle === null) {
     return null;
@@ -2365,16 +2400,21 @@ var GaugeTicks = /* @__PURE__ */ __name(({ numTicks = 11, minorTicksPerMajor = 4
     const y1 = cy - tickStart * Math.cos(angle);
     const x2 = cx + innerRadius * Math.sin(angle);
     const y2 = cy - innerRadius * Math.cos(angle);
-    ticks.push(/* @__PURE__ */ React.createElement("line", {
-      className: `GaugeTick-major-${i}`,
-      key: `major-${i}`,
-      x1,
-      y1,
-      x2,
-      y2,
-      stroke: color,
-      strokeWidth: majorTickWidth
-    }));
+    ticks.push(
+      /* @__PURE__ */ jsx51(
+        "line",
+        {
+          className: `GaugeTick-major-${i}`,
+          x1,
+          y1,
+          x2,
+          y2,
+          stroke: color,
+          strokeWidth: majorTickWidth
+        },
+        `major-${i}`
+      )
+    );
     if (i < numTicks - 1) {
       const angleStep = totalAngle / (numTicks - 1) / (minorTicksPerMajor + 1);
       for (let j = 1; j <= minorTicksPerMajor; j++) {
@@ -2386,61 +2426,82 @@ var GaugeTicks = /* @__PURE__ */ __name(({ numTicks = 11, minorTicksPerMajor = 4
         const my1 = cy - minorTickStart * Math.cos(minorAngle);
         const mx2 = cx + minorInnerRadius * Math.sin(minorAngle);
         const my2 = cy - minorInnerRadius * Math.cos(minorAngle);
-        ticks.push(/* @__PURE__ */ React.createElement("line", {
-          key: `minor-${i}-${j}`,
-          x1: mx1,
-          y1: my1,
-          x2: mx2,
-          y2: my2,
-          stroke: color,
-          strokeWidth: minorTickWidth
-        }));
+        ticks.push(
+          /* @__PURE__ */ jsx51(
+            "line",
+            {
+              x1: mx1,
+              y1: my1,
+              x2: mx2,
+              y2: my2,
+              stroke: color,
+              strokeWidth: minorTickWidth
+            },
+            `minor-${i}-${j}`
+          )
+        );
       }
     }
   }
-  return /* @__PURE__ */ React.createElement("g", {
-    className: "GaugeTicks"
-  }, ticks);
-}, "GaugeTicks");
+  return /* @__PURE__ */ jsx51("g", { className: "GaugeTicks", children: ticks });
+};
 
 // src/components/rate/gauge/Container.tsx
-var BlockRateSpeedGaugeContainer = /* @__PURE__ */ __name(({ blockRate, children, gaugeConfig, startAngle = -110, endAngle = 110, width = 200, height = 150, ...props }) => {
+import { jsx as jsx52, jsxs as jsxs35 } from "react/jsx-runtime";
+var BlockRateSpeedGaugeContainer = ({
+  blockRate,
+  children,
+  gaugeConfig,
+  startAngle = -110,
+  endAngle = 110,
+  width = 200,
+  height = 150,
+  ...props
+}) => {
   const { rate, timeUnit } = blockRate || {};
-  const { targetBlockRate = 5, targetBlockRateUnit = "minutes", targetPosition = 75, showTicks = true } = gaugeConfig || {};
+  const {
+    targetBlockRate = 5,
+    targetBlockRateUnit = "minutes",
+    targetPosition = 75,
+    showTicks = true
+  } = gaugeConfig || {};
   const converter = BlockRateConversions[targetBlockRateUnit];
   const maxGaugeValue = endAngle;
   const blocksPerMinute = rate === void 0 ? 0 : converter(rate, timeUnit);
   const normalizedValue = Math.min(blocksPerMinute / targetBlockRate * targetPosition, maxGaugeValue);
-  return /* @__PURE__ */ React.createElement(GaugeContainer, {
-    startAngle,
-    endAngle,
-    value: normalizedValue,
-    valueMax: endAngle,
-    innerRadius: "95%",
-    outerRadius: "100%",
-    ...props,
-    sx: {
-      width,
-      height
+  return /* @__PURE__ */ jsxs35(
+    GaugeContainer,
+    {
+      startAngle,
+      endAngle,
+      value: normalizedValue,
+      valueMax: endAngle,
+      innerRadius: "95%",
+      outerRadius: "100%",
+      ...props,
+      sx: { width, height },
+      children: [
+        showTicks && /* @__PURE__ */ jsx52(GaugeTicks, {}),
+        /* @__PURE__ */ jsx52(GaugeReferenceArc, {}),
+        /* @__PURE__ */ jsx52(GaugeValueArc, {}),
+        /* @__PURE__ */ jsx52(GaugePointer, { startAngle: -2 }),
+        children
+      ]
     }
-  }, showTicks && /* @__PURE__ */ React.createElement(GaugeTicks, null), /* @__PURE__ */ React.createElement(GaugeReferenceArc, null), /* @__PURE__ */ React.createElement(GaugeValueArc, null), /* @__PURE__ */ React.createElement(GaugePointer, {
-    startAngle: -2
-  }), children);
-}, "BlockRateSpeedGaugeContainer");
+  );
+};
 
 // src/components/rate/gauge/WithLabel.tsx
 import { FlexCol as FlexCol8 } from "@xylabs/react-flexbox";
 import { isDefined as isDefined15 } from "@xylabs/sdk-js";
-var BlockRateSpeedGaugeWithLabel = /* @__PURE__ */ __name(({ blockRate, ...props }) => {
+import { jsx as jsx53, jsxs as jsxs36 } from "react/jsx-runtime";
+var BlockRateSpeedGaugeWithLabel = ({ blockRate, ...props }) => {
   const rateUnitLabel = isDefined15(blockRate?.rate) ? rateUnitToLabel(blockRate?.timeUnit) : "";
-  return /* @__PURE__ */ React.createElement(FlexCol8, null, /* @__PURE__ */ React.createElement(BlockRateSpeedGaugeContainer, {
-    blockRate,
-    ...props
-  }), /* @__PURE__ */ React.createElement(BlockRateSpeedTypography, {
-    rate: blockRate?.rate,
-    rateUnitLabel
-  }));
-}, "BlockRateSpeedGaugeWithLabel");
+  return /* @__PURE__ */ jsxs36(FlexCol8, { children: [
+    /* @__PURE__ */ jsx53(BlockRateSpeedGaugeContainer, { blockRate, ...props }),
+    /* @__PURE__ */ jsx53(BlockRateSpeedTypography, { rate: blockRate?.rate, rateUnitLabel })
+  ] });
+};
 
 // src/stories/ChainArchivistDecorator.tsx
 import { CircularProgress } from "@mui/material";
@@ -2448,44 +2509,33 @@ 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 React46, { useEffect as useEffect5 } from "react";
+import { useEffect as useEffect5 } from "react";
 
 // src/lib/getChainId.ts
 import { toAddress as toAddress2 } from "@xylabs/sdk-js";
 var id = toAddress2("ce080bf3043a40c6c8838c7e813c00ab53df1684");
-var getChainId = /* @__PURE__ */ __name(() => {
+var getChainId = () => {
   return id;
-}, "getChainId");
+};
 
 // src/stories/ChainArchivistDecorator.tsx
-var ChainArchivistDecorator = /* @__PURE__ */ __name((Story, { args, ...context }) => {
+import { jsx as jsx54 } from "react/jsx-runtime";
+var ChainArchivistDecorator = (Story, { args, ...context }) => {
   const [randomBlockChain] = usePromise4(async () => await buildRandomBlockChain(), []);
   const [blockChainRenderProps, blockChainRenderPropsError] = usePromise4(async () => {
     if (randomBlockChain) {
-      const chainArchivist = await MemoryArchivist.create({
-        config: {
-          schema: ArchivistConfigSchema,
-          name: "ChainArchivist"
-        }
-      });
+      const chainArchivist = await MemoryArchivist.create({ config: { schema: ArchivistConfigSchema, name: "ChainArchivist" } });
       const flattened = flattenHydratedBlocks(randomBlockChain);
       await chainArchivist.insert(flattened);
       const chainId = await getChainId();
-      return {
-        chainArchivist,
-        chainId
-      };
+      return { chainArchivist, chainId };
     }
-  }, [
-    randomBlockChain
-  ]);
+  }, [randomBlockChain]);
   useEffect5(() => {
     if (blockChainRenderPropsError) {
       console.error(blockChainRenderPropsError);
     }
-  }, [
-    blockChainRenderPropsError
-  ]);
+  }, [blockChainRenderPropsError]);
   const props = {
     ...context,
     args: {
@@ -2497,8 +2547,8 @@ var ChainArchivistDecorator = /* @__PURE__ */ __name((Story, { args, ...context
       }
     }
   };
-  return blockChainRenderProps?.chainArchivist ? /* @__PURE__ */ React46.createElement(Story, props) : /* @__PURE__ */ React46.createElement(CircularProgress, null);
-}, "ChainArchivistDecorator");
+  return blockChainRenderProps?.chainArchivist ? /* @__PURE__ */ jsx54(Story, { ...props }) : /* @__PURE__ */ jsx54(CircularProgress, {});
+};
 
 // src/stories/ChainArchivistDelayedInsertDecorator.tsx
 import { CircularProgress as CircularProgress2 } from "@mui/material";
@@ -2507,21 +2557,17 @@ 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 React47, { useEffect as useEffect6, useState as useState20 } from "react";
+import { useEffect as useEffect6, useState as useState20 } from "react";
+import { jsx as jsx55 } from "react/jsx-runtime";
 var chainArchivistRef;
-var ChainArchivistDelayedInsertDecorator = /* @__PURE__ */ __name((Story, context) => {
+var ChainArchivistDelayedInsertDecorator = (Story, context) => {
   const [firstBlock, setFirstBlock] = useState20();
   const [randomBlockChain] = usePromise5(async () => await buildRandomBlockChain2(), []);
   const [chainArchivist] = usePromise5(async () => {
     if (chainArchivistRef) {
       return chainArchivistRef;
     } else {
-      chainArchivistRef = await MemoryArchivist2.create({
-        config: {
-          schema: ArchivistConfigSchema2,
-          name: "ChainArchivist"
-        }
-      });
+      chainArchivistRef = await MemoryArchivist2.create({ config: { schema: ArchivistConfigSchema2, name: "ChainArchivist" } });
       return chainArchivistRef;
     }
   }, []);
@@ -2534,26 +2580,16 @@ var ChainArchivistDelayedInsertDecorator = /* @__PURE__ */ __name((Story, contex
         await delay(1e3);
       }
     }
-  }, [
-    chainArchivist,
-    randomBlockChain
-  ]);
+  }, [chainArchivist, randomBlockChain]);
   useEffect6(() => {
     if (delayedInsertError) {
       console.error(delayedInsertError);
     }
-  }, [
-    delayedInsertError
-  ]);
+  }, [delayedInsertError]);
   const [blockChainRenderProps] = usePromise5(async () => {
     const chainId = await getChainId();
-    return {
-      chainArchivist,
-      chainId
-    };
-  }, [
-    chainArchivist
-  ]);
+    return { chainArchivist, chainId };
+  }, [chainArchivist]);
   const { args } = context;
   const props = {
     ...context,
@@ -2566,8 +2602,8 @@ var ChainArchivistDelayedInsertDecorator = /* @__PURE__ */ __name((Story, contex
       }
     }
   };
-  return firstBlock ? /* @__PURE__ */ React47.createElement(Story, props) : /* @__PURE__ */ React47.createElement(CircularProgress2, null);
-}, "ChainArchivistDelayedInsertDecorator");
+  return firstBlock ? /* @__PURE__ */ jsx55(Story, { ...props }) : /* @__PURE__ */ jsx55(CircularProgress2, {});
+};
 export {
   AccountBalanceHistoryFlexBox,
   AccountBalanceHistoryTableEx,
@@ -2644,4 +2680,4 @@ export {
   usePayloadCountsFromBlock,
   useTxsFromBlock
 };
-//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map