@xyo-network/react-payload-table 2.81.10 → 2.83.0

package/dist/browser/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/DynamicTable/DynamicTableRow.tsx","../../src/components/DynamicTable/PayloadDynamicTableColumnConfig.ts","../../src/components/DynamicTable/Table.tsx","../../src/components/Table/PayloadTableColumnConfig.ts","../../src/components/Table/Table.tsx","../../src/components/Table/TableBody.tsx","../../src/components/Table/TableRow.tsx","../../src/components/Table/TableFooter.tsx","../../src/components/Table/TablePagination.tsx","../../src/components/Table/TableHead.tsx","../../src/components/Table/TableRowNoData.tsx"],"sourcesContent":["import {\n  CheckCircleOutlineRounded as CheckCircleOutlineRoundedIcon,\n  ErrorOutlineRounded as ErrorOutlineRoundedIcon,\n  WarningAmberRounded as WarningAmberRoundedIcon,\n} from '@mui/icons-material'\nimport { AvatarProps, TableCell, TableCellProps, TableRow, TableRowProps, Typography } from '@mui/material'\nimport { usePromise } from '@xylabs/react-promise'\nimport { useBreakpoint } from '@xylabs/react-shared'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\nimport { PayloadValidator } from '@xyo-network/payload-validator'\nimport { useNetwork } from '@xyo-network/react-network'\nimport { PayloadRenderProps } from '@xyo-network/react-payload-plugin'\nimport { usePayloadRenderPluginResolver } from '@xyo-network/react-payload-plugin-resolver'\nimport { HashTableCell, HashTableCellProps, usePayloadHash } from '@xyo-network/react-shared'\nimport React, { ComponentType, useMemo } from 'react'\n\nimport {\n  PayloadDynamicTableColumnConfig,\n  payloadDynamicTableColumnConfigDefaults,\n  PayloadDynamicTableColumnSlug,\n} from './PayloadDynamicTableColumnConfig.ts'\n\nexport interface PayloadDynamicTableRowProps extends TableRowProps {\n  archive?: string\n  columns?: PayloadDynamicTableColumnConfig\n  exploreDomain?: string\n  network?: string\n  payload?: Payload & { sources?: string[] }\n}\n\nexport const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({\n  archive,\n  columns,\n  exploreDomain,\n  network: networkProp,\n  payload,\n  ...props\n}) => {\n  const breakPoint = useBreakpoint()\n  const payloadHash = usePayloadHash(payload)\n  const { network } = useNetwork()\n  const { resolver } = usePayloadRenderPluginResolver()\n  const [validationErrors = []] = usePromise(async () => (payload ? await new PayloadValidator(payload).validate() : undefined), [payload])\n  const isValid = validationErrors.length === 0\n  const payloadFieldCount = payload ? Object.keys(PayloadHasher.hashFields(payload)).length : 0\n  const hash: React.FC<HashTableCellProps> = props => (\n    <HashTableCell\n      key=\"hash\"\n      align=\"left\"\n      archive={archive}\n      value={payloadHash}\n      dataType=\"payload\"\n      exploreDomain={exploreDomain}\n      network={networkProp ?? network?.slug}\n      {...props}\n    />\n  )\n\n  const schema: React.FC<TableCellProps> = props => (\n    <TableCell key=\"payloads\" align=\"left\" {...props}>\n      <Typography fontFamily=\"monospace\" variant=\"body2\" noWrap>\n        {payload?.schema}\n      </Typography>\n    </TableCell>\n  )\n\n  const details: React.FC<TableCellProps> = props => (\n    <TableCell key=\"payloads\" align=\"left\" {...props}>\n      <Typography fontFamily=\"monospace\" variant=\"body2\" noWrap>\n        {payloadFieldCount}\n      </Typography>\n    </TableCell>\n  )\n\n  const render: React.FC<TableCellProps> = (props) => {\n    const Render: ComponentType<PayloadRenderProps & TableCellProps> | undefined\n      = payload ? resolver?.resolve(payload)?.components.table.cell : undefined\n    return Render ? <Render payload={payload} {...props} /> : <TableCell key=\"payloads\" align=\"left\" {...props}></TableCell>\n  }\n\n  const icon: React.FC<TableCellProps> = (props) => {\n    const Avatar: ComponentType<PayloadRenderProps & AvatarProps> | undefined\n      = payload ? resolver?.resolve(payload)?.components.avatar.image : undefined\n\n    return (\n      <TableCell key=\"payloads\" align=\"left\" {...props}>\n        {Avatar\n          ? <Avatar payload={payload} />\n          : null}\n      </TableCell>\n    )\n  }\n\n  const valid: React.FC<TableCellProps> = props => (\n    <TableCell key=\"valid\" align=\"center\" {...props}>\n      {isValid === undefined && payload != undefined\n        ? <WarningAmberRoundedIcon fontSize=\"small\" color=\"warning\" />\n        : isValid === true\n          ? <CheckCircleOutlineRoundedIcon fontSize=\"small\" color=\"success\" />\n          : isValid === false\n            ? <ErrorOutlineRoundedIcon color=\"error\" fontSize=\"small\" />\n          // nbsp to keep row height consistent even when no data is provided for the row\n            : <Typography> &nbsp;</Typography>}\n    </TableCell>\n  )\n\n  const tableCells: Record<PayloadDynamicTableColumnSlug, React.FC<TableCellProps>> = {\n    details,\n    hash,\n    icon,\n    render,\n    schema,\n    valid,\n  }\n\n  const columnsMemo = useMemo(() => columns ?? payloadDynamicTableColumnConfigDefaults(), [columns])\n\n  return breakPoint\n    ? (\n        <TableRow style={{ maxWidth: '100vw' }} {...props}>\n          {columnsMemo[breakPoint]?.map((column) => {\n            return column.slug ? tableCells[column.slug]({}) : null\n          })}\n        </TableRow>\n      )\n    : null\n}\n","export type PayloadDynamicTableColumnSlug = 'hash' | 'schema' | 'valid' | 'details' | 'render' | 'icon'\n\nexport interface PayloadDynamicTableColumnHeadData {\n  alignment?: 'left' | 'center' | 'right'\n  name?: string\n  slug?: 'hash' | 'schema' | 'valid' | 'details' | 'render' | 'icon'\n  width?: string | number\n}\n\nexport interface PayloadDynamicTableColumnConfig {\n  xs?: PayloadDynamicTableColumnHeadData[]\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  sm?: PayloadDynamicTableColumnHeadData[]\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  md?: PayloadDynamicTableColumnHeadData[]\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  lg?: PayloadDynamicTableColumnHeadData[]\n  xl?: PayloadDynamicTableColumnHeadData[]\n}\n\nexport const payloadDynamicTableColumnConfigDefaults = (): PayloadDynamicTableColumnConfig => {\n  const xs: PayloadDynamicTableColumnHeadData[] = [\n    { alignment: 'left', name: 'Hash', slug: 'hash', width: '100%' },\n    { alignment: 'left', name: 'Schema', slug: 'schema', width: '50px' },\n    { alignment: 'left', name: 'Valid', slug: 'valid', width: '50px' },\n  ]\n  const sm: PayloadDynamicTableColumnHeadData[] = [\n    { alignment: 'left', name: 'Icon', slug: 'icon', width: '50px' },\n    { alignment: 'left', name: 'Hash', slug: 'hash', width: '100%' },\n    { alignment: 'left', name: 'Schema', slug: 'schema', width: '50px' },\n    { alignment: 'left', name: 'Valid', slug: 'valid', width: '50px' },\n  ]\n  const md: PayloadDynamicTableColumnHeadData[] = [\n    { alignment: 'left', name: 'Icon', slug: 'icon', width: '50px' },\n    { alignment: 'left', name: 'Hash', slug: 'hash', width: '100%' },\n    { alignment: 'left', name: 'Schema', slug: 'schema', width: '50px' },\n    { alignment: 'left', name: 'Valid', slug: 'valid', width: '50px' },\n  ]\n  const lg: PayloadDynamicTableColumnHeadData[] = [\n    { alignment: 'left', name: 'Icon', slug: 'icon', width: '50px' },\n    { alignment: 'left', name: 'Hash', slug: 'hash', width: '100%' },\n    { alignment: 'left', name: 'Schema', slug: 'schema', width: '50px' },\n    { alignment: 'left', name: 'Render', slug: 'render', width: '50px' },\n    { alignment: 'left', name: 'Valid', slug: 'valid', width: '50px' },\n  ]\n  const xl: PayloadDynamicTableColumnHeadData[] = [\n    { alignment: 'left', name: 'Icon', slug: 'icon', width: '50px' },\n    { alignment: 'left', name: 'Hash', slug: 'hash', width: '100%' },\n    { alignment: 'left', name: 'Schema', slug: 'schema', width: '50px' },\n    { alignment: 'left', name: 'Render', slug: 'render', width: '50px' },\n    { alignment: 'left', name: 'Valid', slug: 'valid', width: '50px' },\n  ]\n  return { lg, md, sm, xl, xs }\n}\n","import { FirstPage as FirstPageIcon, KeyboardArrowLeft, KeyboardArrowRight, LastPage as LastPageIcon } from '@mui/icons-material'\nimport {\n  Alert,\n  Box,\n  IconButton,\n  Table,\n  TableBody,\n  TableCell,\n  TableFooter,\n  TableHead,\n  TablePagination,\n  TableProps,\n  TableRow,\n  Typography,\n  useTheme,\n} from '@mui/material'\nimport { useBreakpoint } from '@xylabs/react-shared'\nimport { Payload } from '@xyo-network/payload-model'\nimport { ThrownErrorBoundary } from '@xyo-network/react-error'\nimport { usePayloadHashes } from '@xyo-network/react-shared'\nimport React, { ReactNode, useEffect, useMemo, useState } from 'react'\n\nimport { PayloadDynamicTableRow } from './DynamicTableRow.tsx'\nimport { PayloadDynamicTableColumnConfig, payloadDynamicTableColumnConfigDefaults } from './PayloadDynamicTableColumnConfig.ts'\n\nexport interface PayloadDynamicTableProps extends TableProps {\n  archive?: string\n  columns?: PayloadDynamicTableColumnConfig\n  exploreDomain?: string\n  onRowClick?: (value: Payload) => void\n  payloads?: Payload[] | null\n  rowsPerPage?: number\n}\n\ninterface TablePaginationActionsProps {\n  count: number\n  onPageChange: (event: React.MouseEvent<HTMLButtonElement>, newPage: number) => void\n  page: number\n  rowsPerPage: number\n}\n\nfunction TablePaginationActions(props: TablePaginationActionsProps) {\n  const theme = useTheme()\n  const { count, page, rowsPerPage, onPageChange } = props\n\n  const handleFirstPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onPageChange(event, 0)\n  }\n\n  const handleBackButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onPageChange(event, page - 1)\n  }\n\n  const handleNextButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onPageChange(event, page + 1)\n  }\n\n  const handleLastPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1))\n  }\n\n  return (\n    <Box sx={{ flexShrink: 0, ml: 2.5 }}>\n      <IconButton onClick={handleFirstPageButtonClick} disabled={page === 0} aria-label=\"first page\">\n        {theme.direction === 'rtl'\n          ? <LastPageIcon />\n          : <FirstPageIcon />}\n      </IconButton>\n      <IconButton onClick={handleBackButtonClick} disabled={page === 0} aria-label=\"previous page\">\n        {theme.direction === 'rtl'\n          ? <KeyboardArrowRight />\n          : <KeyboardArrowLeft />}\n      </IconButton>\n      <IconButton onClick={handleNextButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1} aria-label=\"next page\">\n        {theme.direction === 'rtl'\n          ? <KeyboardArrowLeft />\n          : <KeyboardArrowRight />}\n      </IconButton>\n      <IconButton onClick={handleLastPageButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1} aria-label=\"last page\">\n        {theme.direction === 'rtl'\n          ? <FirstPageIcon />\n          : <LastPageIcon />}\n      </IconButton>\n    </Box>\n  )\n}\n\nexport const PayloadDynamicTable: React.FC<PayloadDynamicTableProps> = ({\n  archive,\n  children,\n  columns,\n  exploreDomain,\n  onRowClick,\n  rowsPerPage: rowsPerPageProp = 10,\n  payloads,\n  ...props\n}) => {\n  const breakPoint = useBreakpoint()\n  const [page, setPage] = useState(0)\n  const [rowsPerPage, setRowsPerPage] = useState(rowsPerPageProp)\n  const payloadCount = payloads ? payloads.length : 0\n  // Avoid a layout jump when reaching the last page with empty rows.\n  const emptyRows = page > 0 ? Math.max(0, (1 + page) * rowsPerPage - payloadCount) : 0\n\n  const pagedPayloads = useMemo(() => payloads?.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage), [payloads, page, rowsPerPage])\n\n  const payloadPairs = usePayloadHashes(pagedPayloads)\n\n  useEffect(() => {\n    setRowsPerPage(rowsPerPageProp)\n  }, [rowsPerPageProp])\n\n  const handleChangePage = (event: React.MouseEvent<HTMLButtonElement> | null, newPage: number) => {\n    setPage(newPage)\n  }\n\n  const handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n    setRowsPerPage(Number.parseInt(event.target.value, 10))\n    setPage(0)\n  }\n\n  return breakPoint\n    ? (\n        <Table stickyHeader {...props}>\n          <TableHead>\n            <TableRow>\n              {(columns ?? payloadDynamicTableColumnConfigDefaults())[breakPoint]?.map((column, index) => {\n                return (\n                  <TableCell key={index} align={column.alignment ?? 'left'} width={column.width}>\n                    <Typography variant=\"body2\" noWrap>\n                      {column.name}\n                    </Typography>\n                  </TableCell>\n                )\n              })}\n            </TableRow>\n          </TableHead>\n          <TableBody sx={{ overflowY: 'scroll ' }}>\n            {payloadPairs?.map(([payload, hash], index) => {\n              return (\n                <ThrownErrorBoundary\n                  boundaryName=\"PayloadTableBody\"\n                  key={`${hash}-${index}`}\n                  errorComponent={e => (\n                    <Alert severity=\"error\">\n                      Error Loading Payload:\n                      {' '}\n                      <Typography fontWeight=\"bold\">{e.message}</Typography>\n                    </Alert>\n                  )}\n                >\n                  <PayloadDynamicTableRow\n                    archive={archive}\n                    onClick={\n                      onRowClick\n                        ? () => {\n                            onRowClick(payload)\n                          }\n                        : undefined\n                    }\n                    exploreDomain={exploreDomain}\n                    payload={payload}\n                  />\n                </ThrownErrorBoundary>\n              )\n            })}\n            {children}\n            {emptyRows ? (Array.from({ length: emptyRows }).fill(<PayloadDynamicTableRow />) as ReactNode[]) : null}\n          </TableBody>\n          <TableFooter>\n            <TableRow>\n              <TablePagination\n                rowsPerPageOptions={[5, 10, 25, { label: 'All', value: -1 }]}\n                colSpan={5}\n                count={payloadCount}\n                rowsPerPage={rowsPerPage}\n                page={page}\n                SelectProps={{\n                  inputProps: {\n                    'aria-label': 'rows per page',\n                  },\n                  native: true,\n                }}\n                onPageChange={handleChangePage}\n                onRowsPerPageChange={handleChangeRowsPerPage}\n                ActionsComponent={TablePaginationActions}\n              />\n            </TableRow>\n          </TableFooter>\n        </Table>\n      )\n    : null\n}\n","export type PayloadTableColumnSlug = 'hash' | 'schema' | 'valid'\n\nexport interface PayloadTableColumnConfig<T = PayloadTableColumnSlug> {\n  xs?: T[]\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  sm?: T[]\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  md?: T[]\n  // eslint-disable-next-line @typescript-eslint/member-ordering\n  lg?: T[]\n  xl?: T[]\n}\n\nexport const payloadColumnNames: Record<PayloadTableColumnSlug, string> = {\n  hash: 'Hash',\n  schema: 'Schema',\n  valid: 'Valid',\n}\n\nexport const payloadTableColumnConfigDefaults = (): PayloadTableColumnConfig => {\n  const xs: PayloadTableColumnSlug[] = ['hash', 'schema', 'valid']\n  const sm: PayloadTableColumnSlug[] = ['hash', 'schema', 'valid']\n  const md: PayloadTableColumnSlug[] = ['hash', 'schema', 'valid']\n  const lg: PayloadTableColumnSlug[] = ['hash', 'schema', 'valid']\n  const xl: PayloadTableColumnSlug[] = ['hash', 'schema', 'valid']\n  return { lg, md, sm, xl, xs }\n}\n","import { Hash } from '@xylabs/hex'\nimport { Payload } from '@xyo-network/payload-model'\nimport { TableEx, TableExProps } from '@xyo-network/react-table'\nimport React, { ComponentType, forwardRef, useEffect, useMemo, useState } from 'react'\n\nimport { PayloadTableColumnConfig } from './PayloadTableColumnConfig.ts'\nimport { PayloadTableBody } from './TableBody.tsx'\nimport { PayloadTableFooter } from './TableFooter.tsx'\nimport { PayloadTableHead } from './TableHead.tsx'\nimport { TableRowNoData } from './TableRowNoData.tsx'\nimport { PayloadTableBodyProps, PayloadTableFooterProps, PayloadTableHeadProps } from './types/index.ts'\n\nexport interface PayloadTableProps extends TableExProps {\n  PayloadTableBodyComponent?: ComponentType<PayloadTableBodyProps>\n  PayloadTableFooterComponent?: ComponentType<PayloadTableFooterProps>\n  PayloadTableHeadComponent?: ComponentType<PayloadTableHeadProps>\n  archive?: string\n  columns?: PayloadTableColumnConfig\n  /** Total number of payloads passed */\n  count?: number\n  exploreDomain?: string\n  /** External trigger to fetch more payloads */\n  fetchMorePayloads?: () => void\n  loading?: boolean\n  /** set number of schema parts to display starting from the end */\n  maxSchemaDepth?: number\n  onHashClick?: (value: Hash) => void\n  onRowClick?: (value: Payload) => void\n  payloads?: Payload[] | null\n  rowsPerPage?: number\n}\n\nexport const PayloadTableWithRef = forwardRef<HTMLTableElement, PayloadTableProps>(\n  (\n    {\n      exploreDomain,\n      archive,\n      onHashClick,\n      onRowClick,\n      fetchMorePayloads,\n      rowsPerPage: rowsPerPageProp = 25,\n      payloads,\n      columns,\n      PayloadTableHeadComponent = PayloadTableHead,\n      PayloadTableBodyComponent = PayloadTableBody,\n      PayloadTableFooterComponent = PayloadTableFooter,\n      maxSchemaDepth,\n      count = 0,\n      loading = false,\n      variant = 'scrollable',\n      ...props\n    },\n    ref,\n  ) => {\n    const [page, setPage] = useState(0)\n    const [rowsPerPage, setRowsPerPage] = useState(rowsPerPageProp)\n    const [visiblePayloads, setVisiblePayloads] = useState<Payload[]>([])\n\n    // Avoid a layout jump when reaching the last page with empty rows.\n    const emptyRows = page > 0 ? Math.max(0, (1 + page) * rowsPerPage - count || 0) : 0\n\n    useEffect(() => {\n      setRowsPerPage(rowsPerPageProp)\n    }, [rowsPerPageProp])\n\n    // React to various prop changes to derive new visible payloads\n    // count is needed to show initial payloads added async to the same payloads reference\n    useEffect(() => {\n      if (payloads) {\n        setVisiblePayloads(payloads.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage))\n      }\n    }, [count, page, payloads, rowsPerPage])\n\n    // If the payload reference changes, assume we have a new list and reset current page\n    useEffect(() => {\n      setPage(0)\n    }, [payloads])\n\n    const handleAdditionalPayloads = () => {\n      if (fetchMorePayloads && payloads) {\n        const buffer = rowsPerPage * 2\n        const lastVisiblePayload = visiblePayloads?.at(-1)\n        if (lastVisiblePayload) {\n          const lastVisibleIndex = payloads?.indexOf(lastVisiblePayload)\n          if (lastVisibleIndex !== undefined && payloads.length - (lastVisibleIndex + 1) <= buffer) {\n            fetchMorePayloads()\n          }\n        }\n      }\n    }\n\n    const handleChangePage = (_event: React.MouseEvent<HTMLButtonElement> | null, newPage: number) => {\n      handleAdditionalPayloads()\n      setPage(newPage)\n    }\n\n    const handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      setRowsPerPage(Number.parseInt(event.target.value, 10))\n      setPage(0)\n    }\n\n    const noResults = useMemo(() => {\n      return !loading && (!visiblePayloads || visiblePayloads.length === 0)\n    }, [loading, visiblePayloads])\n\n    return (\n      <TableEx variant={variant} ref={ref} {...props}>\n        <PayloadTableHeadComponent columns={columns} />\n        <PayloadTableBodyComponent\n          payloads={visiblePayloads}\n          exploreDomain={exploreDomain}\n          archive={archive}\n          maxSchemaDepth={maxSchemaDepth}\n          onRowClick={onRowClick}\n          onHashClick={onHashClick}\n          emptyRows={emptyRows}\n          noResults={noResults}\n          NoResultRowComponent={TableRowNoData}\n        />\n        <PayloadTableFooterComponent\n          count={count}\n          variant={variant}\n          rowsPerPage={rowsPerPage}\n          handleChangePage={handleChangePage}\n          handleChangeRowsPerPage={handleChangeRowsPerPage}\n          fetchMorePayloads={fetchMorePayloads}\n          loading={loading}\n          page={page}\n        />\n      </TableEx>\n    )\n  },\n)\n\nPayloadTableWithRef.displayName = 'PayloadTable'\n\nexport const PayloadTable = PayloadTableWithRef\n","import { Alert, TableBody, Typography } from '@mui/material'\nimport { ThrownErrorBoundary } from '@xyo-network/react-error'\nimport { usePayloadHashes } from '@xyo-network/react-shared'\nimport React, { ReactNode } from 'react'\n\nimport { PayloadTableRow } from './TableRow.tsx'\nimport { PayloadTableBodyProps } from './types/index.ts'\n\nexport const PayloadTableBody: React.FC<PayloadTableBodyProps> = ({\n  children,\n  exploreDomain,\n  payloads,\n  archive,\n  maxSchemaDepth,\n  onHashClick,\n  onRowClick,\n  emptyRows,\n  noResults,\n  NoResultRowComponent,\n  ...props\n}) => {\n  const payloadPairs = usePayloadHashes(payloads)\n\n  return (\n    <TableBody {...props}>\n      {noResults && NoResultRowComponent\n        ? <NoResultRowComponent />\n        : null}\n      {payloadPairs?.map(([payload, hash], index) => {\n        return (\n          <ThrownErrorBoundary\n            boundaryName=\"PayloadTableBody\"\n            key={`${hash}-${index}`}\n            errorComponent={e => (\n              <Alert severity=\"error\">\n                Error Loading Payload:\n                {' '}\n                <Typography fontWeight=\"bold\">{e.message}</Typography>\n              </Alert>\n            )}\n          >\n            <PayloadTableRow\n              maxSchemaDepth={maxSchemaDepth}\n              archive={archive}\n              onClick={\n                onRowClick\n                  ? () => {\n                      onRowClick(payload)\n                    }\n                  : undefined\n              }\n              onHashClick={onHashClick}\n              exploreDomain={exploreDomain}\n              payload={payload}\n            />\n          </ThrownErrorBoundary>\n        )\n      })}\n      {children}\n      {emptyRows ? (Array.from({ length: emptyRows }).fill(<PayloadTableRow />) as ReactNode[]) : null}\n    </TableBody>\n  )\n}\n","import {\n  CheckCircleOutlineRounded as CheckCircleOutlineRoundedIcon,\n  ErrorOutlineRounded as ErrorOutlineRoundedIcon,\n  WarningAmberRounded as WarningAmberRoundedIcon,\n} from '@mui/icons-material'\nimport { alpha, TableCell, TableCellProps, TableRow, TableRowProps, Typography } from '@mui/material'\nimport { Hash } from '@xylabs/hex'\nimport { usePromise } from '@xylabs/react-promise'\nimport { useBreakpoint } from '@xylabs/react-shared'\nimport { Payload } from '@xyo-network/payload-model'\nimport { PayloadValidator } from '@xyo-network/payload-validator'\nimport { useNetwork } from '@xyo-network/react-network'\nimport { HashTableCell, usePayloadHash } from '@xyo-network/react-shared'\nimport React, { useMemo } from 'react'\n\nimport { PayloadTableColumnConfig, payloadTableColumnConfigDefaults, PayloadTableColumnSlug } from './PayloadTableColumnConfig.ts'\n\nexport interface PayloadTableRowProps extends TableRowProps {\n  archive?: string\n  columns?: PayloadTableColumnConfig\n  exploreDomain?: string\n  maxSchemaDepth?: number\n  network?: string\n  onHashClick?: (value: Hash) => void\n  payload?: Payload\n}\n\nexport const PayloadTableRow: React.FC<PayloadTableRowProps> = ({\n  archive,\n  columns,\n  exploreDomain,\n  maxSchemaDepth,\n  network: networkProp,\n  onHashClick,\n  payload,\n  ...props\n}) => {\n  const breakPoint = useBreakpoint()\n  const payloadHash = usePayloadHash(payload)\n  const { network } = useNetwork()\n  const [errors = []] = usePromise(async () => (payload ? await new PayloadValidator(payload).validate() : undefined), [payload])\n  const isValid = errors.length === 0\n\n  const hash: React.FC<TableCellProps> = props => (\n    <HashTableCell\n      key=\"hash\"\n      archive={archive}\n      width=\"100%\"\n      value={payloadHash}\n      onHashClick={onHashClick}\n      dataType=\"payload\"\n      exploreDomain={exploreDomain}\n      network={networkProp ?? network?.slug}\n      {...props}\n    />\n  )\n\n  const reduceSchemaDepth = (schema?: string, maxSchemaDepth?: number) => {\n    if (maxSchemaDepth) {\n      const parts = schema?.split('.') ?? []\n      const partsToRemove = parts.length - maxSchemaDepth > 0 ? parts.length - maxSchemaDepth : 0\n      if (partsToRemove > 0) {\n        return (\n          <>\n            <>&#x2026;</>\n            {\n              // eslint-disable-next-line unicorn/no-array-reduce\n              `${parts.slice(partsToRemove).reduce((previousValue, part) => `${previousValue}.${part}`)}`\n            }\n          </>\n        )\n      }\n    }\n    return schema\n  }\n\n  const schema: React.FC<TableCellProps> = props => (\n    <TableCell title={payload?.schema} key=\"payloads\" align=\"center\" {...props}>\n      <Typography fontFamily=\"monospace\" variant=\"body2\" noWrap>\n        {reduceSchemaDepth(payload?.schema, maxSchemaDepth)}\n      </Typography>\n    </TableCell>\n  )\n\n  const valid: React.FC<TableCellProps> = props => (\n    <TableCell key=\"valid\" align=\"center\" {...props}>\n      {isValid === undefined && payload != undefined\n        ? <WarningAmberRoundedIcon fontSize=\"small\" color=\"warning\" />\n        : isValid === true\n          ? <CheckCircleOutlineRoundedIcon fontSize=\"small\" color=\"success\" />\n          : isValid === false\n            ? <ErrorOutlineRoundedIcon color=\"error\" fontSize=\"small\" />\n          // to keep row height consistent when no data provided, may need fix later\n            : <ErrorOutlineRoundedIcon sx={{ color: alpha('#fff', 0) }} fontSize=\"small\" />}\n    </TableCell>\n  )\n\n  const tableCells: Record<PayloadTableColumnSlug, React.FC<TableCellProps>> = {\n    hash,\n    schema,\n    valid,\n  }\n\n  const columnsMemo = useMemo(() => columns ?? payloadTableColumnConfigDefaults(), [columns])\n\n  return breakPoint\n    ? (\n        <TableRow style={{ maxWidth: '100vw' }} {...props}>\n          {columnsMemo[breakPoint]?.map((column) => {\n            return tableCells[column]({})\n          })}\n        </TableRow>\n      )\n    : null\n}\n","import { styled, TablePagination, TableRow } from '@mui/material'\nimport { TableFooterEx } from '@xyo-network/react-table'\nimport React from 'react'\n\nimport { TablePaginationActions } from './TablePagination.tsx'\nimport { PayloadTableFooterProps } from './types/index.ts'\n\nexport const PayloadTableFooter: React.FC<PayloadTableFooterProps> = ({\n  count,\n  variant,\n  page,\n  rowsPerPage,\n  handleChangePage,\n  handleChangeRowsPerPage,\n  fetchMorePayloads,\n  loading,\n}) => (\n  <TableFooterEx variant={variant}>\n    <TableRow>\n      <StyledTablePagination\n        rowsPerPageOptions={[5, 10, 25, { label: 'All', value: -1 }]}\n        count={count ?? 0}\n        rowsPerPage={rowsPerPage ?? 10}\n        page={page ?? 0}\n        SelectProps={{\n          inputProps: {\n            'aria-label': 'rows per page',\n          },\n          native: true,\n        }}\n        onPageChange={handleChangePage ?? (() => {})}\n        onRowsPerPageChange={handleChangeRowsPerPage ?? (() => {})}\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        ActionsComponent={(props: any) => <TablePaginationActions enableNextPage={!!fetchMorePayloads} loading={loading} {...props} />}\n      />\n    </TableRow>\n  </TableFooterEx>\n)\n\nconst StyledTablePagination = styled(TablePagination)(({ theme }) => ({\n  '& > .MuiToolbar-root': {\n    paddingLeft: theme.spacing(1),\n  },\n  'borderTop': '1px solid',\n  'borderTopColor': theme.palette.divider,\n}))\n","import { FirstPage as FirstPageIcon, KeyboardArrowLeft, KeyboardArrowRight, LastPage as LastPageIcon } from '@mui/icons-material'\nimport { Box, CircularProgress, IconButton, useTheme } from '@mui/material'\nimport { useEvent } from '@xyo-network/react-event'\nimport React from 'react'\n\nimport { PaginationNouns } from './types/index.ts'\n\nexport interface TablePaginationActionsProps {\n  count: number\n  enableNextPage?: boolean\n  loading?: boolean\n  onPageChange: (event: React.MouseEvent<HTMLButtonElement>, newPage: number) => void\n  page: number\n  rowsPerPage: number\n}\n\nexport function TablePaginationActions({ count, enableNextPage, loading, onPageChange, page, rowsPerPage }: TablePaginationActionsProps) {\n  const theme = useTheme()\n  const [paginationRef, paginationDispatch] = useEvent<HTMLButtonElement, PaginationNouns>()\n\n  const handleFirstPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    paginationDispatch('firstPage', 'click', 'true')\n    onPageChange(event, 0)\n  }\n\n  const handleBackButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    paginationDispatch('previousPage', 'click', (page - 1)?.toString())\n    onPageChange(event, page - 1)\n  }\n\n  const handleNextButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    paginationDispatch('nextPage', 'click', (page + 1)?.toString())\n    onPageChange(event, page + 1)\n  }\n\n  const handleLastPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n    paginationDispatch('lastPage', 'click', 'true')\n    onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1))\n  }\n\n  return (\n    <>\n      {loading\n        ? <CircularProgress size=\"small\" sx={{ height: theme.spacing(2), position: 'absolute', width: theme.spacing(2) }} />\n        : null}\n      <Box sx={{ flexShrink: 0, ml: 2.5 }}>\n        <IconButton onClick={handleFirstPageButtonClick} disabled={page === 0} aria-label=\"first page\">\n          {theme.direction === 'rtl'\n            ? <LastPageIcon />\n            : <FirstPageIcon />}\n        </IconButton>\n        <IconButton ref={paginationRef} onClick={handleBackButtonClick} disabled={page === 0} aria-label=\"previous page\">\n          {theme.direction === 'rtl'\n            ? <KeyboardArrowRight />\n            : <KeyboardArrowLeft />}\n        </IconButton>\n        <IconButton\n          ref={paginationRef}\n          onClick={handleNextButtonClick}\n          disabled={!enableNextPage && page >= Math.ceil(count / rowsPerPage) - 1}\n          aria-label=\"next page\"\n        >\n          {theme.direction === 'rtl'\n            ? <KeyboardArrowLeft />\n            : <KeyboardArrowRight />}\n        </IconButton>\n        <IconButton onClick={handleLastPageButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1} aria-label=\"last page\">\n          {theme.direction === 'rtl'\n            ? <FirstPageIcon />\n            : <LastPageIcon />}\n        </IconButton>\n      </Box>\n    </>\n  )\n}\n","import { TableCell, TableHead, TableRow, Typography } from '@mui/material'\nimport { useBreakpoint } from '@xylabs/react-shared'\nimport React, { useMemo } from 'react'\n\nimport { payloadColumnNames, payloadTableColumnConfigDefaults } from './PayloadTableColumnConfig.ts'\nimport { PayloadTableHeadProps } from './types/index.ts'\n\nexport const PayloadTableHead: React.FC<PayloadTableHeadProps> = ({ columns, ...props }) => {\n  const breakPoint = useBreakpoint()\n  const columnsMemo = useMemo(() => columns ?? payloadTableColumnConfigDefaults(), [columns])\n  return (\n    <TableHead {...props}>\n      <TableRow>\n        {breakPoint\n          ? columnsMemo[breakPoint]?.map((column, index) => {\n            return (\n              <TableCell key={index} width={index === 0 ? '100%' : undefined} align={index === 0 ? 'left' : 'center'}>\n                <Typography variant=\"body2\" noWrap>\n                  {payloadColumnNames[column]}\n                </Typography>\n              </TableCell>\n            )\n          })\n          : null}\n      </TableRow>\n    </TableHead>\n  )\n}\n","import { styled, TableCell, TableRow, TableRowProps, Typography, TypographyProps } from '@mui/material'\nimport React from 'react'\n\nexport interface TableRowNoDataProps extends TableRowProps {\n  additionalCells?: number\n  hideBorder?: boolean\n  typographyProps?: TypographyProps\n}\n\nexport const TableRowNoData: React.FC<TableRowNoDataProps> = ({ additionalCells, hideBorder = false, typographyProps, ...props }) => {\n  return (\n    <TableRow {...props}>\n      <StyledTableCell hideBorder={hideBorder}>\n        <Typography variant=\"body2\" {...typographyProps}>\n          No Data To Display...\n        </Typography>\n      </StyledTableCell>\n      {additionalCells\n        ? Array.from({ length: additionalCells })\n          .fill(null)\n          .map((_fill, index) => <StyledTableCell key={index} hideBorder={hideBorder} />)\n        : null}\n    </TableRow>\n  )\n}\n\ninterface StyledTableCellProps {\n  hideBorder?: boolean\n}\n\nconst StyledTableCell = styled(TableCell, {\n  name: 'StyledTableCell',\n  shouldForwardProp: (prop: string) => prop !== 'hideBorder',\n})<StyledTableCellProps>(({ hideBorder }) => ({\n  ...(hideBorder && { border: 'none' }),\n}))\n"],"mappings":"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","names":["CheckCircleOutlineRounded","CheckCircleOutlineRoundedIcon","ErrorOutlineRounded","ErrorOutlineRoundedIcon","WarningAmberRounded","WarningAmberRoundedIcon","TableCell","TableRow","Typography","usePromise","useBreakpoint","PayloadHasher","PayloadValidator","useNetwork","usePayloadRenderPluginResolver","HashTableCell","usePayloadHash","React","useMemo","payloadDynamicTableColumnConfigDefaults","xs","alignment","name","slug","width","sm","md","lg","xl","PayloadDynamicTableRow","archive","columns","exploreDomain","network","networkProp","payload","props","breakPoint","useBreakpoint","payloadHash","usePayloadHash","useNetwork","resolver","usePayloadRenderPluginResolver","validationErrors","usePromise","PayloadValidator","validate","undefined","isValid","length","payloadFieldCount","Object","keys","PayloadHasher","hashFields","hash","HashTableCell","key","align","value","dataType","slug","schema","TableCell","Typography","fontFamily","variant","noWrap","details","render","Render","resolve","components","table","cell","icon","Avatar","avatar","image","valid","WarningAmberRoundedIcon","fontSize","color","CheckCircleOutlineRoundedIcon","ErrorOutlineRoundedIcon","tableCells","columnsMemo","useMemo","payloadDynamicTableColumnConfigDefaults","TableRow","style","maxWidth","map","column","FirstPage","FirstPageIcon","KeyboardArrowLeft","KeyboardArrowRight","LastPage","LastPageIcon","Alert","Box","IconButton","Table","TableBody","TableCell","TableFooter","TableHead","TablePagination","TableRow","Typography","useTheme","useBreakpoint","ThrownErrorBoundary","usePayloadHashes","React","useEffect","useMemo","useState","TablePaginationActions","props","theme","useTheme","count","page","rowsPerPage","onPageChange","handleFirstPageButtonClick","event","handleBackButtonClick","handleNextButtonClick","handleLastPageButtonClick","Math","max","ceil","React","Box","sx","flexShrink","ml","IconButton","onClick","disabled","aria-label","direction","LastPageIcon","FirstPageIcon","KeyboardArrowRight","KeyboardArrowLeft","PayloadDynamicTable","archive","children","columns","exploreDomain","onRowClick","rowsPerPageProp","payloads","breakPoint","useBreakpoint","setPage","useState","setRowsPerPage","payloadCount","length","emptyRows","pagedPayloads","useMemo","slice","payloadPairs","usePayloadHashes","useEffect","handleChangePage","newPage","handleChangeRowsPerPage","Number","parseInt","target","value","Table","stickyHeader","TableHead","TableRow","payloadDynamicTableColumnConfigDefaults","map","column","index","TableCell","key","align","alignment","width","Typography","variant","noWrap","name","TableBody","overflowY","payload","hash","ThrownErrorBoundary","boundaryName","errorComponent","e","Alert","severity","fontWeight","message","PayloadDynamicTableRow","undefined","Array","from","fill","TableFooter","TablePagination","rowsPerPageOptions","label","colSpan","SelectProps","inputProps","native","onRowsPerPageChange","ActionsComponent","payloadColumnNames","hash","schema","valid","payloadTableColumnConfigDefaults","xs","sm","md","lg","xl","TableEx","React","forwardRef","useEffect","useMemo","useState","Alert","TableBody","Typography","ThrownErrorBoundary","usePayloadHashes","React","CheckCircleOutlineRounded","CheckCircleOutlineRoundedIcon","ErrorOutlineRounded","ErrorOutlineRoundedIcon","WarningAmberRounded","WarningAmberRoundedIcon","alpha","TableCell","TableRow","Typography","usePromise","useBreakpoint","PayloadValidator","useNetwork","HashTableCell","usePayloadHash","React","useMemo","PayloadTableRow","archive","columns","exploreDomain","maxSchemaDepth","network","networkProp","onHashClick","payload","props","breakPoint","useBreakpoint","payloadHash","usePayloadHash","useNetwork","errors","usePromise","PayloadValidator","validate","undefined","isValid","length","hash","React","HashTableCell","key","width","value","dataType","slug","reduceSchemaDepth","schema","parts","split","partsToRemove","slice","reduce","previousValue","part","TableCell","title","align","Typography","fontFamily","variant","noWrap","valid","WarningAmberRoundedIcon","fontSize","color","CheckCircleOutlineRoundedIcon","ErrorOutlineRoundedIcon","sx","alpha","tableCells","columnsMemo","useMemo","payloadTableColumnConfigDefaults","TableRow","style","maxWidth","map","column","PayloadTableBody","children","exploreDomain","payloads","archive","maxSchemaDepth","onHashClick","onRowClick","emptyRows","noResults","NoResultRowComponent","props","payloadPairs","usePayloadHashes","React","TableBody","map","payload","hash","index","ThrownErrorBoundary","boundaryName","key","errorComponent","e","Alert","severity","Typography","fontWeight","message","PayloadTableRow","onClick","undefined","Array","from","length","fill","styled","TablePagination","TableRow","TableFooterEx","React","FirstPage","FirstPageIcon","KeyboardArrowLeft","KeyboardArrowRight","LastPage","LastPageIcon","Box","CircularProgress","IconButton","useTheme","useEvent","React","TablePaginationActions","count","enableNextPage","loading","onPageChange","page","rowsPerPage","theme","useTheme","paginationRef","paginationDispatch","useEvent","handleFirstPageButtonClick","event","handleBackButtonClick","toString","handleNextButtonClick","handleLastPageButtonClick","Math","max","ceil","React","CircularProgress","size","sx","height","spacing","position","width","Box","flexShrink","ml","IconButton","onClick","disabled","aria-label","direction","LastPageIcon","FirstPageIcon","ref","KeyboardArrowRight","KeyboardArrowLeft","PayloadTableFooter","count","variant","page","rowsPerPage","handleChangePage","handleChangeRowsPerPage","fetchMorePayloads","loading","React","TableFooterEx","TableRow","StyledTablePagination","rowsPerPageOptions","label","value","SelectProps","inputProps","native","onPageChange","onRowsPerPageChange","ActionsComponent","props","TablePaginationActions","enableNextPage","styled","TablePagination","theme","paddingLeft","spacing","palette","divider","TableCell","TableHead","TableRow","Typography","useBreakpoint","React","useMemo","PayloadTableHead","columns","props","breakPoint","useBreakpoint","columnsMemo","useMemo","payloadTableColumnConfigDefaults","React","TableHead","TableRow","map","column","index","TableCell","key","width","undefined","align","Typography","variant","noWrap","payloadColumnNames","styled","TableCell","TableRow","Typography","React","TableRowNoData","additionalCells","hideBorder","typographyProps","props","React","TableRow","StyledTableCell","Typography","variant","Array","from","length","fill","map","_fill","index","key","styled","TableCell","name","shouldForwardProp","prop","border","PayloadTableWithRef","forwardRef","exploreDomain","archive","onHashClick","onRowClick","fetchMorePayloads","rowsPerPage","rowsPerPageProp","payloads","columns","PayloadTableHeadComponent","PayloadTableHead","PayloadTableBodyComponent","PayloadTableBody","PayloadTableFooterComponent","PayloadTableFooter","maxSchemaDepth","count","loading","variant","props","ref","page","setPage","useState","setRowsPerPage","visiblePayloads","setVisiblePayloads","emptyRows","Math","max","useEffect","slice","handleAdditionalPayloads","buffer","lastVisiblePayload","at","lastVisibleIndex","indexOf","undefined","length","handleChangePage","_event","newPage","handleChangeRowsPerPage","event","Number","parseInt","target","value","noResults","useMemo","React","TableEx","NoResultRowComponent","TableRowNoData","displayName","PayloadTable"]}

