npm - @xyo-network/react-payload-details - Versions diffs - 6.2.0 → 7.0.1 - Mend

@xyo-network/react-payload-details 6.2.0 → 7.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/dist/browser/components/Details/Details.stories.d.ts +8 -8
package/dist/browser/components/Details/ValidationDetails/ValidationDetails.stories.d.ts +3 -3
package/dist/browser/components/Details/ValidationDetails/ValidationDetails.stories.d.ts.map +1 -1
package/dist/browser/index.mjs +151 -154
package/dist/browser/index.mjs.map +1 -1
package/package.json +38 -31
package/typedoc.json +0 -5
package/xy.config.ts +0 -10

package/dist/browser/components/Details/Details.stories.d.ts CHANGED Viewed

@@ -1,35 +1,35 @@
 import type { Meta } from '@storybook/react-vite';
 import { PayloadDetails } from './Details.tsx';
 declare const StorybookEntry: Meta<typeof PayloadDetails>;
-declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const Default: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const WithSample: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const WithSample: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const WithBuilderSample: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const WithBuilderSample: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const WithArchiveLink: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const WithArchiveLink: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const DefaultPaper: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const DefaultPaper: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const WithSamplePaper: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const WithSamplePaper: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const WithBuilderSamplePaper: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const WithBuilderSamplePaper: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;
-declare const WithArchiveLinkPaper: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
+declare const WithArchiveLinkPaper: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps & {
     paper?: boolean;
     payload?: import("@xyo-network/payload-model").Payload;
 }>;

package/dist/browser/components/Details/ValidationDetails/ValidationDetails.stories.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
 import type { Meta } from '@storybook/react-vite';
 import type { PayloadValidationDetailsProps } from './ValidationDetailsProps.ts';
 declare const StorybookEntry: Meta;
-declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, PayloadValidationDetailsProps>;
-declare const WithErrorsInToolTip: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, PayloadValidationDetailsProps>;
-declare const SkipBody: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, PayloadValidationDetailsProps>;
+declare const Default: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, PayloadValidationDetailsProps>;
+declare const WithErrorsInToolTip: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, PayloadValidationDetailsProps>;
+declare const SkipBody: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, PayloadValidationDetailsProps>;
 export { Default, SkipBody, WithErrorsInToolTip, };
 export default StorybookEntry;
 //# sourceMappingURL=ValidationDetails.stories.d.ts.map

package/dist/browser/components/Details/ValidationDetails/ValidationDetails.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ValidationDetails.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Details/ValidationDetails/ValidationDetails.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAQ1D,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,6BAA6B,CAAA;AAEhF,QAAA,MAAM,cAAc,EAAE,IAMrB,CAAA;AAQD,QAAA,MAAM,OAAO,~~iIAAoB~~,CAAA;AAGjC,QAAA,MAAM,mBAAmB,~~iIAAoB~~,CAAA;AAW7C,QAAA,MAAM,QAAQ,~~iIAAoB~~,CAAA;AAYlC,OAAO,EACL,OAAO,EAAE,QAAQ,EAAE,mBAAmB,GACvC,CAAA;AAED,eAAe,cAAc,CAAA"}
1	+ {"version":3,"file":"ValidationDetails.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Details/ValidationDetails/ValidationDetails.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAQ1D,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,6BAA6B,CAAA;AAEhF,QAAA,MAAM,cAAc,EAAE,IAMrB,CAAA;AAQD,QAAA,MAAM,OAAO,mKAAoB,CAAA;AAGjC,QAAA,MAAM,mBAAmB,mKAAoB,CAAA;AAW7C,QAAA,MAAM,QAAQ,mKAAoB,CAAA;AAYlC,OAAO,EACL,OAAO,EAAE,QAAQ,EAAE,mBAAmB,GACvC,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/browser/index.mjs CHANGED Viewed

@@ -1,57 +1,70 @@
-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
 // 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 {
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle
+} from "@mui/material";
 import { forget } from "@xylabs/forget";
 import { ButtonEx } from "@xylabs/react-button";
 import { PayloadBuilder as PayloadBuilder2 } from "@xyo-network/payload-builder";
 import { Property } from "@xyo-network/react-property";
 import { usePayloadHash } from "@xyo-network/react-shared";
-import React2, { useState } from "react";
+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 {
+  IconButton,
+  Typography,
+  useTheme
+} from "@mui/material";
+import {
+  FlexCol,
+  FlexGrowRow,
+  FlexRow
+} from "@xylabs/react-flexbox";
 import { QuickTipButton } from "@xylabs/react-quick-tip-button";
 import { PayloadBuilder } from "@xyo-network/payload-builder";
