@xyo-network/react-payload 2.25.22 → 2.25.25

package/dist/cjs/components/Details/JsonDetails.js

@@ -11,13 +11,14 @@ const JsonView = (0, react_1.lazy)(() => Promise.resolve().then(() => tslib_1.__
 const PayloadJsonDetails = (_a) => {
     var _b;
     var { jsonViewProps, payload = {} } = _a, props = tslib_1.__rest(_a, ["jsonViewProps", "payload"]);
-    const { breakpoints } = (0, material_1.useTheme)();
+    const { breakpoints, palette } = (0, material_1.useTheme)();
     const belowSm = (0, material_1.useMediaQuery)(breakpoints.down('sm'));
     let elevation = 2;
     if (props.paper) {
         elevation += (_b = props.elevation) !== null && _b !== void 0 ? _b : 0;
     }
-    return ((0, jsx_runtime_1.jsx)(react_property_1.PropertyGroup, Object.assign({ titleProps: { elevation }, title: "JSON", tip: "The raw JSON of the payload" }, props, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, Object.assign({ fallback: (0, jsx_runtime_1.jsx)(sdk_react_1.FlexGrowRow, {}) }, { children: (0, jsx_runtime_1.jsx)(JsonView, Object.assign({ src: payload, enableClipboard: true, collapseStringsAfterLength: belowSm ? 24 : 32 }, jsonViewProps)) })) })));
+    const jsonTheme = palette.mode === 'dark' ? 'shapeshifter' : undefined;
+    return ((0, jsx_runtime_1.jsx)(react_property_1.PropertyGroup, Object.assign({ titleProps: { elevation }, title: "JSON", tip: "The raw JSON of the payload" }, props, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ square: true, elevation: 2, style: { overflow: 'hidden', padding: '16px', width: '100%' } }, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, Object.assign({ fallback: (0, jsx_runtime_1.jsx)(sdk_react_1.FlexGrowRow, {}) }, { children: (0, jsx_runtime_1.jsx)(JsonView, Object.assign({ groupArraysAfterLength: 5, shouldCollapse: (props) => props.name !== 'root', style: { backgroundColor: undefined, overflow: 'hidden' }, src: payload, enableClipboard: true, theme: jsonTheme, collapseStringsAfterLength: belowSm ? 24 : 32 }, jsonViewProps)) })) })) })));
 };
 exports.PayloadJsonDetails = PayloadJsonDetails;
 //# sourceMappingURL=JsonDetails.js.map

