@xyo-network/react-payload-details 2.77.0 → 2.77.1

package/dist/browser/index.cjs

@@ -1,187 +1,2 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
-  PayloadDataDetails: () => PayloadDataDetails,
-  PayloadDetails: () => PayloadDetails,
-  PayloadJsonDetails: () => PayloadJsonDetails,
-  PayloadValidationDetails: () => PayloadValidationDetails
-});
-module.exports = __toCommonJS(src_exports);
-
-// src/components/Details/DataDetails.tsx
-var import_icons_material2 = require("@mui/icons-material");
-var import_material2 = require("@mui/material");
-var import_forget = require("@xylabs/forget");
-var import_react_button = require("@xylabs/react-button");
-var import_hash2 = require("@xyo-network/hash");
-var import_react_property = require("@xyo-network/react-property");
-var import_react_shared = require("@xyo-network/react-shared");
-var import_react = require("react");
-
-// src/components/Details/HashSourceDetails.tsx
-var import_icons_material = require("@mui/icons-material");
-var import_material = require("@mui/material");
-var import_react_flexbox = require("@xylabs/react-flexbox");
-var import_react_quick_tip_button = require("@xylabs/react-quick-tip-button");
-var import_hash = require("@xyo-network/hash");
-var import_jsx_runtime = require("react/jsx-runtime");
-var PayloadHashSourceDetails = ({ noTitle = false, payload, ...props }) => {
-  const theme = (0, import_material.useTheme)();
-  const payloadString = payload ? JSON.stringify(import_hash.PayloadHasher.hashFields(payload), null, 2) : "";
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_flexbox.FlexCol, { alignItems: "stretch", ...props, children: [
-    noTitle ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_flexbox.FlexRow, { margin: 1, justifyContent: "flex-start", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { children: "Hash Source" }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_quick_tip_button.QuickTipButton, { title: "Hash Source", children: "The actual string used to generate the hash (SHA256)" })
-    ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_flexbox.FlexRow, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_flexbox.FlexGrowRow, { background: true, border: 1, borderColor: theme.palette.divider, justifyContent: "start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { padding: 2, fontFamily: "monospace", variant: "body1", sx: { overflowWrap: "break-word", wordBreak: "break-all" }, children: payloadString }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.IconButton, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ContentCopy, {}) })
-    ] }),
-    noTitle ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_flexbox.FlexRow, { margin: 1, justifyContent: "flex-start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "body2", children: "The actual string used to generate the hash (SHA256). This can be used to validate the hash manually." }) }) : null
-  ] });
-};
-
-// src/components/Details/DataDetails.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var PayloadDataDetails = ({ size, badge, payload, ...props }) => {
-  const payloadString = payload ? JSON.stringify(import_hash2.PayloadHasher.hashFields(payload), null, 2) : "";
-  const [viewSourceOpen, setViewSourceOpen] = (0, import_react.useState)(false);
-  const hash = (0, import_react_shared.usePayloadHash)(payload);
-  let elevation = 2;
-  if (props.paper) {
-    elevation += props.elevation ?? 0;
-  }
-  const actions = [
-    {
-      icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material2.Visibility, {}),
-      name: "View",
-      onClick: () => setViewSourceOpen(true)
-    },
-    {
-      icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material2.ContentCopy, {}),
-      name: "Copy",
-      onClick: () => (0, import_forget.forget)(navigator.clipboard.writeText(hash ?? ""))
-    }
-  ];
-  const onCopy = () => {
-    (0, import_forget.forget)(navigator.clipboard.writeText(payloadString));
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      import_react_property.Property,
-      {
-        titleProps: { elevation },
-        badge,
-        size,
-        actions,
-        title: "Payload Hash",
-        value: hash ?? "<Unknown>",
-        tip: "This is the payload hash",
-        ...props
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material2.Dialog, { open: viewSourceOpen, onClose: () => setViewSourceOpen(false), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.DialogTitle, { children: "Hash Source" }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.DialogContent, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PayloadHashSourceDetails, { noTitle: true, payload }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material2.DialogActions, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_button.ButtonEx, { color: "secondary", onClick: onCopy, children: "Copy" }),
-        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_button.ButtonEx, { color: "secondary", onClick: () => setViewSourceOpen(false), children: "Close" })
-      ] })
-    ] })
-  ] });
-};
-
-// src/components/Details/Details.tsx
-var import_react_flexbox3 = require("@xylabs/react-flexbox");
-var import_react2 = require("react");
-
-// src/components/Details/JsonDetails.tsx
-var import_material3 = require("@mui/material");
-var import_react_payload_raw_info = require("@xyo-network/react-payload-raw-info");
-var import_react_property2 = require("@xyo-network/react-property");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var PayloadJsonDetails = ({ jsonViewProps, payload = {}, ...props }) => {
-  const { breakpoints, palette } = (0, import_material3.useTheme)();
-  const belowSm = (0, import_material3.useMediaQuery)(breakpoints.down("sm"));
-  let elevation = 2;
-  if (props.paper) {
-    elevation += props.elevation ?? 0;
-  }
-  const jsonTheme = palette.mode === "dark" ? "dark" : "light";
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_property2.PropertyGroup, { titleProps: { elevation }, title: "JSON", tip: "The raw JSON of the payload", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Paper, { square: true, variant: "elevation", style: { overflow: "hidden", padding: "16px", width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    import_react_payload_raw_info.JsonViewerEx,
-    {
-      groupArraysAfterLength: 20,
-      style: { backgroundColor: void 0, overflow: "hidden" },
-      value: payload,
-      enableClipboard: true,
-      theme: jsonTheme,
-      collapseStringsAfterLength: belowSm ? 24 : 32,
-      ...jsonViewProps
-    }
-  ) }) });
-};
-
-// src/components/Details/ValidationDetails/ValidationDetails.tsx
-var import_material4 = require("@mui/material");
-var import_react_flexbox2 = require("@xylabs/react-flexbox");
-var import_react_promise = require("@xylabs/react-promise");
-var import_payload_validator = require("@xyo-network/payload-validator");
-var import_react_property3 = require("@xyo-network/react-property");
-var import_react_schema = require("@xyo-network/react-schema");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-var PayloadValidationDetails = ({ skipBody = false, value, ...props }) => {
-  const [validateErrors] = (0, import_react_promise.usePromise)(async () => value ? await new import_payload_validator.PayloadValidator(value).validate() : void 0, [value]);
-  const bodyErrors = skipBody ? [] : validateErrors ?? [];
-  const errors = [...bodyErrors];
-  let elevation = 2;
-  if (props.paper) {
-    elevation += props.elevation ?? 0;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react_property3.PropertyGroup, { titleProps: { elevation }, title: "Validation", tip: "The results from validating the payload", ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
-      import_react_property3.Property,
-      {
-        titleProps: { elevation },
-        flexGrow: 1,
-        title: "Valid",
-        value: errors.length === 0 ? "True" : "False",
-        tip: errors.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_flexbox2.FlexCol, { children: errors.map((error, index) => {
-          return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material4.Typography, { children: error.toString() }, index);
-        }) }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material4.Typography, { children: "No Errors" })
-      }
-    ),
-    value?.schema && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_schema.SchemaProperty, { flexGrow: 1, titleProps: { elevation }, value: value.schema })
-  ] });
-};
-
-// src/components/Details/Details.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var PayloadDetails = (0, import_react2.forwardRef)(({ paper, payload, ...props }, ref) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react_flexbox3.FlexCol, { gap: 1, justifyContent: "flex-start", alignItems: "stretch", marginTop: 2, marginBottom: 8, ref, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PayloadDataDetails, { paper, size: "large", badge: true, payload }),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PayloadValidationDetails, { paper, value: payload }),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PayloadJsonDetails, { paper, payload })
-  ] });
-});
-PayloadDetails.displayName = "PayloadDetails";
+"use strict";var C=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var K=Object.prototype.hasOwnProperty;var X=(t,o)=>{for(var e in o)C(t,e,{get:o[e],enumerable:!0})},Y=(t,o,e,r)=>{if(o&&typeof o=="object"||typeof o=="function")for(let l of U(o))!K.call(t,l)&&l!==e&&C(t,l,{get:()=>o[l],enumerable:!(r=q(o,l))||r.enumerable});return t};var Z=t=>Y(C({},"__esModule",{value:!0}),t);var _={};X(_,{PayloadDataDetails:()=>T,PayloadDetails:()=>W,PayloadJsonDetails:()=>b,PayloadValidationDetails:()=>S});module.exports=Z(_);var u=require("@mui/icons-material"),y=require("@mui/material"),D=require("@xylabs/forget"),w=require("@xylabs/react-button"),B=require("@xyo-network/hash"),E=require("@xyo-network/react-property"),J=require("@xyo-network/react-shared"),R=require("react");var v=require("@mui/icons-material"),p=require("@mui/material"),n=require("@xylabs/react-flexbox"),k=require("@xylabs/react-quick-tip-button"),V=require("@xyo-network/hash"),i=require("react/jsx-runtime"),H=({noTitle:t=!1,payload:o,...e})=>{let r=(0,p.useTheme)(),l=o?JSON.stringify(V.PayloadHasher.hashFields(o),null,2):"";return(0,i.jsxs)(n.FlexCol,{alignItems:"stretch",...e,children:[t?null:(0,i.jsxs)(n.FlexRow,{margin:1,justifyContent:"flex-start",children:[(0,i.jsx)(p.Typography,{children:"Hash Source"}),(0,i.jsx)(k.QuickTipButton,{title:"Hash Source",children:"The actual string used to generate the hash (SHA256)"})]}),(0,i.jsxs)(n.FlexRow,{children:[(0,i.jsx)(n.FlexGrowRow,{background:!0,border:1,borderColor:r.palette.divider,justifyContent:"start",children:(0,i.jsx)(p.Typography,{padding:2,fontFamily:"monospace",variant:"body1",sx:{overflowWrap:"break-word",wordBreak:"break-all"},children:l})}),(0,i.jsx)(p.IconButton,{children:(0,i.jsx)(v.ContentCopy,{})})]}),t?(0,i.jsx)(n.FlexRow,{margin:1,justifyContent:"flex-start",children:(0,i.jsx)(p.Typography,{variant:"body2",children:"The actual string used to generate the hash (SHA256). This can be used to validate the hash manually."})}):null]})};var a=require("react/jsx-runtime"),T=({size:t,badge:o,payload:e,...r})=>{let l=e?JSON.stringify(B.PayloadHasher.hashFields(e),null,2):"",[m,s]=(0,R.useState)(!1),P=(0,J.usePayloadHash)(e),h=2;r.paper&&(h+=r.elevation??0);let M=[{icon:(0,a.jsx)(u.Visibility,{}),name:"View",onClick:()=>s(!0)},{icon:(0,a.jsx)(u.ContentCopy,{}),name:"Copy",onClick:()=>(0,D.forget)(navigator.clipboard.writeText(P??""))}],j=()=>{(0,D.forget)(navigator.clipboard.writeText(l))};return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(E.Property,{titleProps:{elevation:h},badge:o,size:t,actions:M,title:"Payload Hash",value:P??"<Unknown>",tip:"This is the payload hash",...r}),(0,a.jsxs)(y.Dialog,{open:m,onClose:()=>s(!1),children:[(0,a.jsx)(y.DialogTitle,{children:"Hash Source"}),(0,a.jsx)(y.DialogContent,{children:(0,a.jsx)(H,{noTitle:!0,payload:e})}),(0,a.jsxs)(y.DialogActions,{children:[(0,a.jsx)(w.ButtonEx,{color:"secondary",onClick:j,children:"Copy"}),(0,a.jsx)(w.ButtonEx,{color:"secondary",onClick:()=>s(!1),children:"Close"})]})]})]})};var L=require("@xylabs/react-flexbox"),Q=require("react");var f=require("@mui/material"),G=require("@xyo-network/react-payload-raw-info"),A=require("@xyo-network/react-property"),g=require("react/jsx-runtime"),b=({jsonViewProps:t,payload:o={},...e})=>{let{breakpoints:r,palette:l}=(0,f.useTheme)(),m=(0,f.useMediaQuery)(r.down("sm")),s=2;e.paper&&(s+=e.elevation??0);let P=l.mode==="dark"?"dark":"light";return(0,g.jsx)(A.PropertyGroup,{titleProps:{elevation:s},title:"JSON",tip:"The raw JSON of the payload",...e,children:(0,g.jsx)(f.Paper,{square:!0,variant:"elevation",style:{overflow:"hidden",padding:"16px",width:"100%"},children:(0,g.jsx)(G.JsonViewerEx,{groupArraysAfterLength:20,style:{backgroundColor:void 0,overflow:"hidden"},value:o,enableClipboard:!0,theme:P,collapseStringsAfterLength:m?24:32,...t})})})};var F=require("@mui/material"),I=require("@xylabs/react-flexbox"),N=require("@xylabs/react-promise"),O=require("@xyo-network/payload-validator"),x=require("@xyo-network/react-property"),z=require("@xyo-network/react-schema"),d=require("react/jsx-runtime"),S=({skipBody:t=!1,value:o,...e})=>{let[r]=(0,N.usePromise)(async()=>o?await new O.PayloadValidator(o).validate():void 0,[o]),m=[...t?[]:r??[]],s=2;return e.paper&&(s+=e.elevation??0),(0,d.jsxs)(x.PropertyGroup,{titleProps:{elevation:s},title:"Validation",tip:"The results from validating the payload",...e,children:[(0,d.jsx)(x.Property,{titleProps:{elevation:s},flexGrow:1,title:"Valid",value:m.length===0?"True":"False",tip:m.length>0?(0,d.jsx)(I.FlexCol,{children:m.map((P,h)=>(0,d.jsx)(F.Typography,{children:P.toString()},h))}):(0,d.jsx)(F.Typography,{children:"No Errors"})}),o?.schema&&(0,d.jsx)(z.SchemaProperty,{flexGrow:1,titleProps:{elevation:s},value:o.schema})]})};var c=require("react/jsx-runtime"),W=(0,Q.forwardRef)(({paper:t,payload:o,...e},r)=>(0,c.jsxs)(L.FlexCol,{gap:1,justifyContent:"flex-start",alignItems:"stretch",marginTop:2,marginBottom:8,ref:r,...e,children:[(0,c.jsx)(T,{paper:t,size:"large",badge:!0,payload:o}),(0,c.jsx)(S,{paper:t,value:o}),(0,c.jsx)(b,{paper:t,payload:o})]}));W.displayName="PayloadDetails";
 //# sourceMappingURL=index.cjs.map