-import React from "react";
-var PayloadHashSourceDetails = /* @__PURE__ */ __name(({ noTitle = false, payload, ...props }) => {
+import { jsx, jsxs } from "react/jsx-runtime";
+var PayloadHashSourceDetails = ({
+  noTitle = false,
+  payload,
+  ...props
+}) => {
   const theme = useTheme();
   const payloadString = payload ? JSON.stringify(PayloadBuilder.hashableFields(payload), null, 2) : "";
-  return /* @__PURE__ */ React.createElement(FlexCol, {
-    alignItems: "stretch",
-    ...props
-  }, noTitle ? null : /* @__PURE__ */ React.createElement(FlexRow, {
-    margin: 1,
-    justifyContent: "flex-start"
-  }, /* @__PURE__ */ React.createElement(Typography, null, "Hash Source"), /* @__PURE__ */ React.createElement(QuickTipButton, {
-    title: "Hash Source"
-  }, "The actual string used to generate the hash (SHA256)")), /* @__PURE__ */ React.createElement(FlexRow, null, /* @__PURE__ */ React.createElement(FlexGrowRow, {
-    background: true,
-    border: 1,
-    borderColor: theme.vars.palette.divider,
-    justifyContent: "start"
-  }, /* @__PURE__ */ React.createElement(Typography, {
-    padding: 2,
-    fontFamily: "monospace",
-    variant: "body1",
-    sx: {
-      overflowWrap: "break-word",
-      wordBreak: "break-all"
-    }
-  }, payloadString)), /* @__PURE__ */ React.createElement(IconButton, null, /* @__PURE__ */ React.createElement(ContentCopyIcon, null))), noTitle ? /* @__PURE__ */ React.createElement(FlexRow, {
-    margin: 1,
-    justifyContent: "flex-start"
-  }, /* @__PURE__ */ React.createElement(Typography, {
-    variant: "body2"
-  }, "The actual string used to generate the hash (SHA256). This can be used to validate the hash manually.")) : null);
-}, "PayloadHashSourceDetails");
+  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.vars.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
-var PayloadDataDetails = /* @__PURE__ */ __name(({ size, badge, payload, ...props }) => {
+import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var PayloadDataDetails = ({
+  size,
+  badge,
+  payload,
+  ...props
+}) => {
   const payloadString = payload ? JSON.stringify(PayloadBuilder2.hashableFields(payload), null, 2) : "";
   const [viewSourceOpen, setViewSourceOpen] = useState(false);
   const hash = usePayloadHash(payload);
@@ -61,87 +74,91 @@ var PayloadDataDetails = /* @__PURE__ */ __name(({ size, badge, payload, ...prop
   }
   const actions = [
     {
-      icon: /* @__PURE__ */ React2.createElement(VisibilityIcon, null),
+      icon: /* @__PURE__ */ jsx2(VisibilityIcon, {}),
       name: "View",
-      onClick: /* @__PURE__ */ __name(() => setViewSourceOpen(true), "onClick")
+      onClick: () => setViewSourceOpen(true)
     },
     {
-      icon: /* @__PURE__ */ React2.createElement(ContentCopyIcon2, null),
+      icon: /* @__PURE__ */ jsx2(ContentCopyIcon2, {}),
       name: "Copy",
-      onClick: /* @__PURE__ */ __name(() => forget(navigator.clipboard.writeText(hash ?? "")), "onClick")
+      onClick: () => forget(navigator.clipboard.writeText(hash ?? ""))
     }
   ];
-  const onCopy = /* @__PURE__ */ __name(() => {
+  const onCopy = () => {
     forget(navigator.clipboard.writeText(payloadString));
-  }, "onCopy");
-  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(Property, {
-    titleProps: {
-      elevation
-    },
-    badge,
-    size,
-    actions,
-    title: "Payload Hash",
-    value: hash ?? "<Unknown>",
-    tip: "This is the payload hash",
-    ...props
-  }), /* @__PURE__ */ React2.createElement(Dialog, {
-    open: viewSourceOpen,
-    onClose: /* @__PURE__ */ __name(() => setViewSourceOpen(false), "onClose")
-  }, /* @__PURE__ */ React2.createElement(DialogTitle, null, "Hash Source"), /* @__PURE__ */ React2.createElement(DialogContent, null, /* @__PURE__ */ React2.createElement(PayloadHashSourceDetails, {
-    noTitle: true,
-    payload
-  })), /* @__PURE__ */ React2.createElement(DialogActions, null, /* @__PURE__ */ React2.createElement(ButtonEx, {
-    color: "secondary",
-    onClick: onCopy
-  }, "Copy"), /* @__PURE__ */ React2.createElement(ButtonEx, {
-    color: "secondary",
-    onClick: /* @__PURE__ */ __name(() => setViewSourceOpen(false), "onClick")
-  }, "Close"))));
-}, "PayloadDataDetails");
+  };
+  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 React5 from "react";
 // src/components/Details/JsonDetails.tsx
-import { Paper, useMediaQuery, useTheme as useTheme2 } from "@mui/material";
+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 React3 from "react";
-var PayloadJsonDetails = /* @__PURE__ */ __name(({ jsonViewProps, payload, ...props }) => {
+import { jsx as jsx3 } from "react/jsx-runtime";
+var PayloadJsonDetails = ({
+  jsonViewProps,
+  payload,
+  ...props
+}) => {
   const { breakpoints } = useTheme2();
   const belowSm = useMediaQuery(breakpoints.down("sm"));
   let elevation = 2;
   if (props.paper) {
     elevation += props.elevation ?? 0;
   }
-  return /* @__PURE__ */ React3.createElement(PropertyGroup, {
-    titleProps: {
-      elevation
-    },
-    title: "JSON",
-    tip: "The raw JSON of the payload",
-    ...props
-  }, /* @__PURE__ */ React3.createElement(Paper, {
-    square: true,
-    variant: "elevation",
-    style: {
-      overflow: "hidden",
-      padding: "16px",
-      width: "100%"
+  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: { overflow: "hidden" },
+          value: payload,
+          enableClipboard: true,
+          collapseStringsAfterLength: belowSm ? 24 : 32,
+          ...jsonViewProps
+        }
+      )
     }
-  }, /* @__PURE__ */ React3.createElement(JsonViewerEx, {
-    groupArraysAfterLength: 20,
-    style: {
-      overflow: "hidden"
-    },
-    value: payload,
-    enableClipboard: true,
-    collapseStringsAfterLength: belowSm ? 24 : 32,
-    ...jsonViewProps
-  })));
-}, "PayloadJsonDetails");
+  ) });
+};
 // src/components/Details/ValidationDetails/ValidationDetails.tsx
 import { Typography as Typography2 } from "@mui/material";