package/dist/cjs/components/Details/JsonDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"JsonDetails.js","sourceRoot":"","sources":["../../../../src/components/Details/JsonDetails.tsx"],"names":[],"mappings":";;;;;AAAA,4CAAuD;AACvD,iDAA+C;AAE/C,gEAA+E;AAC/E,iCAAsC;AAGtC,MAAM,QAAQ,GAAG,IAAA,YAAI,EAAC,GAAG,EAAE,2DAAQ,kCAAkC,CAAC,iBAAiB,GAAC,CAAC,CAAA;AAOlF,MAAM,kBAAkB,GAAsC,CAAC,EAAyC,EAAE,EAAE;;QAA7C,EAAE,aAAa,EAAE,OAAO,GAAG,EAAE,OAAY,EAAP,KAAK,sBAAvC,4BAAyC,CAAF;IAC3G,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,mBAAQ,GAAE,CAAA;IAClC,MAAM,OAAO,GAAG,IAAA,wBAAa,EAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAErD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC,CAAA;KAClC;IAED,OAAO,CACL,uBAAC,8BAAa,kBAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,6BAA6B,IAAK,KAAK,cAChG,uBAAC,gBAAQ,kBAAC,QAAQ,EAAE,uBAAC,uBAAW,KAAG,gBACjC,uBAAC,QAAQ,kBAAC,GAAG,EAAE,OAAO,EAAE,eAAe,QAAC,0BAA0B,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,IAAM,aAAa,EAAI,IACnG,IACG,CACjB,CAAA;AACH,CAAC,CAAA;AAhBY,QAAA,kBAAkB,sBAgB9B"}
+{"version":3,"file":"JsonDetails.js","sourceRoot":"","sources":["../../../../src/components/Details/JsonDetails.tsx"],"names":[],"mappings":";;;;;AAAA,4CAA8D;AAC9D,iDAA+C;AAE/C,gEAA+E;AAC/E,iCAAsC;AAGtC,MAAM,QAAQ,GAAG,IAAA,YAAI,EAAC,GAAG,EAAE,2DAAQ,kCAAkC,CAAC,iBAAiB,GAAC,CAAC,CAAA;AAOlF,MAAM,kBAAkB,GAAsC,CAAC,EAAyC,EAAE,EAAE;;QAA7C,EAAE,aAAa,EAAE,OAAO,GAAG,EAAE,OAAY,EAAP,KAAK,sBAAvC,4BAAyC,CAAF;IAC3G,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,GAAG,IAAA,mBAAQ,GAAE,CAAA;IAC3C,MAAM,OAAO,GAAG,IAAA,wBAAa,EAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAErD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC,CAAA;KAClC;IAED,MAAM,SAAS,GAAG,OAAO,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAA;IAEtE,OAAO,CACL,uBAAC,8BAAa,kBAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,6BAA6B,IAAK,KAAK,cAChG,uBAAC,gBAAK,kBAAC,MAAM,QAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,gBACvF,uBAAC,gBAAQ,kBAAC,QAAQ,EAAE,uBAAC,uBAAW,KAAG,gBACjC,uBAAC,QAAQ,kBACP,sBAAsB,EAAE,CAAC,EACzB,cAAc,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,EAChD,KAAK,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,EACzD,GAAG,EAAE,OAAO,EACZ,eAAe,QACf,KAAK,EAAE,SAAS,EAChB,0BAA0B,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,IACzC,aAAa,EACjB,IACO,IACL,IACM,CACjB,CAAA;AACH,CAAC,CAAA;AA7BY,QAAA,kBAAkB,sBA6B9B"}

package/dist/cjs/components/Details/ValidationDetails/ValidationDetails.js

@@ -21,7 +21,7 @@ const PayloadValidationDetails = (_a) => {
     }
     return ((0, jsx_runtime_1.jsxs)(react_property_1.PropertyGroup, Object.assign({ titleProps: { elevation }, title: "Validation", tip: "The results from validating the payload" }, props, { children: [(0, jsx_runtime_1.jsx)(react_property_1.Property, { titleProps: { elevation }, flexGrow: 1, title: "Valid", value: errors.length === 0 ? 'True' : 'False', tip: errors.length > 0 ? ((0, jsx_runtime_1.jsx)(sdk_react_1.FlexCol, { children: errors.map((error, index) => {
                         return (0, jsx_runtime_1.jsx)(material_1.Typography, { children: error.toString() }, index);
-                    }) })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { children: "No Errors" })) }), (value === null || value === void 0 ? void 0 : value.schema) && (0, jsx_runtime_1.jsx)(react_schema_1.SchemaProperty, { titleProps: { elevation }, value: value.schema, viewSchemaUrl: viewSchemaUrl })] })));
+                    }) })) : ((0, jsx_runtime_1.jsx)(material_1.Typography, { children: "No Errors" })) }), (value === null || value === void 0 ? void 0 : value.schema) && (0, jsx_runtime_1.jsx)(react_schema_1.SchemaProperty, { flexGrow: 1, titleProps: { elevation }, value: value.schema, viewSchemaUrl: viewSchemaUrl })] })));
 };
 exports.PayloadValidationDetails = PayloadValidationDetails;
 //# sourceMappingURL=ValidationDetails.js.map

