@xyo-network/react-payload-table 2.64.9 → 2.65.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (154) hide show
  1. package/package.json +18 -18
  2. package/dist/browser/components/DynamicTable/DynamicTableRow.cjs +0 -128
  3. package/dist/browser/components/DynamicTable/DynamicTableRow.cjs.map +0 -1
  4. package/dist/browser/components/DynamicTable/DynamicTableRow.js +0 -111
  5. package/dist/browser/components/DynamicTable/DynamicTableRow.js.map +0 -1
  6. package/dist/browser/components/DynamicTable/PayloadDynamicTableColumnConfig.cjs +0 -60
  7. package/dist/browser/components/DynamicTable/PayloadDynamicTableColumnConfig.cjs.map +0 -1
  8. package/dist/browser/components/DynamicTable/PayloadDynamicTableColumnConfig.js +0 -39
  9. package/dist/browser/components/DynamicTable/PayloadDynamicTableColumnConfig.js.map +0 -1
  10. package/dist/browser/components/DynamicTable/Table.cjs +0 -241
  11. package/dist/browser/components/DynamicTable/Table.cjs.map +0 -1
  12. package/dist/browser/components/DynamicTable/Table.js +0 -237
  13. package/dist/browser/components/DynamicTable/Table.js.map +0 -1
  14. package/dist/browser/components/DynamicTable/index.cjs +0 -243
  15. package/dist/browser/components/DynamicTable/index.cjs.map +0 -1
  16. package/dist/browser/components/DynamicTable/index.js +0 -237
  17. package/dist/browser/components/DynamicTable/index.js.map +0 -1
  18. package/dist/browser/components/Table/PayloadTableColumnConfig.cjs +0 -40
  19. package/dist/browser/components/Table/PayloadTableColumnConfig.cjs.map +0 -1
  20. package/dist/browser/components/Table/PayloadTableColumnConfig.js +0 -19
  21. package/dist/browser/components/Table/PayloadTableColumnConfig.js.map +0 -1
  22. package/dist/browser/components/Table/Table.cjs +0 -366
  23. package/dist/browser/components/Table/Table.cjs.map +0 -1
  24. package/dist/browser/components/Table/Table.js +0 -349
  25. package/dist/browser/components/Table/Table.js.map +0 -1
  26. package/dist/browser/components/Table/TableBody.cjs +0 -152
  27. package/dist/browser/components/Table/TableBody.cjs.map +0 -1
  28. package/dist/browser/components/Table/TableBody.js +0 -135
  29. package/dist/browser/components/Table/TableBody.js.map +0 -1
  30. package/dist/browser/components/Table/TableFooter.cjs +0 -109
  31. package/dist/browser/components/Table/TableFooter.cjs.map +0 -1
  32. package/dist/browser/components/Table/TableFooter.js +0 -88
  33. package/dist/browser/components/Table/TableFooter.js.map +0 -1
  34. package/dist/browser/components/Table/TableHead.cjs +0 -52
  35. package/dist/browser/components/Table/TableHead.cjs.map +0 -1
  36. package/dist/browser/components/Table/TableHead.js +0 -31
  37. package/dist/browser/components/Table/TableHead.js.map +0 -1
  38. package/dist/browser/components/Table/TablePagination.cjs +0 -68
  39. package/dist/browser/components/Table/TablePagination.cjs.map +0 -1
  40. package/dist/browser/components/Table/TablePagination.js +0 -47
  41. package/dist/browser/components/Table/TablePagination.js.map +0 -1
  42. package/dist/browser/components/Table/TableRow.cjs +0 -100
  43. package/dist/browser/components/Table/TableRow.cjs.map +0 -1
  44. package/dist/browser/components/Table/TableRow.js +0 -83
  45. package/dist/browser/components/Table/TableRow.js.map +0 -1
  46. package/dist/browser/components/Table/TableRowNoData.cjs +0 -40
  47. package/dist/browser/components/Table/TableRowNoData.cjs.map +0 -1
  48. package/dist/browser/components/Table/TableRowNoData.js +0 -19
  49. package/dist/browser/components/Table/TableRowNoData.js.map +0 -1
  50. package/dist/browser/components/Table/index.cjs +0 -371
  51. package/dist/browser/components/Table/index.cjs.map +0 -1
  52. package/dist/browser/components/Table/index.js +0 -352
  53. package/dist/browser/components/Table/index.js.map +0 -1
  54. package/dist/browser/components/Table/types/PaginationEventNouns.cjs +0 -19
  55. package/dist/browser/components/Table/types/PaginationEventNouns.cjs.map +0 -1
  56. package/dist/browser/components/Table/types/PaginationEventNouns.js +0 -1
  57. package/dist/browser/components/Table/types/PaginationEventNouns.js.map +0 -1
  58. package/dist/browser/components/Table/types/PayloadTableBodyProps.cjs +0 -19
  59. package/dist/browser/components/Table/types/PayloadTableBodyProps.cjs.map +0 -1
  60. package/dist/browser/components/Table/types/PayloadTableBodyProps.js +0 -1
  61. package/dist/browser/components/Table/types/PayloadTableBodyProps.js.map +0 -1
  62. package/dist/browser/components/Table/types/PayloadTableFooterProps.cjs +0 -19
  63. package/dist/browser/components/Table/types/PayloadTableFooterProps.cjs.map +0 -1
  64. package/dist/browser/components/Table/types/PayloadTableFooterProps.js +0 -1
  65. package/dist/browser/components/Table/types/PayloadTableFooterProps.js.map +0 -1
  66. package/dist/browser/components/Table/types/PayloadTableHeadProps.cjs +0 -19
  67. package/dist/browser/components/Table/types/PayloadTableHeadProps.cjs.map +0 -1
  68. package/dist/browser/components/Table/types/PayloadTableHeadProps.js +0 -1
  69. package/dist/browser/components/Table/types/PayloadTableHeadProps.js.map +0 -1
  70. package/dist/browser/components/Table/types/index.cjs +0 -19
  71. package/dist/browser/components/Table/types/index.cjs.map +0 -1
  72. package/dist/browser/components/Table/types/index.js +0 -1
  73. package/dist/browser/components/Table/types/index.js.map +0 -1
  74. package/dist/browser/components/index.cjs +0 -589
  75. package/dist/browser/components/index.cjs.map +0 -1
  76. package/dist/browser/components/index.js +0 -587
  77. package/dist/browser/components/index.js.map +0 -1
  78. package/dist/docs.json +0 -4590
  79. package/dist/node/components/DynamicTable/DynamicTableRow.cjs +0 -135
  80. package/dist/node/components/DynamicTable/DynamicTableRow.cjs.map +0 -1
  81. package/dist/node/components/DynamicTable/DynamicTableRow.js +0 -114
  82. package/dist/node/components/DynamicTable/DynamicTableRow.js.map +0 -1
  83. package/dist/node/components/DynamicTable/PayloadDynamicTableColumnConfig.cjs +0 -64
  84. package/dist/node/components/DynamicTable/PayloadDynamicTableColumnConfig.cjs.map +0 -1
  85. package/dist/node/components/DynamicTable/PayloadDynamicTableColumnConfig.js +0 -39
  86. package/dist/node/components/DynamicTable/PayloadDynamicTableColumnConfig.js.map +0 -1
  87. package/dist/node/components/DynamicTable/Table.cjs +0 -249
  88. package/dist/node/components/DynamicTable/Table.cjs.map +0 -1
  89. package/dist/node/components/DynamicTable/Table.js +0 -241
  90. package/dist/node/components/DynamicTable/Table.js.map +0 -1
  91. package/dist/node/components/DynamicTable/index.cjs +0 -253
  92. package/dist/node/components/DynamicTable/index.cjs.map +0 -1
  93. package/dist/node/components/DynamicTable/index.js +0 -241
  94. package/dist/node/components/DynamicTable/index.js.map +0 -1
  95. package/dist/node/components/Table/PayloadTableColumnConfig.cjs +0 -45
  96. package/dist/node/components/Table/PayloadTableColumnConfig.cjs.map +0 -1
  97. package/dist/node/components/Table/PayloadTableColumnConfig.js +0 -19
  98. package/dist/node/components/Table/PayloadTableColumnConfig.js.map +0 -1
  99. package/dist/node/components/Table/Table.cjs +0 -375
  100. package/dist/node/components/Table/Table.cjs.map +0 -1
  101. package/dist/node/components/Table/Table.js +0 -353
  102. package/dist/node/components/Table/Table.js.map +0 -1
  103. package/dist/node/components/Table/TableBody.cjs +0 -157
  104. package/dist/node/components/Table/TableBody.cjs.map +0 -1
  105. package/dist/node/components/Table/TableBody.js +0 -136
  106. package/dist/node/components/Table/TableBody.js.map +0 -1
  107. package/dist/node/components/Table/TableFooter.cjs +0 -115
  108. package/dist/node/components/Table/TableFooter.cjs.map +0 -1
  109. package/dist/node/components/Table/TableFooter.js +0 -90
  110. package/dist/node/components/Table/TableFooter.js.map +0 -1
  111. package/dist/node/components/Table/TableHead.cjs +0 -57
  112. package/dist/node/components/Table/TableHead.cjs.map +0 -1
  113. package/dist/node/components/Table/TableHead.js +0 -32
  114. package/dist/node/components/Table/TableHead.js.map +0 -1
  115. package/dist/node/components/Table/TablePagination.cjs +0 -74
  116. package/dist/node/components/Table/TablePagination.cjs.map +0 -1
  117. package/dist/node/components/Table/TablePagination.js +0 -49
  118. package/dist/node/components/Table/TablePagination.js.map +0 -1
  119. package/dist/node/components/Table/TableRow.cjs +0 -105
  120. package/dist/node/components/Table/TableRow.cjs.map +0 -1
  121. package/dist/node/components/Table/TableRow.js +0 -84
  122. package/dist/node/components/Table/TableRow.js.map +0 -1
  123. package/dist/node/components/Table/TableRowNoData.cjs +0 -44
  124. package/dist/node/components/Table/TableRowNoData.cjs.map +0 -1
  125. package/dist/node/components/Table/TableRowNoData.js +0 -19
  126. package/dist/node/components/Table/TableRowNoData.js.map +0 -1
  127. package/dist/node/components/Table/index.cjs +0 -385
  128. package/dist/node/components/Table/index.cjs.map +0 -1
  129. package/dist/node/components/Table/index.js +0 -356
  130. package/dist/node/components/Table/index.js.map +0 -1
  131. package/dist/node/components/Table/types/PaginationEventNouns.cjs +0 -19
  132. package/dist/node/components/Table/types/PaginationEventNouns.cjs.map +0 -1
  133. package/dist/node/components/Table/types/PaginationEventNouns.js +0 -1
  134. package/dist/node/components/Table/types/PaginationEventNouns.js.map +0 -1
  135. package/dist/node/components/Table/types/PayloadTableBodyProps.cjs +0 -19
  136. package/dist/node/components/Table/types/PayloadTableBodyProps.cjs.map +0 -1
  137. package/dist/node/components/Table/types/PayloadTableBodyProps.js +0 -1
  138. package/dist/node/components/Table/types/PayloadTableBodyProps.js.map +0 -1
  139. package/dist/node/components/Table/types/PayloadTableFooterProps.cjs +0 -19
  140. package/dist/node/components/Table/types/PayloadTableFooterProps.cjs.map +0 -1
  141. package/dist/node/components/Table/types/PayloadTableFooterProps.js +0 -1
  142. package/dist/node/components/Table/types/PayloadTableFooterProps.js.map +0 -1
  143. package/dist/node/components/Table/types/PayloadTableHeadProps.cjs +0 -19
  144. package/dist/node/components/Table/types/PayloadTableHeadProps.cjs.map +0 -1
  145. package/dist/node/components/Table/types/PayloadTableHeadProps.js +0 -1
  146. package/dist/node/components/Table/types/PayloadTableHeadProps.js.map +0 -1
  147. package/dist/node/components/Table/types/index.cjs +0 -19
  148. package/dist/node/components/Table/types/index.cjs.map +0 -1
  149. package/dist/node/components/Table/types/index.js +0 -1
  150. package/dist/node/components/Table/types/index.js.map +0 -1
  151. package/dist/node/components/index.cjs +0 -610
  152. package/dist/node/components/index.cjs.map +0 -1
  153. package/dist/node/components/index.js +0 -595
  154. package/dist/node/components/index.js.map +0 -1
