@xyo-network/react-chain-boundwitness 1.3.29 → 1.3.31

package/dist/browser/index.mjs

@@ -136,142 +136,224 @@ var BlockBoundWitnessDetails = /* @__PURE__ */ __name(({ block, paper, children,
 }, "BlockBoundWitnessDetails");
 
 // src/components/transactions/card/Card.tsx
-import { Card, CardContent, Grid, Typography as Typography2 } from "@mui/material";
+import { Card, CardContent, Grid, Typography as Typography3 } from "@mui/material";
 import { isUndefined } from "@xylabs/typeof";
 import { bigIntToFixedPointString } from "@xyo-network/chain-utils";
-import React4, { useCallback } from "react";
+import React5, { useMemo as useMemo3 } from "react";
 import { GiReceiveMoney, GiSandsOfTime } from "react-icons/gi";
 import { IoStatsChartOutline } from "react-icons/io5";
 import { MdOutlineAlternateEmail } from "react-icons/md";
 
 // src/components/transactions/card/DetailsStack.tsx
-import { Icon, Stack, styled, Typography } from "@mui/material";
-import React3 from "react";
-var DetailsStack = /* @__PURE__ */ __name(({ IconComponent, heading, children, ...props }) => {
+import { Stack, styled, Tooltip, Typography, useTheme } from "@mui/material";
+import { isDefined } from "@xylabs/typeof";
+import React3, { useMemo as useMemo2 } from "react";
+var DetailsStack = /* @__PURE__ */ __name(({ IconComponent, heading, children, tooltipTitle, ...props }) => {
+  const theme = useTheme();
+  const hasTooltip = isDefined(tooltipTitle);
+  const resolvedIconComponent = useMemo2(() => {
+    return IconComponent ? /* @__PURE__ */ React3.createElement(IconComponent, {
+      style: {
+        /** height and marginTop adjusted to account for font not filling container with line-height: 1 */
+        height: "0.85rem",
+        marginTop: 0.5,
+        marginLeft: theme.spacing(1)
+      }
+    }) : /* @__PURE__ */ React3.createElement(React3.Fragment, null);
+  }, [
+    IconComponent
+  ]);
   return /* @__PURE__ */ React3.createElement(Stack, {
-    direction: "row",
-    mb: 1,
-    gap: 1,
-    ...props
-  }, IconComponent && /* @__PURE__ */ React3.createElement(Icon, {
-    fontSize: "small",
-    sx: {
-      mr: 0.25
-    }
-  }, /* @__PURE__ */ React3.createElement(IconComponent, {
-    style: {
-      height: "0.7em"
-    }
-  })), /* @__PURE__ */ React3.createElement(Stack, {
     direction: "column",
+    flexGrow: 1,
     flexWrap: "wrap",
-    mb: 1
-  }, /* @__PURE__ */ React3.createElement(SectionHeadingTypography, null, heading), children));
+    minWidth: "1px",
+    ...props
+  }, /* @__PURE__ */ React3.createElement(SectionHeadingTypography, null, heading, hasTooltip ? /* @__PURE__ */ React3.createElement(Tooltip, {
+    title: tooltipTitle
+  }, resolvedIconComponent) : resolvedIconComponent), children);
 }, "DetailsStack");
 var SectionHeadingTypography = styled(Typography, {
   name: "SectionHeadingTypography"
 })(({ theme }) => ({
-  display: "inline-flex",
-  alignItems: "baseline",
+  display: "flex",
   fontFamily: "monospace",
-  fontSize: 16,
-  marginBottom: theme.spacing(0.75)
+  lineHeight: 1,
+  marginBottom: theme.spacing(1.5)
 }));
 
-// src/components/transactions/card/Card.tsx
-var TransactionBoundWitnessCard = /* @__PURE__ */ __name(({ wrapper, ...props }) => {
-  if (!wrapper) return null;
-  const formatFee = useCallback((fee) => {
-    if (isUndefined(fee)) return;
-    return bigIntToFixedPointString(fee, 12);
-  }, []);
-  return /* @__PURE__ */ React4.createElement(Card, props, /* @__PURE__ */ React4.createElement(CardContent, {
+// src/components/transactions/card/LabelValueStack.tsx
+import { Stack as Stack2, Typography as Typography2, useTheme as useTheme2 } from "@mui/material";
+import React4 from "react";
+var LabelValueStack = /* @__PURE__ */ __name(({ labels, values, ...props }) => {
+  const theme = useTheme2();
+  return /* @__PURE__ */ React4.createElement(Stack2, {
+    flexDirection: "row",
+    flexGrow: 1,
+    ...props
+  }, /* @__PURE__ */ React4.createElement(Stack2, null, labels.map((label) => /* @__PURE__ */ React4.createElement(Typography2, {
+    fontWeight: "300",
+    key: label,
+    variant: "body2",
+    sx: {
+      borderBottom: `1px solid ${theme.vars?.palette.divider}`,
+      opacity: 0.7
+    }
+  }, label, ":"))), /* @__PURE__ */ React4.createElement(Stack2, {
+    alignItems: "end",
+    flexGrow: 1
+  }, values.map((value) => /* @__PURE__ */ React4.createElement(Typography2, {
+    fontFamily: "monospace",
+    variant: "body2",
+    key: value,
+    width: "100%",
     sx: {
       display: "flex",
-      flexDirection: "row",
-      gap: 2,
-      flexWrap: "wrap"
+      justifyContent: "end",
+      borderBottom: `1px solid ${theme.vars?.palette.divider}`
     }
-  }, /* @__PURE__ */ React4.createElement(Grid, {
+  }, value))));
+}, "LabelValueStack");
+
+// src/components/transactions/card/Card.tsx
+var formatFee = /* @__PURE__ */ __name((fee) => {
+  if (isUndefined(fee)) return;
+  const stringValue = bigIntToFixedPointString(fee, 12);
+  if (stringValue === "0") return "0.0";
+  return stringValue;
+}, "formatFee");
+var TransactionBoundWitnessCard = /* @__PURE__ */ __name(({ wrapper, ...props }) => {
+  if (!wrapper) return null;
+  const stats = useMemo3(() => {
+    const labels = [
+      "Reward",
+      "Elevated Payloads",
+      "Total Payloads",
+      "Signatures"
+    ];
+    const values = [
+      wrapper.reward().toLocaleString(navigator.language ?? "en-US"),
+      wrapper.elevatedPayloadCount.toLocaleString(navigator.language ?? "en-US"),
+      wrapper.payloadCount.toLocaleString(navigator.language ?? "en-US"),
+      wrapper.signatureCount.toLocaleString(navigator.language ?? "en-US"),
+      ,
+    ];
+    return {
+      labels,
+      values
+    };
+  }, [
+    wrapper
+  ]);
+  const fees = useMemo3(() => {
+    const labels = [
+      "Base",
+      "Gas",
+      "Priority",
+      "Gas Limit"
+    ];
+    const values = [
+      formatFee(wrapper.fees.base),
+      formatFee(wrapper.fees.gasPrice),
+      formatFee(wrapper.fees.priority),
+      formatFee(wrapper.fees.gasLimit)
+    ];
+    return {
+      labels,
+      values
+    };
+  }, [
+    wrapper
+  ]);
+  const blockDuration = useMemo3(() => {
+    const labels = [
+      "Expiration",
+      "Not Before"
+    ];
+    const values = [
+      wrapper.boundWitness.exp.toLocaleString(navigator.language ?? "en-US"),
+      wrapper.boundWitness.nbf.toLocaleString(navigator.language ?? "en-US")
+    ];
+    return {
+      labels,
+      values
+    };
+  }, [
+    wrapper
+  ]);
+  return /* @__PURE__ */ React5.createElement(Card, props, /* @__PURE__ */ React5.createElement(CardContent, null, /* @__PURE__ */ React5.createElement(Grid, {
     container: true,
-    spacing: 3,
+    spacing: 6,
     sx: {
       width: "100%"
     }
-  }, /* @__PURE__ */ React4.createElement(Grid, {
+  }, /* @__PURE__ */ React5.createElement(Grid, {
     size: {
       xs: 12
     }
-  }, /* @__PURE__ */ React4.createElement(DetailsStack, {
+  }, /* @__PURE__ */ React5.createElement(DetailsStack, {
     IconComponent: MdOutlineAlternateEmail,
-    heading: "From:"
-  }, /* @__PURE__ */ React4.createElement(Typography2, {
+    heading: "From:",
+    tooltipTitle: "Address of the sender"
+  }, /* @__PURE__ */ React5.createElement(Typography3, {
     variant: "body2",
     sx: {
       maxWidth: "100%",
       textOverflow: "ellipsis",
-      overflow: "hidden"
+      overflow: "hidden",
+      fontFamily: "monospace"
     }
-  }, wrapper?.boundWitness.from))), /* @__PURE__ */ React4.createElement(Grid, {
+  }, wrapper?.boundWitness.from))), /* @__PURE__ */ React5.createElement(Grid, {
     size: {
       xs: 12,
       sm: 6,
       md: 4
     }
-  }, /* @__PURE__ */ React4.createElement(DetailsStack, {
+  }, /* @__PURE__ */ React5.createElement(DetailsStack, {
     IconComponent: IoStatsChartOutline,
-    heading: "Stats"
-  }, /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Reward:", " ", wrapper?.reward()), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Elevated Payloads:", " ", wrapper?.elevatedPayloadCount), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Total Payloads:", " ", wrapper?.payloadCount), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Signatures:", " ", wrapper?.signatureCount))), /* @__PURE__ */ React4.createElement(Grid, {
+    heading: "Stats",
+    tooltipTitle: "Transaction Statistics"
+  }, /* @__PURE__ */ React5.createElement(LabelValueStack, {
+    labels: stats.labels,
+    values: stats.values
+  }))), /* @__PURE__ */ React5.createElement(Grid, {
     size: {
       xs: 12,
       sm: 6,
       md: 4
     }
-  }, /* @__PURE__ */ React4.createElement(DetailsStack, {
+  }, /* @__PURE__ */ React5.createElement(DetailsStack, {
     IconComponent: GiReceiveMoney,
-    heading: "Fees"
-  }, /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Base:", " ", formatFee(wrapper?.fees.base)), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Gas:", " ", formatFee(wrapper?.fees.gasPrice)), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Priority:", " ", formatFee(wrapper?.fees.priority)), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Gas Limit:", " ", formatFee(wrapper?.fees.gasLimit)))), /* @__PURE__ */ React4.createElement(Grid, {
+    heading: "Fees",
+    tooltipTitle: "Fees offered to the producer"
+  }, /* @__PURE__ */ React5.createElement(LabelValueStack, {
+    labels: fees.labels,
+    values: fees.values
+  }))), /* @__PURE__ */ React5.createElement(Grid, {
     size: {
       xs: 12,
       sm: 6,
       md: 4
     }
-  }, /* @__PURE__ */ React4.createElement(DetailsStack, {
+  }, /* @__PURE__ */ React5.createElement(DetailsStack, {
     IconComponent: GiSandsOfTime,
-    heading: "Block Duration"
-  }, /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Expiration:", " ", wrapper?.boundWitness.exp), /* @__PURE__ */ React4.createElement(Typography2, {
-    variant: "body2"
-  }, "Not Before:", " ", wrapper?.boundWitness?.nbf))))));
+    heading: "Block Duration",
+    tooltipTitle: "Block window for the transaction to be valid"
+  }, /* @__PURE__ */ React5.createElement(LabelValueStack, {
+    labels: blockDuration.labels,
+    values: blockDuration.values
+  }))))));
 }, "TransactionBoundWitnessCard");
 
 // src/components/transactions/TransactionDetails.tsx