package/package.json

@@ -10,28 +10,28 @@
     "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
   },
   "dependencies": {
-    "@xylabs/hex": "^3.6.4",
-    "@xylabs/react-promise": "^3.4.1",
-    "@xylabs/react-shared": "^3.4.1",
-    "@xyo-network/hash": "^2.110.9",
-    "@xyo-network/payload-model": "^2.110.9",
-    "@xyo-network/payload-validator": "^2.110.9",
-    "@xyo-network/react-error": "^2.81.10",
-    "@xyo-network/react-event": "^2.81.10",
-    "@xyo-network/react-network": "^2.81.10",
-    "@xyo-network/react-payload-plugin": "^2.81.10",
-    "@xyo-network/react-payload-plugin-resolver": "^2.81.10",
-    "@xyo-network/react-shared": "^2.81.10",
-    "@xyo-network/react-table": "^2.81.10"
+    "@xylabs/hex": "^3.6.12",
+    "@xylabs/react-promise": "^3.4.2",
+    "@xylabs/react-shared": "^3.4.2",
+    "@xyo-network/hash": "^2.111.3",
+    "@xyo-network/payload-model": "^2.111.3",
+    "@xyo-network/payload-validator": "^2.111.3",
+    "@xyo-network/react-error": "^2.83.0",
+    "@xyo-network/react-event": "^2.83.0",
+    "@xyo-network/react-network": "^2.83.0",
+    "@xyo-network/react-payload-plugin": "^2.83.0",
+    "@xyo-network/react-payload-plugin-resolver": "^2.83.0",
+    "@xyo-network/react-shared": "^2.83.0",
+    "@xyo-network/react-table": "^2.83.0"
   },
   "devDependencies": {
-    "@storybook/react": "^7.6.20",
-    "@xylabs/delay": "^3.6.4",
-    "@xylabs/ts-scripts-yarn3": "^3.12.4",
-    "@xylabs/tsconfig-react": "^3.12.4",
-    "@xyo-network/react-crypto-market-uniswap-plugin": "^2.81.10",
-    "@xyo-network/react-storybook": "^2.81.10",
-    "react-router-dom": "^6.25.1",
+    "@storybook/react": "^8.2.7",
+    "@xylabs/delay": "^3.6.12",
+    "@xylabs/ts-scripts-yarn3": "^4.0.0-rc.7",
+    "@xylabs/tsconfig-react": "^4.0.0-rc.7",
+    "@xyo-network/react-crypto-market-uniswap-plugin": "^2.83.0",
+    "@xyo-network/react-storybook": "^2.83.0",
+    "react-router-dom": "^6.26.0",
     "typescript": "^5.5.4"
   },
   "peerDependencies": {
@@ -47,32 +47,16 @@
   "docs": "dist/docs.json",
   "exports": {
     ".": {
-      "node": {
-        "import": {
-          "types": "./dist/node/index.d.mts",
-          "default": "./dist/node/index.js"
-        },
-        "require": {
-          "types": "./dist/node/index.d.cts",
-          "default": "./dist/node/index.cjs"
-        }
+      "import": {
+        "types": "./dist/browser/index.d.ts",
+        "default": "./dist/browser/index.mjs"
       },
-      "browser": {
-        "import": {
-          "types": "./dist/browser/index.d.mts",
-          "default": "./dist/browser/index.js"
-        },
-        "require": {
-          "types": "./dist/browser/index.d.cts",
-          "default": "./dist/browser/index.cjs"
-        }
-      },
-      "default": "./dist/browser/index.js"
+      "types": "./dist/browser/index.d.ts",
+      "default": "./dist/browser/index.mjs"
     },
     "./package.json": "./package.json"
   },
-  "main": "dist/browser/index.cjs",
-  "module": "dist/browser/index.js",
+  "module": "dist/browser/index.mjs",
   "types": "dist/browser/index.d.ts",
   "homepage": "https://xyo.network",
   "keywords": [
@@ -94,6 +78,6 @@
     "license": "yarn license-checker --exclude \"MIT, ISC, Apache-2.0, BSD, BSD-2-Clause, CC-BY-4.0, Unlicense, CC-BY-3.0, CC0-1.0\""
   },
   "sideEffects": false,
-  "version": "2.81.10",
+  "version": "2.83.0",
   "type": "module"
 }

package/src/components/DynamicTable/DynamicTable.stories.tsx

@@ -3,9 +3,10 @@ import { UniswapPairsRenderPlugin } from '@xyo-network/react-crypto-market-unisw
 import { DefaultPayloadRenderPlugin } from '@xyo-network/react-payload-plugin'
 import { PayloadRenderPluginResolver, PayloadRenderPluginResolverProvider } from '@xyo-network/react-payload-plugin-resolver'
 import { sampleCoinGeckoPayload, sampleIdPayload, sampleSystemInfoBrowserPayload, sampleUniswapPayload } from '@xyo-network/react-storybook'
+import React from 'react'
 import { BrowserRouter } from 'react-router-dom'
 
-import { PayloadDynamicTable } from './Table.js'
+import { PayloadDynamicTable } from './Table.tsx'
 
 const StorybookEntry = {
   argTypes: {},
@@ -18,7 +19,7 @@ const StorybookEntry = {
   title: 'payload/DynamicTable',
 } as Meta<typeof PayloadDynamicTable>
 
-const Template: StoryFn<typeof PayloadDynamicTable> = (args) => (
+const Template: StoryFn<typeof PayloadDynamicTable> = args => (
   <PayloadRenderPluginResolverProvider
     resolver={new PayloadRenderPluginResolver().register(UniswapPairsRenderPlugin).register(DefaultPayloadRenderPlugin)}
   >
@@ -59,14 +60,13 @@ WithData.args = {
 }
 
 const WithError = Template.bind({})
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 const { ...badPayload } = sampleIdPayload
 
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-//@ts-ignore
+// @ts-ignore
 WithError.args = { payloads: [sampleIdPayload, badPayload] }
 
 export { Default, WithData, WithError }
 
-// eslint-disable-next-line import/no-default-export
 export default StorybookEntry

package/src/components/DynamicTable/DynamicTableRow.tsx

@@ -13,13 +13,13 @@ import { useNetwork } from '@xyo-network/react-network'
 import { PayloadRenderProps } from '@xyo-network/react-payload-plugin'
 import { usePayloadRenderPluginResolver } from '@xyo-network/react-payload-plugin-resolver'
 import { HashTableCell, HashTableCellProps, usePayloadHash } from '@xyo-network/react-shared'
-import { ComponentType } from 'react'
+import React, { ComponentType, useMemo } from 'react'
 
 import {
   PayloadDynamicTableColumnConfig,
   payloadDynamicTableColumnConfigDefaults,
   PayloadDynamicTableColumnSlug,
-} from './PayloadDynamicTableColumnConfig.js'
+} from './PayloadDynamicTableColumnConfig.ts'
 
 export interface PayloadDynamicTableRowProps extends TableRowProps {
   archive?: string
@@ -31,7 +31,7 @@ export interface PayloadDynamicTableRowProps extends TableRowProps {
 
 export const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({
   archive,
-  columns = payloadDynamicTableColumnConfigDefaults(),
+  columns,
   exploreDomain,
   network: networkProp,
   payload,
@@ -44,7 +44,7 @@ export const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({
   const [validationErrors = []] = usePromise(async () => (payload ? await new PayloadValidator(payload).validate() : undefined), [payload])
   const isValid = validationErrors.length === 0
   const payloadFieldCount = payload ? Object.keys(PayloadHasher.hashFields(payload)).length : 0
-  const hash: React.FC<HashTableCellProps> = (props) => (
+  const hash: React.FC<HashTableCellProps> = props => (
     <HashTableCell
       key="hash"
       align="left"
@@ -57,7 +57,7 @@ export const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({
     />
   )
 
-  const schema: React.FC<TableCellProps> = (props) => (
+  const schema: React.FC<TableCellProps> = props => (
     <TableCell key="payloads" align="left" {...props}>
       <Typography fontFamily="monospace" variant="body2" noWrap>
         {payload?.schema}
@@ -65,7 +65,7 @@ export const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({
     </TableCell>
   )
 
-  const details: React.FC<TableCellProps> = (props) => (
+  const details: React.FC<TableCellProps> = props => (
     <TableCell key="payloads" align="left" {...props}>
       <Typography fontFamily="monospace" variant="body2" noWrap>
         {payloadFieldCount}
@@ -74,34 +74,34 @@ export const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({
   )
 
   const render: React.FC<TableCellProps> = (props) => {
-    const Render: ComponentType<PayloadRenderProps & TableCellProps> | undefined =
-      payload ? resolver?.resolve(payload)?.components.table.cell : undefined
+    const Render: ComponentType<PayloadRenderProps & TableCellProps> | undefined
+      = payload ? resolver?.resolve(payload)?.components.table.cell : undefined
     return Render ? <Render payload={payload} {...props} /> : <TableCell key="payloads" align="left" {...props}></TableCell>
   }
 
   const icon: React.FC<TableCellProps> = (props) => {
-    const Avatar: ComponentType<PayloadRenderProps & AvatarProps> | undefined =
-      payload ? resolver?.resolve(payload)?.components.avatar.image : undefined
+    const Avatar: ComponentType<PayloadRenderProps & AvatarProps> | undefined
+      = payload ? resolver?.resolve(payload)?.components.avatar.image : undefined
 
     return (
       <TableCell key="payloads" align="left" {...props}>
-        {Avatar ?
-          <Avatar payload={payload} />
-        : null}
+        {Avatar
+          ? <Avatar payload={payload} />
+          : null}
       </TableCell>
     )
   }
 
-  const valid: React.FC<TableCellProps> = (props) => (
+  const valid: React.FC<TableCellProps> = props => (
     <TableCell key="valid" align="center" {...props}>
-      {isValid === undefined && payload != undefined ?
-        <WarningAmberRoundedIcon fontSize="small" color="warning" />
-      : isValid === true ?
-        <CheckCircleOutlineRoundedIcon fontSize="small" color="success" />
-      : isValid === false ?
-        <ErrorOutlineRoundedIcon color="error" fontSize="small" />
-        //nbsp to keep row height consistent even when no data is provided for the row
-      : <Typography> &nbsp;</Typography>}
+      {isValid === undefined && payload != undefined
+        ? <WarningAmberRoundedIcon fontSize="small" color="warning" />
+        : isValid === true
+          ? <CheckCircleOutlineRoundedIcon fontSize="small" color="success" />
+          : isValid === false
+            ? <ErrorOutlineRoundedIcon color="error" fontSize="small" />
+          // nbsp to keep row height consistent even when no data is provided for the row
+            : <Typography> &nbsp;</Typography>}
     </TableCell>
   )
 
@@ -114,11 +114,15 @@ export const PayloadDynamicTableRow: React.FC<PayloadDynamicTableRowProps> = ({
     valid,
   }
 
-  return breakPoint ?
-      <TableRow style={{ maxWidth: '100vw' }} {...props}>
-        {columns[breakPoint]?.map((column) => {
-          return column.slug ? tableCells[column.slug]({}) : null
-        })}
-      </TableRow>
+  const columnsMemo = useMemo(() => columns ?? payloadDynamicTableColumnConfigDefaults(), [columns])
+
+  return breakPoint
+    ? (
+        <TableRow style={{ maxWidth: '100vw' }} {...props}>
+          {columnsMemo[breakPoint]?.map((column) => {
+            return column.slug ? tableCells[column.slug]({}) : null
+          })}
+        </TableRow>
+      )
     : null
 }

package/src/components/DynamicTable/Table.tsx

@@ -18,10 +18,10 @@ import { useBreakpoint } from '@xylabs/react-shared'
 import { Payload } from '@xyo-network/payload-model'
 import { ThrownErrorBoundary } from '@xyo-network/react-error'
 import { usePayloadHashes } from '@xyo-network/react-shared'
-import { ReactNode, useEffect, useMemo, useState } from 'react'
+import React, { ReactNode, useEffect, useMemo, useState } from 'react'
 
-import { PayloadDynamicTableRow } from './DynamicTableRow.js'
-import { PayloadDynamicTableColumnConfig, payloadDynamicTableColumnConfigDefaults } from './PayloadDynamicTableColumnConfig.js'
+import { PayloadDynamicTableRow } from './DynamicTableRow.tsx'
+import { PayloadDynamicTableColumnConfig, payloadDynamicTableColumnConfigDefaults } from './PayloadDynamicTableColumnConfig.ts'
 
 export interface PayloadDynamicTableProps extends TableProps {
   archive?: string
@@ -62,24 +62,24 @@ function TablePaginationActions(props: TablePaginationActionsProps) {
   return (
     <Box sx={{ flexShrink: 0, ml: 2.5 }}>
       <IconButton onClick={handleFirstPageButtonClick} disabled={page === 0} aria-label="first page">
-        {theme.direction === 'rtl' ?
-          <LastPageIcon />
-        : <FirstPageIcon />}
+        {theme.direction === 'rtl'
+          ? <LastPageIcon />
+          : <FirstPageIcon />}
       </IconButton>
       <IconButton onClick={handleBackButtonClick} disabled={page === 0} aria-label="previous page">
-        {theme.direction === 'rtl' ?
-          <KeyboardArrowRight />
-        : <KeyboardArrowLeft />}
+        {theme.direction === 'rtl'
+          ? <KeyboardArrowRight />
+          : <KeyboardArrowLeft />}
       </IconButton>
       <IconButton onClick={handleNextButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1} aria-label="next page">
-        {theme.direction === 'rtl' ?
-          <KeyboardArrowLeft />
-        : <KeyboardArrowRight />}
+        {theme.direction === 'rtl'
+          ? <KeyboardArrowLeft />
+          : <KeyboardArrowRight />}
       </IconButton>
       <IconButton onClick={handleLastPageButtonClick} disabled={page >= Math.ceil(count / rowsPerPage) - 1} aria-label="last page">
-        {theme.direction === 'rtl' ?
-          <FirstPageIcon />
-        : <LastPageIcon />}
+        {theme.direction === 'rtl'
+          ? <FirstPageIcon />
+          : <LastPageIcon />}
       </IconButton>
     </Box>
   )
@@ -88,7 +88,7 @@ function TablePaginationActions(props: TablePaginationActionsProps) {
 export const PayloadDynamicTable: React.FC<PayloadDynamicTableProps> = ({
   archive,
   children,
-  columns = payloadDynamicTableColumnConfigDefaults(),
+  columns,
   exploreDomain,
   onRowClick,
   rowsPerPage: rowsPerPageProp = 10,
@@ -119,71 +119,75 @@ export const PayloadDynamicTable: React.FC<PayloadDynamicTableProps> = ({
     setPage(0)
   }
 
-  return breakPoint ?
-      <Table stickyHeader {...props}>
-        <TableHead>
-          <TableRow>
-            {columns[breakPoint]?.map((column, index) => {
+  return breakPoint
+    ? (
+        <Table stickyHeader {...props}>
+          <TableHead>
+            <TableRow>
+              {(columns ?? payloadDynamicTableColumnConfigDefaults())[breakPoint]?.map((column, index) => {
+                return (
+                  <TableCell key={index} align={column.alignment ?? 'left'} width={column.width}>
+                    <Typography variant="body2" noWrap>
+                      {column.name}
+                    </Typography>
+                  </TableCell>
+                )
+              })}
+            </TableRow>
+          </TableHead>
+          <TableBody sx={{ overflowY: 'scroll ' }}>
+            {payloadPairs?.map(([payload, hash], index) => {
               return (
-                <TableCell key={index} align={column.alignment ?? 'left'} width={column.width}>
-                  <Typography variant="body2" noWrap>
-                    {column.name}
-                  </Typography>
-                </TableCell>
+                <ThrownErrorBoundary
+                  boundaryName="PayloadTableBody"
+                  key={`${hash}-${index}`}
+                  errorComponent={e => (
+                    <Alert severity="error">
+                      Error Loading Payload:
+                      {' '}
+                      <Typography fontWeight="bold">{e.message}</Typography>
+                    </Alert>
+                  )}
+                >
+                  <PayloadDynamicTableRow
+                    archive={archive}
+                    onClick={
+                      onRowClick
+                        ? () => {
+                            onRowClick(payload)
+                          }
+                        : undefined
+                    }
+                    exploreDomain={exploreDomain}
+                    payload={payload}
+                  />
+                </ThrownErrorBoundary>
               )
             })}
-          </TableRow>
-        </TableHead>
-        <TableBody sx={{ overflowY: 'scroll ' }}>
-          {payloadPairs?.map(([payload, hash], index) => {
-            return (
-              <ThrownErrorBoundary
-                boundaryName="PayloadTableBody"
-                key={`${hash}-${index}`}
-                errorComponent={(e) => (
-                  <Alert severity="error">
-                    Error Loading Payload: <Typography fontWeight="bold">{e.message}</Typography>
-                  </Alert>
-                )}
-              >
-                <PayloadDynamicTableRow
-                  archive={archive}
-                  onClick={
-                    onRowClick ?
-                      () => {
-                        onRowClick(payload)
-                      }
-                    : undefined
-                  }
-                  exploreDomain={exploreDomain}
-                  payload={payload}
-                />
-              </ThrownErrorBoundary>
-            )
-          })}
-          {children}
-          {emptyRows ? (Array.from({ length: emptyRows }).fill(<PayloadDynamicTableRow />) as ReactNode[]) : null}
-        </TableBody>
-        <TableFooter>
-          <TableRow>
-            <TablePagination
-              rowsPerPageOptions={[5, 10, 25, { label: 'All', value: -1 }]}
-              colSpan={5}
-              count={payloadCount}
-              rowsPerPage={rowsPerPage}
-              page={page}
-              SelectProps={{
-                inputProps: {
-                  'aria-label': 'rows per page',
-                },
-                native: true,
-              }}
-              onPageChange={handleChangePage}
-              onRowsPerPageChange={handleChangeRowsPerPage}
-              ActionsComponent={TablePaginationActions}
-            />
-          </TableRow>
-        </TableFooter>
-      </Table>
+            {children}
+            {emptyRows ? (Array.from({ length: emptyRows }).fill(<PayloadDynamicTableRow />) as ReactNode[]) : null}
+          </TableBody>
+          <TableFooter>
+            <TableRow>
+              <TablePagination
+                rowsPerPageOptions={[5, 10, 25, { label: 'All', value: -1 }]}
+                colSpan={5}
+                count={payloadCount}
+                rowsPerPage={rowsPerPage}
+                page={page}
+                SelectProps={{
+                  inputProps: {
+                    'aria-label': 'rows per page',
+                  },
+                  native: true,
+                }}
+                onPageChange={handleChangePage}
+                onRowsPerPageChange={handleChangeRowsPerPage}
+                ActionsComponent={TablePaginationActions}
+              />
+            </TableRow>
+          </TableFooter>
+        </Table>
+      )
     : null
 }

package/src/components/DynamicTable/index.ts

@@ -1,3 +1,3 @@
-export * from './DynamicTableRow.js'
-export * from './PayloadDynamicTableColumnConfig.js'
-export * from './Table.js'
+export * from './DynamicTableRow.tsx'
+export * from './PayloadDynamicTableColumnConfig.ts'
+export * from './Table.tsx'