@xyo-network/react-payload-details 5.2.2 → 5.2.4

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.
@@ -32,7 +32,7 @@ var PayloadHashSourceDetails = /* @__PURE__ */ __name(({ noTitle = false, payloa
32
32
  }, "The actual string used to generate the hash (SHA256)")), /* @__PURE__ */ React.createElement(FlexRow, null, /* @__PURE__ */ React.createElement(FlexGrowRow, {
33
33
  background: true,
34
34
  border: 1,
35
- borderColor: theme.palette.divider,
35
+ borderColor: theme.vars.palette.divider,
36
36
  justifyContent: "start"
37
37
  }, /* @__PURE__ */ React.createElement(Typography, {
38
38
  padding: 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 { 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"]}
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.vars.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","vars","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/knip.config.ts ADDED
@@ -0,0 +1,15 @@
1
+ import type { KnipConfig } from 'knip'
2
+
3
+ const config: KnipConfig = {
4
+ entry: [
5
+ 'src/index.ts',
6
+ ],
7
+ project: ['src/**/*.ts*'],
8
+ typescript: {
9
+ config: [
10
+ 'tsconfig.json',
11
+ ],
12
+ },
13
+ }
14
+
15
+ export default config
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xyo-network/react-payload-details",
3
- "version": "5.2.2",
3
+ "version": "5.2.4",
4
4
  "description": "Common React library for all XYO projects that use React",
5
5
  "keywords": [
6
6
  "xyo",
@@ -39,18 +39,18 @@
39
39
  "module": "dist/browser/index.mjs",
40
40
  "types": "dist/types/index.d.ts",
41
41
  "dependencies": {
42
- "@xylabs/forget": "^4.8.5",
43
- "@xylabs/react-button": "^6.2.1",
44
- "@xylabs/react-flexbox": "^6.2.1",
45
- "@xylabs/react-promise": "^6.2.1",
46
- "@xylabs/react-quick-tip-button": "^6.2.1",
47
- "@xyo-network/payload-builder": "^3.12.4",
48
- "@xyo-network/payload-model": "^3.12.4",
49
- "@xyo-network/payload-validator": "^3.12.4",
50
- "@xyo-network/react-payload-raw-info": "^5.2.2",
51
- "@xyo-network/react-property": "^5.2.2",
52
- "@xyo-network/react-schema": "^5.2.2",
53
- "@xyo-network/react-shared": "^5.2.2"
42
+ "@xylabs/forget": "^4.8.7",
43
+ "@xylabs/react-button": "^6.2.11",
44
+ "@xylabs/react-flexbox": "^6.2.11",
45
+ "@xylabs/react-promise": "^6.2.11",
46
+ "@xylabs/react-quick-tip-button": "^6.2.11",
47
+ "@xyo-network/payload-builder": "^3.14.12",
48
+ "@xyo-network/payload-model": "^3.14.12",
49
+ "@xyo-network/payload-validator": "^3.14.12",
50
+ "@xyo-network/react-payload-raw-info": "^5.2.4",
51
+ "@xyo-network/react-property": "^5.2.4",
52
+ "@xyo-network/react-schema": "^5.2.4",
53
+ "@xyo-network/react-shared": "^5.2.4"
54
54
  },
55
55
  "devDependencies": {
56
56
  "@emotion/react": "^11.14.0",
@@ -59,12 +59,13 @@
59
59
  "@mui/material": "^7.0.2",
60
60
  "@storybook/react": "^8.6.12",
61
61
  "@types/react": "^19.1.2",
62
- "@xylabs/ts-scripts-yarn3": "^6.2.1",
63
- "@xylabs/tsconfig-react": "^6.2.1",
64
- "@xyo-network/react-storybook": "^5.2.2",
62
+ "@xylabs/ts-scripts-yarn3": "^6.3.5",
63
+ "@xylabs/tsconfig-react": "^6.3.5",
64
+ "@xyo-network/react-storybook": "^5.2.4",
65
+ "knip": "^5.50.5",
65
66
  "react": "^19.1.0",
66
67
  "react-dom": "^19.1.0",
67
- "react-router-dom": "^7.5.0",
68
+ "react-router-dom": "^7.5.2",
68
69
  "storybook": "^8.6.12",
69
70
  "typescript": "^5.8.3"
70
71
  },
@@ -33,7 +33,7 @@ export const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> =
33
33
  </FlexRow>
34
34
  )}
35
35
  <FlexRow>
36
- <FlexGrowRow background border={1} borderColor={theme.palette.divider} justifyContent="start">
36
+ <FlexGrowRow background border={1} borderColor={theme.vars.palette.divider} justifyContent="start">
37
37
  <Typography
38
38
  padding={2}
39
39
  fontFamily="monospace"
@@ -0,0 +1 @@
1
+ import type {} from '@mui/material/themeCssVarsAugmentation'