package/dist/cjs/components/Details/ValidationDetails/ValidationDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"ValidationDetails.js","sourceRoot":"","sources":["../../../../../src/components/Details/ValidationDetails/ValidationDetails.tsx"],"names":[],"mappings":";;;;;AAAA,4CAA0C;AAC1C,iDAA2C;AAC3C,4CAAuD;AACvD,gEAAqE;AACrE,4DAA0D;AAInD,MAAM,wBAAwB,GAA4C,CAAC,EAAsE,EAAE,EAAE;;QAA1E,EAAE,aAAa,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,KAAK,OAAY,EAAP,KAAK,sBAApE,kDAAsE,CAAF;IACpJ,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,0BAAmB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAEpE,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,CAAC,GAAG,EAAE,mCAAI,EAAE,CAAA;IAC9D,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,CAAC,GAAG,EAAE,mCAAI,EAAE,CAAA;IAC9D,MAAM,MAAM,GAAY,CAAC,GAAG,UAAU,EAAE,GAAG,UAAU,CAAC,CAAA;IAEtD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC,CAAA;KAClC;IAED,OAAO,CACL,wBAAC,8BAAa,kBAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,YAAY,EAAC,GAAG,EAAC,yCAAyC,IAAK,KAAK,eAClH,uBAAC,yBAAQ,IACP,UAAU,EAAE,EAAE,SAAS,EAAE,EACzB,QAAQ,EAAE,CAAC,EACX,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC7C,GAAG,EACD,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAClB,uBAAC,mBAAO,cACL,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;wBAC3B,OAAO,uBAAC,qBAAU,cAAc,KAAK,CAAC,QAAQ,EAAE,IAAxB,KAAK,CAAiC,CAAA;oBAChE,CAAC,CAAC,GACM,CACX,CAAC,CAAC,CAAC,CACF,uBAAC,qBAAU,4BAAuB,CACnC,GAEH,EACD,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,KAAI,uBAAC,6BAAc,IAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,aAAa,EAAE,aAAa,GAAI,KACpG,CACjB,CAAA;AACH,CAAC,CAAA;AAlCY,QAAA,wBAAwB,4BAkCpC"}
+{"version":3,"file":"ValidationDetails.js","sourceRoot":"","sources":["../../../../../src/components/Details/ValidationDetails/ValidationDetails.tsx"],"names":[],"mappings":";;;;;AAAA,4CAA0C;AAC1C,iDAA2C;AAC3C,4CAAuD;AACvD,gEAAqE;AACrE,4DAA0D;AAInD,MAAM,wBAAwB,GAA4C,CAAC,EAAsE,EAAE,EAAE;;QAA1E,EAAE,aAAa,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,KAAK,OAAY,EAAP,KAAK,sBAApE,kDAAsE,CAAF;IACpJ,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,0BAAmB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAEpE,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,CAAC,GAAG,EAAE,mCAAI,EAAE,CAAA;IAC9D,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,IAAI,CAAC,GAAG,EAAE,mCAAI,EAAE,CAAA;IAC9D,MAAM,MAAM,GAAY,CAAC,GAAG,UAAU,EAAE,GAAG,UAAU,CAAC,CAAA;IAEtD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC,CAAA;KAClC;IAED,OAAO,CACL,wBAAC,8BAAa,kBAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,YAAY,EAAC,GAAG,EAAC,yCAAyC,IAAK,KAAK,eAClH,uBAAC,yBAAQ,IACP,UAAU,EAAE,EAAE,SAAS,EAAE,EACzB,QAAQ,EAAE,CAAC,EACX,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC7C,GAAG,EACD,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAClB,uBAAC,mBAAO,cACL,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;wBAC3B,OAAO,uBAAC,qBAAU,cAAc,KAAK,CAAC,QAAQ,EAAE,IAAxB,KAAK,CAAiC,CAAA;oBAChE,CAAC,CAAC,GACM,CACX,CAAC,CAAC,CAAC,CACF,uBAAC,qBAAU,4BAAuB,CACnC,GAEH,EACD,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,KAAI,uBAAC,6BAAc,IAAC,QAAQ,EAAE,CAAC,EAAE,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,aAAa,EAAE,aAAa,GAAI,KACjH,CACjB,CAAA;AACH,CAAC,CAAA;AAlCY,QAAA,wBAAwB,4BAkCpC"}

package/dist/esm/components/Details/JsonDetails.js