package/dist/browser/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts","../../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":["export * from './components'\n","import { ContentCopy as ContentCopyIcon, Visibility as VisibilityIcon } from '@mui/icons-material'\nimport { Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'\nimport { forget } from '@xylabs/forget'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\nimport { Property, PropertyAction, PropertyProps } from '@xyo-network/react-property'\nimport { SizeProp, usePayloadHash } from '@xyo-network/react-shared'\nimport { useState } from 'react'\n\nimport { PayloadHashSourceDetails } from './HashSourceDetails'\n\nexport type PayloadDataDetailsProps = PropertyProps & {\n  badge?: boolean\n  payload?: Payload\n  size?: SizeProp\n}\n\nexport const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({ size, badge, payload, ...props }) => {\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 { IconButton, Typography, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\n\nexport interface PayloadHashSourceDetailsProps extends FlexBoxProps {\n  noTitle?: boolean\n  payload?: Payload\n}\n\nexport const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> = ({ noTitle = false, payload, ...props }) => {\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 ? null : (\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 padding={2} fontFamily=\"monospace\" variant=\"body1\" sx={{ overflowWrap: 'break-word', wordBreak: 'break-all' }}>\n            {payloadString}\n          </Typography>\n        </FlexGrowRow>\n        <IconButton>\n          <ContentCopyIcon />\n        </IconButton>\n      </FlexRow>\n      {noTitle ?\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      : null}\n    </FlexCol>\n  )\n}\n","import { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { Payload } from '@xyo-network/payload-model'\nimport { forwardRef } from 'react'\n\nimport { PayloadDataDetails } from './DataDetails'\nimport { PayloadJsonDetails } from './JsonDetails'\nimport { PayloadValidationDetails } from './ValidationDetails'\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 = forwardRef<HTMLDivElement, PayloadDetailsProps>(({ paper, payload, ...props }, ref) => {\n  return (\n    <FlexCol gap={1} justifyContent=\"flex-start\" alignItems=\"stretch\" marginTop={2} marginBottom={8} ref={ref} {...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 { Paper, useMediaQuery, useTheme } from '@mui/material'\nimport { Payload } from '@xyo-network/payload-model'\nimport { JsonViewerEx, JsonViewerExProps } from '@xyo-network/react-payload-raw-info'\nimport { PropertyGroup, PropertyGroupProps } from '@xyo-network/react-property'\n\nexport type PayloadJsonDetailsProps = PropertyGroupProps & {\n  jsonViewProps?: JsonViewerExProps\n  payload?: Payload\n}\n\nexport const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({ jsonViewProps, payload = {}, ...props }) => {\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 square variant=\"elevation\" style={{ overflow: 'hidden', padding: '16px', width: '100%' }}>\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'\n\nimport { PayloadValidationDetailsProps } from './ValidationDetailsProps'\n\nexport const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> = ({ skipBody = false, value, ...props }) => {\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            <FlexCol>\n              {errors.map((error, index) => {\n                return <Typography key={index}>{error.toString()}</Typography>\n              })}\n            </FlexCol>\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":["import_icons_material","import_material","import_hash","ContentCopyIcon","import_jsx_runtime","VisibilityIcon","ContentCopyIcon","import_react_flexbox","import_react","import_material","import_react_property","import_jsx_runtime","import_material","import_react_flexbox","import_react_property","import_jsx_runtime","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/index.ts","../../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":["export * from './components'\n","import { ContentCopy as ContentCopyIcon, Visibility as VisibilityIcon } from '@mui/icons-material'\nimport { Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'\nimport { forget } from '@xylabs/forget'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\nimport { Property, PropertyAction, PropertyProps } from '@xyo-network/react-property'\nimport { SizeProp, usePayloadHash } from '@xyo-network/react-shared'\nimport { useState } from 'react'\n\nimport { PayloadHashSourceDetails } from './HashSourceDetails'\n\nexport type PayloadDataDetailsProps = PropertyProps & {\n  badge?: boolean\n  payload?: Payload\n  size?: SizeProp\n}\n\nexport const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({ size, badge, payload, ...props }) => {\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 { IconButton, Typography, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\n\nexport interface PayloadHashSourceDetailsProps extends FlexBoxProps {\n  noTitle?: boolean\n  payload?: Payload\n}\n\nexport const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> = ({ noTitle = false, payload, ...props }) => {\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 ? null : (\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 padding={2} fontFamily=\"monospace\" variant=\"body1\" sx={{ overflowWrap: 'break-word', wordBreak: 'break-all' }}>\n            {payloadString}\n          </Typography>\n        </FlexGrowRow>\n        <IconButton>\n          <ContentCopyIcon />\n        </IconButton>\n      </FlexRow>\n      {noTitle ?\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      : null}\n    </FlexCol>\n  )\n}\n","import { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { Payload } from '@xyo-network/payload-model'\nimport { forwardRef } from 'react'\n\nimport { PayloadDataDetails } from './DataDetails'\nimport { PayloadJsonDetails } from './JsonDetails'\nimport { PayloadValidationDetails } from './ValidationDetails'\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 = forwardRef<HTMLDivElement, PayloadDetailsProps>(({ paper, payload, ...props }, ref) => {\n  return (\n    <FlexCol gap={1} justifyContent=\"flex-start\" alignItems=\"stretch\" marginTop={2} marginBottom={8} ref={ref} {...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 { Paper, useMediaQuery, useTheme } from '@mui/material'\nimport { Payload } from '@xyo-network/payload-model'\nimport { JsonViewerEx, JsonViewerExProps } from '@xyo-network/react-payload-raw-info'\nimport { PropertyGroup, PropertyGroupProps } from '@xyo-network/react-property'\n\nexport type PayloadJsonDetailsProps = PropertyGroupProps & {\n  jsonViewProps?: JsonViewerExProps\n  payload?: Payload\n}\n\nexport const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({ jsonViewProps, payload = {}, ...props }) => {\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 square variant=\"elevation\" style={{ overflow: 'hidden', padding: '16px', width: '100%' }}>\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'\n\nimport { PayloadValidationDetailsProps } from './ValidationDetailsProps'\n\nexport const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> = ({ skipBody = false, value, ...props }) => {\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            <FlexCol>\n              {errors.map((error, index) => {\n                return <Typography key={index}>{error.toString()}</Typography>\n              })}\n            </FlexCol>\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":["src_exports","__export","PayloadDataDetails","PayloadDetails","PayloadJsonDetails","PayloadValidationDetails","__toCommonJS","import_icons_material","import_material","import_forget","import_react_button","import_hash","import_react_property","import_react_shared","import_react","import_icons_material","import_material","import_react_flexbox","import_react_quick_tip_button","import_hash","import_jsx_runtime","PayloadHashSourceDetails","noTitle","payload","props","theme","payloadString","ContentCopyIcon","import_jsx_runtime","PayloadDataDetails","size","badge","payload","props","payloadString","viewSourceOpen","setViewSourceOpen","hash","elevation","actions","VisibilityIcon","ContentCopyIcon","onCopy","PayloadHashSourceDetails","import_react_flexbox","import_react","import_material","import_react_payload_raw_info","import_react_property","import_jsx_runtime","PayloadJsonDetails","jsonViewProps","payload","props","breakpoints","palette","belowSm","elevation","jsonTheme","import_material","import_react_flexbox","import_react_promise","import_payload_validator","import_react_property","import_react_schema","import_jsx_runtime","PayloadValidationDetails","skipBody","value","props","validateErrors","errors","elevation","error","index","import_jsx_runtime","PayloadDetails","paper","payload","props","ref","PayloadDataDetails","PayloadValidationDetails","PayloadJsonDetails"]}

package/dist/browser/index.js

@@ -1,164 +1,2 @@
-// src/components/Details/DataDetails.tsx
-import { ContentCopy as ContentCopyIcon2, Visibility as VisibilityIcon } from "@mui/icons-material";
-import { Dialog, DialogActions, DialogContent, DialogTitle } from "@mui/material";
-import { forget } from "@xylabs/forget";
-import { ButtonEx } from "@xylabs/react-button";
-import { PayloadHasher as PayloadHasher2 } from "@xyo-network/hash";
-import { Property } from "@xyo-network/react-property";
-import { usePayloadHash } from "@xyo-network/react-shared";
-import { useState } from "react";
-
-// src/components/Details/HashSourceDetails.tsx
-import { ContentCopy as ContentCopyIcon } from "@mui/icons-material";
-import { IconButton, Typography, useTheme } from "@mui/material";
-import { FlexCol, FlexGrowRow, FlexRow } from "@xylabs/react-flexbox";
-import { QuickTipButton } from "@xylabs/react-quick-tip-button";
-import { PayloadHasher } from "@xyo-network/hash";
-import { jsx, jsxs } from "react/jsx-runtime";
-var PayloadHashSourceDetails = ({ noTitle = false, payload, ...props }) => {
-  const theme = useTheme();
-  const payloadString = payload ? JSON.stringify(PayloadHasher.hashFields(payload), null, 2) : "";
-  return /* @__PURE__ */ jsxs(FlexCol, { alignItems: "stretch", ...props, children: [
-    noTitle ? null : /* @__PURE__ */ jsxs(FlexRow, { margin: 1, justifyContent: "flex-start", children: [
-      /* @__PURE__ */ jsx(Typography, { children: "Hash Source" }),
-      /* @__PURE__ */ jsx(QuickTipButton, { title: "Hash Source", children: "The actual string used to generate the hash (SHA256)" })
-    ] }),
-    /* @__PURE__ */ jsxs(FlexRow, { children: [
-      /* @__PURE__ */ jsx(FlexGrowRow, { background: true, border: 1, borderColor: theme.palette.divider, justifyContent: "start", children: /* @__PURE__ */ jsx(Typography, { padding: 2, fontFamily: "monospace", variant: "body1", sx: { overflowWrap: "break-word", wordBreak: "break-all" }, children: payloadString }) }),
-      /* @__PURE__ */ jsx(IconButton, { children: /* @__PURE__ */ jsx(ContentCopyIcon, {}) })
-    ] }),
-    noTitle ? /* @__PURE__ */ jsx(FlexRow, { margin: 1, justifyContent: "flex-start", children: /* @__PURE__ */ jsx(Typography, { variant: "body2", children: "The actual string used to generate the hash (SHA256). This can be used to validate the hash manually." }) }) : null
-  ] });
-};
-
-// src/components/Details/DataDetails.tsx
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var PayloadDataDetails = ({ size, badge, payload, ...props }) => {
-  const payloadString = payload ? JSON.stringify(PayloadHasher2.hashFields(payload), null, 2) : "";
-  const [viewSourceOpen, setViewSourceOpen] = useState(false);
-  const hash = usePayloadHash(payload);
-  let elevation = 2;
-  if (props.paper) {
-    elevation += props.elevation ?? 0;
-  }
-  const actions = [
-    {
-      icon: /* @__PURE__ */ jsx2(VisibilityIcon, {}),
-      name: "View",
-      onClick: () => setViewSourceOpen(true)
-    },
-    {
-      icon: /* @__PURE__ */ jsx2(ContentCopyIcon2, {}),
-      name: "Copy",
-      onClick: () => forget(navigator.clipboard.writeText(hash ?? ""))
-    }
-  ];
-  const onCopy = () => {
-    forget(navigator.clipboard.writeText(payloadString));
-  };
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx2(
-      Property,
-      {
-        titleProps: { elevation },
-        badge,
-        size,
-        actions,
-        title: "Payload Hash",
-        value: hash ?? "<Unknown>",
-        tip: "This is the payload hash",
-        ...props
-      }
-    ),
-    /* @__PURE__ */ jsxs2(Dialog, { open: viewSourceOpen, onClose: () => setViewSourceOpen(false), children: [
-      /* @__PURE__ */ jsx2(DialogTitle, { children: "Hash Source" }),
-      /* @__PURE__ */ jsx2(DialogContent, { children: /* @__PURE__ */ jsx2(PayloadHashSourceDetails, { noTitle: true, payload }) }),
-      /* @__PURE__ */ jsxs2(DialogActions, { children: [
-        /* @__PURE__ */ jsx2(ButtonEx, { color: "secondary", onClick: onCopy, children: "Copy" }),
-        /* @__PURE__ */ jsx2(ButtonEx, { color: "secondary", onClick: () => setViewSourceOpen(false), children: "Close" })
-      ] })
-    ] })
-  ] });
-};
-
-// src/components/Details/Details.tsx
-import { FlexCol as FlexCol3 } from "@xylabs/react-flexbox";
-import { forwardRef } from "react";
-
-// src/components/Details/JsonDetails.tsx
-import { Paper, useMediaQuery, useTheme as useTheme2 } from "@mui/material";
-import { JsonViewerEx } from "@xyo-network/react-payload-raw-info";
-import { PropertyGroup } from "@xyo-network/react-property";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var PayloadJsonDetails = ({ jsonViewProps, payload = {}, ...props }) => {
-  const { breakpoints, palette } = useTheme2();
-  const belowSm = useMediaQuery(breakpoints.down("sm"));
-  let elevation = 2;
-  if (props.paper) {
-    elevation += props.elevation ?? 0;
-  }
-  const jsonTheme = palette.mode === "dark" ? "dark" : "light";
-  return /* @__PURE__ */ jsx3(PropertyGroup, { titleProps: { elevation }, title: "JSON", tip: "The raw JSON of the payload", ...props, children: /* @__PURE__ */ jsx3(Paper, { square: true, variant: "elevation", style: { overflow: "hidden", padding: "16px", width: "100%" }, children: /* @__PURE__ */ jsx3(
-    JsonViewerEx,
-    {
-      groupArraysAfterLength: 20,
-      style: { backgroundColor: void 0, overflow: "hidden" },
-      value: payload,
-      enableClipboard: true,
-      theme: jsonTheme,
-      collapseStringsAfterLength: belowSm ? 24 : 32,
-      ...jsonViewProps
-    }
-  ) }) });
-};
-
-// src/components/Details/ValidationDetails/ValidationDetails.tsx
-import { Typography as Typography2 } from "@mui/material";
-import { FlexCol as FlexCol2 } from "@xylabs/react-flexbox";
-import { usePromise } from "@xylabs/react-promise";
-import { PayloadValidator } from "@xyo-network/payload-validator";
-import { Property as Property2, PropertyGroup as PropertyGroup2 } from "@xyo-network/react-property";
-import { SchemaProperty } from "@xyo-network/react-schema";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var PayloadValidationDetails = ({ skipBody = false, value, ...props }) => {
-  const [validateErrors] = usePromise(async () => value ? await new PayloadValidator(value).validate() : void 0, [value]);
-  const bodyErrors = skipBody ? [] : validateErrors ?? [];
-  const errors = [...bodyErrors];
-  let elevation = 2;
-  if (props.paper) {
-    elevation += props.elevation ?? 0;
-  }
-  return /* @__PURE__ */ jsxs3(PropertyGroup2, { titleProps: { elevation }, title: "Validation", tip: "The results from validating the payload", ...props, children: [
-    /* @__PURE__ */ jsx4(
-      Property2,
-      {
-        titleProps: { elevation },
-        flexGrow: 1,
-        title: "Valid",
-        value: errors.length === 0 ? "True" : "False",
-        tip: errors.length > 0 ? /* @__PURE__ */ jsx4(FlexCol2, { children: errors.map((error, index) => {
-          return /* @__PURE__ */ jsx4(Typography2, { children: error.toString() }, index);
-        }) }) : /* @__PURE__ */ jsx4(Typography2, { children: "No Errors" })
-      }
-    ),
-    value?.schema && /* @__PURE__ */ jsx4(SchemaProperty, { flexGrow: 1, titleProps: { elevation }, value: value.schema })
-  ] });
-};
-
-// src/components/Details/Details.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var PayloadDetails = forwardRef(({ paper, payload, ...props }, ref) => {
-  return /* @__PURE__ */ jsxs4(FlexCol3, { gap: 1, justifyContent: "flex-start", alignItems: "stretch", marginTop: 2, marginBottom: 8, ref, ...props, children: [
-    /* @__PURE__ */ jsx5(PayloadDataDetails, { paper, size: "large", badge: true, payload }),
-    /* @__PURE__ */ jsx5(PayloadValidationDetails, { paper, value: payload }),
-    /* @__PURE__ */ jsx5(PayloadJsonDetails, { paper, payload })
-  ] });
-});
-PayloadDetails.displayName = "PayloadDetails";
-export {
-  PayloadDataDetails,
-  PayloadDetails,
-  PayloadJsonDetails,
-  PayloadValidationDetails
-};
+import{ContentCopy as R,Visibility as G}from"@mui/icons-material";import{Dialog as A,DialogActions as I,DialogContent as N,DialogTitle as O}from"@mui/material";import{forget as x}from"@xylabs/forget";import{ButtonEx as C}from"@xylabs/react-button";import{PayloadHasher as z}from"@xyo-network/hash";import{Property as L}from"@xyo-network/react-property";import{usePayloadHash as Q}from"@xyo-network/react-shared";import{useState as W}from"react";import{ContentCopy as v}from"@mui/icons-material";import{IconButton as k,Typography as m,useTheme as V}from"@mui/material";import{FlexCol as H,FlexGrowRow as B,FlexRow as P}from"@xylabs/react-flexbox";import{QuickTipButton as E}from"@xylabs/react-quick-tip-button";import{PayloadHasher as J}from"@xyo-network/hash";import{jsx as i,jsxs as f}from"react/jsx-runtime";var g=({noTitle:t=!1,payload:o,...e})=>{let a=V(),p=o?JSON.stringify(J.hashFields(o),null,2):"";return f(H,{alignItems:"stretch",...e,children:[t?null:f(P,{margin:1,justifyContent:"flex-start",children:[i(m,{children:"Hash Source"}),i(E,{title:"Hash Source",children:"The actual string used to generate the hash (SHA256)"})]}),f(P,{children:[i(B,{background:!0,border:1,borderColor:a.palette.divider,justifyContent:"start",children:i(m,{padding:2,fontFamily:"monospace",variant:"body1",sx:{overflowWrap:"break-word",wordBreak:"break-all"},children:p})}),i(k,{children:i(v,{})})]}),t?i(P,{margin:1,justifyContent:"flex-start",children:i(m,{variant:"body2",children:"The actual string used to generate the hash (SHA256). This can be used to validate the hash manually."})}):null]})};import{Fragment as M,jsx as l,jsxs as c}from"react/jsx-runtime";var D=({size:t,badge:o,payload:e,...a})=>{let p=e?JSON.stringify(z.hashFields(e),null,2):"",[s,r]=W(!1),n=Q(e),d=2;a.paper&&(d+=a.elevation??0);let F=[{icon:l(G,{}),name:"View",onClick:()=>r(!0)},{icon:l(R,{}),name:"Copy",onClick:()=>x(navigator.clipboard.writeText(n??""))}],S=()=>{x(navigator.clipboard.writeText(p))};return c(M,{children:[l(L,{titleProps:{elevation:d},badge:o,size:t,actions:F,title:"Payload Hash",value:n??"<Unknown>",tip:"This is the payload hash",...a}),c(A,{open:s,onClose:()=>r(!1),children:[l(O,{children:"Hash Source"}),l(N,{children:l(g,{noTitle:!0,payload:e})}),c(I,{children:[l(C,{color:"secondary",onClick:S,children:"Copy"}),l(C,{color:"secondary",onClick:()=>r(!1),children:"Close"})]})]})]})};import{FlexCol as ao}from"@xylabs/react-flexbox";import{forwardRef as ro}from"react";import{Paper as j,useMediaQuery as q,useTheme as U}from"@mui/material";import{JsonViewerEx as K}from"@xyo-network/react-payload-raw-info";import{PropertyGroup as X}from"@xyo-network/react-property";import{jsx as h}from"react/jsx-runtime";var w=({jsonViewProps:t,payload:o={},...e})=>{let{breakpoints:a,palette:p}=U(),s=q(a.down("sm")),r=2;e.paper&&(r+=e.elevation??0);let n=p.mode==="dark"?"dark":"light";return h(X,{titleProps:{elevation:r},title:"JSON",tip:"The raw JSON of the payload",...e,children:h(j,{square:!0,variant:"elevation",style:{overflow:"hidden",padding:"16px",width:"100%"},children:h(K,{groupArraysAfterLength:20,style:{backgroundColor:void 0,overflow:"hidden"},value:o,enableClipboard:!0,theme:n,collapseStringsAfterLength:s?24:32,...t})})})};import{Typography as T}from"@mui/material";import{FlexCol as Y}from"@xylabs/react-flexbox";import{usePromise as Z}from"@xylabs/react-promise";import{PayloadValidator as _}from"@xyo-network/payload-validator";import{Property as $,PropertyGroup as oo}from"@xyo-network/react-property";import{SchemaProperty as eo}from"@xyo-network/react-schema";import{jsx as y,jsxs as to}from"react/jsx-runtime";var b=({skipBody:t=!1,value:o,...e})=>{let[a]=Z(async()=>o?await new _(o).validate():void 0,[o]),s=[...t?[]:a??[]],r=2;return e.paper&&(r+=e.elevation??0),to(oo,{titleProps:{elevation:r},title:"Validation",tip:"The results from validating the payload",...e,children:[y($,{titleProps:{elevation:r},flexGrow:1,title:"Valid",value:s.length===0?"True":"False",tip:s.length>0?y(Y,{children:s.map((n,d)=>y(T,{children:n.toString()},d))}):y(T,{children:"No Errors"})}),o?.schema&&y(eo,{flexGrow:1,titleProps:{elevation:r},value:o.schema})]})};import{jsx as u,jsxs as lo}from"react/jsx-runtime";var io=ro(({paper:t,payload:o,...e},a)=>lo(ao,{gap:1,justifyContent:"flex-start",alignItems:"stretch",marginTop:2,marginBottom:8,ref:a,...e,children:[u(D,{paper:t,size:"large",badge:!0,payload:o}),u(b,{paper:t,value:o}),u(w,{paper:t,payload:o})]}));io.displayName="PayloadDetails";export{D as PayloadDataDetails,io as PayloadDetails,w as PayloadJsonDetails,b as PayloadValidationDetails};
 //# sourceMappingURL=index.js.map