@@ -1,595 +0,0 @@
1
- // src/components/DynamicTable/DynamicTableRow.tsx
2
- import {
3
- CheckCircleOutlineRounded as CheckCircleOutlineRoundedIcon,
4
- ErrorOutlineRounded as ErrorOutlineRoundedIcon,
5
- WarningAmberRounded as WarningAmberRoundedIcon
6
- } from "@mui/icons-material";
7
- import { TableCell, TableRow, Typography } from "@mui/material";
8
- import { usePromise } from "@xylabs/react-promise";
9
- import { useBreakpoint } from "@xylabs/react-shared";
10
- import { PayloadHasher } from "@xyo-network/hash";
11
- import { PayloadValidator } from "@xyo-network/payload-validator";
12
- import { useNetwork } from "@xyo-network/react-network";
13
- import { usePayloadRenderPluginResolver } from "@xyo-network/react-payload-plugin-resolver";
14
- import { HashTableCell, usePayloadHash } from "@xyo-network/react-shared";
15
-
16
- // src/components/DynamicTable/PayloadDynamicTableColumnConfig.ts
17
- var payloadDynamicTableColumnConfigDefaults = () => {
18
- const xs = [
19
- { alignment: "left", name: "Hash", slug: "hash", width: "100%" },
20
- { alignment: "left", name: "Schema", slug: "schema", width: "50px" },
21
- { alignment: "left", name: "Valid", slug: "valid", width: "50px" }
22
- ];
23
- const sm = [
24
- { alignment: "left", name: "Icon", slug: "icon", width: "50px" },
25
- { alignment: "left", name: "Hash", slug: "hash", width: "100%" },
26
- { alignment: "left", name: "Schema", slug: "schema", width: "50px" },
27
- { alignment: "left", name: "Valid", slug: "valid", width: "50px" }
28
- ];
29
- const md = [
30
- { alignment: "left", name: "Icon", slug: "icon", width: "50px" },
31
- { alignment: "left", name: "Hash", slug: "hash", width: "100%" },
32
- { alignment: "left", name: "Schema", slug: "schema", width: "50px" },
33
- { alignment: "left", name: "Valid", slug: "valid", width: "50px" }
34
- ];
35
- const lg = [
36
- { alignment: "left", name: "Icon", slug: "icon", width: "50px" },
37
- { alignment: "left", name: "Hash", slug: "hash", width: "100%" },
38
- { alignment: "left", name: "Schema", slug: "schema", width: "50px" },
39
- { alignment: "left", name: "Render", slug: "render", width: "50px" },
40
- { alignment: "left", name: "Valid", slug: "valid", width: "50px" }
41
- ];
42
- const xl = [
43
- { alignment: "left", name: "Icon", slug: "icon", width: "50px" },
44
- { alignment: "left", name: "Hash", slug: "hash", width: "100%" },
45
- { alignment: "left", name: "Schema", slug: "schema", width: "50px" },
46
- { alignment: "left", name: "Render", slug: "render", width: "50px" },
47
- { alignment: "left", name: "Valid", slug: "valid", width: "50px" }
48
- ];
49
- return { lg, md, sm, xl, xs };
50
- };
51
-
52
- // src/components/DynamicTable/DynamicTableRow.tsx
53
- import { jsx } from "react/jsx-runtime";
54
- var PayloadDynamicTableRow = ({
55
- archive,
56
- columns = payloadDynamicTableColumnConfigDefaults(),
57
- exploreDomain,
58
- network: networkProp,
59
- payload,
60
- ...props
61
- }) => {
62
- var _a;
63
- const breakPoint = useBreakpoint();
64
- const payloadHash = usePayloadHash(payload);
65
- const { network } = useNetwork();
66
- const { resolver } = usePayloadRenderPluginResolver();
67
- const [validationErrors = []] = usePromise(async () => payload ? await new PayloadValidator(payload).validate() : void 0, [payload]);
68
- const isValid = validationErrors.length === 0;
69
- const payloadFieldCount = payload ? Object.keys(PayloadHasher.hashFields(payload)).length : 0;
70
- const hash = (props2) => /* @__PURE__ */ jsx(
71
- HashTableCell,
72
- {
73
- align: "left",
74
- archive,
75
- value: payloadHash,
76
- dataType: "payload",
77
- exploreDomain,
78
- network: networkProp ?? (network == null ? void 0 : network.slug),
79
- ...props2
80
- },
81
- "hash"
82
- );
83
- const schema = (props2) => /* @__PURE__ */ jsx(TableCell, { align: "left", ...props2, children: /* @__PURE__ */ jsx(Typography, { fontFamily: "monospace", variant: "body2", noWrap: true, children: payload == null ? void 0 : payload.schema }) }, "payloads");
84
- const details = (props2) => /* @__PURE__ */ jsx(TableCell, { align: "left", ...props2, children: /* @__PURE__ */ jsx(Typography, { fontFamily: "monospace", variant: "body2", noWrap: true, children: payloadFieldCount }) }, "payloads");
85
- const render = (props2) => {
86
- var _a2;
87
- const Render = payload ? (_a2 = resolver == null ? void 0 : resolver.resolve(payload)) == null ? void 0 : _a2.components.table.cell : void 0;
88
- return Render ? /* @__PURE__ */ jsx(Render, { payload, ...props2 }) : /* @__PURE__ */ jsx(TableCell, { align: "left", ...props2 }, "payloads");
89
- };
90
- const icon = (props2) => {
91
- var _a2;
92
- const Avatar = payload ? (_a2 = resolver == null ? void 0 : resolver.resolve(payload)) == null ? void 0 : _a2.components.avatar.image : void 0;
93
- return /* @__PURE__ */ jsx(TableCell, { align: "left", ...props2, children: Avatar ? /* @__PURE__ */ jsx(Avatar, { payload }) : null }, "payloads");
94
- };
95
- const valid = (props2) => /* @__PURE__ */ jsx(TableCell, { align: "center", ...props2, children: isValid === void 0 && payload != void 0 ? /* @__PURE__ */ jsx(WarningAmberRoundedIcon, { fontSize: "small", color: "warning" }) : isValid === true ? /* @__PURE__ */ jsx(CheckCircleOutlineRoundedIcon, { fontSize: "small", color: "success" }) : isValid === false ? /* @__PURE__ */ jsx(ErrorOutlineRoundedIcon, { color: "error", fontSize: "small" }) : (
96
- //nbsp to keep row height consistent even when no data is provided for the row
97
- /* @__PURE__ */ jsx(Typography, { children: " \xA0" })
98
- ) }, "valid");
99
- const tableCells = {
100
- details,
101
- hash,
102
- icon,
103
- render,
104
- schema,
105
- valid
106
- };
107
- return breakPoint ? /* @__PURE__ */ jsx(TableRow, { style: { maxWidth: "100vw" }, ...props, children: (_a = columns[breakPoint]) == null ? void 0 : _a.map((column) => {
108
- return column.slug ? tableCells[column.slug]({}) : null;
109
- }) }) : null;
110
- };
111
-
112
- // src/components/DynamicTable/Table.tsx
113
- import { FirstPage as FirstPageIcon, KeyboardArrowLeft, KeyboardArrowRight, LastPage as LastPageIcon } from "@mui/icons-material";
114
- import {
115
- Alert,
116
- Box,
117
- IconButton,
118
- Table,
119
- TableBody,
120
- TableCell as TableCell2,
121
- TableFooter,
122
- TableHead,
123
- TablePagination,
124
- TableRow as TableRow2,
125
- Typography as Typography2,
126
- useTheme
127
- } from "@mui/material";
128
- import { useBreakpoint as useBreakpoint2 } from "@xylabs/react-shared";
129
- import { ThrownErrorBoundary } from "@xyo-network/react-error";
130
- import { usePayloadHashes } from "@xyo-network/react-shared";
131
- import { useEffect, useMemo, useState } from "react";
132
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
133
- function TablePaginationActions(props) {
134
- const theme = useTheme();
135
- const { count, page, rowsPerPage, onPageChange } = props;
136
- const handleFirstPageButtonClick = (event) => {
137
- onPageChange(event, 0);
138
- };
139
- const handleBackButtonClick = (event) => {
140
- onPageChange(event, page - 1);
141
- };
142
- const handleNextButtonClick = (event) => {
143
- onPageChange(event, page + 1);
144
- };
145
- const handleLastPageButtonClick = (event) => {
146
- onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1));
147
- };
148
- return /* @__PURE__ */ jsxs(Box, { sx: { flexShrink: 0, ml: 2.5 }, children: [
149
- /* @__PURE__ */ jsx2(IconButton, { onClick: handleFirstPageButtonClick, disabled: page === 0, "aria-label": "first page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx2(LastPageIcon, {}) : /* @__PURE__ */ jsx2(FirstPageIcon, {}) }),
150
- /* @__PURE__ */ jsx2(IconButton, { onClick: handleBackButtonClick, disabled: page === 0, "aria-label": "previous page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx2(KeyboardArrowRight, {}) : /* @__PURE__ */ jsx2(KeyboardArrowLeft, {}) }),
151
- /* @__PURE__ */ jsx2(IconButton, { onClick: handleNextButtonClick, disabled: page >= Math.ceil(count / rowsPerPage) - 1, "aria-label": "next page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx2(KeyboardArrowLeft, {}) : /* @__PURE__ */ jsx2(KeyboardArrowRight, {}) }),
152
- /* @__PURE__ */ jsx2(IconButton, { onClick: handleLastPageButtonClick, disabled: page >= Math.ceil(count / rowsPerPage) - 1, "aria-label": "last page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx2(FirstPageIcon, {}) : /* @__PURE__ */ jsx2(LastPageIcon, {}) })
153
- ] });
154
- }
155
- var PayloadDynamicTable = ({
156
- archive,
157
- children,
158
- columns = payloadDynamicTableColumnConfigDefaults(),
159
- exploreDomain,
160
- onRowClick,
161
- rowsPerPage: rowsPerPageProp = 10,
162
- payloads,
163
- ...props
164
- }) => {
165
- var _a;
166
- const breakPoint = useBreakpoint2();
167
- const [page, setPage] = useState(0);
168
- const [rowsPerPage, setRowsPerPage] = useState(rowsPerPageProp);
169
- const payloadCount = payloads ? payloads.length : 0;
170
- const emptyRows = page > 0 ? Math.max(0, (1 + page) * rowsPerPage - payloadCount) : 0;
171
- const pagedPayloads = useMemo(() => payloads == null ? void 0 : payloads.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage), [payloads, page, rowsPerPage]);
172
- const payloadPairs = usePayloadHashes(pagedPayloads);
173
- useEffect(() => {
174
- setRowsPerPage(rowsPerPageProp);
175
- }, [rowsPerPageProp]);
176
- const handleChangePage = (event, newPage) => {
177
- setPage(newPage);
178
- };
179
- const handleChangeRowsPerPage = (event) => {
180
- setRowsPerPage(parseInt(event.target.value, 10));
181
- setPage(0);
182
- };
183
- return breakPoint ? /* @__PURE__ */ jsxs(Table, { stickyHeader: true, ...props, children: [
184
- /* @__PURE__ */ jsx2(TableHead, { children: /* @__PURE__ */ jsx2(TableRow2, { children: (_a = columns[breakPoint]) == null ? void 0 : _a.map((column, index) => {
185
- return /* @__PURE__ */ jsx2(TableCell2, { align: column.alignment ?? "left", width: column.width, children: /* @__PURE__ */ jsx2(Typography2, { variant: "body2", noWrap: true, children: column.name }) }, index);
186
- }) }) }),
187
- /* @__PURE__ */ jsxs(TableBody, { sx: { overflowY: "scroll " }, children: [
188
- payloadPairs == null ? void 0 : payloadPairs.map(([payload, hash], index) => {
189
- return /* @__PURE__ */ jsx2(
190
- ThrownErrorBoundary,
191
- {
192
- boundaryName: "PayloadTableBody",
193
- errorComponent: (e) => /* @__PURE__ */ jsxs(Alert, { severity: "error", children: [
194
- "Error Loading Payload: ",
195
- /* @__PURE__ */ jsx2(Typography2, { fontWeight: "bold", children: e.message })
196
- ] }),
197
- children: /* @__PURE__ */ jsx2(
198
- PayloadDynamicTableRow,
199
- {
200
- archive,
201
- onClick: onRowClick ? () => {
202
- onRowClick(payload);
203
- } : void 0,
204
- exploreDomain,
205
- payload
206
- }
207
- )
208
- },
209
- `${hash}-${index}`
210
- );
211
- }),
212
- children,
213
- emptyRows > 0 && Array(emptyRows).fill(/* @__PURE__ */ jsx2(PayloadDynamicTableRow, {}))
214
- ] }),
215
- /* @__PURE__ */ jsx2(TableFooter, { children: /* @__PURE__ */ jsx2(TableRow2, { children: /* @__PURE__ */ jsx2(
216
- TablePagination,
217
- {
218
- rowsPerPageOptions: [5, 10, 25, { label: "All", value: -1 }],
219
- colSpan: 5,
220
- count: payloadCount,
221
- rowsPerPage,
222
- page,
223
- SelectProps: {
224
- inputProps: {
225
- "aria-label": "rows per page"
226
- },
227
- native: true
228
- },
229
- onPageChange: handleChangePage,
230
- onRowsPerPageChange: handleChangeRowsPerPage,
231
- ActionsComponent: TablePaginationActions
232
- }
233
- ) }) })
234
- ] }) : null;
235
- };
236
-
237
- // src/components/Table/PayloadTableColumnConfig.ts
238
- var payloadColumnNames = {
239
- hash: "Hash",
240
- schema: "Schema",
241
- valid: "Valid"
242
- };
243
- var payloadTableColumnConfigDefaults = () => {
244
- const xs = ["hash", "schema", "valid"];
245
- const sm = ["hash", "schema", "valid"];
246
- const md = ["hash", "schema", "valid"];
247
- const lg = ["hash", "schema", "valid"];
248
- const xl = ["hash", "schema", "valid"];
249
- return { lg, md, sm, xl, xs };
250
- };
251
-
252
- // src/components/Table/Table.tsx
253
- import { TableEx } from "@xyo-network/react-table";
254
- import { forwardRef, useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
255
-
256
- // src/components/Table/TableBody.tsx
257
- import { Alert as Alert2, TableBody as TableBody2, Typography as Typography4 } from "@mui/material";
258
- import { ThrownErrorBoundary as ThrownErrorBoundary2 } from "@xyo-network/react-error";
259
- import { usePayloadHashes as usePayloadHashes2 } from "@xyo-network/react-shared";
260
-
261
- // src/components/Table/TableRow.tsx
262
- import {
263
- CheckCircleOutlineRounded as CheckCircleOutlineRoundedIcon2,
264
- ErrorOutlineRounded as ErrorOutlineRoundedIcon2,
265
- WarningAmberRounded as WarningAmberRoundedIcon2
266
- } from "@mui/icons-material";
267
- import { alpha, TableCell as TableCell3, TableRow as TableRow3, Typography as Typography3 } from "@mui/material";
268
- import { usePromise as usePromise2 } from "@xylabs/react-promise";
269
- import { useBreakpoint as useBreakpoint3 } from "@xylabs/react-shared";
270
- import { PayloadValidator as PayloadValidator2 } from "@xyo-network/payload-validator";
271
- import { useNetwork as useNetwork2 } from "@xyo-network/react-network";
272
- import { HashTableCell as HashTableCell2, usePayloadHash as usePayloadHash2 } from "@xyo-network/react-shared";
273
- import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
274
- var PayloadTableRow = ({
275
- archive,
276
- columns = payloadTableColumnConfigDefaults(),
277
- exploreDomain,
278
- maxSchemaDepth,
279
- network: networkProp,
280
- payload,
281
- ...props
282
- }) => {
283
- var _a;
284
- const breakPoint = useBreakpoint3();
285
- const payloadHash = usePayloadHash2(payload);
286
- const { network } = useNetwork2();
287
- const [errors = []] = usePromise2(async () => payload ? await new PayloadValidator2(payload).validate() : void 0, [payload]);
288
- const isValid = errors.length === 0;
289
- const hash = (props2) => /* @__PURE__ */ jsx3(
290
- HashTableCell2,
291
- {
292
- archive,
293
- width: "100%",
294
- value: payloadHash,
295
- dataType: "payload",
296
- exploreDomain,
297
- network: networkProp ?? (network == null ? void 0 : network.slug),
298
- ...props2
299
- },
300
- "hash"
301
- );
302
- const reduceSchemaDepth = (schema2, maxSchemaDepth2) => {
303
- if (maxSchemaDepth2) {
304
- const parts = (schema2 == null ? void 0 : schema2.split(".")) ?? [];
305
- const partsToRemove = parts.length - maxSchemaDepth2 > 0 ? parts.length - maxSchemaDepth2 : 0;
306
- if (partsToRemove > 0) {
307
- return /* @__PURE__ */ jsxs2(Fragment, { children: [
308
- /* @__PURE__ */ jsx3(Fragment, { children: "\u2026" }),
309
- `${parts.slice(partsToRemove).reduce((previousValue, part) => `${previousValue}.${part}`)}`
310
- ] });
311
- }
312
- }
313
- return schema2;
314
- };
315
- const schema = (props2) => /* @__PURE__ */ jsx3(TableCell3, { title: payload == null ? void 0 : payload.schema, align: "center", ...props2, children: /* @__PURE__ */ jsx3(Typography3, { fontFamily: "monospace", variant: "body2", noWrap: true, children: reduceSchemaDepth(payload == null ? void 0 : payload.schema, maxSchemaDepth) }) }, "payloads");
316
- const valid = (props2) => /* @__PURE__ */ jsx3(TableCell3, { align: "center", ...props2, children: isValid === void 0 && payload != void 0 ? /* @__PURE__ */ jsx3(WarningAmberRoundedIcon2, { fontSize: "small", color: "warning" }) : isValid === true ? /* @__PURE__ */ jsx3(CheckCircleOutlineRoundedIcon2, { fontSize: "small", color: "success" }) : isValid === false ? /* @__PURE__ */ jsx3(ErrorOutlineRoundedIcon2, { color: "error", fontSize: "small" }) : (
317
- //to keep row height consistent when no data provided, may need fix later
318
- /* @__PURE__ */ jsx3(ErrorOutlineRoundedIcon2, { sx: { color: alpha("#fff", 0) }, fontSize: "small" })
319
- ) }, "valid");
320
- const tableCells = {
321
- hash,
322
- schema,
323
- valid
324
- };
325
- return breakPoint ? /* @__PURE__ */ jsx3(TableRow3, { style: { maxWidth: "100vw" }, ...props, children: (_a = columns[breakPoint]) == null ? void 0 : _a.map((column) => {
326
- return tableCells[column]({});
327
- }) }) : null;
328
- };
329
-
330
- // src/components/Table/TableBody.tsx
331
- import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
332
- var PayloadTableBody = ({
333
- children,
334
- exploreDomain,
335
- payloads,
336
- archive,
337
- maxSchemaDepth,
338
- onRowClick,
339
- emptyRows,
340
- noResults,
341
- NoResultRowComponent,
342
- ...props
343
- }) => {
344
- const payloadPairs = usePayloadHashes2(payloads);
345
- return /* @__PURE__ */ jsxs3(TableBody2, { ...props, children: [
346
- noResults && NoResultRowComponent ? /* @__PURE__ */ jsx4(NoResultRowComponent, {}) : null,
347
- payloadPairs == null ? void 0 : payloadPairs.map(([payload, hash], index) => {
348
- return /* @__PURE__ */ jsx4(
349
- ThrownErrorBoundary2,
350
- {
351
- boundaryName: "PayloadTableBody",
352
- errorComponent: (e) => /* @__PURE__ */ jsxs3(Alert2, { severity: "error", children: [
353
- "Error Loading Payload: ",
354
- /* @__PURE__ */ jsx4(Typography4, { fontWeight: "bold", children: e.message })
355
- ] }),
356
- children: /* @__PURE__ */ jsx4(
357
- PayloadTableRow,
358
- {
359
- maxSchemaDepth,
360
- archive,
361
- onClick: onRowClick ? () => {
362
- onRowClick(payload);
363
- } : void 0,
364
- exploreDomain,
365
- payload
366
- }
367
- )
368
- },
369
- `${hash}-${index}`
370
- );
371
- }),
372
- children,
373
- (emptyRows ?? 0) > 0 && Array(emptyRows).fill(/* @__PURE__ */ jsx4(PayloadTableRow, {}))
374
- ] });
375
- };
376
-
377
- // src/components/Table/TableFooter.tsx
378
- import { styled, TablePagination as TablePagination2, TableRow as TableRow4 } from "@mui/material";
379
- import { TableFooterEx } from "@xyo-network/react-table";
380
-
381
- // src/components/Table/TablePagination.tsx
382
- import { FirstPage as FirstPageIcon2, KeyboardArrowLeft as KeyboardArrowLeft2, KeyboardArrowRight as KeyboardArrowRight2, LastPage as LastPageIcon2 } from "@mui/icons-material";
383
- import { Box as Box2, CircularProgress, IconButton as IconButton2, useTheme as useTheme2 } from "@mui/material";
384
- import { useEvent } from "@xyo-network/react-event";
385
- import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
386
- function TablePaginationActions2({ count, enableNextPage, loading, onPageChange, page, rowsPerPage }) {
387
- const theme = useTheme2();
388
- const [paginationRef, paginationDispatch] = useEvent();
389
- const handleFirstPageButtonClick = (event) => {
390
- paginationDispatch("firstPage", "click", "true");
391
- onPageChange(event, 0);
392
- };
393
- const handleBackButtonClick = (event) => {
394
- var _a;
395
- paginationDispatch("previousPage", "click", (_a = page - 1) == null ? void 0 : _a.toString());
396
- onPageChange(event, page - 1);
397
- };
398
- const handleNextButtonClick = (event) => {
399
- var _a;
400
- paginationDispatch("nextPage", "click", (_a = page + 1) == null ? void 0 : _a.toString());
401
- onPageChange(event, page + 1);
402
- };
403
- const handleLastPageButtonClick = (event) => {
404
- paginationDispatch("lastPage", "click", "true");
405
- onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1));
406
- };
407
- return /* @__PURE__ */ jsxs4(Fragment2, { children: [
408
- loading ? /* @__PURE__ */ jsx5(CircularProgress, { size: "small", sx: { height: theme.spacing(2), position: "absolute", width: theme.spacing(2) } }) : null,
409
- /* @__PURE__ */ jsxs4(Box2, { sx: { flexShrink: 0, ml: 2.5 }, children: [
410
- /* @__PURE__ */ jsx5(IconButton2, { onClick: handleFirstPageButtonClick, disabled: page === 0, "aria-label": "first page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx5(LastPageIcon2, {}) : /* @__PURE__ */ jsx5(FirstPageIcon2, {}) }),
411
- /* @__PURE__ */ jsx5(IconButton2, { ref: paginationRef, onClick: handleBackButtonClick, disabled: page === 0, "aria-label": "previous page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx5(KeyboardArrowRight2, {}) : /* @__PURE__ */ jsx5(KeyboardArrowLeft2, {}) }),
412
- /* @__PURE__ */ jsx5(
413
- IconButton2,
414
- {
415
- ref: paginationRef,
416
- onClick: handleNextButtonClick,
417
- disabled: !enableNextPage && page >= Math.ceil(count / rowsPerPage) - 1,
418
- "aria-label": "next page",
419
- children: theme.direction === "rtl" ? /* @__PURE__ */ jsx5(KeyboardArrowLeft2, {}) : /* @__PURE__ */ jsx5(KeyboardArrowRight2, {})
420
- }
421
- ),
422
- /* @__PURE__ */ jsx5(IconButton2, { onClick: handleLastPageButtonClick, disabled: page >= Math.ceil(count / rowsPerPage) - 1, "aria-label": "last page", children: theme.direction === "rtl" ? /* @__PURE__ */ jsx5(FirstPageIcon2, {}) : /* @__PURE__ */ jsx5(LastPageIcon2, {}) })
423
- ] })
424
- ] });
425
- }
426
-
427
- // src/components/Table/TableFooter.tsx
428
- import { jsx as jsx6 } from "react/jsx-runtime";
429
- var PayloadTableFooter = ({
430
- count,
431
- variant,
432
- page,
433
- rowsPerPage,
434
- handleChangePage = () => void 0,
435
- handleChangeRowsPerPage = () => void 0,
436
- fetchMorePayloads,
437
- loading
438
- }) => /* @__PURE__ */ jsx6(TableFooterEx, { variant, children: /* @__PURE__ */ jsx6(TableRow4, { children: /* @__PURE__ */ jsx6(
439
- StyledTablePagination,
440
- {
441
- rowsPerPageOptions: [5, 10, 25, { label: "All", value: -1 }],
442
- count: count ?? 0,
443
- rowsPerPage: rowsPerPage ?? 10,
444
- page: page ?? 0,
445
- SelectProps: {
446
- inputProps: {
447
- "aria-label": "rows per page"
448
- },
449
- native: true
450
- },
451
- onPageChange: handleChangePage,
452
- onRowsPerPageChange: handleChangeRowsPerPage,
453
- ActionsComponent: (props) => /* @__PURE__ */ jsx6(TablePaginationActions2, { enableNextPage: !!fetchMorePayloads, loading, ...props })
454
- }
455
- ) }) });
456
- var StyledTablePagination = styled(TablePagination2)(({ theme }) => ({
457
- "& > .MuiToolbar-root": {
458
- paddingLeft: theme.spacing(1)
459
- },
460
- borderTop: "1px solid",
461
- borderTopColor: theme.palette.divider
462
- }));
463
-
464
- // src/components/Table/TableHead.tsx
465
- import { TableCell as TableCell4, TableHead as TableHead2, TableRow as TableRow5, Typography as Typography5 } from "@mui/material";
466
- import { useBreakpoint as useBreakpoint4 } from "@xylabs/react-shared";
467
- import { jsx as jsx7 } from "react/jsx-runtime";
468
- var PayloadTableHead = ({ columns = payloadTableColumnConfigDefaults(), ...props }) => {
469
- var _a;
470
- const breakPoint = useBreakpoint4();
471
- return /* @__PURE__ */ jsx7(TableHead2, { ...props, children: /* @__PURE__ */ jsx7(TableRow5, { children: breakPoint && columns ? (_a = columns[breakPoint]) == null ? void 0 : _a.map((column, index) => {
472
- return /* @__PURE__ */ jsx7(TableCell4, { width: index === 0 ? "100%" : void 0, align: index === 0 ? "left" : "center", children: /* @__PURE__ */ jsx7(Typography5, { variant: "body2", noWrap: true, children: payloadColumnNames[column] }) }, index);
473
- }) : null }) });
474
- };
475
-
476
- // src/components/Table/TableRowNoData.tsx
477
- import { styled as styled2, TableCell as TableCell5, TableRow as TableRow6, Typography as Typography6 } from "@mui/material";
478
- import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
479
- var TableRowNoData = ({ additionalCells, hideBorder = false, typographyProps, ...props }) => {
480
- return /* @__PURE__ */ jsxs5(TableRow6, { ...props, children: [
481
- /* @__PURE__ */ jsx8(StyledTableCell, { hideBorder, children: /* @__PURE__ */ jsx8(Typography6, { variant: "body2", ...typographyProps, children: "No Data To Display..." }) }),
482
- additionalCells ? Array(additionalCells).fill(void 0).map((_fill, index) => /* @__PURE__ */ jsx8(StyledTableCell, { hideBorder }, index)) : null
483
- ] });
484
- };
485
- var StyledTableCell = styled2(TableCell5, {
486
- name: "StyledTableCell",
487
- shouldForwardProp: (prop) => prop !== "hideBorder"
488
- })(({ hideBorder }) => ({
489
- ...hideBorder && { border: "none" }
490
- }));
491
-
492
- // src/components/Table/Table.tsx
493
- import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
494
- var PayloadTableWithRef = forwardRef(
495
- ({
496
- exploreDomain,
497
- archive,
498
- onRowClick,
499
- fetchMorePayloads,
500
- rowsPerPage: rowsPerPageProp = 25,
501
- payloads,
502
- columns,
503
- PayloadTableHeadComponent = PayloadTableHead,
504
- PayloadTableBodyComponent = PayloadTableBody,
505
- PayloadTableFooterComponent = PayloadTableFooter,
506
- maxSchemaDepth,
507
- count = 0,
508
- loading = false,
509
- variant = "scrollable",
510
- ...props
511
- }, ref) => {
512
- const [page, setPage] = useState2(0);
513
- const [rowsPerPage, setRowsPerPage] = useState2(rowsPerPageProp);
514
- const [visiblePayloads, setVisiblePayloads] = useState2([]);
515
- const emptyRows = page > 0 ? Math.max(0, (1 + page) * rowsPerPage - count || 0) : 0;
516
- useEffect2(() => {
517
- setRowsPerPage(rowsPerPageProp);
518
- }, [rowsPerPageProp]);
519
- useEffect2(() => {
520
- if (payloads) {
521
- setVisiblePayloads(payloads.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage));
522
- }
523
- }, [count, page, payloads, rowsPerPage]);
524
- useEffect2(() => {
525
- setPage(0);
526
- }, [payloads]);
527
- const handleAdditionalPayloads = () => {
528
- if (fetchMorePayloads && payloads) {
529
- const buffer = rowsPerPage * 2;
530
- const lastVisiblePayload = visiblePayloads == null ? void 0 : visiblePayloads.at(-1);
531
- if (lastVisiblePayload) {
532
- const lastVisibleIndex = payloads == null ? void 0 : payloads.indexOf(lastVisiblePayload);
533
- if (lastVisibleIndex !== void 0 && payloads.length - (lastVisibleIndex + 1) <= buffer) {
534
- fetchMorePayloads();
535
- }
536
- }
537
- }
538
- };
539
- const handleChangePage = (_event, newPage) => {
540
- handleAdditionalPayloads();
541
- setPage(newPage);
542
- };
543
- const handleChangeRowsPerPage = (event) => {
544
- setRowsPerPage(parseInt(event.target.value, 10));
545
- setPage(0);
546
- };
547
- const noResults = useMemo2(() => {
548
- return !loading && (!visiblePayloads || visiblePayloads.length === 0);
549
- }, [loading, visiblePayloads]);
550
- return /* @__PURE__ */ jsxs6(TableEx, { variant, ref, ...props, children: [
551
- /* @__PURE__ */ jsx9(PayloadTableHeadComponent, { columns }),
552
- /* @__PURE__ */ jsx9(
553
- PayloadTableBodyComponent,
554
- {
555
- payloads: visiblePayloads,
556
- exploreDomain,
557
- archive,
558
- maxSchemaDepth,
559
- onRowClick,
560
- emptyRows,
561
- noResults,
562
- NoResultRowComponent: TableRowNoData
563
- }
564
- ),
565
- /* @__PURE__ */ jsx9(
566
- PayloadTableFooterComponent,
567
- {
568
- count,
569
- variant,
570
- rowsPerPage,
571
- handleChangePage,
572
- handleChangeRowsPerPage,
573
- fetchMorePayloads,
574
- loading,
575
- page
576
- }
577
- )
578
- ] });
579
- }
580
- );
581
- PayloadTableWithRef.displayName = "PayloadTable";
582
- var PayloadTable = PayloadTableWithRef;
583
- export {
584
- PayloadDynamicTable,
585
- PayloadDynamicTableRow,
586
- PayloadTable,
587
- PayloadTableRow,
588
- PayloadTableWithRef,
589
- TablePaginationActions2 as TablePaginationActions,
590
- TableRowNoData,
591
- payloadColumnNames,
592
- payloadDynamicTableColumnConfigDefaults,
593
- payloadTableColumnConfigDefaults
594
- };
595
- //# sourceMappingURL=index.js.map