@@ -1,16 +1,17 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMediaQuery, useTheme } from '@mui/material';
+import { Paper, useMediaQuery, useTheme } from '@mui/material';
 import { FlexGrowRow } from '@xylabs/sdk-react';
 import { PropertyGroup } from '@xyo-network/react-property';
 import { lazy, Suspense } from 'react';
 const JsonView = lazy(() => import(/* webpackChunkName: "jsonView" */ 'react-json-view'));
 export const PayloadJsonDetails = ({ jsonViewProps, payload = {}, ...props }) => {
-    const { breakpoints } = useTheme();
+    const { breakpoints, palette } = useTheme();
     const belowSm = useMediaQuery(breakpoints.down('sm'));
     let elevation = 2;
     if (props.paper) {
         elevation += props.elevation ?? 0;
     }
-    return (_jsx(PropertyGroup, { titleProps: { elevation }, title: "JSON", tip: "The raw JSON of the payload", ...props, children: _jsx(Suspense, { fallback: _jsx(FlexGrowRow, {}), children: _jsx(JsonView, { src: payload, enableClipboard: true, collapseStringsAfterLength: belowSm ? 24 : 32, ...jsonViewProps }) }) }));
+    const jsonTheme = palette.mode === 'dark' ? 'shapeshifter' : undefined;
+    return (_jsx(PropertyGroup, { titleProps: { elevation }, title: "JSON", tip: "The raw JSON of the payload", ...props, children: _jsx(Paper, { square: true, elevation: 2, style: { overflow: 'hidden', padding: '16px', width: '100%' }, children: _jsx(Suspense, { fallback: _jsx(FlexGrowRow, {}), children: _jsx(JsonView, { groupArraysAfterLength: 5, shouldCollapse: (props) => props.name !== 'root', style: { backgroundColor: undefined, overflow: 'hidden' }, src: payload, enableClipboard: true, theme: jsonTheme, collapseStringsAfterLength: belowSm ? 24 : 32, ...jsonViewProps }) }) }) }));
 };
 //# sourceMappingURL=JsonDetails.js.map

package/dist/esm/components/Details/JsonDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"JsonDetails.js","sourceRoot":"","sources":["../../../../src/components/Details/JsonDetails.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,aAAa,EAAsB,MAAM,6BAA6B,CAAA;AAC/E,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAGtC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,kCAAkC,CAAC,iBAAiB,CAAC,CAAC,CAAA;AAOzF,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EAAE,aAAa,EAAE,OAAO,GAAG,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACjH,MAAM,EAAE,WAAW,EAAE,GAAG,QAAQ,EAAE,CAAA;IAClC,MAAM,OAAO,GAAG,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAErD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,KAAK,CAAC,SAAS,IAAI,CAAC,CAAA;KAClC;IAED,OAAO,CACL,KAAC,aAAa,IAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,6BAA6B,KAAK,KAAK,YAChG,KAAC,QAAQ,IAAC,QAAQ,EAAE,KAAC,WAAW,KAAG,YACjC,KAAC,QAAQ,IAAC,GAAG,EAAE,OAAO,EAAE,eAAe,QAAC,0BAA0B,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAM,aAAa,GAAI,GACnG,GACG,CACjB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"JsonDetails.js","sourceRoot":"","sources":["../../../../src/components/Details/JsonDetails.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,aAAa,EAAsB,MAAM,6BAA6B,CAAA;AAC/E,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAGtC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,kCAAkC,CAAC,iBAAiB,CAAC,CAAC,CAAA;AAOzF,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EAAE,aAAa,EAAE,OAAO,GAAG,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACjH,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,GAAG,QAAQ,EAAE,CAAA;IAC3C,MAAM,OAAO,GAAG,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAErD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,KAAK,CAAC,SAAS,IAAI,CAAC,CAAA;KAClC;IAED,MAAM,SAAS,GAAG,OAAO,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,CAAA;IAEtE,OAAO,CACL,KAAC,aAAa,IAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,6BAA6B,KAAK,KAAK,YAChG,KAAC,KAAK,IAAC,MAAM,QAAC,SAAS,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,YACvF,KAAC,QAAQ,IAAC,QAAQ,EAAE,KAAC,WAAW,KAAG,YACjC,KAAC,QAAQ,IACP,sBAAsB,EAAE,CAAC,EACzB,cAAc,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,EAChD,KAAK,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,EACzD,GAAG,EAAE,OAAO,EACZ,eAAe,QACf,KAAK,EAAE,SAAS,EAChB,0BAA0B,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KACzC,aAAa,GACjB,GACO,GACL,GACM,CACjB,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/Details/ValidationDetails/ValidationDetails.js

@@ -15,6 +15,6 @@ export const PayloadValidationDetails = ({ viewSchemaUrl, skipMeta = false, skip
     }
     return (_jsxs(PropertyGroup, { titleProps: { elevation }, title: "Validation", tip: "The results from validating the payload", ...props, children: [_jsx(Property, { titleProps: { elevation }, flexGrow: 1, title: "Valid", value: errors.length === 0 ? 'True' : 'False', tip: errors.length > 0 ? (_jsx(FlexCol, { children: errors.map((error, index) => {
                         return _jsx(Typography, { children: error.toString() }, index);
-                    }) })) : (_jsx(Typography, { children: "No Errors" })) }), value?.schema && _jsx(SchemaProperty, { titleProps: { elevation }, value: value.schema, viewSchemaUrl: viewSchemaUrl })] }));
+                    }) })) : (_jsx(Typography, { children: "No Errors" })) }), value?.schema && _jsx(SchemaProperty, { flexGrow: 1, titleProps: { elevation }, value: value.schema, viewSchemaUrl: viewSchemaUrl })] }));
 };
 //# sourceMappingURL=ValidationDetails.js.map

