npm - @xyo-network/react-card - Versions diffs - 7.6.2 → 8.0.0 - Mend

@xyo-network/react-card 7.6.2 → 8.0.0

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 (5) hide show

package/dist/browser/components/FullWidthCard/FullWidthCard.d.ts.map +1 -1
package/dist/browser/components/SimpleCard/SimpleCard.d.ts.map +1 -1
package/dist/browser/index.mjs +121 -30
package/dist/browser/index.mjs.map +1 -1
package/package.json +70 -70

package/dist/browser/components/FullWidthCard/FullWidthCard.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FullWidthCard.d.ts","sourceRoot":"","sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAM9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAG1C,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,EAAE,CAAC,EAAE,EAAE,CAAA;CACR;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,~~CA6GtD~~,CAAA"}
1	+ {"version":3,"file":"FullWidthCard.d.ts","sourceRoot":"","sources":["../../../../src/components/FullWidthCard/FullWidthCard.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAM9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAG1C,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,EAAE,CAAC,EAAE,EAAE,CAAA;CACR;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6ItD,CAAA"}

package/dist/browser/components/SimpleCard/SimpleCard.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SimpleCard.d.ts","sourceRoot":"","sources":["../../../../src/components/SimpleCard/SimpleCard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAGhD,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kBAAkB,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAA;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,EAAE,CAAC,EAAE,EAAE,CAAA;CACR;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,~~CA8GhD~~,CAAA"}
1	+ {"version":3,"file":"SimpleCard.d.ts","sourceRoot":"","sources":["../../../../src/components/SimpleCard/SimpleCard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAGhD,MAAM,WAAW,eAAgB,SAAQ,WAAW;IAClD,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kBAAkB,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAA;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,EAAE,CAAC,EAAE,EAAE,CAAA;CACR;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAqIhD,CAAA"}

package/dist/browser/index.mjs CHANGED Viewed

@@ -111,33 +111,83 @@ var FullWidthCard = ({
       onMouseLeave: () => isMobile ? null : cardIsButton ? setRaised(false) : null,
       onClick: () => cardIsButton ? href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404") : null,
       children: [
-        media ? /* @__PURE__ */ jsx3(CardMedia, { component: "img", height: "100", image: media, alt: "" }) : null,
-        /* @__PURE__ */ jsx3(CardContent2, { children: /* @__PURE__ */ jsxs(Grid, { container: true, alignItems: "center", paddingY: 2, paddingX: 2, children: [
-          /* @__PURE__ */ jsx3(Grid, { size: { xs: 12, md: 6 }, children: typeof name === "string" ? /* @__PURE__ */ jsx3(Typography, { fontWeight: 700, variant: "h2", textAlign: "left", paddingBottom: 1, children: name }) : name }),
-          /* @__PURE__ */ jsx3(Grid, { size: { xs: 12, md: 5 }, children: /* @__PURE__ */ jsx3(Typography, { variant: "body1", fontWeight: 400, textAlign: "left", children: desc }) }),
-          /* @__PURE__ */ jsx3(Grid, { size: { xs: 1 }, display: isMobile ? "none" : "flex", justifyContent: "center", children: /* @__PURE__ */ jsx3(Zoom, { in: raised, children: /* @__PURE__ */ jsx3(
-            IconButton,
-            {
-              color: "primary",
-              size: small ? "small" : "medium",
-              onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
-              disableFocusRipple: true,
-              disableRipple: true,
-              disableTouchRipple: true,
-              children: /* @__PURE__ */ jsx3(ArrowForwardRoundedIcon, { fontSize: small ? "small" : "medium" })
-            }
-          ) }) })
-        ] }) }),
-        /* @__PURE__ */ jsx3(CardActions, { sx: { display: { md: isMobile ? "flex" : "none" } }, children: /* @__PURE__ */ jsx3(FlexGrowCol, { alignItems: "flex-end", children: /* @__PURE__ */ jsx3(
+        media ? /* @__PURE__ */ jsx3(
+          CardMedia,
+          {
+            component: "img",
+            image: media,
+            alt: "",
+            sx: { height: "100" }
+          }
+        ) : null,
+        /* @__PURE__ */ jsx3(CardContent2, { children: /* @__PURE__ */ jsxs(
+          Grid,
+          {
+            container: true,
+            sx: {
+              alignItems: "center",
+              paddingY: 2,
+              paddingX: 2
+            },
+            children: [
+              /* @__PURE__ */ jsx3(Grid, { size: { xs: 12, md: 6 }, children: typeof name === "string" ? /* @__PURE__ */ jsx3(
+                Typography,
+                {
+                  variant: "h2",
+                  sx: {
+                    fontWeight: 700,
+                    textAlign: "left",
+                    paddingBottom: 1
+                  },
+                  children: name
+                }
+              ) : name }),
+              /* @__PURE__ */ jsx3(Grid, { size: { xs: 12, md: 5 }, children: /* @__PURE__ */ jsx3(
+                Typography,
+                {
+                  variant: "body1",
+                  sx: {
+                    fontWeight: 400,
+                    textAlign: "left"
+                  },
+                  children: desc
+                }
+              ) }),
+              /* @__PURE__ */ jsx3(
+                Grid,
+                {
+                  size: { xs: 1 },
+                  sx: {
+                    display: isMobile ? "none" : "flex",
+                    justifyContent: "center"
+                  },
+                  children: /* @__PURE__ */ jsx3(Zoom, { in: raised, children: /* @__PURE__ */ jsx3(
+                    IconButton,
+                    {
+                      size: small ? "small" : "medium",
+                      onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
+                      disableFocusRipple: true,
+                      disableRipple: true,
+                      disableTouchRipple: true,
+                      sx: { color: "primary" },
+                      children: /* @__PURE__ */ jsx3(ArrowForwardRoundedIcon, { sx: { fontSize: small ? "small" : "medium" } })
+                    }
+                  ) })
+                }
+              )
+            ]
+          }
+        ) }),
+        /* @__PURE__ */ jsx3(CardActions, { sx: { display: { md: isMobile ? "flex" : "none" } }, children: /* @__PURE__ */ jsx3(FlexGrowCol, { sx: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx3(
           IconButton,
           {
-            color: "primary",
             size: small ? "small" : "medium",
             onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
             disableFocusRipple: true,
             disableRipple: true,
             disableTouchRipple: true,
-            children: /* @__PURE__ */ jsx3(ArrowForwardRoundedIcon, { fontSize: small ? "small" : "medium" })
+            sx: { color: "primary" },
+            children: /* @__PURE__ */ jsx3(ArrowForwardRoundedIcon, { sx: { fontSize: small ? "small" : "medium" } })
           }
         ) }) })
       ]
@@ -241,24 +291,65 @@ var SimpleCard = ({
       onClick: () => interactionVariant == "button" ? href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404") : null,
       ...props,
       children: [
-        media ? /* @__PURE__ */ jsx5(CardMedia2, { component: "img", height: "100", image: media, alt: "" }) : null,
-        /* @__PURE__ */ jsx5(CardContent3, { sx: { height: "100%" }, children: /* @__PURE__ */ jsxs3(FlexCol, { width: "100%", alignItems: "flex-start", children: [
-          iconImage ? /* @__PURE__ */ jsx5("img", { src: iconImage, height: "40px", style: { paddingBottom: "8px" } }) : null,
-          typeof headline === "string" ? /* @__PURE__ */ jsx5(Typography2, { variant: small ? "body1" : "h6", textAlign: "left", gutterBottom: true, children: headline }) : headline,
-          subtitle ? /* @__PURE__ */ jsx5(Typography2, { variant: "subtitle2", textAlign: "left", gutterBottom: true, children: subtitle }) : null,
-          /* @__PURE__ */ jsx5(Typography2, { variant: small ? "caption" : "body1", textAlign: "left", gutterBottom: true, children: desc })
-        ] }) }),
+        media ? /* @__PURE__ */ jsx5(
+          CardMedia2,
+          {
+            component: "img",
+            image: media,
+            alt: "",
+            sx: { height: "100" }
+          }
+        ) : null,
+        /* @__PURE__ */ jsx5(CardContent3, { sx: { height: "100%" }, children: /* @__PURE__ */ jsxs3(
+          FlexCol,
+          {
+            sx: {
+              width: "100%",
+              alignItems: "flex-start"
+            },
+            children: [
+              iconImage ? /* @__PURE__ */ jsx5("img", { src: iconImage, height: "40px", style: { paddingBottom: "8px" } }) : null,
+              typeof headline === "string" ? /* @__PURE__ */ jsx5(
+                Typography2,
+                {
+                  variant: small ? "body1" : "h6",
+                  gutterBottom: true,
+                  sx: { textAlign: "left" },
+                  children: headline
+                }
+              ) : headline,
+              subtitle ? /* @__PURE__ */ jsx5(
+                Typography2,
+                {
+                  variant: "subtitle2",
+                  gutterBottom: true,
+                  sx: { textAlign: "left" },
+                  children: subtitle
+                }
+              ) : null,
+              /* @__PURE__ */ jsx5(
+                Typography2,
+                {
+                  variant: small ? "caption" : "body1",
+                  gutterBottom: true,
+                  sx: { textAlign: "left" },
+                  children: desc
+                }
+              )
+            ]
+          }
+        ) }),
         children,
-        interactionVariant == "button" ? /* @__PURE__ */ jsx5(CardActions2, { children: /* @__PURE__ */ jsx5(FlexGrowCol2, { alignItems: "flex-end", children: /* @__PURE__ */ jsx5(
+        interactionVariant == "button" ? /* @__PURE__ */ jsx5(CardActions2, { children: /* @__PURE__ */ jsx5(FlexGrowCol2, { sx: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx5(
           IconButton3,
           {
-            color: raised ? "secondary" : "primary",
             size: small ? "small" : "medium",
             onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
             disableFocusRipple: true,
             disableRipple: true,
             disableTouchRipple: true,
-            children: /* @__PURE__ */ jsx5(ArrowForwardRoundedIcon2, { fontSize: small ? "small" : "medium" })
+            sx: { color: raised ? "secondary" : "primary" },
+            children: /* @__PURE__ */ jsx5(ArrowForwardRoundedIcon2, { sx: { fontSize: small ? "small" : "medium" } })
           }
         ) }) }) : null
       ]

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/components/CardContentEx.tsx","../../src/components/CardEx.tsx","../../src/components/FullWidthCard/FullWidthCard.tsx","../../src/components/PageCard.tsx","../../src/components/SimpleCard/SimpleCard.tsx"],"sourcesContent":["import type { CardContentProps } from '@mui/material'\nimport { CardContent, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport React, { useEffect } from 'react'\n\nconst CardContentExRoot = styled(CardContent, {\n name: 'CardContentEx',\n shouldForwardProp: (prop: string) => !['variant', 'removePadding'].includes(prop),\n slot: 'Root',\n})<CardContentExProps>(({ variant, removePadding }) => ({\n ...((variant === 'scrollable' \|\| removePadding) && {\n [':last-child']: { paddingBottom: 0 },\n overflow: 'auto',\n paddingTop: 0,\n ...(removePadding && { padding: 0 }),\n }),\n}))\n\nexport type CardContentExProps = CardContentProps & {\n refreshRef?: number\n removePadding?: boolean\n scrollToTop?: number\n variant?: 'scrollable' \| 'normal'\n}\n\nexport const CardContentExWithRef = ({\n ref, scrollToTop = 0, refreshRef = 0, ...props\n}: CardContentExProps & { ref?: React.RefObject<HTMLDivElement \| null> }) => {\n const sharedRef = useShareForwardedRef<HTMLDivElement>(ref, refreshRef)\n\n useEffect(() => {\n if (sharedRef && scrollToTop) {\n sharedRef.current?.scroll({ behavior: 'smooth', top: 0 })\n }\n }, [sharedRef, scrollToTop])\n\n return <CardContentExRoot ref={sharedRef} {...props} />\n}\n\nCardContentExWithRef.displayName = 'CardContentEx'\n\nexport const CardContentEx = CardContentExWithRef\n","import type { CardProps } from '@mui/material'\nimport { Card } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport React from 'react'\n\nexport interface CardExProps extends CardProps {\n gradient?: 'border' \| 'background'\n}\n\nexport const CardExWithRef = ({\n ref, style, gradient, ...props\n}: CardExProps) => {\n const styles = useGradientStyles()\n const gradientStyle\n = gradient === 'border'\n ? styles.border\n : gradient === 'background'\n ? styles.background\n : {}\n return (\n <Card\n style={{\n ...gradientStyle,\n ...style,\n }}\n ref={ref}\n {...props}\n />\n )\n}\n\nCardExWithRef.displayName = 'CardEx'\n\nexport const CardEx = CardExWithRef\n","import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport type { CardProps } from '@mui/material'\nimport {\n Card, CardActions, CardContent, CardMedia, Grid, IconButton, Typography, useTheme, Zoom,\n} from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { alphaCss, useIsSmall } from '@xylabs/react-theme'\nimport type { ReactNode } from 'react'\nimport React, { useState } from 'react'\nimport type { To } from 'react-router-dom'\nimport { useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({\n cardIsButton, desc, href, media, name, small, to, ...props\n}) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsSmall()\n\n const localRouteChange = (to: To \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n to ? void navigate(to) : void navigate('/404')\n }\n const externalRouteChange = (href: string \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n href ? void window.open(href) : void navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': { cursor: 'pointer' },\n 'backgroundColor': alphaCss(theme.vars.palette.primary.light, 0.05),\n }}\n onMouseEnter={() =>\n isMobile\n ? null\n : cardIsButton\n ? setRaised(true)\n : null}\n onMouseLeave={() =>\n isMobile\n ? null\n : cardIsButton\n ? setRaised(false)\n : null}\n onClick={() =>\n cardIsButton\n ? href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')\n : null}\n >\n {media\n ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" />\n : null}\n\n <CardContent>\n <Grid container alignItems=\"center\" paddingY={2} paddingX={2}>\n <Grid size={{ xs: 12, md: 6 }}>\n {typeof name === 'string'\n ? (\n <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n {name}\n </Typography>\n )\n : name}\n </Grid>\n <Grid size={{ xs: 12, md: 5 }}>\n <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n {desc}\n </Typography>\n </Grid>\n <Grid size={{ xs: 1 }} display={isMobile ? 'none' : 'flex'} justifyContent=\"center\">\n <Zoom in={raised}>\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() =>\n href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color=\"primary\"\n size={small ? 'small' : 'medium'}\n onClick={() =>\n href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n","import { Refresh as RefreshIcon } from '@mui/icons-material'\nimport type { CardHeaderProps } from '@mui/material'\nimport { CardHeader, IconButton } from '@mui/material'\nimport { TypographyEx } from '@xyo-network/react-shared'\nimport type { ReactNode } from 'react'\nimport React from 'react'\n\nimport type { CardExProps } from './CardEx.tsx'\nimport { CardEx } from './CardEx.tsx'\n\nexport interface PageCardProps extends CardExProps {\n action?: ReactNode\n onRefresh?: () => void\n subheader?: CardHeaderProps['subheader']\n}\n\nconst PageCardWithRef = ({\n ref, subheader, title, onRefresh, children, action, style, ...props\n}: PageCardProps) => {\n return (\n <CardEx\n style={{\n backgroundColor: 'transparent', position: 'relative', ...style,\n }}\n elevation={0}\n ref={ref}\n {...props}\n >\n <CardHeader\n title={(\n <TypographyEx variant=\"h5\" gutterBottom>\n {title}\n </TypographyEx>\n )}\n subheader={<TypographyEx variant=\"subtitle1\">{subheader}</TypographyEx>}\n action={\n action ?? (\n <>\n {onRefresh\n ? (\n <IconButton onClick={() => onRefresh?.()}>\n <RefreshIcon />\n </IconButton>\n )\n : null}\n </>\n )\n }\n />\n {children}\n </CardEx>\n )\n}\n\nPageCardWithRef.displayName = 'PageCard'\n\nexport const PageCard = PageCardWithRef\n","import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport {\n CardActions, CardContent, CardMedia, IconButton, Typography, useTheme,\n} from '@mui/material'\nimport { FlexCol, FlexGrowCol } from '@xylabs/react-flexbox'\nimport { alphaCss, useIsSmall } from '@xylabs/react-theme'\nimport type { ReactNode } from 'react'\nimport React, { useState } from 'react'\nimport type { To } from 'react-router-dom'\nimport { useNavigate } from 'react-router-dom'\n\nimport type { CardExProps } from '../CardEx.tsx'\nimport { CardEx } from '../CardEx.tsx'\n\nexport interface SimpleCardProps extends CardExProps {\n desc?: ReactNode\n headline?: ReactNode\n href?: string\n iconImage?: string\n interactionVariant?: 'button' \| 'card'\n media?: string\n small?: boolean\n subtitle?: string\n to?: To\n}\n\nexport const SimpleCard: React.FC<SimpleCardProps> = ({\n children,\n desc,\n iconImage,\n interactionVariant = 'card',\n headline,\n href,\n media,\n small,\n subtitle,\n sx,\n to,\n ...props\n}) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isSmall = useIsSmall()\n const localRouteChange = (to: To \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n to ? void navigate(to) : void navigate('/404')\n }\n const externalRouteChange = (href: string \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n href ? void window.open(href) : void navigate('/404')\n }\n return (\n <CardEx\n elevation={raised ? 3 : 0}\n sx={{\n '&:hover': { cursor: interactionVariant == 'button' ? 'pointer' : null },\n 'backgroundColor': alphaCss(theme.vars.palette.primary.main, 0.05),\n ...sx,\n }}\n onMouseEnter={() =>\n isSmall\n ? null\n : interactionVariant == 'button'\n ? setRaised(true)\n : null}\n onMouseLeave={() =>\n isSmall\n ? null\n : interactionVariant == 'button'\n ? setRaised(false)\n : null}\n onClick={() =>\n interactionVariant == 'button'\n ? href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')\n : null}\n {...props}\n >\n {media\n ? <CardMedia component=\"img\" height=\"100\" image={media} alt=\"\" />\n : null}\n\n <CardContent sx={{ height: '100%' }}>\n <FlexCol width=\"100%\" alignItems=\"flex-start\">\n {iconImage\n ? <img src={iconImage} height=\"40px\" style={{ paddingBottom: '8px' }} />\n : null}\n {typeof headline === 'string'\n ? (\n <Typography variant={small ? 'body1' : 'h6'} textAlign=\"left\" gutterBottom>\n {headline}\n </Typography>\n )\n : headline}\n {subtitle\n ? (\n <Typography variant=\"subtitle2\" textAlign=\"left\" gutterBottom>\n {subtitle}\n </Typography>\n )\n : null}\n <Typography variant={small ? 'caption' : 'body1'} textAlign=\"left\" gutterBottom>\n {desc}\n </Typography>\n </FlexCol>\n </CardContent>\n {children}\n {interactionVariant == 'button'\n ? (\n <CardActions>\n <FlexGrowCol alignItems=\"flex-end\">\n <IconButton\n color={raised ? 'secondary' : 'primary'}\n size={small ? 'small' : 'medium'}\n onClick={() =>\n href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n >\n <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n )\n : null}\n </CardEx>\n )\n}\n"],"mappings":"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","names":["jsx","Card","CardContent","jsx","to","href","IconButton","jsx","jsxs","IconButton","ArrowForwardRoundedIcon","CardActions","CardContent","CardMedia","IconButton","Typography","useTheme","FlexGrowCol","alphaCss","useIsSmall","useState","useNavigate","jsx","jsxs","useTheme","useState","useNavigate","useIsSmall","to","href","alphaCss","CardMedia","CardContent","Typography","CardActions","FlexGrowCol","IconButton","ArrowForwardRoundedIcon"]}
1	+ {"version":3,"sources":["../../src/components/CardContentEx.tsx","../../src/components/CardEx.tsx","../../src/components/FullWidthCard/FullWidthCard.tsx","../../src/components/PageCard.tsx","../../src/components/SimpleCard/SimpleCard.tsx"],"sourcesContent":["import type { CardContentProps } from '@mui/material'\nimport { CardContent, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport React, { useEffect } from 'react'\n\nconst CardContentExRoot = styled(CardContent, {\n name: 'CardContentEx',\n shouldForwardProp: (prop: string) => !['variant', 'removePadding'].includes(prop),\n slot: 'Root',\n})<CardContentExProps>(({ variant, removePadding }) => ({\n ...((variant === 'scrollable' \|\| removePadding) && {\n [':last-child']: { paddingBottom: 0 },\n overflow: 'auto',\n paddingTop: 0,\n ...(removePadding && { padding: 0 }),\n }),\n}))\n\nexport type CardContentExProps = CardContentProps & {\n refreshRef?: number\n removePadding?: boolean\n scrollToTop?: number\n variant?: 'scrollable' \| 'normal'\n}\n\nexport const CardContentExWithRef = ({\n ref, scrollToTop = 0, refreshRef = 0, ...props\n}: CardContentExProps & { ref?: React.RefObject<HTMLDivElement \| null> }) => {\n const sharedRef = useShareForwardedRef<HTMLDivElement>(ref, refreshRef)\n\n useEffect(() => {\n if (sharedRef && scrollToTop) {\n sharedRef.current?.scroll({ behavior: 'smooth', top: 0 })\n }\n }, [sharedRef, scrollToTop])\n\n return <CardContentExRoot ref={sharedRef} {...props} />\n}\n\nCardContentExWithRef.displayName = 'CardContentEx'\n\nexport const CardContentEx = CardContentExWithRef\n","import type { CardProps } from '@mui/material'\nimport { Card } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport React from 'react'\n\nexport interface CardExProps extends CardProps {\n gradient?: 'border' \| 'background'\n}\n\nexport const CardExWithRef = ({\n ref, style, gradient, ...props\n}: CardExProps) => {\n const styles = useGradientStyles()\n const gradientStyle\n = gradient === 'border'\n ? styles.border\n : gradient === 'background'\n ? styles.background\n : {}\n return (\n <Card\n style={{\n ...gradientStyle,\n ...style,\n }}\n ref={ref}\n {...props}\n />\n )\n}\n\nCardExWithRef.displayName = 'CardEx'\n\nexport const CardEx = CardExWithRef\n","import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport type { CardProps } from '@mui/material'\nimport {\n Card, CardActions, CardContent, CardMedia, Grid, IconButton, Typography, useTheme, Zoom,\n} from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { alphaCss, useIsSmall } from '@xylabs/react-theme'\nimport type { ReactNode } from 'react'\nimport React, { useState } from 'react'\nimport type { To } from 'react-router-dom'\nimport { useNavigate } from 'react-router-dom'\n\nexport interface FullWidthCardProps extends CardProps {\n cardIsButton?: boolean\n desc?: ReactNode\n href?: string\n linkText?: string\n media?: string\n name: ReactNode\n small?: boolean\n to?: To\n}\n\nexport const FullWidthCard: React.FC<FullWidthCardProps> = ({\n cardIsButton, desc, href, media, name, small, to, ...props\n}) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isMobile = useIsSmall()\n\n const localRouteChange = (to: To \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n to ? void navigate(to) : void navigate('/404')\n }\n const externalRouteChange = (href: string \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n href ? void window.open(href) : void navigate('/404')\n }\n\n return (\n <Card\n elevation={raised ? 3 : 0}\n style={{ height: '100%', width: '100%' }}\n {...props}\n sx={{\n '&:hover': { cursor: 'pointer' },\n 'backgroundColor': alphaCss(theme.vars.palette.primary.light, 0.05),\n }}\n onMouseEnter={() =>\n isMobile\n ? null\n : cardIsButton\n ? setRaised(true)\n : null}\n onMouseLeave={() =>\n isMobile\n ? null\n : cardIsButton\n ? setRaised(false)\n : null}\n onClick={() =>\n cardIsButton\n ? href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')\n : null}\n >\n {media\n ? (\n <CardMedia\n component=\"img\"\n image={media}\n alt=\"\"\n sx={{ height: '100' }}\n />\n )\n : null}\n <CardContent>\n <Grid\n container\n sx={{\n alignItems: 'center',\n paddingY: 2,\n paddingX: 2,\n }}\n >\n <Grid size={{ xs: 12, md: 6 }}>\n {typeof name === 'string'\n ? (\n <Typography\n variant=\"h2\"\n sx={{\n fontWeight: 700,\n textAlign: 'left',\n paddingBottom: 1,\n }}\n >\n {name}\n </Typography>\n )\n : name}\n </Grid>\n <Grid size={{ xs: 12, md: 5 }}>\n <Typography\n variant=\"body1\"\n sx={{\n fontWeight: 400,\n textAlign: 'left',\n }}\n >\n {desc}\n </Typography>\n </Grid>\n <Grid\n size={{ xs: 1 }}\n sx={{\n display: isMobile ? 'none' : 'flex',\n justifyContent: 'center',\n }}\n >\n <Zoom in={raised}>\n <IconButton\n size={small ? 'small' : 'medium'}\n onClick={() =>\n href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n sx={{ color: 'primary' }}\n >\n <ArrowForwardRoundedIcon sx={{ fontSize: small ? 'small' : 'medium' }} />\n </IconButton>\n </Zoom>\n </Grid>\n </Grid>\n </CardContent>\n <CardActions sx={{ display: { md: isMobile ? 'flex' : 'none' } }}>\n <FlexGrowCol sx={{ alignItems: 'flex-end' }}>\n <IconButton\n size={small ? 'small' : 'medium'}\n onClick={() =>\n href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n sx={{ color: 'primary' }}\n >\n <ArrowForwardRoundedIcon sx={{ fontSize: small ? 'small' : 'medium' }} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n </Card>\n )\n}\n","import { Refresh as RefreshIcon } from '@mui/icons-material'\nimport type { CardHeaderProps } from '@mui/material'\nimport { CardHeader, IconButton } from '@mui/material'\nimport { TypographyEx } from '@xyo-network/react-shared'\nimport type { ReactNode } from 'react'\nimport React from 'react'\n\nimport type { CardExProps } from './CardEx.tsx'\nimport { CardEx } from './CardEx.tsx'\n\nexport interface PageCardProps extends CardExProps {\n action?: ReactNode\n onRefresh?: () => void\n subheader?: CardHeaderProps['subheader']\n}\n\nconst PageCardWithRef = ({\n ref, subheader, title, onRefresh, children, action, style, ...props\n}: PageCardProps) => {\n return (\n <CardEx\n style={{\n backgroundColor: 'transparent', position: 'relative', ...style,\n }}\n elevation={0}\n ref={ref}\n {...props}\n >\n <CardHeader\n title={(\n <TypographyEx variant=\"h5\" gutterBottom>\n {title}\n </TypographyEx>\n )}\n subheader={<TypographyEx variant=\"subtitle1\">{subheader}</TypographyEx>}\n action={\n action ?? (\n <>\n {onRefresh\n ? (\n <IconButton onClick={() => onRefresh?.()}>\n <RefreshIcon />\n </IconButton>\n )\n : null}\n </>\n )\n }\n />\n {children}\n </CardEx>\n )\n}\n\nPageCardWithRef.displayName = 'PageCard'\n\nexport const PageCard = PageCardWithRef\n","import { ArrowForwardRounded as ArrowForwardRoundedIcon } from '@mui/icons-material'\nimport {\n CardActions, CardContent, CardMedia, IconButton, Typography, useTheme,\n} from '@mui/material'\nimport { FlexCol, FlexGrowCol } from '@xylabs/react-flexbox'\nimport { alphaCss, useIsSmall } from '@xylabs/react-theme'\nimport type { ReactNode } from 'react'\nimport React, { useState } from 'react'\nimport type { To } from 'react-router-dom'\nimport { useNavigate } from 'react-router-dom'\n\nimport type { CardExProps } from '../CardEx.tsx'\nimport { CardEx } from '../CardEx.tsx'\n\nexport interface SimpleCardProps extends CardExProps {\n desc?: ReactNode\n headline?: ReactNode\n href?: string\n iconImage?: string\n interactionVariant?: 'button' \| 'card'\n media?: string\n small?: boolean\n subtitle?: string\n to?: To\n}\n\nexport const SimpleCard: React.FC<SimpleCardProps> = ({\n children,\n desc,\n iconImage,\n interactionVariant = 'card',\n headline,\n href,\n media,\n small,\n subtitle,\n sx,\n to,\n ...props\n}) => {\n const theme = useTheme()\n const [raised, setRaised] = useState(false)\n const navigate = useNavigate()\n const isSmall = useIsSmall()\n const localRouteChange = (to: To \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n to ? void navigate(to) : void navigate('/404')\n }\n const externalRouteChange = (href: string \| undefined) => {\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n href ? void window.open(href) : void navigate('/404')\n }\n return (\n <CardEx\n elevation={raised ? 3 : 0}\n sx={{\n '&:hover': { cursor: interactionVariant == 'button' ? 'pointer' : null },\n 'backgroundColor': alphaCss(theme.vars.palette.primary.main, 0.05),\n ...sx,\n }}\n onMouseEnter={() =>\n isSmall\n ? null\n : interactionVariant == 'button'\n ? setRaised(true)\n : null}\n onMouseLeave={() =>\n isSmall\n ? null\n : interactionVariant == 'button'\n ? setRaised(false)\n : null}\n onClick={() =>\n interactionVariant == 'button'\n ? href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')\n : null}\n {...props}\n >\n {media\n ? (\n <CardMedia\n component=\"img\"\n image={media}\n alt=\"\"\n sx={{ height: '100' }}\n />\n )\n : null}\n <CardContent sx={{ height: '100%' }}>\n <FlexCol\n sx={{\n width: '100%',\n alignItems: 'flex-start',\n }}\n >\n {iconImage\n ? <img src={iconImage} height=\"40px\" style={{ paddingBottom: '8px' }} />\n : null}\n {typeof headline === 'string'\n ? (\n <Typography\n variant={small ? 'body1' : 'h6'}\n gutterBottom\n sx={{ textAlign: 'left' }}\n >\n {headline}\n </Typography>\n )\n : headline}\n {subtitle\n ? (\n <Typography\n variant=\"subtitle2\"\n gutterBottom\n sx={{ textAlign: 'left' }}\n >\n {subtitle}\n </Typography>\n )\n : null}\n <Typography\n variant={small ? 'caption' : 'body1'}\n gutterBottom\n sx={{ textAlign: 'left' }}\n >\n {desc}\n </Typography>\n </FlexCol>\n </CardContent>\n {children}\n {interactionVariant == 'button'\n ? (\n <CardActions>\n <FlexGrowCol sx={{ alignItems: 'flex-end' }}>\n <IconButton\n size={small ? 'small' : 'medium'}\n onClick={() =>\n href\n ? externalRouteChange(href)\n : to\n ? localRouteChange(to)\n : navigate('/404')}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n sx={{ color: raised ? 'secondary' : 'primary' }}\n >\n <ArrowForwardRoundedIcon sx={{ fontSize: small ? 'small' : 'medium' }} />\n </IconButton>\n </FlexGrowCol>\n </CardActions>\n )\n : null}\n </CardEx>\n )\n}\n"],"mappings":"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","names":["jsx","Card","CardContent","jsx","to","href","IconButton","jsx","jsxs","IconButton","ArrowForwardRoundedIcon","CardActions","CardContent","CardMedia","IconButton","Typography","useTheme","FlexGrowCol","alphaCss","useIsSmall","useState","useNavigate","jsx","jsxs","useTheme","useState","useNavigate","useIsSmall","to","href","alphaCss","CardMedia","CardContent","Typography","CardActions","FlexGrowCol","IconButton","ArrowForwardRoundedIcon"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@xyo-network/react-card",
-  "version": "7.6.2",
+  "version": "8.0.0",
   "description": "Common React library for all XYO projects that use React",
   "keywords": [
     "xyo",
@@ -41,36 +41,36 @@
     "README.md"
   ],
   "dependencies": {
-    "@xyo-network/react-shared": "~7.6.2"
+    "@xyo-network/react-shared": "~8.0.0"
   },
   "devDependencies": {
     "@bitauth/libauth": "~3.0.0",
-    "@mui/icons-material": "^7.3.10",
-    "@mui/material": "^7.3.10",
+    "@mui/icons-material": "~9.0",
+    "@mui/material": "~9.0",
     "@opentelemetry/api": "^1.9.1",
     "@opentelemetry/sdk-trace-base": "^2.7.1",
     "@react-spring/web": "~10.0.3",
     "@scure/base": "~2.2.0",
     "@storybook/react-vite": "~10.3.6",
     "@types/react": "^19.2.14",
-    "@xylabs/pixel": "~5.1.1",
-    "@xylabs/react-button": "~7.2.3",
-    "@xylabs/react-flexbox": "~7.2.3",
-    "@xylabs/react-hooks": "~7.2.3",
-    "@xylabs/react-link": "~7.2.3",
-    "@xylabs/react-promise": "~7.2.3",
-    "@xylabs/react-shared": "~7.2.3",
-    "@xylabs/react-theme": "~7.2.3",
-    "@xylabs/sdk-js": "^5.1.1",
-    "@xylabs/threads": "~5.1.1",
-    "@xylabs/toolchain": "~7.13.7",
-    "@xylabs/tsconfig": "^7.13.7",
-    "@xylabs/tsconfig-dom": "^7.13.7",
-    "@xylabs/tsconfig-react": "~7.13.7",
-    "@xyo-network/boundwitness-model": "^5.6.2",
-    "@xyo-network/boundwitness-validator": "^5.6.1",
-    "@xyo-network/payload-builder": "^5.6.1",
-    "@xyo-network/payload-model": "^5.6.2",
+    "@xylabs/pixel": "~5.1.2",
+    "@xylabs/react-button": "~8.0",
+    "@xylabs/react-flexbox": "~8.0",
+    "@xylabs/react-hooks": "~8.0",
+    "@xylabs/react-link": "~8.0",
+    "@xylabs/react-promise": "~8.0",
+    "@xylabs/react-shared": "~8.0",
+    "@xylabs/react-theme": "~8.0",
+    "@xylabs/sdk-js": "^5.1.2",
+    "@xylabs/threads": "~5.1.2",
+    "@xylabs/toolchain": "~7.13.22",
+    "@xylabs/tsconfig": "^7.13.22",
+    "@xylabs/tsconfig-dom": "^7.13.22",
+    "@xylabs/tsconfig-react": "~7.13.22",
+    "@xyo-network/boundwitness-model": "^5.6.3",
+    "@xyo-network/boundwitness-validator": "^5.6.2",
+    "@xyo-network/payload-builder": "^5.6.2",
+    "@xyo-network/payload-model": "^5.6.3",
     "async-mutex": "^0.5.0",
     "bn.js": "^5.2.3",
     "bowser": "^2.14.1",
@@ -86,63 +86,63 @@
     "observable-fns": "~0.6.1",
     "pako": "^2.1.0",
     "query-string": "~9.3.1",
-    "react": "^19.2.5",
-    "react-dom": "^19.2.5",
-    "react-is": "^19.2.5",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
+    "react-is": "^19.2.6",
     "react-router-dom": "^7.15.0",
     "recharts": "~3.8.1",
     "spark-md5": "~3.0.2",
     "storybook": "^10.3.6",
     "typescript": "^5.9.3",
-    "vite": "^8.0.10",
+    "vite": "^8.0.11",
     "wasm-feature-detect": "~1.8.0",
     "zod": "^4.4.3",
-    "@xyo-network/react-storybook": "~7.6.2"
+    "@xyo-network/react-storybook": "~8.0.0"
   },
   "peerDependencies": {
-    "@bitauth/libauth": ">=3.0.0 <3.1",
-    "@mui/icons-material": ">=7.3.10 <8",
-    "@mui/material": ">=7.3.10 <8",
-    "@opentelemetry/api": ">=1.9.1 <2",
-    "@opentelemetry/sdk-trace-base": ">=2.7.1 <3",
-    "@react-spring/web": ">=10.0.3 <10.1",
-    "@scure/base": ">=2.2.0 <2.3",
-    "@xylabs/pixel": ">=5.1.1 <5.2",
-    "@xylabs/react-button": ">=7.2.3 <7.3",
-    "@xylabs/react-flexbox": ">=7.2.3 <7.3",
-    "@xylabs/react-hooks": ">=7.2.3 <7.3",
-    "@xylabs/react-link": ">=7.2.3 <7.3",
-    "@xylabs/react-promise": ">=7.2.3 <7.3",
-    "@xylabs/react-shared": ">=7.2.3 <7.3",
-    "@xylabs/react-theme": ">=7.2.3 <7.3",
-    "@xylabs/sdk-js": ">=5.1.1 <6",
-    "@xylabs/threads": ">=5.1.1 <5.2",
-    "@xyo-network/boundwitness-model": ">=5.6.2 <6",
-    "@xyo-network/boundwitness-validator": ">=5.6.1 <6",
-    "@xyo-network/payload-builder": ">=5.6.1 <6",
-    "@xyo-network/payload-model": ">=5.6.2 <6",
-    "async-mutex": ">=0.5.0 <1",
-    "bn.js": ">=5.2.3 <6",
-    "bowser": ">=2.14.1 <3",
-    "buffer": ">=6.0.3 <7",
-    "chalk": ">=5.6.2 <6",
-    "debug": ">=4.4.3 <4.5",
-    "ethers": ">=6.16.0 <7",
-    "fast-deep-equal": ">=3.1.3 <3.2",
-    "hash-wasm": ">=4.12.0 <4.13",
-    "js-cookie": ">=3.0.5 <3.1",
-    "mixpanel-browser": ">=2.78.0 <2.79",
-    "observable-fns": ">=0.6.1 <0.7",
-    "pako": ">=2.1.0 <3",
-    "query-string": ">=9.3.1 <9.4",
-    "react": ">=19.2.5 <20",
-    "react-dom": ">=19.2.5 <20",
-    "react-is": ">=19.2.5 <20",
-    "react-router-dom": ">=7.15.0 <8",
-    "recharts": ">=3.8.1 <3.9",
-    "spark-md5": ">=3.0.2 <3.1",
-    "wasm-feature-detect": ">=1.8.0 <1.9",
-    "zod": ">=4.4.3 <5"
+    "@bitauth/libauth": "~3.0",
+    "@mui/icons-material": "~9.0",
+    "@mui/material": "~9.0",
+    "@opentelemetry/api": "^1.9",
+    "@opentelemetry/sdk-trace-base": "^2.7",
+    "@react-spring/web": "~10.0",
+    "@scure/base": "~2.2",
+    "@xylabs/pixel": "~5.1",
+    "@xylabs/react-button": "~8.0",
+    "@xylabs/react-flexbox": "~8.0",
+    "@xylabs/react-hooks": "~8.0",
+    "@xylabs/react-link": "~8.0",
+    "@xylabs/react-promise": "~8.0",
+    "@xylabs/react-shared": "~8.0",
+    "@xylabs/react-theme": "~8.0",
+    "@xylabs/sdk-js": "^5.1",
+    "@xylabs/threads": "~5.1",
+    "@xyo-network/boundwitness-model": "^5.6",
+    "@xyo-network/boundwitness-validator": "^5.6",
+    "@xyo-network/payload-builder": "^5.6",
+    "@xyo-network/payload-model": "^5.6",
+    "async-mutex": "^0.5",
+    "bn.js": "^5.2",
+    "bowser": "^2.14",
+    "buffer": "^6.0",
+    "chalk": "^5.6",
+    "debug": "~4.4",
+    "ethers": "^6.16",
+    "fast-deep-equal": "~3.1",
+    "hash-wasm": "~4.12",
+    "js-cookie": "~3.0",
+    "mixpanel-browser": "~2.78",
+    "observable-fns": "~0.6",
+    "pako": "^2.1",
+    "query-string": "~9.3",
+    "react": "^19.2",
+    "react-dom": "^19.2",
+    "react-is": "^19.2",
+    "react-router-dom": "^7.15",
+    "recharts": "~3.8",
+    "spark-md5": "~3.0",
+    "wasm-feature-detect": "~1.8",
+    "zod": "^4.4"
   },
   "publishConfig": {
     "access": "public"