@@ -150,69 +167,49 @@ 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 React4 from "react";
-var PayloadValidationDetails = /* @__PURE__ */ __name(({ skipBody = false, value, ...props }) => {
-  const [validateErrors] = usePromise(async () => value ? await new PayloadValidator(value).validate() : void 0, [
-    value
-  ]);
+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
-  ];
+  const errors = [...bodyErrors];
   let elevation = 2;
   if (props.paper) {
     elevation += props.elevation ?? 0;
   }
-  return /* @__PURE__ */ React4.createElement(PropertyGroup2, {
-    titleProps: {
-      elevation
-    },
-    title: "Validation",
-    tip: "The results from validating the payload",
-    ...props
-  }, /* @__PURE__ */ React4.createElement(Property2, {
-    titleProps: {
-      elevation
-    },
-    flexGrow: 1,
-    title: "Valid",
-    value: errors.length === 0 ? "True" : "False",
-    tip: errors.length > 0 ? /* @__PURE__ */ React4.createElement(FlexCol2, null, errors.map((error, index) => {
-      return /* @__PURE__ */ React4.createElement(Typography2, {
-        key: index
-      }, error.toString());
-    })) : /* @__PURE__ */ React4.createElement(Typography2, null, "No Errors")
-  }), value?.schema && /* @__PURE__ */ React4.createElement(SchemaProperty, {
-    flexGrow: 1,
-    titleProps: {
-      elevation
-    },
-    value: value.schema
-  }));
-}, "PayloadValidationDetails");
+  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
-var PayloadDetails = /* @__PURE__ */ __name(({ paper, payload, ...props }) => {
-  return /* @__PURE__ */ React5.createElement(FlexCol3, {
-    gap: 1,
-    justifyContent: "flex-start",
-    alignItems: "stretch",
-    marginTop: 2,
-    marginBottom: 8,
-    ...props
-  }, /* @__PURE__ */ React5.createElement(PayloadDataDetails, {
-    paper,
-    size: "large",
-    badge: true,
-    payload
-  }), /* @__PURE__ */ React5.createElement(PayloadValidationDetails, {
-    paper,
-    value: payload
-  }), /* @__PURE__ */ React5.createElement(PayloadJsonDetails, {
-    paper,
-    payload
-  }));
-}, "PayloadDetails");
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var PayloadDetails = ({
+  paper,
+  payload,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs4(FlexCol3, { gap: 1, justifyContent: "flex-start", alignItems: "stretch", marginTop: 2, marginBottom: 8, ...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,

package/dist/browser/index.mjs.map CHANGED Viewed

	@@ -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.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 } = 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 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={{ overflow: 'hidden' }}\n value={payload}\n enableClipboard\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","useTheme","belowSm","useMediaQuery","down","elevation","paper","React","PropertyGroup","titleProps","title","tip","Paper","square","variant","style","overflow","padding","width","JsonViewerEx","groupArraysAfterLength","value","enableClipboard","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 } = 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 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={{ overflow: 'hidden' }}\n value={payload}\n enableClipboard\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":["ContentCopyIcon","PayloadBuilder","jsx","jsxs","PayloadBuilder","ContentCopyIcon","FlexCol","useTheme","jsx","Typography","FlexCol","Property","PropertyGroup","jsx","jsxs","jsx","jsxs","FlexCol"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@xyo-network/react-payload-details",
-  "version": "6.2.0",
+  "version": "7.0.1",
   "description": "Common React library for all XYO projects that use React",
   "keywords": [
     "xyo",
@@ -38,43 +38,50 @@
   },
   "module": "dist/browser/index.mjs",
   "types": "dist/browser/index.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
   "dependencies": {
-    "@xylabs/forget": "^4.15.0",
-    "@xylabs/react-button": "^6.4.0",
-    "@xylabs/react-flexbox": "^6.4.0",
-    "@xylabs/react-promise": "^6.4.0",
-    "@xylabs/react-quick-tip-button": "^6.4.0",
-    "@xyo-network/payload-builder": "^4.3.0",
-    "@xyo-network/payload-model": "^4.3.0",
-    "@xyo-network/payload-validator": "^4.3.0",
-    "@xyo-network/react-payload-raw-info": "^6.2.0",
-    "@xyo-network/react-property": "^6.2.0",
-    "@xyo-network/react-schema": "^6.2.0",
-    "@xyo-network/react-shared": "^6.2.0"
+    "@xylabs/forget": "~5.0.8",
+    "@xylabs/react-button": "~7.0.1",
+    "@xylabs/react-flexbox": "~7.0.1",
+    "@xylabs/react-promise": "~7.0.1",
+    "@xylabs/react-quick-tip-button": "~7.0.1",
+    "@xyo-network/payload-builder": "~5.0.5",
+    "@xyo-network/payload-model": "~5.0.5",
+    "@xyo-network/payload-validator": "~5.0.5",
+    "@xyo-network/react-payload-raw-info": "^7.0.1",
+    "@xyo-network/react-property": "^7.0.1",
+    "@xyo-network/react-schema": "^7.0.1",
+    "@xyo-network/react-shared": "^7.0.1"
   },
   "devDependencies": {
-    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.1",
-    "@mui/icons-material": "^7.2.0",
-    "@mui/material": "^7.2.0",
-    "@storybook/react-vite": "^9.0.18",
-    "@types/react": "^19.1.8",
-    "@xylabs/ts-scripts-yarn3": "^7.0.1",
-    "@xylabs/tsconfig-react": "^7.0.1",
-    "@xyo-network/react-storybook": "^6.2.0",
-    "react": "^19.1.1",
-    "react-dom": "^19.1.1",
-    "react-router-dom": "^7.7.1",
-    "storybook": "^9.0.18",
-    "typescript": "^5.8.3"
+    "@emotion/react": "~11.14.0",
+    "@emotion/styled": "~11.14.1",
+    "@mui/icons-material": "~7.3.1",
+    "@mui/material": "~7.3.1",
+    "@storybook/react-vite": "~9.1.2",
+    "@types/react": "~19.1.10",
+    "@xylabs/ts-scripts-yarn3": "~7.1.1",
+    "@xylabs/tsconfig": "~7.1.1",
+    "@xylabs/tsconfig-dom": "~7.1.1",
+    "@xylabs/tsconfig-react": "~7.1.1",
+    "@xyo-network/react-storybook": "^7.0.1",
+    "react": "~19.1.1",
+    "react-dom": "~19.1.1",
+    "react-router-dom": "~7.8.0",
+    "storybook": "~9.1.2",
+    "typescript": "~5.9.2",
+    "vite": "~7.1.2"
   },
   "peerDependencies": {
-    "@emotion/react": "^11",
-    "@emotion/styled": "^11",
+    "@emotion/react": "~11",
+    "@emotion/styled": "~11",
     "@mui/icons-material": ">=6 <8",
     "@mui/material": ">=6 <8",
-    "react": "^19",
-    "react-dom": "^19"
+    "react": "~19",
+    "react-dom": "~19"
   },
   "publishConfig": {
     "access": "public"

package/typedoc.json DELETED Viewed

@@ -1,5 +0,0 @@
-{
-  "$schema": "https://typedoc.org/schema.json",
-  "entryPoints": ["src/index.ts"],
-  "tsconfig": "./tsconfig.typedoc.json"
-}

package/xy.config.ts DELETED Viewed

@@ -1,10 +0,0 @@
-import type { XyTsupConfig } from '@xylabs/ts-scripts-yarn3'
-const config: XyTsupConfig = {
-  compile: {
-    browser: { src: true },
-    node: {},
-    neutral: {},
-  },
-}
-export default config