package/dist/esm/components/Details/ValidationDetails/ValidationDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"ValidationDetails.js","sourceRoot":"","sources":["../../../../../src/components/Details/ValidationDetails/ValidationDetails.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AACrE,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAI1D,MAAM,CAAC,MAAM,wBAAwB,GAA4C,CAAC,EAAE,aAAa,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC1J,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAEpE,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,CAAA;IAC9D,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,CAAA;IAC9D,MAAM,MAAM,GAAY,CAAC,GAAG,UAAU,EAAE,GAAG,UAAU,CAAC,CAAA;IAEtD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,KAAK,CAAC,SAAS,IAAI,CAAC,CAAA;KAClC;IAED,OAAO,CACL,MAAC,aAAa,IAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,YAAY,EAAC,GAAG,EAAC,yCAAyC,KAAK,KAAK,aAClH,KAAC,QAAQ,IACP,UAAU,EAAE,EAAE,SAAS,EAAE,EACzB,QAAQ,EAAE,CAAC,EACX,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC7C,GAAG,EACD,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAClB,KAAC,OAAO,cACL,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;wBAC3B,OAAO,KAAC,UAAU,cAAc,KAAK,CAAC,QAAQ,EAAE,IAAxB,KAAK,CAAiC,CAAA;oBAChE,CAAC,CAAC,GACM,CACX,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,4BAAuB,CACnC,GAEH,EACD,KAAK,EAAE,MAAM,IAAI,KAAC,cAAc,IAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,aAAa,EAAE,aAAa,GAAI,IACpG,CACjB,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"ValidationDetails.js","sourceRoot":"","sources":["../../../../../src/components/Details/ValidationDetails/ValidationDetails.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAA;AACrE,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAI1D,MAAM,CAAC,MAAM,wBAAwB,GAA4C,CAAC,EAAE,aAAa,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,GAAG,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC1J,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAEpE,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,CAAA;IAC9D,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,EAAE,CAAA;IAC9D,MAAM,MAAM,GAAY,CAAC,GAAG,UAAU,EAAE,GAAG,UAAU,CAAC,CAAA;IAEtD,IAAI,SAAS,GAAG,CAAC,CAAA;IACjB,IAAI,KAAK,CAAC,KAAK,EAAE;QACf,SAAS,IAAI,KAAK,CAAC,SAAS,IAAI,CAAC,CAAA;KAClC;IAED,OAAO,CACL,MAAC,aAAa,IAAC,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAC,YAAY,EAAC,GAAG,EAAC,yCAAyC,KAAK,KAAK,aAClH,KAAC,QAAQ,IACP,UAAU,EAAE,EAAE,SAAS,EAAE,EACzB,QAAQ,EAAE,CAAC,EACX,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAC7C,GAAG,EACD,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAClB,KAAC,OAAO,cACL,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;wBAC3B,OAAO,KAAC,UAAU,cAAc,KAAK,CAAC,QAAQ,EAAE,IAAxB,KAAK,CAAiC,CAAA;oBAChE,CAAC,CAAC,GACM,CACX,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,4BAAuB,CACnC,GAEH,EACD,KAAK,EAAE,MAAM,IAAI,KAAC,cAAc,IAAC,QAAQ,EAAE,CAAC,EAAE,UAAU,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,EAAE,aAAa,EAAE,aAAa,GAAI,IACjH,CACjB,CAAA;AACH,CAAC,CAAA"}

package/package.json

@@ -18,14 +18,14 @@
     "@xyo-network/api": "^2.20.33",
     "@xyo-network/core": "^2.20.33",
     "@xyo-network/network": "^2.20.33",
-    "@xyo-network/react-archive": "^2.25.22",
-    "@xyo-network/react-archivist-api": "^2.25.22",
-    "@xyo-network/react-auth-service": "^2.25.22",
-    "@xyo-network/react-network": "^2.25.22",
-    "@xyo-network/react-property": "^2.25.22",
-    "@xyo-network/react-schema": "^2.25.22",
-    "@xyo-network/react-shared": "^2.25.22",
-    "@xyo-network/react-theme": "^2.25.22",
+    "@xyo-network/react-archive": "^2.25.25",
+    "@xyo-network/react-archivist-api": "^2.25.25",
+    "@xyo-network/react-auth-service": "^2.25.25",
+    "@xyo-network/react-network": "^2.25.25",
+    "@xyo-network/react-property": "^2.25.25",
+    "@xyo-network/react-schema": "^2.25.25",
+    "@xyo-network/react-shared": "^2.25.25",
+    "@xyo-network/react-theme": "^2.25.25",
     "@xyo-network/utils": "^2.20.33",
     "lodash": "^4.17.21",
     "luxon": "^2.4.0",
@@ -114,6 +114,6 @@
   },
   "sideEffects": false,
   "types": "dist/esm/index.d.ts",