-import { Divider as Divider2 } from "@mui/material";
 import { ErrorRender as ErrorRender2 } from "@xylabs/react-error";
 import { FlexCol as FlexCol3 } from "@xylabs/react-flexbox";
 import { usePromise as usePromise2 } from "@xylabs/react-promise";
-import { isDefined } from "@xylabs/typeof";
+import { isDefined as isDefined2 } from "@xylabs/typeof";
 import { SignedHydratedTransactionWrapper } from "@xyo-network/chain-wrappers";
 import { PayloadBuilder as PayloadBuilder2 } from "@xyo-network/payload-builder";
 import { BoundWitnessSignatureTable as BoundWitnessSignatureTable2, BWActions as BWActions2, HashHeadingPaper as HashHeadingPaper2, HeadingPaper as HeadingPaper3 } from "@xyo-network/react-boundwitness-plugin";
-import React5 from "react";
+import React6 from "react";
 import { FaSignature as FaSignature2 } from "react-icons/fa";
 import { VscSymbolMethod as VscSymbolMethod3 } from "react-icons/vsc";
 var TransactionBoundWitnessDetails = /* @__PURE__ */ __name(({ transaction, ...props }) => {
@@ -283,7 +365,7 @@ var TransactionBoundWitnessDetails = /* @__PURE__ */ __name(({ transaction, ...p
     transaction
   ]);
   const [elevatedPayloadSets, elevatedPayloadSetsError] = usePromise2(async () => {
-    if (isDefined(wrapper)) {
+    if (isDefined2(wrapper)) {
       const elevatedPayloads = wrapper.elevatedPayloads;
       const pairs = await PayloadBuilder2.hashPairs(elevatedPayloads);
       return formatPayloadsForTable(pairs);
@@ -297,53 +379,49 @@ var TransactionBoundWitnessDetails = /* @__PURE__ */ __name(({ transaction, ...p
     wrapper
   ]);
   const { hashes: elevatedPayloadHashes, schemas: elevatedPayloadSchemas } = elevatedPayloadSets ?? {};
-  return /* @__PURE__ */ React5.createElement(FlexCol3, {
+  return /* @__PURE__ */ React6.createElement(FlexCol3, {
     alignItems: "stretch",
-    rowGap: 4,
+    rowGap: 2,
     ...props
-  }, /* @__PURE__ */ React5.createElement(HashHeadingPaper2, {
+  }, /* @__PURE__ */ React6.createElement(HashHeadingPaper2, {
     hash: wrapper?.boundWitness?._hash,
     paperProps: {
       sx: {
         p: 2
       }
     },
-    AdornmentEnd: /* @__PURE__ */ React5.createElement(BWActions2, {
+    AdornmentEnd: /* @__PURE__ */ React6.createElement(BWActions2, {
       boundwitness: wrapper?.boundWitness
     }),
     identiconProps: {
       p: 0.75,
       size: 24
     }
-  }), /* @__PURE__ */ React5.createElement(ErrorRender2, {
+  }), /* @__PURE__ */ React6.createElement(ErrorRender2, {
     error: wrapperError,
     scope: "wrapperError:TransactionBoundWitnessDetails.tsx"
-  }), /* @__PURE__ */ React5.createElement(ErrorRender2, {
+  }), /* @__PURE__ */ React6.createElement(ErrorRender2, {
     error: elevatedPayloadSetsError,
     scope: "elevatedPayloadSetsError:TransactionBoundWitnessDetails.tsx"
-  }), /* @__PURE__ */ React5.createElement(Divider2, {
-    flexItem: true
-  }), /* @__PURE__ */ React5.createElement(TransactionBoundWitnessCard, {
+  }), /* @__PURE__ */ React6.createElement(TransactionBoundWitnessCard, {
     elevation: 4,
     wrapper
-  }), /* @__PURE__ */ React5.createElement(Divider2, {
-    flexItem: true
-  }), /* @__PURE__ */ React5.createElement(BWPayloadTableFlexbox, {
-    IconComponent: /* @__PURE__ */ React5.createElement(VscSymbolMethod3, null),
+  }), /* @__PURE__ */ React6.createElement(BWPayloadTableFlexbox, {
+    IconComponent: /* @__PURE__ */ React6.createElement(VscSymbolMethod3, null),
     hashes: elevatedPayloadHashes,
     headingTitle: "Elevated Payloads",
     schemas: elevatedPayloadSchemas,
     sx: {
       mb: 1
     }
-  }), /* @__PURE__ */ React5.createElement(FlexCol3, {
+  }), /* @__PURE__ */ React6.createElement(FlexCol3, {
     alignItems: "stretch",
     rowGap: 1,
     mb: 1
-  }, /* @__PURE__ */ React5.createElement(HeadingPaper3, {
-    IconComponent: /* @__PURE__ */ React5.createElement(FaSignature2, null),
+  }, /* @__PURE__ */ React6.createElement(HeadingPaper3, {
+    IconComponent: /* @__PURE__ */ React6.createElement(FaSignature2, null),
     heading: "Signatures"
-  }), /* @__PURE__ */ React5.createElement(BoundWitnessSignatureTable2, {
+  }), /* @__PURE__ */ React6.createElement(BoundWitnessSignatureTable2, {
     block: wrapper?.boundWitness
   })));
 }, "TransactionBoundWitnessDetails");

package/dist/browser/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/block/BlockBoundWitnessDetails.tsx","../../src/lib/formatPayloadsForTable.ts","../../src/components/BwPayloadTable.tsx","../../src/components/transactions/card/Card.tsx","../../src/components/transactions/card/DetailsStack.tsx","../../src/components/transactions/TransactionDetails.tsx"],"sourcesContent":["import { Divider } from '@mui/material'\nimport { filterAs } from '@xylabs/array'\nimport { ErrorRender } from '@xylabs/react-error'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { usePromise } from '@xylabs/react-promise'\nimport { isBoundWitness } from '@xyo-network/boundwitness-model'\nimport { PayloadBuilder } from '@xyo-network/payload-builder'\nimport {\n  BoundWitnessPayloadsTable,\n  BoundWitnessSignatureTable,\n  BWActions,\n  HashHeadingPaper,\n  HeadingPaper,\n} from '@xyo-network/react-boundwitness-plugin'\nimport { useTxsFromBlock } from '@xyo-network/react-chain-blockchain'\nimport { usePayloadHash } from '@xyo-network/react-shared'\nimport { isTransactionBoundWitness, type SignedHydratedBlock } from '@xyo-network/xl1-protocol'\nimport React, { useMemo } from 'react'\nimport { FaSignature } from 'react-icons/fa'\nimport { GrTransaction } from 'react-icons/gr'\nimport { VscSymbolMethod, VscSymbolNamespace } from 'react-icons/vsc'\n\nimport { formatPayloadsForTable } from '../../lib/index.ts'\nimport type { TransactionBoundWitnessEvents } from '../../types/index.ts'\nimport { BWPayloadTableFlexbox } from '../BwPayloadTable.tsx'\n\nexport interface BoundWitnessDetailsProps extends FlexBoxProps {\n  block?: SignedHydratedBlock\n}\n\nexport const BlockBoundWitnessDetails = ({\n  block, paper, children, ...props\n}: BoundWitnessDetailsProps) => {\n  const boundWitness = block?.[0]\n  const payloads = block?.[1]\n\n  const hash = usePayloadHash(boundWitness)\n\n  const [transactions, txFromBlockError] = useTxsFromBlock(block)\n\n  const { hashes: txHashes, schemas: txSchemas } = useMemo(() => formatPayloadsForTable(transactions ?? []), [transactions])\n\n  const [nonTxBoundWitnesses, bwsFromBlockError] = usePromise(async () => {\n    const bws = filterAs(payloads ?? [], payload =>\n      (!isTransactionBoundWitness(payload) && isBoundWitness(payload)) ? payload : undefined)\n    return await PayloadBuilder.hashPairs(bws)\n  }, [payloads])\n\n  const { hashes: nonTxBwHashes, schemas: nonTxBwSchemas } = useMemo(() => formatPayloadsForTable(nonTxBoundWitnesses ?? []), [nonTxBoundWitnesses])\n  const hasNonTxBoundWitnesses = (nonTxBoundWitnesses?.length ?? 0) > 0\n\n  return (\n    <FlexCol alignItems=\"stretch\" rowGap={4} {...props}>\n      <ErrorRender error={txFromBlockError ?? bwsFromBlockError} scope=\"BlockBoundWitnessDetails.tsx\" />\n      <HashHeadingPaper\n        hash={hash}\n        paperProps={{ sx: { p: 2 } }}\n        AdornmentEnd={<BWActions boundwitness={boundWitness} />}\n        identiconProps={{ p: 0.75, size: 24 }}\n      />\n      <Divider flexItem />\n      {(transactions?.length ?? 0) > 0 && (\n        <BWPayloadTableFlexbox<TransactionBoundWitnessEvents>\n          IconComponent={<GrTransaction />}\n          eventNoun=\"transaction\"\n          hashes={txHashes}\n          headingTitle=\"Transactions\"\n          schemas={txSchemas}\n          sx={{ mb: 1 }}\n        />\n      )}\n      <FlexCol alignItems=\"stretch\" rowGap={1} mb={1}>\n        <HeadingPaper IconComponent={<VscSymbolNamespace />} heading=\"Payloads\" />\n        <BoundWitnessPayloadsTable boundwitness={boundWitness} />\n      </FlexCol>\n      {hasNonTxBoundWitnesses\n        ? (\n            <BWPayloadTableFlexbox<TransactionBoundWitnessEvents>\n              IconComponent={<VscSymbolMethod />}\n              eventNoun=\"boundwitness\"\n              hashes={nonTxBwHashes}\n              headingTitle=\"Bound Witnesses\"\n              schemas={nonTxBwSchemas}\n              sx={{ mb: 1 }}\n            />\n          )\n        : null}\n      <FlexCol alignItems=\"stretch\" rowGap={1} mb={1}>\n        <HeadingPaper IconComponent={<FaSignature />} heading=\"Signatures\" />\n        <BoundWitnessSignatureTable block={boundWitness} />\n      </FlexCol>\n    </FlexCol>\n  )\n}\n","import type { Hash } from '@xylabs/hex'\nimport type { Payload } from '@xyo-network/payload-model'\n\nexport const formatPayloadsForTable = (pairs: [Payload, Hash][]) => {\n  let hashes: Hash[] = []\n  let schemas: string[] = []\n  for (const [bw, hash] of pairs ?? []) {\n    hashes.push(hash)\n    schemas.push(bw?.schema ?? '')\n  }\n  return { hashes, schemas }\n}\n","import type { Hash } from '@xylabs/hex'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport {\n  BoundWitnessPayloadTableBody, BoundWitnessPayloadTableHead, HeadingPaper,\n} from '@xyo-network/react-boundwitness-plugin'\nimport type { EventNoun, ExtendEventNoun } from '@xyo-network/react-event'\nimport { TableEx } from '@xyo-network/react-table'\nimport React from 'react'\nimport { VscSymbolMethod } from 'react-icons/vsc'\n\nexport interface BWPayloadTableFlexboxProps<TNoun extends ExtendEventNoun = EventNoun> extends FlexBoxProps {\n  IconComponent?: React.ReactNode\n  eventNoun?: TNoun\n  hashes?: Hash[]\n  headingTitle?: string\n  schemas?: string[]\n}\n\nexport const BWPayloadTableFlexbox = <TNoun extends ExtendEventNoun = EventNoun>({\n  IconComponent,\n  eventNoun,\n  hashes,\n  schemas,\n  headingTitle,\n  ...props\n}: BWPayloadTableFlexboxProps<TNoun>) => {\n  const resolvedIconComponent = IconComponent ?? <VscSymbolMethod />\n  return (\n    <FlexCol alignItems=\"stretch\" rowGap={1} {...props}>\n      <HeadingPaper IconComponent={resolvedIconComponent} heading={headingTitle} />\n      <TableEx>\n        <BoundWitnessPayloadTableHead />\n        <BoundWitnessPayloadTableBody<TNoun> payloadHashes={hashes} payloadSchemas={schemas} eventNoun={eventNoun} />\n      </TableEx>\n    </FlexCol>\n  )\n}\n","import type { CardProps } from '@mui/material'\nimport {\n  Card, CardContent, Grid, Typography,\n} from '@mui/material'\nimport { isUndefined } from '@xylabs/typeof'\nimport { bigIntToFixedPointString } from '@xyo-network/chain-utils'\nimport type { SignedHydratedTransactionInstance } from '@xyo-network/xl1-protocol-sdk'\nimport React, { useCallback } from 'react'\nimport { GiReceiveMoney, GiSandsOfTime } from 'react-icons/gi'\nimport { IoStatsChartOutline } from 'react-icons/io5'\nimport { MdOutlineAlternateEmail } from 'react-icons/md'\n\nimport { DetailsStack } from './DetailsStack.tsx'\n\nexport interface TransactionBoundWitnessCardProps extends CardProps {\n  wrapper?: SignedHydratedTransactionInstance\n}\n\nexport const TransactionBoundWitnessCard: React.FC<TransactionBoundWitnessCardProps> = ({ wrapper, ...props }) => {\n  if (!wrapper) return null\n\n  const formatFee = useCallback((fee?: bigint) => {\n    if (isUndefined(fee)) return\n    return bigIntToFixedPointString(fee, 12)\n  }, [])\n\n  return (\n    <Card {...props}>\n      <CardContent sx={{\n        display: 'flex', flexDirection: 'row', gap: 2, flexWrap: 'wrap',\n      }}\n      >\n        <Grid container spacing={3} sx={{ width: '100%' }}>\n          <Grid size={{ xs: 12 }}>\n            <DetailsStack IconComponent={MdOutlineAlternateEmail} heading=\"From:\">\n              <Typography\n                variant=\"body2\"\n                sx={{\n                  maxWidth: '100%', textOverflow: 'ellipsis', overflow: 'hidden',\n                }}\n              >\n                {wrapper?.boundWitness.from}\n              </Typography>\n            </DetailsStack>\n          </Grid>\n          <Grid size={{\n            xs: 12, sm: 6, md: 4,\n          }}\n          >\n            <DetailsStack IconComponent={IoStatsChartOutline} heading=\"Stats\">\n              <Typography variant=\"body2\">\n                Reward:\n                {' '}\n                {wrapper?.reward()}\n              </Typography>\n              <Typography variant=\"body2\">\n                Elevated Payloads:\n                {' '}\n                {wrapper?.elevatedPayloadCount}\n              </Typography>\n              <Typography variant=\"body2\">\n                Total Payloads:\n                {' '}\n                {wrapper?.payloadCount}\n              </Typography>\n              <Typography variant=\"body2\">\n                Signatures:\n                {' '}\n                {wrapper?.signatureCount}\n              </Typography>\n            </DetailsStack>\n          </Grid>\n          <Grid size={{\n            xs: 12, sm: 6, md: 4,\n          }}\n          >\n            <DetailsStack IconComponent={GiReceiveMoney} heading=\"Fees\">\n              <Typography variant=\"body2\">\n                Base:\n                {' '}\n                {formatFee(wrapper?.fees.base)}\n              </Typography>\n              <Typography variant=\"body2\">\n                Gas:\n                {' '}\n                {formatFee(wrapper?.fees.gasPrice)}\n              </Typography>\n              <Typography variant=\"body2\">\n                Priority:\n                {' '}\n                {formatFee(wrapper?.fees.priority)}\n              </Typography>\n              <Typography variant=\"body2\">\n                Gas Limit:\n                {' '}\n                {formatFee(wrapper?.fees.gasLimit)}\n              </Typography>\n            </DetailsStack>\n          </Grid>\n          <Grid size={{\n            xs: 12, sm: 6, md: 4,\n          }}\n          >\n            <DetailsStack IconComponent={GiSandsOfTime} heading=\"Block Duration\">\n              <Typography variant=\"body2\">\n                Expiration:\n                {' '}\n                {wrapper?.boundWitness.exp}\n              </Typography>\n              <Typography variant=\"body2\">\n                Not Before:\n                {' '}\n                {wrapper?.boundWitness?.nbf}\n              </Typography>\n            </DetailsStack>\n          </Grid>\n        </Grid>\n      </CardContent>\n    </Card>\n  )\n}\n","import type { StackProps } from '@mui/material'\nimport {\n  Icon, Stack, styled, Typography,\n} from '@mui/material'\nimport type { ComponentType, SVGAttributes } from 'react'\nimport React from 'react'\n\nexport interface DetailsStackProps extends StackProps {\n  IconComponent?: ComponentType<SVGAttributes<SVGElement>>\n  heading?: string\n}\n\nexport const DetailsStack: React.FC<DetailsStackProps> = ({\n  IconComponent, heading, children, ...props\n}) => {\n  return (\n    <Stack direction=\"row\" mb={1} gap={1} {...props}>\n      {IconComponent && <Icon fontSize=\"small\" sx={{ mr: 0.25 }}><IconComponent style={{ height: '0.7em' }} /></Icon>}\n      <Stack direction=\"column\" flexWrap=\"wrap\" mb={1}>\n        <SectionHeadingTypography>\n          {heading}\n        </SectionHeadingTypography>\n        {children}\n      </Stack>\n    </Stack>\n  )\n}\n\nconst SectionHeadingTypography = styled(Typography, { name: 'SectionHeadingTypography' })(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'baseline',\n  fontFamily: 'monospace',\n  fontSize: 16,\n  marginBottom: theme.spacing(0.75),\n}))\n","import { Divider } from '@mui/material'\nimport { ErrorRender } from '@xylabs/react-error'\nimport { type FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { usePromise } from '@xylabs/react-promise'\nimport { isDefined } from '@xylabs/typeof'\nimport { SignedHydratedTransactionWrapper } from '@xyo-network/chain-wrappers'\nimport { PayloadBuilder } from '@xyo-network/payload-builder'\nimport {\n  BoundWitnessSignatureTable, BWActions, HashHeadingPaper, HeadingPaper,\n} from '@xyo-network/react-boundwitness-plugin'\nimport type { SignedHydratedTransaction } from '@xyo-network/xl1-protocol'\nimport React from 'react'\nimport { FaSignature } from 'react-icons/fa'\nimport { VscSymbolMethod } from 'react-icons/vsc'\n\nimport { formatPayloadsForTable } from '../../lib/index.ts'\nimport { BWPayloadTableFlexbox } from '../BwPayloadTable.tsx'\nimport { TransactionBoundWitnessCard } from './card/index.ts'\n\nexport interface TransactionBoundWitnessDetailsProps extends FlexBoxProps {\n  transaction?: SignedHydratedTransaction | null\n}\n\nexport const TransactionBoundWitnessDetails: React.FC<TransactionBoundWitnessDetailsProps> = ({ transaction, ...props }) => {\n  const [wrapper, wrapperError] = usePromise(async () => {\n    if (transaction) {\n      return await SignedHydratedTransactionWrapper.parse(transaction)\n    }\n  }, [transaction])\n\n  const [elevatedPayloadSets, elevatedPayloadSetsError] = usePromise(async () => {\n    if (isDefined(wrapper)) {\n      const elevatedPayloads = wrapper.elevatedPayloads\n      const pairs = await PayloadBuilder.hashPairs(elevatedPayloads)\n      return formatPayloadsForTable(pairs)\n    } else {\n      return { hashes: [], schemas: [] }\n    }\n  }, [wrapper])\n\n  const { hashes: elevatedPayloadHashes, schemas: elevatedPayloadSchemas } = elevatedPayloadSets ?? {}\n\n  return (\n    <FlexCol alignItems=\"stretch\" rowGap={4} {...props}>\n      <HashHeadingPaper\n        hash={wrapper?.boundWitness?._hash}\n        paperProps={{ sx: { p: 2 } }}\n        AdornmentEnd={<BWActions boundwitness={wrapper?.boundWitness} />}\n        identiconProps={{ p: 0.75, size: 24 }}\n      />\n      <ErrorRender error={wrapperError} scope=\"wrapperError:TransactionBoundWitnessDetails.tsx\" />\n      <ErrorRender error={elevatedPayloadSetsError} scope=\"elevatedPayloadSetsError:TransactionBoundWitnessDetails.tsx\" />\n      <Divider flexItem />\n      <TransactionBoundWitnessCard elevation={4} wrapper={wrapper} />\n      <Divider flexItem />\n      <BWPayloadTableFlexbox\n        IconComponent={<VscSymbolMethod />}\n        hashes={elevatedPayloadHashes}\n        headingTitle=\"Elevated Payloads\"\n        schemas={elevatedPayloadSchemas}\n        sx={{ mb: 1 }}\n      />\n      <FlexCol alignItems=\"stretch\" rowGap={1} mb={1}>\n        <HeadingPaper IconComponent={<FaSignature />} heading=\"Signatures\" />\n        <BoundWitnessSignatureTable block={wrapper?.boundWitness} />\n      </FlexCol>\n    </FlexCol>\n  )\n}\n"],"mappings":"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","names":["Divider","filterAs","ErrorRender","FlexCol","usePromise","isBoundWitness","PayloadBuilder","BoundWitnessPayloadsTable","BoundWitnessSignatureTable","BWActions","HashHeadingPaper","HeadingPaper","useTxsFromBlock","usePayloadHash","isTransactionBoundWitness","React","useMemo","FaSignature","GrTransaction","VscSymbolMethod","VscSymbolNamespace","formatPayloadsForTable","pairs","hashes","schemas","bw","hash","push","schema","FlexCol","BoundWitnessPayloadTableBody","BoundWitnessPayloadTableHead","HeadingPaper","TableEx","React","VscSymbolMethod","BWPayloadTableFlexbox","IconComponent","eventNoun","hashes","schemas","headingTitle","props","resolvedIconComponent","VscSymbolMethod","FlexCol","alignItems","rowGap","HeadingPaper","heading","TableEx","BoundWitnessPayloadTableHead","BoundWitnessPayloadTableBody","payloadHashes","payloadSchemas","BlockBoundWitnessDetails","block","paper","children","props","boundWitness","payloads","hash","usePayloadHash","transactions","txFromBlockError","useTxsFromBlock","hashes","txHashes","schemas","txSchemas","useMemo","formatPayloadsForTable","nonTxBoundWitnesses","bwsFromBlockError","usePromise","bws","filterAs","payload","isTransactionBoundWitness","isBoundWitness","undefined","PayloadBuilder","hashPairs","nonTxBwHashes","nonTxBwSchemas","hasNonTxBoundWitnesses","length","React","FlexCol","alignItems","rowGap","ErrorRender","error","scope","HashHeadingPaper","paperProps","sx","p","AdornmentEnd","BWActions","boundwitness","identiconProps","size","Divider","flexItem","BWPayloadTableFlexbox","IconComponent","GrTransaction","eventNoun","headingTitle","mb","HeadingPaper","VscSymbolNamespace","heading","BoundWitnessPayloadsTable","VscSymbolMethod","FaSignature","BoundWitnessSignatureTable","Card","CardContent","Grid","Typography","isUndefined","bigIntToFixedPointString","React","useCallback","GiReceiveMoney","GiSandsOfTime","IoStatsChartOutline","MdOutlineAlternateEmail","Icon","Stack","styled","Typography","React","DetailsStack","IconComponent","heading","children","props","React","Stack","direction","mb","gap","Icon","fontSize","sx","mr","style","height","flexWrap","SectionHeadingTypography","styled","Typography","name","theme","display","alignItems","fontFamily","marginBottom","spacing","TransactionBoundWitnessCard","wrapper","props","formatFee","useCallback","fee","isUndefined","bigIntToFixedPointString","React","Card","CardContent","sx","display","flexDirection","gap","flexWrap","Grid","container","spacing","width","size","xs","DetailsStack","IconComponent","MdOutlineAlternateEmail","heading","Typography","variant","maxWidth","textOverflow","overflow","boundWitness","from","sm","md","IoStatsChartOutline","reward","elevatedPayloadCount","payloadCount","signatureCount","GiReceiveMoney","fees","base","gasPrice","priority","gasLimit","GiSandsOfTime","exp","nbf","Divider","ErrorRender","FlexCol","usePromise","isDefined","SignedHydratedTransactionWrapper","PayloadBuilder","BoundWitnessSignatureTable","BWActions","HashHeadingPaper","HeadingPaper","React","FaSignature","VscSymbolMethod","TransactionBoundWitnessDetails","transaction","props","wrapper","wrapperError","usePromise","SignedHydratedTransactionWrapper","parse","elevatedPayloadSets","elevatedPayloadSetsError","isDefined","elevatedPayloads","pairs","PayloadBuilder","hashPairs","formatPayloadsForTable","hashes","schemas","elevatedPayloadHashes","elevatedPayloadSchemas","React","FlexCol","alignItems","rowGap","HashHeadingPaper","hash","boundWitness","_hash","paperProps","sx","p","AdornmentEnd","BWActions","boundwitness","identiconProps","size","ErrorRender","error","scope","Divider","flexItem","TransactionBoundWitnessCard","elevation","BWPayloadTableFlexbox","IconComponent","VscSymbolMethod","headingTitle","mb","HeadingPaper","FaSignature","heading","BoundWitnessSignatureTable","block"]}
+{"version":3,"sources":["../../src/components/block/BlockBoundWitnessDetails.tsx","../../src/lib/formatPayloadsForTable.ts","../../src/components/BwPayloadTable.tsx","../../src/components/transactions/card/Card.tsx","../../src/components/transactions/card/DetailsStack.tsx","../../src/components/transactions/card/LabelValueStack.tsx","../../src/components/transactions/TransactionDetails.tsx"],"sourcesContent":["import { Divider } from '@mui/material'\nimport { filterAs } from '@xylabs/array'\nimport { ErrorRender } from '@xylabs/react-error'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { usePromise } from '@xylabs/react-promise'\nimport { isBoundWitness } from '@xyo-network/boundwitness-model'\nimport { PayloadBuilder } from '@xyo-network/payload-builder'\nimport {\n  BoundWitnessPayloadsTable,\n  BoundWitnessSignatureTable,\n  BWActions,\n  HashHeadingPaper,\n  HeadingPaper,\n} from '@xyo-network/react-boundwitness-plugin'\nimport { useTxsFromBlock } from '@xyo-network/react-chain-blockchain'\nimport { usePayloadHash } from '@xyo-network/react-shared'\nimport { isTransactionBoundWitness, type SignedHydratedBlock } from '@xyo-network/xl1-protocol'\nimport React, { useMemo } from 'react'\nimport { FaSignature } from 'react-icons/fa'\nimport { GrTransaction } from 'react-icons/gr'\nimport { VscSymbolMethod, VscSymbolNamespace } from 'react-icons/vsc'\n\nimport { formatPayloadsForTable } from '../../lib/index.ts'\nimport type { TransactionBoundWitnessEvents } from '../../types/index.ts'\nimport { BWPayloadTableFlexbox } from '../BwPayloadTable.tsx'\n\nexport interface BoundWitnessDetailsProps extends FlexBoxProps {\n  block?: SignedHydratedBlock\n}\n\nexport const BlockBoundWitnessDetails = ({\n  block, paper, children, ...props\n}: BoundWitnessDetailsProps) => {\n  const boundWitness = block?.[0]\n  const payloads = block?.[1]\n\n  const hash = usePayloadHash(boundWitness)\n\n  const [transactions, txFromBlockError] = useTxsFromBlock(block)\n\n  const { hashes: txHashes, schemas: txSchemas } = useMemo(() => formatPayloadsForTable(transactions ?? []), [transactions])\n\n  const [nonTxBoundWitnesses, bwsFromBlockError] = usePromise(async () => {\n    const bws = filterAs(payloads ?? [], payload =>\n      (!isTransactionBoundWitness(payload) && isBoundWitness(payload)) ? payload : undefined)\n    return await PayloadBuilder.hashPairs(bws)\n  }, [payloads])\n\n  const { hashes: nonTxBwHashes, schemas: nonTxBwSchemas } = useMemo(() => formatPayloadsForTable(nonTxBoundWitnesses ?? []), [nonTxBoundWitnesses])\n  const hasNonTxBoundWitnesses = (nonTxBoundWitnesses?.length ?? 0) > 0\n\n  return (\n    <FlexCol alignItems=\"stretch\" rowGap={4} {...props}>\n      <ErrorRender error={txFromBlockError ?? bwsFromBlockError} scope=\"BlockBoundWitnessDetails.tsx\" />\n      <HashHeadingPaper\n        hash={hash}\n        paperProps={{ sx: { p: 2 } }}\n        AdornmentEnd={<BWActions boundwitness={boundWitness} />}\n        identiconProps={{ p: 0.75, size: 24 }}\n      />\n      <Divider flexItem />\n      {(transactions?.length ?? 0) > 0 && (\n        <BWPayloadTableFlexbox<TransactionBoundWitnessEvents>\n          IconComponent={<GrTransaction />}\n          eventNoun=\"transaction\"\n          hashes={txHashes}\n          headingTitle=\"Transactions\"\n          schemas={txSchemas}\n          sx={{ mb: 1 }}\n        />\n      )}\n      <FlexCol alignItems=\"stretch\" rowGap={1} mb={1}>\n        <HeadingPaper IconComponent={<VscSymbolNamespace />} heading=\"Payloads\" />\n        <BoundWitnessPayloadsTable boundwitness={boundWitness} />\n      </FlexCol>\n      {hasNonTxBoundWitnesses\n        ? (\n            <BWPayloadTableFlexbox<TransactionBoundWitnessEvents>\n              IconComponent={<VscSymbolMethod />}\n              eventNoun=\"boundwitness\"\n              hashes={nonTxBwHashes}\n              headingTitle=\"Bound Witnesses\"\n              schemas={nonTxBwSchemas}\n              sx={{ mb: 1 }}\n            />\n          )\n        : null}\n      <FlexCol alignItems=\"stretch\" rowGap={1} mb={1}>\n        <HeadingPaper IconComponent={<FaSignature />} heading=\"Signatures\" />\n        <BoundWitnessSignatureTable block={boundWitness} />\n      </FlexCol>\n    </FlexCol>\n  )\n}\n","import type { Hash } from '@xylabs/hex'\nimport type { Payload } from '@xyo-network/payload-model'\n\nexport const formatPayloadsForTable = (pairs: [Payload, Hash][]) => {\n  let hashes: Hash[] = []\n  let schemas: string[] = []\n  for (const [bw, hash] of pairs ?? []) {\n    hashes.push(hash)\n    schemas.push(bw?.schema ?? '')\n  }\n  return { hashes, schemas }\n}\n","import type { Hash } from '@xylabs/hex'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport {\n  BoundWitnessPayloadTableBody, BoundWitnessPayloadTableHead, HeadingPaper,\n} from '@xyo-network/react-boundwitness-plugin'\nimport type { EventNoun, ExtendEventNoun } from '@xyo-network/react-event'\nimport { TableEx } from '@xyo-network/react-table'\nimport React from 'react'\nimport { VscSymbolMethod } from 'react-icons/vsc'\n\nexport interface BWPayloadTableFlexboxProps<TNoun extends ExtendEventNoun = EventNoun> extends FlexBoxProps {\n  IconComponent?: React.ReactNode\n  eventNoun?: TNoun\n  hashes?: Hash[]\n  headingTitle?: string\n  schemas?: string[]\n}\n\nexport const BWPayloadTableFlexbox = <TNoun extends ExtendEventNoun = EventNoun>({\n  IconComponent,\n  eventNoun,\n  hashes,\n  schemas,\n  headingTitle,\n  ...props\n}: BWPayloadTableFlexboxProps<TNoun>) => {\n  const resolvedIconComponent = IconComponent ?? <VscSymbolMethod />\n  return (\n    <FlexCol alignItems=\"stretch\" rowGap={1} {...props}>\n      <HeadingPaper IconComponent={resolvedIconComponent} heading={headingTitle} />\n      <TableEx>\n        <BoundWitnessPayloadTableHead />\n        <BoundWitnessPayloadTableBody<TNoun> payloadHashes={hashes} payloadSchemas={schemas} eventNoun={eventNoun} />\n      </TableEx>\n    </FlexCol>\n  )\n}\n","import type { CardProps } from '@mui/material'\nimport {\n  Card, CardContent, Grid, Typography,\n} from '@mui/material'\nimport { isUndefined } from '@xylabs/typeof'\nimport { bigIntToFixedPointString } from '@xyo-network/chain-utils'\nimport type { SignedHydratedTransactionInstance } from '@xyo-network/xl1-protocol-sdk'\nimport React, { useMemo } from 'react'\nimport { GiReceiveMoney, GiSandsOfTime } from 'react-icons/gi'\nimport { IoStatsChartOutline } from 'react-icons/io5'\nimport { MdOutlineAlternateEmail } from 'react-icons/md'\n\nimport { DetailsStack } from './DetailsStack.tsx'\nimport { LabelValueStack } from './LabelValueStack.tsx'\n\nconst formatFee = (fee?: bigint) => {\n  if (isUndefined(fee)) return\n  const stringValue = bigIntToFixedPointString(fee, 12)\n  if (stringValue === '0') return '0.0'\n  return stringValue\n}\n\nexport interface TransactionBoundWitnessCardProps extends CardProps {\n  wrapper?: SignedHydratedTransactionInstance\n}\n\nexport const TransactionBoundWitnessCard: React.FC<TransactionBoundWitnessCardProps> = ({ wrapper, ...props }) => {\n  if (!wrapper) return null\n\n  const stats = useMemo(() => {\n    const labels = [\n      'Reward',\n      'Elevated Payloads',\n      'Total Payloads',\n      'Signatures',\n    ]\n\n    const values: (string | undefined)[] = [\n      wrapper.reward().toLocaleString(navigator.language ?? 'en-US'),\n      wrapper.elevatedPayloadCount.toLocaleString(navigator.language ?? 'en-US'),\n      wrapper.payloadCount.toLocaleString(navigator.language ?? 'en-US'),\n      wrapper.signatureCount.toLocaleString(navigator.language ?? 'en-US'),,\n    ]\n\n    return { labels, values } as const\n  }, [wrapper])\n\n  const fees = useMemo(() => {\n    const labels = [\n      'Base',\n      'Gas',\n      'Priority',\n      'Gas Limit',\n    ]\n    const values = [\n      formatFee(wrapper.fees.base),\n      formatFee(wrapper.fees.gasPrice),\n      formatFee(wrapper.fees.priority),\n      formatFee(wrapper.fees.gasLimit),\n    ]\n\n    return { labels, values } as const\n  }, [wrapper])\n\n  const blockDuration = useMemo(() => {\n    const labels = [\n      'Expiration',\n      'Not Before',\n    ]\n\n    const values = [\n      wrapper.boundWitness.exp.toLocaleString(navigator.language ?? 'en-US'),\n      wrapper.boundWitness.nbf.toLocaleString(navigator.language ?? 'en-US'),\n    ]\n\n    return { labels, values } as const\n  }, [wrapper])\n\n  return (\n    <Card {...props}>\n      <CardContent>\n        <Grid container spacing={6} sx={{ width: '100%' }}>\n          <Grid size={{ xs: 12 }}>\n            <DetailsStack IconComponent={MdOutlineAlternateEmail} heading=\"From:\" tooltipTitle=\"Address of the sender\">\n              <Typography\n                variant=\"body2\"\n                sx={{\n                  maxWidth: '100%', textOverflow: 'ellipsis', overflow: 'hidden', fontFamily: 'monospace',\n                }}\n              >\n                {wrapper?.boundWitness.from}\n              </Typography>\n            </DetailsStack>\n          </Grid>\n          <Grid size={{\n            xs: 12, sm: 6, md: 4,\n          }}\n          >\n            <DetailsStack IconComponent={IoStatsChartOutline} heading=\"Stats\" tooltipTitle=\"Transaction Statistics\">\n              <LabelValueStack labels={stats.labels} values={stats.values} />\n            </DetailsStack>\n          </Grid>\n          <Grid size={{\n            xs: 12, sm: 6, md: 4,\n          }}\n          >\n            <DetailsStack IconComponent={GiReceiveMoney} heading=\"Fees\" tooltipTitle=\"Fees offered to the producer\">\n              <LabelValueStack labels={fees.labels} values={fees.values} />\n            </DetailsStack>\n          </Grid>\n          <Grid size={{\n            xs: 12, sm: 6, md: 4,\n          }}\n          >\n            <DetailsStack IconComponent={GiSandsOfTime} heading=\"Block Duration\" tooltipTitle=\"Block window for the transaction to be valid\">\n              <LabelValueStack labels={blockDuration.labels} values={blockDuration.values} />\n            </DetailsStack>\n          </Grid>\n        </Grid>\n      </CardContent>\n    </Card>\n  )\n}\n","import type { StackProps } from '@mui/material'\nimport {\n  Stack, styled, Tooltip, Typography,\n  useTheme,\n} from '@mui/material'\nimport { isDefined } from '@xylabs/typeof'\nimport type { ComponentType, SVGAttributes } from 'react'\nimport React, { useMemo } from 'react'\n\nexport interface DetailsStackProps extends StackProps {\n  IconComponent?: ComponentType<SVGAttributes<SVGElement>>\n  heading?: string\n  tooltipTitle?: string\n}\n\nexport const DetailsStack: React.FC<DetailsStackProps> = ({\n  IconComponent, heading, children, tooltipTitle, ...props\n}) => {\n  const theme = useTheme()\n\n  const hasTooltip = isDefined(tooltipTitle)\n  const resolvedIconComponent = useMemo(() => {\n    return IconComponent\n      ? (\n          <IconComponent\n            style={{\n              /** height and marginTop adjusted to account for font not filling container with line-height: 1 */\n              height: '0.85rem',\n              marginTop: 0.5,\n              marginLeft: theme.spacing(1),\n            }}\n          />\n        )\n      : <></>\n  }, [IconComponent])\n\n  return (\n    <Stack direction=\"column\" flexGrow={1} flexWrap=\"wrap\" minWidth=\"1px\" {...props}>\n      <SectionHeadingTypography>\n        {heading}\n        {hasTooltip\n          ? (\n              <Tooltip title={tooltipTitle}>\n                {resolvedIconComponent}\n              </Tooltip>\n            )\n          : resolvedIconComponent}\n      </SectionHeadingTypography>\n      {children}\n    </Stack>\n  )\n}\n\nconst SectionHeadingTypography = styled(Typography, { name: 'SectionHeadingTypography' })(({ theme }) => ({\n  display: 'flex',\n  fontFamily: 'monospace',\n  lineHeight: 1,\n  marginBottom: theme.spacing(1.5),\n}))\n","import type { StackProps } from '@mui/material'\nimport {\n  Stack, Typography, useTheme,\n} from '@mui/material'\nimport React from 'react'\n\nexport interface LabelValueStackProps extends StackProps {\n  labels: string[]\n  values: (string | undefined)[]\n}\n\nexport const LabelValueStack: React.FC<LabelValueStackProps> = ({\n  labels, values, ...props\n}) => {\n  const theme = useTheme()\n\n  return (\n    <Stack flexDirection=\"row\" flexGrow={1} {...props}>\n      <Stack>\n        {labels.map(label => (\n          <Typography\n            fontWeight=\"300\"\n            key={label}\n            variant=\"body2\"\n            sx={{ borderBottom: `1px solid ${theme.vars?.palette.divider}`, opacity: 0.7 }}\n          >\n            {label}\n            :\n          </Typography>\n        ))}\n      </Stack>\n      <Stack alignItems=\"end\" flexGrow={1}>\n        {values.map(value => (\n          <Typography\n            fontFamily=\"monospace\"\n            variant=\"body2\"\n            key={value}\n            width=\"100%\"\n            sx={{\n              display: 'flex', justifyContent: 'end', borderBottom: `1px solid ${theme.vars?.palette.divider}`,\n            }}\n          >\n            {value}\n          </Typography>\n        ))}\n      </Stack>\n    </Stack>\n  )\n}\n","import { ErrorRender } from '@xylabs/react-error'\nimport { type FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { usePromise } from '@xylabs/react-promise'\nimport { isDefined } from '@xylabs/typeof'\nimport { SignedHydratedTransactionWrapper } from '@xyo-network/chain-wrappers'\nimport { PayloadBuilder } from '@xyo-network/payload-builder'\nimport {\n  BoundWitnessSignatureTable, BWActions, HashHeadingPaper, HeadingPaper,\n} from '@xyo-network/react-boundwitness-plugin'\nimport type { SignedHydratedTransaction } from '@xyo-network/xl1-protocol'\nimport React from 'react'\nimport { FaSignature } from 'react-icons/fa'\nimport { VscSymbolMethod } from 'react-icons/vsc'\n\nimport { formatPayloadsForTable } from '../../lib/index.ts'\nimport { BWPayloadTableFlexbox } from '../BwPayloadTable.tsx'\nimport { TransactionBoundWitnessCard } from './card/index.ts'\n\nexport interface TransactionBoundWitnessDetailsProps extends FlexBoxProps {\n  transaction?: SignedHydratedTransaction | null\n}\n\nexport const TransactionBoundWitnessDetails: React.FC<TransactionBoundWitnessDetailsProps> = ({ transaction, ...props }) => {\n  const [wrapper, wrapperError] = usePromise(async () => {\n    if (transaction) {\n      return await SignedHydratedTransactionWrapper.parse(transaction)\n    }\n  }, [transaction])\n\n  const [elevatedPayloadSets, elevatedPayloadSetsError] = usePromise(async () => {\n    if (isDefined(wrapper)) {\n      const elevatedPayloads = wrapper.elevatedPayloads\n      const pairs = await PayloadBuilder.hashPairs(elevatedPayloads)\n      return formatPayloadsForTable(pairs)\n    } else {\n      return { hashes: [], schemas: [] }\n    }\n  }, [wrapper])\n\n  const { hashes: elevatedPayloadHashes, schemas: elevatedPayloadSchemas } = elevatedPayloadSets ?? {}\n\n  return (\n    <FlexCol alignItems=\"stretch\" rowGap={2} {...props}>\n      <HashHeadingPaper\n        hash={wrapper?.boundWitness?._hash}\n        paperProps={{ sx: { p: 2 } }}\n        AdornmentEnd={<BWActions boundwitness={wrapper?.boundWitness} />}\n        identiconProps={{ p: 0.75, size: 24 }}\n      />\n      <ErrorRender error={wrapperError} scope=\"wrapperError:TransactionBoundWitnessDetails.tsx\" />\n      <ErrorRender error={elevatedPayloadSetsError} scope=\"elevatedPayloadSetsError:TransactionBoundWitnessDetails.tsx\" />\n      <TransactionBoundWitnessCard elevation={4} wrapper={wrapper} />\n      <BWPayloadTableFlexbox\n        IconComponent={<VscSymbolMethod />}\n        hashes={elevatedPayloadHashes}\n        headingTitle=\"Elevated Payloads\"\n        schemas={elevatedPayloadSchemas}\n        sx={{ mb: 1 }}\n      />\n      <FlexCol alignItems=\"stretch\" rowGap={1} mb={1}>\n        <HeadingPaper IconComponent={<FaSignature />} heading=\"Signatures\" />\n        <BoundWitnessSignatureTable block={wrapper?.boundWitness} />\n      </FlexCol>\n    </FlexCol>\n  )\n}\n"],"mappings":"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","names":["Divider","filterAs","ErrorRender","FlexCol","usePromise","isBoundWitness","PayloadBuilder","BoundWitnessPayloadsTable","BoundWitnessSignatureTable","BWActions","HashHeadingPaper","HeadingPaper","useTxsFromBlock","usePayloadHash","isTransactionBoundWitness","React","useMemo","FaSignature","GrTransaction","VscSymbolMethod","VscSymbolNamespace","formatPayloadsForTable","pairs","hashes","schemas","bw","hash","push","schema","FlexCol","BoundWitnessPayloadTableBody","BoundWitnessPayloadTableHead","HeadingPaper","TableEx","React","VscSymbolMethod","BWPayloadTableFlexbox","IconComponent","eventNoun","hashes","schemas","headingTitle","props","resolvedIconComponent","VscSymbolMethod","FlexCol","alignItems","rowGap","HeadingPaper","heading","TableEx","BoundWitnessPayloadTableHead","BoundWitnessPayloadTableBody","payloadHashes","payloadSchemas","BlockBoundWitnessDetails","block","paper","children","props","boundWitness","payloads","hash","usePayloadHash","transactions","txFromBlockError","useTxsFromBlock","hashes","txHashes","schemas","txSchemas","useMemo","formatPayloadsForTable","nonTxBoundWitnesses","bwsFromBlockError","usePromise","bws","filterAs","payload","isTransactionBoundWitness","isBoundWitness","undefined","PayloadBuilder","hashPairs","nonTxBwHashes","nonTxBwSchemas","hasNonTxBoundWitnesses","length","React","FlexCol","alignItems","rowGap","ErrorRender","error","scope","HashHeadingPaper","paperProps","sx","p","AdornmentEnd","BWActions","boundwitness","identiconProps","size","Divider","flexItem","BWPayloadTableFlexbox","IconComponent","GrTransaction","eventNoun","headingTitle","mb","HeadingPaper","VscSymbolNamespace","heading","BoundWitnessPayloadsTable","VscSymbolMethod","FaSignature","BoundWitnessSignatureTable","Card","CardContent","Grid","Typography","isUndefined","bigIntToFixedPointString","React","useMemo","GiReceiveMoney","GiSandsOfTime","IoStatsChartOutline","MdOutlineAlternateEmail","Stack","styled","Tooltip","Typography","useTheme","isDefined","React","useMemo","DetailsStack","IconComponent","heading","children","tooltipTitle","props","theme","useTheme","hasTooltip","isDefined","resolvedIconComponent","useMemo","React","style","height","marginTop","marginLeft","spacing","Stack","direction","flexGrow","flexWrap","minWidth","SectionHeadingTypography","Tooltip","title","styled","Typography","name","display","fontFamily","lineHeight","marginBottom","Stack","Typography","useTheme","React","LabelValueStack","labels","values","props","theme","useTheme","React","Stack","flexDirection","flexGrow","map","label","Typography","fontWeight","key","variant","sx","borderBottom","vars","palette","divider","opacity","alignItems","value","fontFamily","width","display","justifyContent","formatFee","fee","isUndefined","stringValue","bigIntToFixedPointString","TransactionBoundWitnessCard","wrapper","props","stats","useMemo","labels","values","reward","toLocaleString","navigator","language","elevatedPayloadCount","payloadCount","signatureCount","fees","base","gasPrice","priority","gasLimit","blockDuration","boundWitness","exp","nbf","React","Card","CardContent","Grid","container","spacing","sx","width","size","xs","DetailsStack","IconComponent","MdOutlineAlternateEmail","heading","tooltipTitle","Typography","variant","maxWidth","textOverflow","overflow","fontFamily","from","sm","md","IoStatsChartOutline","LabelValueStack","GiReceiveMoney","GiSandsOfTime","ErrorRender","FlexCol","usePromise","isDefined","SignedHydratedTransactionWrapper","PayloadBuilder","BoundWitnessSignatureTable","BWActions","HashHeadingPaper","HeadingPaper","React","FaSignature","VscSymbolMethod","TransactionBoundWitnessDetails","transaction","props","wrapper","wrapperError","usePromise","SignedHydratedTransactionWrapper","parse","elevatedPayloadSets","elevatedPayloadSetsError","isDefined","elevatedPayloads","pairs","PayloadBuilder","hashPairs","formatPayloadsForTable","hashes","schemas","elevatedPayloadHashes","elevatedPayloadSchemas","React","FlexCol","alignItems","rowGap","HashHeadingPaper","hash","boundWitness","_hash","paperProps","sx","p","AdornmentEnd","BWActions","boundwitness","identiconProps","size","ErrorRender","error","scope","TransactionBoundWitnessCard","elevation","BWPayloadTableFlexbox","IconComponent","VscSymbolMethod","headingTitle","mb","HeadingPaper","FaSignature","heading","BoundWitnessSignatureTable","block"]}

package/dist/types/components/transactions/TransactionDetails.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TransactionDetails.d.ts","sourceRoot":"","sources":["../../../../src/components/transactions/TransactionDetails.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAQlE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAA;AAC1E,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,MAAM,WAAW,mCAAoC,SAAQ,YAAY;IACvE,WAAW,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAA;CAC/C;AAED,eAAO,MAAM,8BAA8B,EAAE,KAAK,CAAC,EAAE,CAAC,mCAAmC,CA6CxF,CAAA"}
+{"version":3,"file":"TransactionDetails.d.ts","sourceRoot":"","sources":["../../../../src/components/transactions/TransactionDetails.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAAW,MAAM,uBAAuB,CAAA;AAQlE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAA;AAC1E,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,MAAM,WAAW,mCAAoC,SAAQ,YAAY;IACvE,WAAW,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAA;CAC/C;AAED,eAAO,MAAM,8BAA8B,EAAE,KAAK,CAAC,EAAE,CAAC,mCAAmC,CA2CxF,CAAA"}

package/dist/types/components/transactions/card/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../../src/components/transactions/card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAM9C,OAAO,KAAK,EAAE,iCAAiC,EAAE,MAAM,+BAA+B,CAAA;AACtF,OAAO,KAAsB,MAAM,OAAO,CAAA;AAO1C,MAAM,WAAW,gCAAiC,SAAQ,SAAS;IACjE,OAAO,CAAC,EAAE,iCAAiC,CAAA;CAC5C;AAED,eAAO,MAAM,2BAA2B,EAAE,KAAK,CAAC,EAAE,CAAC,gCAAgC,CAsGlF,CAAA"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../../src/components/transactions/card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAM9C,OAAO,KAAK,EAAE,iCAAiC,EAAE,MAAM,+BAA+B,CAAA;AACtF,OAAO,KAAkB,MAAM,OAAO,CAAA;AAetC,MAAM,WAAW,gCAAiC,SAAQ,SAAS;IACjE,OAAO,CAAC,EAAE,iCAAiC,CAAA;CAC5C;AAED,eAAO,MAAM,2BAA2B,EAAE,KAAK,CAAC,EAAE,CAAC,gCAAgC,CAgGlF,CAAA"}

package/dist/types/components/transactions/card/DetailsStack.d.ts

@@ -4,6 +4,7 @@ import React from 'react';
 export interface DetailsStackProps extends StackProps {
     IconComponent?: ComponentType<SVGAttributes<SVGElement>>;
     heading?: string;
+    tooltipTitle?: string;
 }
 export declare const DetailsStack: React.FC<DetailsStackProps>;
 //# sourceMappingURL=DetailsStack.d.ts.map

package/dist/types/components/transactions/card/DetailsStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DetailsStack.d.ts","sourceRoot":"","sources":["../../../../../src/components/transactions/card/DetailsStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAI/C,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,WAAW,iBAAkB,SAAQ,UAAU;IACnD,aAAa,CAAC,EAAE,aAAa,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,CAAA;IACxD,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAcpD,CAAA"}
+{"version":3,"file":"DetailsStack.d.ts","sourceRoot":"","sources":["../../../../../src/components/transactions/card/DetailsStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAM/C,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,KAAkB,MAAM,OAAO,CAAA;AAEtC,MAAM,WAAW,iBAAkB,SAAQ,UAAU;IACnD,aAAa,CAAC,EAAE,aAAa,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,CAAA;IACxD,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAoCpD,CAAA"}

package/dist/types/components/transactions/card/LabelValueStack.d.ts

@@ -0,0 +1,8 @@
+import type { StackProps } from '@mui/material';
+import React from 'react';
+export interface LabelValueStackProps extends StackProps {
+    labels: string[];
+    values: (string | undefined)[];
+}
+export declare const LabelValueStack: React.FC<LabelValueStackProps>;
+//# sourceMappingURL=LabelValueStack.d.ts.map

package/dist/types/components/transactions/card/LabelValueStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LabelValueStack.d.ts","sourceRoot":"","sources":["../../../../../src/components/transactions/card/LabelValueStack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAI/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,WAAW,oBAAqB,SAAQ,UAAU;IACtD,MAAM,EAAE,MAAM,EAAE,CAAA;IAChB,MAAM,EAAE,CAAC,MAAM,GAAG,SAAS,CAAC,EAAE,CAAA;CAC/B;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAqC1D,CAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "http://json.schemastore.org/package.json",
   "name": "@xyo-network/react-chain-boundwitness",
-  "version": "1.3.29",
+  "version": "1.3.31",
   "description": "XYO Layer One React SDK BoundWitness",
   "homepage": "https://xylabs.com",
   "bugs": {
@@ -40,18 +40,18 @@
     "@xylabs/react-flexbox": "^6.3.1",
     "@xylabs/react-promise": "^6.3.1",
     "@xylabs/typeof": "^4.9.18",
-    "@xyo-network/boundwitness-model": "^3.16.0",
-    "@xyo-network/chain-utils": "^1.3.29",
-    "@xyo-network/chain-wrappers": "^1.3.29",
-    "@xyo-network/payload-builder": "^3.16.0",
-    "@xyo-network/payload-model": "^3.16.0",
+    "@xyo-network/boundwitness-model": "^3.16.1",
+    "@xyo-network/chain-utils": "^1.3.31",
+    "@xyo-network/chain-wrappers": "^1.3.31",
+    "@xyo-network/payload-builder": "^3.16.1",
+    "@xyo-network/payload-model": "^3.16.1",
     "@xyo-network/react-boundwitness-plugin": "^5.3.4",
-    "@xyo-network/react-chain-blockchain": "^1.3.29",
+    "@xyo-network/react-chain-blockchain": "^1.3.31",
     "@xyo-network/react-event": "^5.3.4",
     "@xyo-network/react-shared": "^5.3.4",
     "@xyo-network/react-table": "^5.3.4",
-    "@xyo-network/xl1-protocol": "^1.3.17",
-    "@xyo-network/xl1-protocol-sdk": "^1.3.29",
+    "@xyo-network/xl1-protocol": "^1.3.31",
+    "@xyo-network/xl1-protocol-sdk": "^1.3.31",
     "react-icons": "^5.5.0"
   },
   "devDependencies": {
@@ -62,9 +62,9 @@
     "@storybook/react": "^8.6.14",
     "@xylabs/ts-scripts-yarn3": "^6.5.7",
     "@xylabs/tsconfig-react": "^6.5.7",
-    "@xyo-network/chain-protocol": "^1.3.29",
-    "@xyo-network/react-chain-shared": "^1.3.29",
-    "knip": "^5.56.0",
+    "@xyo-network/chain-protocol": "^1.3.31",
+    "@xyo-network/react-chain-shared": "^1.3.31",
+    "knip": "^5.57.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-router-dom": "^7.6.0",

package/src/components/transactions/TransactionDetails.tsx

@@ -1,4 +1,3 @@
-import { Divider } from '@mui/material'
 import { ErrorRender } from '@xylabs/react-error'
 import { type FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'
 import { usePromise } from '@xylabs/react-promise'
@@ -41,7 +40,7 @@ export const TransactionBoundWitnessDetails: React.FC<TransactionBoundWitnessDet
   const { hashes: elevatedPayloadHashes, schemas: elevatedPayloadSchemas } = elevatedPayloadSets ?? {}
 
   return (
-    <FlexCol alignItems="stretch" rowGap={4} {...props}>
+    <FlexCol alignItems="stretch" rowGap={2} {...props}>
       <HashHeadingPaper
         hash={wrapper?.boundWitness?._hash}
         paperProps={{ sx: { p: 2 } }}
@@ -50,9 +49,7 @@ export const TransactionBoundWitnessDetails: React.FC<TransactionBoundWitnessDet
       />
       <ErrorRender error={wrapperError} scope="wrapperError:TransactionBoundWitnessDetails.tsx" />
       <ErrorRender error={elevatedPayloadSetsError} scope="elevatedPayloadSetsError:TransactionBoundWitnessDetails.tsx" />
-      <Divider flexItem />
       <TransactionBoundWitnessCard elevation={4} wrapper={wrapper} />
-      <Divider flexItem />
       <BWPayloadTableFlexbox
         IconComponent={<VscSymbolMethod />}
         hashes={elevatedPayloadHashes}

package/src/components/transactions/card/Card.tsx

@@ -5,12 +5,20 @@ import {
 import { isUndefined } from '@xylabs/typeof'
 import { bigIntToFixedPointString } from '@xyo-network/chain-utils'
 import type { SignedHydratedTransactionInstance } from '@xyo-network/xl1-protocol-sdk'
-import React, { useCallback } from 'react'
+import React, { useMemo } from 'react'
 import { GiReceiveMoney, GiSandsOfTime } from 'react-icons/gi'
 import { IoStatsChartOutline } from 'react-icons/io5'
 import { MdOutlineAlternateEmail } from 'react-icons/md'
 
 import { DetailsStack } from './DetailsStack.tsx'
+import { LabelValueStack } from './LabelValueStack.tsx'
+
+const formatFee = (fee?: bigint) => {
+  if (isUndefined(fee)) return
+  const stringValue = bigIntToFixedPointString(fee, 12)
+  if (stringValue === '0') return '0.0'
+  return stringValue
+}
 
 export interface TransactionBoundWitnessCardProps extends CardProps {
   wrapper?: SignedHydratedTransactionInstance
@@ -19,24 +27,65 @@ export interface TransactionBoundWitnessCardProps extends CardProps {
 export const TransactionBoundWitnessCard: React.FC<TransactionBoundWitnessCardProps> = ({ wrapper, ...props }) => {
   if (!wrapper) return null
 
-  const formatFee = useCallback((fee?: bigint) => {
-    if (isUndefined(fee)) return
-    return bigIntToFixedPointString(fee, 12)
-  }, [])
+  const stats = useMemo(() => {
+    const labels = [
+      'Reward',
+      'Elevated Payloads',
+      'Total Payloads',
+      'Signatures',
+    ]
+
+    const values: (string | undefined)[] = [
+      wrapper.reward().toLocaleString(navigator.language ?? 'en-US'),
+      wrapper.elevatedPayloadCount.toLocaleString(navigator.language ?? 'en-US'),
+      wrapper.payloadCount.toLocaleString(navigator.language ?? 'en-US'),
+      wrapper.signatureCount.toLocaleString(navigator.language ?? 'en-US'),,
+    ]
+
+    return { labels, values } as const
+  }, [wrapper])
+
+  const fees = useMemo(() => {
+    const labels = [
+      'Base',
+      'Gas',
+      'Priority',
+      'Gas Limit',
+    ]
+    const values = [
+      formatFee(wrapper.fees.base),
+      formatFee(wrapper.fees.gasPrice),
+      formatFee(wrapper.fees.priority),
+      formatFee(wrapper.fees.gasLimit),
+    ]
+
+    return { labels, values } as const
+  }, [wrapper])
+
+  const blockDuration = useMemo(() => {
+    const labels = [
+      'Expiration',
+      'Not Before',
+    ]
+
+    const values = [
+      wrapper.boundWitness.exp.toLocaleString(navigator.language ?? 'en-US'),
+      wrapper.boundWitness.nbf.toLocaleString(navigator.language ?? 'en-US'),
+    ]
+
+    return { labels, values } as const
+  }, [wrapper])
 
   return (
     <Card {...props}>
-      <CardContent sx={{
-        display: 'flex', flexDirection: 'row', gap: 2, flexWrap: 'wrap',
-      }}
-      >
-        <Grid container spacing={3} sx={{ width: '100%' }}>
+      <CardContent>
+        <Grid container spacing={6} sx={{ width: '100%' }}>
           <Grid size={{ xs: 12 }}>
-            <DetailsStack IconComponent={MdOutlineAlternateEmail} heading="From:">
+            <DetailsStack IconComponent={MdOutlineAlternateEmail} heading="From:" tooltipTitle="Address of the sender">
               <Typography
                 variant="body2"
                 sx={{
-                  maxWidth: '100%', textOverflow: 'ellipsis', overflow: 'hidden',
+                  maxWidth: '100%', textOverflow: 'ellipsis', overflow: 'hidden', fontFamily: 'monospace',
                 }}
               >
                 {wrapper?.boundWitness.from}
@@ -47,71 +96,24 @@ export const TransactionBoundWitnessCard: React.FC<TransactionBoundWitnessCardPr
             xs: 12, sm: 6, md: 4,
           }}
           >
-            <DetailsStack IconComponent={IoStatsChartOutline} heading="Stats">
-              <Typography variant="body2">
-                Reward:
-                {' '}
-                {wrapper?.reward()}
-              </Typography>
-              <Typography variant="body2">
-                Elevated Payloads:
-                {' '}
-                {wrapper?.elevatedPayloadCount}
-              </Typography>
-              <Typography variant="body2">
-                Total Payloads:
-                {' '}
-                {wrapper?.payloadCount}
-              </Typography>
-              <Typography variant="body2">
-                Signatures:
-                {' '}
-                {wrapper?.signatureCount}
-              </Typography>
+            <DetailsStack IconComponent={IoStatsChartOutline} heading="Stats" tooltipTitle="Transaction Statistics">
+              <LabelValueStack labels={stats.labels} values={stats.values} />
             </DetailsStack>
           </Grid>
           <Grid size={{
             xs: 12, sm: 6, md: 4,
           }}
           >
-            <DetailsStack IconComponent={GiReceiveMoney} heading="Fees">
-              <Typography variant="body2">
-                Base:
-                {' '}
-                {formatFee(wrapper?.fees.base)}
-              </Typography>
-              <Typography variant="body2">
-                Gas:
-                {' '}
-                {formatFee(wrapper?.fees.gasPrice)}
-              </Typography>
-              <Typography variant="body2">
-                Priority:
-                {' '}
-                {formatFee(wrapper?.fees.priority)}
-              </Typography>
-              <Typography variant="body2">
-                Gas Limit:
-                {' '}
-                {formatFee(wrapper?.fees.gasLimit)}
-              </Typography>
+            <DetailsStack IconComponent={GiReceiveMoney} heading="Fees" tooltipTitle="Fees offered to the producer">
+              <LabelValueStack labels={fees.labels} values={fees.values} />
             </DetailsStack>
           </Grid>
           <Grid size={{
             xs: 12, sm: 6, md: 4,
           }}
           >
-            <DetailsStack IconComponent={GiSandsOfTime} heading="Block Duration">
-              <Typography variant="body2">
-                Expiration:
-                {' '}
-                {wrapper?.boundWitness.exp}
-              </Typography>
-              <Typography variant="body2">
-                Not Before:
-                {' '}
-                {wrapper?.boundWitness?.nbf}
-              </Typography>
+            <DetailsStack IconComponent={GiSandsOfTime} heading="Block Duration" tooltipTitle="Block window for the transaction to be valid">
+              <LabelValueStack labels={blockDuration.labels} values={blockDuration.values} />
             </DetailsStack>
           </Grid>
         </Grid>

package/src/components/transactions/card/DetailsStack.tsx

@@ -1,35 +1,59 @@
 import type { StackProps } from '@mui/material'
 import {
-  Icon, Stack, styled, Typography,
+  Stack, styled, Tooltip, Typography,
+  useTheme,
 } from '@mui/material'
+import { isDefined } from '@xylabs/typeof'
 import type { ComponentType, SVGAttributes } from 'react'
-import React from 'react'
+import React, { useMemo } from 'react'
 
 export interface DetailsStackProps extends StackProps {
   IconComponent?: ComponentType<SVGAttributes<SVGElement>>
   heading?: string
+  tooltipTitle?: string
 }
 
 export const DetailsStack: React.FC<DetailsStackProps> = ({
-  IconComponent, heading, children, ...props
+  IconComponent, heading, children, tooltipTitle, ...props
 }) => {
+  const theme = useTheme()
+
+  const hasTooltip = isDefined(tooltipTitle)
+  const resolvedIconComponent = useMemo(() => {
+    return IconComponent
+      ? (
+          <IconComponent
+            style={{
+              /** height and marginTop adjusted to account for font not filling container with line-height: 1 */
+              height: '0.85rem',
+              marginTop: 0.5,
+              marginLeft: theme.spacing(1),
+            }}
+          />
+        )
+      : <></>
+  }, [IconComponent])
+
   return (
-    <Stack direction="row" mb={1} gap={1} {...props}>
-      {IconComponent && <Icon fontSize="small" sx={{ mr: 0.25 }}><IconComponent style={{ height: '0.7em' }} /></Icon>}
-      <Stack direction="column" flexWrap="wrap" mb={1}>
-        <SectionHeadingTypography>
-          {heading}
-        </SectionHeadingTypography>
-        {children}
-      </Stack>
+    <Stack direction="column" flexGrow={1} flexWrap="wrap" minWidth="1px" {...props}>
+      <SectionHeadingTypography>
+        {heading}
+        {hasTooltip
+          ? (
+              <Tooltip title={tooltipTitle}>
+                {resolvedIconComponent}
+              </Tooltip>
+            )
+          : resolvedIconComponent}
+      </SectionHeadingTypography>
+      {children}
     </Stack>
   )
 }
 
 const SectionHeadingTypography = styled(Typography, { name: 'SectionHeadingTypography' })(({ theme }) => ({
-  display: 'inline-flex',
-  alignItems: 'baseline',
+  display: 'flex',
   fontFamily: 'monospace',
-  fontSize: 16,
-  marginBottom: theme.spacing(0.75),
+  lineHeight: 1,
+  marginBottom: theme.spacing(1.5),
 }))

package/src/components/transactions/card/LabelValueStack.tsx

@@ -0,0 +1,49 @@
+import type { StackProps } from '@mui/material'
+import {
+  Stack, Typography, useTheme,
+} from '@mui/material'
+import React from 'react'
+
+export interface LabelValueStackProps extends StackProps {
+  labels: string[]
+  values: (string | undefined)[]
+}
+
+export const LabelValueStack: React.FC<LabelValueStackProps> = ({
+  labels, values, ...props
+}) => {
+  const theme = useTheme()
+
+  return (
+    <Stack flexDirection="row" flexGrow={1} {...props}>
+      <Stack>
+        {labels.map(label => (
+          <Typography
+            fontWeight="300"
+            key={label}
+            variant="body2"
+            sx={{ borderBottom: `1px solid ${theme.vars?.palette.divider}`, opacity: 0.7 }}
+          >
+            {label}
+            :
+          </Typography>
+        ))}
+      </Stack>
+      <Stack alignItems="end" flexGrow={1}>
+        {values.map(value => (
+          <Typography
+            fontFamily="monospace"
+            variant="body2"
+            key={value}
+            width="100%"
+            sx={{
+              display: 'flex', justifyContent: 'end', borderBottom: `1px solid ${theme.vars?.palette.divider}`,
+            }}
+          >
+            {value}
+          </Typography>
+        ))}
+      </Stack>
+    </Stack>
+  )
+}