package/dist/browser/index.js.map

@@ -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 { Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'\nimport { forget } from '@xylabs/forget'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\nimport { Property, PropertyAction, PropertyProps } from '@xyo-network/react-property'\nimport { SizeProp, usePayloadHash } from '@xyo-network/react-shared'\nimport { useState } from 'react'\n\nimport { PayloadHashSourceDetails } from './HashSourceDetails'\n\nexport type PayloadDataDetailsProps = PropertyProps & {\n  badge?: boolean\n  payload?: Payload\n  size?: SizeProp\n}\n\nexport const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({ size, badge, payload, ...props }) => {\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 { IconButton, Typography, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\n\nexport interface PayloadHashSourceDetailsProps extends FlexBoxProps {\n  noTitle?: boolean\n  payload?: Payload\n}\n\nexport const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> = ({ noTitle = false, payload, ...props }) => {\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 ? null : (\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 padding={2} fontFamily=\"monospace\" variant=\"body1\" sx={{ overflowWrap: 'break-word', wordBreak: 'break-all' }}>\n            {payloadString}\n          </Typography>\n        </FlexGrowRow>\n        <IconButton>\n          <ContentCopyIcon />\n        </IconButton>\n      </FlexRow>\n      {noTitle ?\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      : null}\n    </FlexCol>\n  )\n}\n","import { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { Payload } from '@xyo-network/payload-model'\nimport { forwardRef } from 'react'\n\nimport { PayloadDataDetails } from './DataDetails'\nimport { PayloadJsonDetails } from './JsonDetails'\nimport { PayloadValidationDetails } from './ValidationDetails'\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 = forwardRef<HTMLDivElement, PayloadDetailsProps>(({ paper, payload, ...props }, ref) => {\n  return (\n    <FlexCol gap={1} justifyContent=\"flex-start\" alignItems=\"stretch\" marginTop={2} marginBottom={8} ref={ref} {...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 { Paper, useMediaQuery, useTheme } from '@mui/material'\nimport { Payload } from '@xyo-network/payload-model'\nimport { JsonViewerEx, JsonViewerExProps } from '@xyo-network/react-payload-raw-info'\nimport { PropertyGroup, PropertyGroupProps } from '@xyo-network/react-property'\n\nexport type PayloadJsonDetailsProps = PropertyGroupProps & {\n  jsonViewProps?: JsonViewerExProps\n  payload?: Payload\n}\n\nexport const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({ jsonViewProps, payload = {}, ...props }) => {\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 square variant=\"elevation\" style={{ overflow: 'hidden', padding: '16px', width: '100%' }}>\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'\n\nimport { PayloadValidationDetailsProps } from './ValidationDetailsProps'\n\nexport const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> = ({ skipBody = false, value, ...props }) => {\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            <FlexCol>\n              {errors.map((error, index) => {\n                return <Typography key={index}>{error.toString()}</Typography>\n              })}\n            </FlexCol>\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":["ContentCopyIcon","PayloadHasher","jsx","jsxs","PayloadHasher","ContentCopyIcon","FlexCol","useTheme","jsx","Typography","FlexCol","Property","PropertyGroup","jsx","jsxs","jsx","jsxs","FlexCol"]}
+{"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 { Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material'\nimport { forget } from '@xylabs/forget'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\nimport { Property, PropertyAction, PropertyProps } from '@xyo-network/react-property'\nimport { SizeProp, usePayloadHash } from '@xyo-network/react-shared'\nimport { useState } from 'react'\n\nimport { PayloadHashSourceDetails } from './HashSourceDetails'\n\nexport type PayloadDataDetailsProps = PropertyProps & {\n  badge?: boolean\n  payload?: Payload\n  size?: SizeProp\n}\n\nexport const PayloadDataDetails: React.FC<PayloadDataDetailsProps> = ({ size, badge, payload, ...props }) => {\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 { IconButton, Typography, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { PayloadHasher } from '@xyo-network/hash'\nimport { Payload } from '@xyo-network/payload-model'\n\nexport interface PayloadHashSourceDetailsProps extends FlexBoxProps {\n  noTitle?: boolean\n  payload?: Payload\n}\n\nexport const PayloadHashSourceDetails: React.FC<PayloadHashSourceDetailsProps> = ({ noTitle = false, payload, ...props }) => {\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 ? null : (\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 padding={2} fontFamily=\"monospace\" variant=\"body1\" sx={{ overflowWrap: 'break-word', wordBreak: 'break-all' }}>\n            {payloadString}\n          </Typography>\n        </FlexGrowRow>\n        <IconButton>\n          <ContentCopyIcon />\n        </IconButton>\n      </FlexRow>\n      {noTitle ?\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      : null}\n    </FlexCol>\n  )\n}\n","import { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'\nimport { Payload } from '@xyo-network/payload-model'\nimport { forwardRef } from 'react'\n\nimport { PayloadDataDetails } from './DataDetails'\nimport { PayloadJsonDetails } from './JsonDetails'\nimport { PayloadValidationDetails } from './ValidationDetails'\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 = forwardRef<HTMLDivElement, PayloadDetailsProps>(({ paper, payload, ...props }, ref) => {\n  return (\n    <FlexCol gap={1} justifyContent=\"flex-start\" alignItems=\"stretch\" marginTop={2} marginBottom={8} ref={ref} {...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 { Paper, useMediaQuery, useTheme } from '@mui/material'\nimport { Payload } from '@xyo-network/payload-model'\nimport { JsonViewerEx, JsonViewerExProps } from '@xyo-network/react-payload-raw-info'\nimport { PropertyGroup, PropertyGroupProps } from '@xyo-network/react-property'\n\nexport type PayloadJsonDetailsProps = PropertyGroupProps & {\n  jsonViewProps?: JsonViewerExProps\n  payload?: Payload\n}\n\nexport const PayloadJsonDetails: React.FC<PayloadJsonDetailsProps> = ({ jsonViewProps, payload = {}, ...props }) => {\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 square variant=\"elevation\" style={{ overflow: 'hidden', padding: '16px', width: '100%' }}>\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'\n\nimport { PayloadValidationDetailsProps } from './ValidationDetailsProps'\n\nexport const PayloadValidationDetails: React.FC<PayloadValidationDetailsProps> = ({ skipBody = false, value, ...props }) => {\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            <FlexCol>\n              {errors.map((error, index) => {\n                return <Typography key={index}>{error.toString()}</Typography>\n              })}\n            </FlexCol>\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":["ContentCopyIcon","VisibilityIcon","Dialog","DialogActions","DialogContent","DialogTitle","forget","ButtonEx","PayloadHasher","Property","usePayloadHash","useState","ContentCopyIcon","IconButton","Typography","useTheme","FlexCol","FlexGrowRow","FlexRow","QuickTipButton","PayloadHasher","jsx","jsxs","PayloadHashSourceDetails","noTitle","payload","props","theme","payloadString","Fragment","jsx","jsxs","PayloadDataDetails","size","badge","payload","props","payloadString","PayloadHasher","viewSourceOpen","setViewSourceOpen","useState","hash","usePayloadHash","elevation","actions","VisibilityIcon","ContentCopyIcon","forget","onCopy","Property","Dialog","DialogTitle","DialogContent","PayloadHashSourceDetails","DialogActions","ButtonEx","FlexCol","forwardRef","Paper","useMediaQuery","useTheme","JsonViewerEx","PropertyGroup","jsx","PayloadJsonDetails","jsonViewProps","payload","props","breakpoints","palette","belowSm","elevation","jsonTheme","Typography","FlexCol","usePromise","PayloadValidator","Property","PropertyGroup","SchemaProperty","jsx","jsxs","PayloadValidationDetails","skipBody","value","props","validateErrors","errors","elevation","error","index","jsx","jsxs","PayloadDetails","forwardRef","paper","payload","props","ref","FlexCol","PayloadDataDetails","PayloadValidationDetails","PayloadJsonDetails"]}