-  "version": "2.25.22",
+  "version": "2.25.25",
   "packageManager": "yarn@3.1.1"
 }

package/src/components/Details/JsonDetails.tsx

@@ -1,4 +1,4 @@
-import { useMediaQuery, useTheme } from '@mui/material'
+import { Paper, useMediaQuery, useTheme } from '@mui/material'
 import { FlexGrowRow } from '@xylabs/sdk-react'
 import { XyoPayload } from '@xyo-network/core'
 import { PropertyGroup, PropertyGroupProps } from '@xyo-network/react-property'
@@ -13,7 +13,7 @@ export type PayloadJsonDetailsProps = PropertyGroupProps & {
 }
 
 export const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({ jsonViewProps, payload = {}, ...props }) => {
-  const { breakpoints } = useTheme()
+  const { breakpoints, palette } = useTheme()
   const belowSm = useMediaQuery(breakpoints.down('sm'))
 
   let elevation = 2
@@ -21,11 +21,24 @@ export const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({ jsonView
     elevation += props.elevation ?? 0
   }
 
+  const jsonTheme = palette.mode === 'dark' ? 'shapeshifter' : undefined
+
   return (
     <PropertyGroup titleProps={{ elevation }} title="JSON" tip="The raw JSON of the payload" {...props}>
-      <Suspense fallback={<FlexGrowRow />}>
-        <JsonView src={payload} enableClipboard collapseStringsAfterLength={belowSm ? 24 : 32} {...jsonViewProps} />
-      </Suspense>
+      <Paper square elevation={2} style={{ overflow: 'hidden', padding: '16px', width: '100%' }}>
+        <Suspense fallback={<FlexGrowRow />}>
+          <JsonView
+            groupArraysAfterLength={5}
+            shouldCollapse={(props) => props.name !== 'root'}
+            style={{ backgroundColor: undefined, overflow: 'hidden' }}
+            src={payload}
+            enableClipboard
+            theme={jsonTheme}
+            collapseStringsAfterLength={belowSm ? 24 : 32}
+            {...jsonViewProps}
+          />
+        </Suspense>
+      </Paper>
     </PropertyGroup>
   )
 }

package/src/components/Details/ValidationDetails/ValidationDetails.tsx

@@ -37,7 +37,7 @@ export const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> =
           )
         }
       />
-      {value?.schema && <SchemaProperty titleProps={{ elevation }} value={value.schema} viewSchemaUrl={viewSchemaUrl} />}
+      {value?.schema && <SchemaProperty flexGrow={1} titleProps={{ elevation }} value={value.schema} viewSchemaUrl={viewSchemaUrl} />}
     </PropertyGroup>
   )
 }