@xyo-network/react-payload-details 5.1.0 → 5.1.2
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.
package/dist/browser/index.mjs
CHANGED
@@ -6,7 +6,7 @@ import { ContentCopy as ContentCopyIcon2, Visibility as VisibilityIcon } from "@
|
|
6
6
|
import { Dialog, DialogActions, DialogContent, DialogTitle } from "@mui/material";
|
7
7
|
import { forget } from "@xylabs/forget";
|
8
8
|
import { ButtonEx } from "@xylabs/react-button";
|
9
|
-
import {
|
9
|
+
import { PayloadBuilder as PayloadBuilder2 } from "@xyo-network/payload-builder";
|
10
10
|
import { Property } from "@xyo-network/react-property";
|
11
11
|
import { usePayloadHash } from "@xyo-network/react-shared";
|
12
12
|
import React2, { useState } from "react";
|
@@ -16,11 +16,11 @@ import { ContentCopy as ContentCopyIcon } from "@mui/icons-material";
|
|
16
16
|
import { IconButton, Typography, useTheme } from "@mui/material";
|
17
17
|
import { FlexCol, FlexGrowRow, FlexRow } from "@xylabs/react-flexbox";
|
18
18
|
import { QuickTipButton } from "@xylabs/react-quick-tip-button";
|
19
|
-
import {
|
19
|
+
import { PayloadBuilder } from "@xyo-network/payload-builder";
|
20
20
|
import React from "react";
|
21
21
|
var PayloadHashSourceDetails = /* @__PURE__ */ __name(({ noTitle = false, payload, ...props }) => {
|
22
22
|
const theme = useTheme();
|
23
|
-
const payloadString = payload ? JSON.stringify(
|
23
|
+
const payloadString = payload ? JSON.stringify(PayloadBuilder.hashableFields(payload), null, 2) : "";
|
24
24
|
return /* @__PURE__ */ React.createElement(FlexCol, {
|
25
25
|
alignItems: "stretch",
|
26
26
|
...props
|
@@ -52,7 +52,7 @@ var PayloadHashSourceDetails = /* @__PURE__ */ __name(({ noTitle = false, payloa
|
|
52
52
|
|
53
53
|
// src/components/Details/DataDetails.tsx
|
54
54
|
var PayloadDataDetails = /* @__PURE__ */ __name(({ size, badge, payload, ...props }) => {
|
55
|
-
const payloadString = payload ? JSON.stringify(
|
55
|
+
const payloadString = payload ? JSON.stringify(PayloadBuilder2.hashableFields(payload), null, 2) : "";
|
56
56
|
const [viewSourceOpen, setViewSourceOpen] = useState(false);
|
57
57
|
const hash = usePayloadHash(payload);
|
58
58
|
let elevation = 2;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/components/Details/DataDetails.tsx","../../src/components/Details/HashSourceDetails.tsx","../../src/components/Details/Details.tsx","../../src/components/Details/JsonDetails.tsx","../../src/components/Details/ValidationDetails/ValidationDetails.tsx"],"sourcesContent":["import { ContentCopy as ContentCopyIcon, Visibility as VisibilityIcon } from '@mui/icons-material'\nimport {\n Dialog, DialogActions, DialogContent, DialogTitle,\n} from '@mui/material'\nimport { forget } from '@xylabs/forget'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport type { Payload } from '@xyo-network/payload-model'\nimport type { PropertyAction, PropertyProps } from '@xyo-network/react-property'\nimport { Property } from '@xyo-network/react-property'\nimport type { SizeProp } from '@xyo-network/react-shared'\nimport { usePayloadHash } from '@xyo-network/react-shared'\nimport React, { useState } from 'react'\n\nimport { PayloadHashSourceDetails } from './HashSourceDetails.tsx'\n\nexport type PayloadDataDetailsProps = PropertyProps & {\n badge?: boolean\n payload?: Payload\n size?: SizeProp\n}\n\nexport const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({\n size, badge, payload, ...props\n}) => {\n const payloadString = payload ? JSON.stringify(PayloadHasher.hashFields(payload), null, 2) : ''\n\n const [viewSourceOpen, setViewSourceOpen] = useState(false)\n const hash = usePayloadHash(payload)\n\n let elevation = 2\n if (props.paper) {\n elevation += props.elevation ?? 0\n }\n\n const actions: PropertyAction[] = [\n {\n icon: <VisibilityIcon />,\n name: 'View',\n onClick: () => setViewSourceOpen(true),\n },\n {\n icon: <ContentCopyIcon />,\n name: 'Copy',\n onClick: () => forget(navigator.clipboard.writeText(hash ?? '')),\n },\n ]\n\n const onCopy = () => {\n forget(navigator.clipboard.writeText(payloadString))\n }\n\n return (\n <>\n <Property\n titleProps={{ elevation }}\n badge={badge}\n size={size}\n actions={actions}\n title=\"Payload Hash\"\n value={hash ?? '<Unknown>'}\n tip=\"This is the payload hash\"\n {...props}\n />\n <Dialog open={viewSourceOpen} onClose={() => setViewSourceOpen(false)}>\n <DialogTitle>Hash Source</DialogTitle>\n <DialogContent>\n <PayloadHashSourceDetails noTitle payload={payload} />\n </DialogContent>\n <DialogActions>\n <ButtonEx color=\"secondary\" onClick={onCopy}>\n Copy\n </ButtonEx>\n <ButtonEx color=\"secondary\" onClick={() => setViewSourceOpen(false)}>\n Close\n </ButtonEx>\n </DialogActions>\n </Dialog>\n </>\n )\n}\n","import { ContentCopy as ContentCopyIcon } from '@mui/icons-material'\nimport {\n IconButton, Typography, useTheme,\n} from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport {\n FlexCol, FlexGrowRow, FlexRow,\n} from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport type { Payload } from '@xyo-network/payload-model'\nimport React from 'react'\n\nexport interface PayloadHashSourceDetailsProps extends FlexBoxProps {\n noTitle?: boolean\n payload?: Payload\n}\n\nexport const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> = ({\n noTitle = false, payload, ...props\n}) => {\n const theme = useTheme()\n const payloadString = payload ? JSON.stringify(PayloadHasher.hashFields(payload), null, 2) : ''\n\n return (\n <FlexCol alignItems=\"stretch\" {...props}>\n {noTitle\n ? null\n : (\n <FlexRow margin={1} justifyContent=\"flex-start\">\n <Typography>Hash Source</Typography>\n <QuickTipButton title=\"Hash Source\">The actual string used to generate the hash (SHA256)</QuickTipButton>\n </FlexRow>\n )}\n <FlexRow>\n <FlexGrowRow background border={1} borderColor={theme.palette.divider} justifyContent=\"start\">\n <Typography\n padding={2}\n fontFamily=\"monospace\"\n variant=\"body1\"\n sx={{ overflowWrap: 'break-word', wordBreak: 'break-all' }}\n >\n {payloadString}\n </Typography>\n </FlexGrowRow>\n <IconButton>\n <ContentCopyIcon />\n </IconButton>\n </FlexRow>\n {noTitle\n ? (\n <FlexRow margin={1} justifyContent=\"flex-start\">\n <Typography variant=\"body2\">\n The actual string used to generate the hash (SHA256). This can be used to validate the hash manually.\n </Typography>\n </FlexRow>\n )\n : null}\n </FlexCol>\n )\n}\n","import type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport type { Payload } from '@xyo-network/payload-model'\nimport React from 'react'\n\nimport { PayloadDataDetails } from './DataDetails.tsx'\nimport { PayloadJsonDetails } from './JsonDetails.tsx'\nimport { PayloadValidationDetails } from './ValidationDetails/index.ts'\n\nexport type WithPaper<T> = T & { paper: true }\nexport type WithoutPaper<T> = T & { paper?: false }\n\nexport type PayloadDetailsProps = FlexBoxProps & {\n paper?: boolean\n payload?: Payload\n}\n\nexport const PayloadDetails: React.FC<PayloadDetailsProps> = ({\n paper, payload, ...props\n}) => {\n return (\n <FlexCol gap={1} justifyContent=\"flex-start\" alignItems=\"stretch\" marginTop={2} marginBottom={8} {...props}>\n <PayloadDataDetails paper={paper} size=\"large\" badge payload={payload} />\n <PayloadValidationDetails paper={paper} value={payload} />\n <PayloadJsonDetails paper={paper} payload={payload} />\n </FlexCol>\n )\n}\n\nPayloadDetails.displayName = 'PayloadDetails'\n","import {\n Paper, useMediaQuery, useTheme,\n} from '@mui/material'\nimport type { Payload } from '@xyo-network/payload-model'\nimport type { JsonViewerExProps } from '@xyo-network/react-payload-raw-info'\nimport { JsonViewerEx } from '@xyo-network/react-payload-raw-info'\nimport type { PropertyGroupProps } from '@xyo-network/react-property'\nimport { PropertyGroup } from '@xyo-network/react-property'\nimport React from 'react'\n\nexport type PayloadJsonDetailsProps = PropertyGroupProps & {\n jsonViewProps?: JsonViewerExProps\n payload?: Payload\n}\n\nexport const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({\n jsonViewProps, payload, ...props\n}) => {\n const { breakpoints, palette } = useTheme()\n const belowSm = useMediaQuery(breakpoints.down('sm'))\n\n let elevation = 2\n if (props.paper) {\n elevation += props.elevation ?? 0\n }\n\n const jsonTheme = palette.mode === 'dark' ? 'dark' : 'light'\n\n return (\n <PropertyGroup titleProps={{ elevation }} title=\"JSON\" tip=\"The raw JSON of the payload\" {...props}>\n <Paper\n square\n variant=\"elevation\"\n style={{\n overflow: 'hidden', padding: '16px', width: '100%',\n }}\n >\n <JsonViewerEx\n groupArraysAfterLength={20}\n style={{ backgroundColor: undefined, overflow: 'hidden' }}\n value={payload}\n enableClipboard\n theme={jsonTheme}\n collapseStringsAfterLength={belowSm ? 24 : 32}\n {...jsonViewProps}\n />\n </Paper>\n </PropertyGroup>\n )\n}\n","import { Typography } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { usePromise } from '@xylabs/react-promise'\nimport { PayloadValidator } from '@xyo-network/payload-validator'\nimport { Property, PropertyGroup } from '@xyo-network/react-property'\nimport { SchemaProperty } from '@xyo-network/react-schema'\nimport React from 'react'\n\nimport type { PayloadValidationDetailsProps } from './ValidationDetailsProps.ts'\n\nexport const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> = ({\n skipBody = false, value, ...props\n}) => {\n const [validateErrors] = usePromise(async () => (value ? await new PayloadValidator(value).validate() : undefined), [value])\n\n const bodyErrors = skipBody ? [] : (validateErrors ?? [])\n const errors: Error[] = [...bodyErrors]\n\n let elevation = 2\n if (props.paper) {\n elevation += props.elevation ?? 0\n }\n\n return (\n <PropertyGroup titleProps={{ elevation }} title=\"Validation\" tip=\"The results from validating the payload\" {...props}>\n <Property\n titleProps={{ elevation }}\n flexGrow={1}\n title=\"Valid\"\n value={errors.length === 0 ? 'True' : 'False'}\n tip={\n errors.length > 0\n ? (\n <FlexCol>\n {errors.map((error, index) => {\n return <Typography key={index}>{error.toString()}</Typography>\n })}\n </FlexCol>\n )\n : <Typography>No Errors</Typography>\n }\n />\n {value?.schema && <SchemaProperty flexGrow={1} titleProps={{ elevation }} value={value.schema} />}\n </PropertyGroup>\n )\n}\n"],"mappings":"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","names":["ContentCopy","ContentCopyIcon","Visibility","VisibilityIcon","Dialog","DialogActions","DialogContent","DialogTitle","forget","ButtonEx","PayloadHasher","Property","usePayloadHash","React","useState","ContentCopy","ContentCopyIcon","IconButton","Typography","useTheme","FlexCol","FlexGrowRow","FlexRow","QuickTipButton","PayloadHasher","React","PayloadHashSourceDetails","noTitle","payload","props","theme","useTheme","payloadString","JSON","stringify","PayloadHasher","hashFields","FlexCol","alignItems","FlexRow","margin","justifyContent","Typography","QuickTipButton","title","FlexGrowRow","background","border","borderColor","palette","divider","padding","fontFamily","variant","sx","overflowWrap","wordBreak","IconButton","ContentCopyIcon","PayloadDataDetails","size","badge","payload","props","payloadString","JSON","stringify","PayloadHasher","hashFields","viewSourceOpen","setViewSourceOpen","useState","hash","usePayloadHash","elevation","paper","actions","icon","React","VisibilityIcon","name","onClick","ContentCopyIcon","forget","navigator","clipboard","writeText","onCopy","Property","titleProps","title","value","tip","Dialog","open","onClose","DialogTitle","DialogContent","PayloadHashSourceDetails","noTitle","DialogActions","ButtonEx","color","FlexCol","React","Paper","useMediaQuery","useTheme","JsonViewerEx","PropertyGroup","React","PayloadJsonDetails","jsonViewProps","payload","props","breakpoints","palette","useTheme","belowSm","useMediaQuery","down","elevation","paper","jsonTheme","mode","React","PropertyGroup","titleProps","title","tip","Paper","square","variant","style","overflow","padding","width","JsonViewerEx","groupArraysAfterLength","backgroundColor","undefined","value","enableClipboard","theme","collapseStringsAfterLength","Typography","FlexCol","usePromise","PayloadValidator","Property","PropertyGroup","SchemaProperty","React","PayloadValidationDetails","skipBody","value","props","validateErrors","usePromise","PayloadValidator","validate","undefined","bodyErrors","errors","elevation","paper","React","PropertyGroup","titleProps","title","tip","Property","flexGrow","length","FlexCol","map","error","index","Typography","key","toString","schema","SchemaProperty","PayloadDetails","paper","payload","props","React","FlexCol","gap","justifyContent","alignItems","marginTop","marginBottom","PayloadDataDetails","size","badge","PayloadValidationDetails","value","PayloadJsonDetails","displayName"]}
|
1
|
+
{"version":3,"sources":["../../src/components/Details/DataDetails.tsx","../../src/components/Details/HashSourceDetails.tsx","../../src/components/Details/Details.tsx","../../src/components/Details/JsonDetails.tsx","../../src/components/Details/ValidationDetails/ValidationDetails.tsx"],"sourcesContent":["import { ContentCopy as ContentCopyIcon, Visibility as VisibilityIcon } from '@mui/icons-material'\nimport {\n Dialog, DialogActions, DialogContent, DialogTitle,\n} from '@mui/material'\nimport { forget } from '@xylabs/forget'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { PayloadBuilder } from '@xyo-network/payload-builder'\nimport type { Payload } from '@xyo-network/payload-model'\nimport type { PropertyAction, PropertyProps } from '@xyo-network/react-property'\nimport { Property } from '@xyo-network/react-property'\nimport type { SizeProp } from '@xyo-network/react-shared'\nimport { usePayloadHash } from '@xyo-network/react-shared'\nimport React, { useState } from 'react'\n\nimport { PayloadHashSourceDetails } from './HashSourceDetails.tsx'\n\nexport type PayloadDataDetailsProps = PropertyProps & {\n badge?: boolean\n payload?: Payload\n size?: SizeProp\n}\n\nexport const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({\n size, badge, payload, ...props\n}) => {\n const payloadString = payload ? JSON.stringify(PayloadBuilder.hashableFields(payload), null, 2) : ''\n\n const [viewSourceOpen, setViewSourceOpen] = useState(false)\n const hash = usePayloadHash(payload)\n\n let elevation = 2\n if (props.paper) {\n elevation += props.elevation ?? 0\n }\n\n const actions: PropertyAction[] = [\n {\n icon: <VisibilityIcon />,\n name: 'View',\n onClick: () => setViewSourceOpen(true),\n },\n {\n icon: <ContentCopyIcon />,\n name: 'Copy',\n onClick: () => forget(navigator.clipboard.writeText(hash ?? '')),\n },\n ]\n\n const onCopy = () => {\n forget(navigator.clipboard.writeText(payloadString))\n }\n\n return (\n <>\n <Property\n titleProps={{ elevation }}\n badge={badge}\n size={size}\n actions={actions}\n title=\"Payload Hash\"\n value={hash ?? '<Unknown>'}\n tip=\"This is the payload hash\"\n {...props}\n />\n <Dialog open={viewSourceOpen} onClose={() => setViewSourceOpen(false)}>\n <DialogTitle>Hash Source</DialogTitle>\n <DialogContent>\n <PayloadHashSourceDetails noTitle payload={payload} />\n </DialogContent>\n <DialogActions>\n <ButtonEx color=\"secondary\" onClick={onCopy}>\n Copy\n </ButtonEx>\n <ButtonEx color=\"secondary\" onClick={() => setViewSourceOpen(false)}>\n Close\n </ButtonEx>\n </DialogActions>\n </Dialog>\n </>\n )\n}\n","import { ContentCopy as ContentCopyIcon } from '@mui/icons-material'\nimport {\n IconButton, Typography, useTheme,\n} from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport {\n FlexCol, FlexGrowRow, FlexRow,\n} from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { PayloadBuilder } from '@xyo-network/payload-builder'\nimport type { Payload } from '@xyo-network/payload-model'\nimport React from 'react'\n\nexport interface PayloadHashSourceDetailsProps extends FlexBoxProps {\n noTitle?: boolean\n payload?: Payload\n}\n\nexport const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> = ({\n noTitle = false, payload, ...props\n}) => {\n const theme = useTheme()\n const payloadString = payload ? JSON.stringify(PayloadBuilder.hashableFields(payload), null, 2) : ''\n\n return (\n <FlexCol alignItems=\"stretch\" {...props}>\n {noTitle\n ? null\n : (\n <FlexRow margin={1} justifyContent=\"flex-start\">\n <Typography>Hash Source</Typography>\n <QuickTipButton title=\"Hash Source\">The actual string used to generate the hash (SHA256)</QuickTipButton>\n </FlexRow>\n )}\n <FlexRow>\n <FlexGrowRow background border={1} borderColor={theme.palette.divider} justifyContent=\"start\">\n <Typography\n padding={2}\n fontFamily=\"monospace\"\n variant=\"body1\"\n sx={{ overflowWrap: 'break-word', wordBreak: 'break-all' }}\n >\n {payloadString}\n </Typography>\n </FlexGrowRow>\n <IconButton>\n <ContentCopyIcon />\n </IconButton>\n </FlexRow>\n {noTitle\n ? (\n <FlexRow margin={1} justifyContent=\"flex-start\">\n <Typography variant=\"body2\">\n The actual string used to generate the hash (SHA256). This can be used to validate the hash manually.\n </Typography>\n </FlexRow>\n )\n : null}\n </FlexCol>\n )\n}\n","import type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport type { Payload } from '@xyo-network/payload-model'\nimport React from 'react'\n\nimport { PayloadDataDetails } from './DataDetails.tsx'\nimport { PayloadJsonDetails } from './JsonDetails.tsx'\nimport { PayloadValidationDetails } from './ValidationDetails/index.ts'\n\nexport type WithPaper<T> = T & { paper: true }\nexport type WithoutPaper<T> = T & { paper?: false }\n\nexport type PayloadDetailsProps = FlexBoxProps & {\n paper?: boolean\n payload?: Payload\n}\n\nexport const PayloadDetails: React.FC<PayloadDetailsProps> = ({\n paper, payload, ...props\n}) => {\n return (\n <FlexCol gap={1} justifyContent=\"flex-start\" alignItems=\"stretch\" marginTop={2} marginBottom={8} {...props}>\n <PayloadDataDetails paper={paper} size=\"large\" badge payload={payload} />\n <PayloadValidationDetails paper={paper} value={payload} />\n <PayloadJsonDetails paper={paper} payload={payload} />\n </FlexCol>\n )\n}\n\nPayloadDetails.displayName = 'PayloadDetails'\n","import {\n Paper, useMediaQuery, useTheme,\n} from '@mui/material'\nimport type { Payload } from '@xyo-network/payload-model'\nimport type { JsonViewerExProps } from '@xyo-network/react-payload-raw-info'\nimport { JsonViewerEx } from '@xyo-network/react-payload-raw-info'\nimport type { PropertyGroupProps } from '@xyo-network/react-property'\nimport { PropertyGroup } from '@xyo-network/react-property'\nimport React from 'react'\n\nexport type PayloadJsonDetailsProps = PropertyGroupProps & {\n jsonViewProps?: JsonViewerExProps\n payload?: Payload\n}\n\nexport const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({\n jsonViewProps, payload, ...props\n}) => {\n const { breakpoints, palette } = useTheme()\n const belowSm = useMediaQuery(breakpoints.down('sm'))\n\n let elevation = 2\n if (props.paper) {\n elevation += props.elevation ?? 0\n }\n\n const jsonTheme = palette.mode === 'dark' ? 'dark' : 'light'\n\n return (\n <PropertyGroup titleProps={{ elevation }} title=\"JSON\" tip=\"The raw JSON of the payload\" {...props}>\n <Paper\n square\n variant=\"elevation\"\n style={{\n overflow: 'hidden', padding: '16px', width: '100%',\n }}\n >\n <JsonViewerEx\n groupArraysAfterLength={20}\n style={{ backgroundColor: undefined, overflow: 'hidden' }}\n value={payload}\n enableClipboard\n theme={jsonTheme}\n collapseStringsAfterLength={belowSm ? 24 : 32}\n {...jsonViewProps}\n />\n </Paper>\n </PropertyGroup>\n )\n}\n","import { Typography } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { usePromise } from '@xylabs/react-promise'\nimport { PayloadValidator } from '@xyo-network/payload-validator'\nimport { Property, PropertyGroup } from '@xyo-network/react-property'\nimport { SchemaProperty } from '@xyo-network/react-schema'\nimport React from 'react'\n\nimport type { PayloadValidationDetailsProps } from './ValidationDetailsProps.ts'\n\nexport const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> = ({\n skipBody = false, value, ...props\n}) => {\n const [validateErrors] = usePromise(async () => (value ? await new PayloadValidator(value).validate() : undefined), [value])\n\n const bodyErrors = skipBody ? [] : (validateErrors ?? [])\n const errors: Error[] = [...bodyErrors]\n\n let elevation = 2\n if (props.paper) {\n elevation += props.elevation ?? 0\n }\n\n return (\n <PropertyGroup titleProps={{ elevation }} title=\"Validation\" tip=\"The results from validating the payload\" {...props}>\n <Property\n titleProps={{ elevation }}\n flexGrow={1}\n title=\"Valid\"\n value={errors.length === 0 ? 'True' : 'False'}\n tip={\n errors.length > 0\n ? (\n <FlexCol>\n {errors.map((error, index) => {\n return <Typography key={index}>{error.toString()}</Typography>\n })}\n </FlexCol>\n )\n : <Typography>No Errors</Typography>\n }\n />\n {value?.schema && <SchemaProperty flexGrow={1} titleProps={{ elevation }} value={value.schema} />}\n </PropertyGroup>\n )\n}\n"],"mappings":"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","names":["ContentCopy","ContentCopyIcon","Visibility","VisibilityIcon","Dialog","DialogActions","DialogContent","DialogTitle","forget","ButtonEx","PayloadBuilder","Property","usePayloadHash","React","useState","ContentCopy","ContentCopyIcon","IconButton","Typography","useTheme","FlexCol","FlexGrowRow","FlexRow","QuickTipButton","PayloadBuilder","React","PayloadHashSourceDetails","noTitle","payload","props","theme","useTheme","payloadString","JSON","stringify","PayloadBuilder","hashableFields","FlexCol","alignItems","FlexRow","margin","justifyContent","Typography","QuickTipButton","title","FlexGrowRow","background","border","borderColor","palette","divider","padding","fontFamily","variant","sx","overflowWrap","wordBreak","IconButton","ContentCopyIcon","PayloadDataDetails","size","badge","payload","props","payloadString","JSON","stringify","PayloadBuilder","hashableFields","viewSourceOpen","setViewSourceOpen","useState","hash","usePayloadHash","elevation","paper","actions","icon","React","VisibilityIcon","name","onClick","ContentCopyIcon","forget","navigator","clipboard","writeText","onCopy","Property","titleProps","title","value","tip","Dialog","open","onClose","DialogTitle","DialogContent","PayloadHashSourceDetails","noTitle","DialogActions","ButtonEx","color","FlexCol","React","Paper","useMediaQuery","useTheme","JsonViewerEx","PropertyGroup","React","PayloadJsonDetails","jsonViewProps","payload","props","breakpoints","palette","useTheme","belowSm","useMediaQuery","down","elevation","paper","jsonTheme","mode","React","PropertyGroup","titleProps","title","tip","Paper","square","variant","style","overflow","padding","width","JsonViewerEx","groupArraysAfterLength","backgroundColor","undefined","value","enableClipboard","theme","collapseStringsAfterLength","Typography","FlexCol","usePromise","PayloadValidator","Property","PropertyGroup","SchemaProperty","React","PayloadValidationDetails","skipBody","value","props","validateErrors","usePromise","PayloadValidator","validate","undefined","bodyErrors","errors","elevation","paper","React","PropertyGroup","titleProps","title","tip","Property","flexGrow","length","FlexCol","map","error","index","Typography","key","toString","schema","SchemaProperty","PayloadDetails","paper","payload","props","React","FlexCol","gap","justifyContent","alignItems","marginTop","marginBottom","PayloadDataDetails","size","badge","PayloadValidationDetails","value","PayloadJsonDetails","displayName"]}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@xyo-network/react-payload-details",
|
3
|
-
"version": "5.1.
|
3
|
+
"version": "5.1.2",
|
4
4
|
"description": "Common React library for all XYO projects that use React",
|
5
5
|
"keywords": [
|
6
6
|
"xyo",
|
@@ -39,34 +39,34 @@
|
|
39
39
|
"module": "dist/browser/index.mjs",
|
40
40
|
"types": "dist/types/index.d.ts",
|
41
41
|
"dependencies": {
|
42
|
-
"@xylabs/forget": "^4.
|
43
|
-
"@xylabs/react-button": "^6.1.
|
44
|
-
"@xylabs/react-flexbox": "^6.1.
|
45
|
-
"@xylabs/react-promise": "^6.1.
|
46
|
-
"@xylabs/react-quick-tip-button": "^6.1.
|
47
|
-
"@xyo-network/hash": "^3.
|
48
|
-
"@xyo-network/payload-model": "^3.
|
49
|
-
"@xyo-network/payload-validator": "^3.
|
50
|
-
"@xyo-network/react-payload-raw-info": "^5.1.
|
51
|
-
"@xyo-network/react-property": "^5.1.
|
52
|
-
"@xyo-network/react-schema": "^5.1.
|
53
|
-
"@xyo-network/react-shared": "^5.1.
|
42
|
+
"@xylabs/forget": "^4.8.0",
|
43
|
+
"@xylabs/react-button": "^6.1.13",
|
44
|
+
"@xylabs/react-flexbox": "^6.1.13",
|
45
|
+
"@xylabs/react-promise": "^6.1.13",
|
46
|
+
"@xylabs/react-quick-tip-button": "^6.1.13",
|
47
|
+
"@xyo-network/hash": "^3.12.0",
|
48
|
+
"@xyo-network/payload-model": "^3.12.0",
|
49
|
+
"@xyo-network/payload-validator": "^3.12.0",
|
50
|
+
"@xyo-network/react-payload-raw-info": "^5.1.2",
|
51
|
+
"@xyo-network/react-property": "^5.1.2",
|
52
|
+
"@xyo-network/react-schema": "^5.1.2",
|
53
|
+
"@xyo-network/react-shared": "^5.1.2"
|
54
54
|
},
|
55
55
|
"devDependencies": {
|
56
56
|
"@emotion/react": "^11.14.0",
|
57
57
|
"@emotion/styled": "^11.14.0",
|
58
58
|
"@mui/icons-material": "^7.0.1",
|
59
59
|
"@mui/material": "^7.0.1",
|
60
|
-
"@storybook/react": "^8.6.
|
61
|
-
"@types/react": "^19.0
|
62
|
-
"@xylabs/ts-scripts-yarn3": "^6.2.
|
63
|
-
"@xylabs/tsconfig-react": "^6.2.
|
64
|
-
"@xyo-network/react-storybook": "^5.1.
|
60
|
+
"@storybook/react": "^8.6.12",
|
61
|
+
"@types/react": "^19.1.0",
|
62
|
+
"@xylabs/ts-scripts-yarn3": "^6.2.1",
|
63
|
+
"@xylabs/tsconfig-react": "^6.2.1",
|
64
|
+
"@xyo-network/react-storybook": "^5.1.2",
|
65
65
|
"react": "^19.1.0",
|
66
66
|
"react-dom": "^19.1.0",
|
67
|
-
"react-router-dom": "^7.
|
68
|
-
"storybook": "^8.6.
|
69
|
-
"typescript": "^5.8.
|
67
|
+
"react-router-dom": "^7.5.0",
|
68
|
+
"storybook": "^8.6.12",
|
69
|
+
"typescript": "^5.8.3"
|
70
70
|
},
|
71
71
|
"peerDependencies": {
|
72
72
|
"@emotion/react": "^11",
|
@@ -4,7 +4,7 @@ import {
|
|
4
4
|
} from '@mui/material'
|
5
5
|
import { forget } from '@xylabs/forget'
|
6
6
|
import { ButtonEx } from '@xylabs/react-button'
|
7
|
-
import {
|
7
|
+
import { PayloadBuilder } from '@xyo-network/payload-builder'
|
8
8
|
import type { Payload } from '@xyo-network/payload-model'
|
9
9
|
import type { PropertyAction, PropertyProps } from '@xyo-network/react-property'
|
10
10
|
import { Property } from '@xyo-network/react-property'
|
@@ -23,7 +23,7 @@ export type PayloadDataDetailsProps = PropertyProps & {
|
|
23
23
|
export const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({
|
24
24
|
size, badge, payload, ...props
|
25
25
|
}) => {
|
26
|
-
const payloadString = payload ? JSON.stringify(
|
26
|
+
const payloadString = payload ? JSON.stringify(PayloadBuilder.hashableFields(payload), null, 2) : ''
|
27
27
|
|
28
28
|
const [viewSourceOpen, setViewSourceOpen] = useState(false)
|
29
29
|
const hash = usePayloadHash(payload)
|
@@ -7,7 +7,7 @@ import {
|
|
7
7
|
FlexCol, FlexGrowRow, FlexRow,
|
8
8
|
} from '@xylabs/react-flexbox'
|
9
9
|
import { QuickTipButton } from '@xylabs/react-quick-tip-button'
|
10
|
-
import {
|
10
|
+
import { PayloadBuilder } from '@xyo-network/payload-builder'
|
11
11
|
import type { Payload } from '@xyo-network/payload-model'
|
12
12
|
import React from 'react'
|
13
13
|
|
@@ -20,7 +20,7 @@ export const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> =
|
|
20
20
|
noTitle = false, payload, ...props
|
21
21
|
}) => {
|
22
22
|
const theme = useTheme()
|
23
|
-
const payloadString = payload ? JSON.stringify(
|
23
|
+
const payloadString = payload ? JSON.stringify(PayloadBuilder.hashableFields(payload), null, 2) : ''
|
24
24
|
|
25
25
|
return (
|
26
26
|
<FlexCol alignItems="stretch" {...props}>
|