@xyo-network/react-card 2.78.0 → 2.78.1

package/dist/neutral/index.js

@@ -1,2 +1,225 @@
-import{CardContent as S,styled as G}from"@mui/material";import{useShareForwardedRef as W}from"@xyo-network/react-shared";import{forwardRef as H,useEffect as z}from"react";import{jsx as D}from"react/jsx-runtime";var L=G(S,{name:"CardContentEx",shouldForwardProp:t=>!["variant","removePadding"].includes(t),slot:"Root"})(({variant:t,removePadding:r})=>({...(t==="scrollable"||r)&&{":last-child":{paddingBottom:0},overflow:"auto",paddingTop:0,...r&&{padding:0}}})),T=H(({scrollToTop:t=0,refreshRef:r=0,...o},i)=>{let e=W(i,r);return z(()=>{e&&t&&e.current?.scroll({behavior:"smooth",top:0})},[e,t]),D(L,{ref:e,...o})});T.displayName="CardContentEx";var To=T;import{Card as Z}from"@mui/material";import{useGradientStyles as X}from"@xyo-network/react-shared";import{forwardRef as Y}from"react";import{jsx as q}from"react/jsx-runtime";var w=Y(({style:t,gradient:r,...o},i)=>{let{styles:e}=X(),d=r==="border"?e.border:r==="background"?e.background:{};return q(Z,{style:{...d,...t},ref:i,...o})});w.displayName="CardEx";var y=w;import{ArrowForwardRounded as F}from"@mui/icons-material";import{alpha as J,Card as K,CardActions as O,CardContent as Q,CardMedia as U,Grid as b,IconButton as I,Typography as M,useTheme as _,Zoom as $}from"@mui/material";import{FlexGrowCol as V}from"@xylabs/react-flexbox";import{useIsMobile as j}from"@xyo-network/react-shared";import{useState as oo}from"react";import{useNavigate as eo}from"react-router-dom";import{jsx as n,jsxs as k}from"react/jsx-runtime";var Yo=({cardIsButton:t,desc:r,href:o,media:i,name:e,small:d,to:a,...c})=>{let R=_(),[u,h]=oo(!1),p=eo(),C=j(),g=m=>{p(m||"/404")},s=m=>{m?window.open(m):p("/404")};return k(K,{elevation:u?3:0,style:{height:"100%",width:"100%"},...c,sx:{"&:hover":{cursor:"pointer"},backgroundColor:J(R.palette.primary.light,.05)},onMouseEnter:()=>C?null:t?h(!0):null,onMouseLeave:()=>C?null:t?h(!1):null,onClick:()=>t?o?s(o):a?g(a):p("/404"):null,children:[i?n(U,{component:"img",height:"100",image:i,alt:""}):null,n(Q,{children:k(b,{container:!0,alignItems:"center",paddingY:2,paddingX:2,children:[n(b,{item:!0,xs:12,md:6,children:typeof e=="string"?n(M,{fontWeight:700,variant:"h2",textAlign:"left",paddingBottom:1,children:e}):e}),n(b,{item:!0,xs:12,md:5,children:n(M,{variant:"body1",fontWeight:400,textAlign:"left",children:r})}),n(b,{item:!0,xs:1,display:C?"none":"flex",justifyContent:"center",children:n($,{in:u,children:n(I,{color:"primary",size:d?"small":"medium",onClick:()=>o?s(o):a?g(a):p("/404"),disableFocusRipple:!0,disableRipple:!0,disableTouchRipple:!0,children:n(F,{fontSize:d?"small":"medium"})})})})]})}),n(O,{sx:{display:{md:C?"flex":"none"}},children:n(V,{alignItems:"flex-end",children:n(I,{color:"primary",size:d?"small":"medium",onClick:()=>o?s(o):a?g(a):p("/404"),disableFocusRipple:!0,disableRipple:!0,disableTouchRipple:!0,children:n(F,{fontSize:d?"small":"medium"})})})})]})};import{Refresh as to}from"@mui/icons-material";import{CardHeader as ro,IconButton as no}from"@mui/material";import{TypographyEx as A}from"@xyo-network/react-shared";import{forwardRef as ao}from"react";import{Fragment as io,jsx as f,jsxs as lo}from"react/jsx-runtime";var B=ao(({subheader:t,title:r,onRefresh:o,children:i,action:e,style:d,...a},c)=>lo(y,{style:{backgroundColor:"transparent",position:"relative",...d},elevation:0,ref:c,...a,children:[f(ro,{title:f(A,{variant:"h5",gutterBottom:!0,children:r}),subheader:f(A,{variant:"subtitle1",children:t}),action:e??f(io,{children:o?f(no,{onClick:()=>o?.(),children:f(to,{})}):null})}),i]}));B.displayName="PageCard";var oe=B;import{ArrowForwardRounded as so}from"@mui/icons-material";import{alpha as po,CardActions as mo,CardContent as uo,CardMedia as Co,IconButton as co,Typography as E,useTheme as go}from"@mui/material";import{FlexCol as fo,FlexGrowCol as xo}from"@xylabs/react-flexbox";import{useIsMobile as ho}from"@xyo-network/react-shared";import{useState as yo}from"react";import{useNavigate as bo}from"react-router-dom";import{jsx as l,jsxs as N}from"react/jsx-runtime";var Ce=({desc:t,iconImage:r,interactionVariant:o="card",headline:i,href:e,media:d,small:a,subtitle:c,sx:R,to:u,...h})=>{let p=go(),[C,g]=yo(!1),s=bo(),m=ho(),P=x=>{s(x||"/404")},v=x=>{x?window.open(x):s("/404")};return N(y,{elevation:C?3:0,sx:{"&:hover":{cursor:o=="button"?"pointer":null},backgroundColor:po(p.palette.primary.light,.05),...R},onMouseEnter:()=>m?null:o=="button"?g(!0):null,onMouseLeave:()=>m?null:o=="button"?g(!1):null,onClick:()=>o=="button"?e?v(e):u?P(u):s("/404"):null,...h,children:[d?l(Co,{component:"img",height:"100",image:d,alt:""}):null,l(uo,{sx:{height:"100%"},children:N(fo,{width:"100%",alignItems:"flex-start",children:[r?l("img",{src:r,height:"40px",style:{paddingBottom:"8px"}}):null,typeof i=="string"?l(E,{variant:a?"body1":"h6",textAlign:"left",gutterBottom:!0,children:i}):i,c?l(E,{variant:"subtitle2",textAlign:"left",gutterBottom:!0,children:c}):null,l(E,{variant:a?"caption":"body1",textAlign:"left",gutterBottom:!0,children:t})]})}),o=="button"?l(mo,{children:l(xo,{alignItems:"flex-end",children:l(co,{color:C?"secondary":"primary",size:a?"small":"medium",onClick:()=>e?v(e):u?P(u):s("/404"),disableFocusRipple:!0,disableRipple:!0,disableTouchRipple:!0,children:l(so,{fontSize:a?"small":"medium"})})})}):null]})};export{To as CardContentEx,T as CardContentExWithRef,y as CardEx,w as CardExWithRef,Yo as FullWidthCard,oe as PageCard,Ce as SimpleCard};
+// src/components/CardContentEx.tsx
+import { CardContent, styled } from "@mui/material";
+import { useShareForwardedRef } from "@xyo-network/react-shared";
+import { forwardRef, useEffect } from "react";
+import { jsx } from "react/jsx-runtime";
+var CardContentExRoot = styled(CardContent, {
+  name: "CardContentEx",
+  shouldForwardProp: (prop) => !["variant", "removePadding"].includes(prop),
+  slot: "Root"
+})(({ variant, removePadding }) => ({
+  ...(variant === "scrollable" || removePadding) && {
+    [":last-child"]: {
+      paddingBottom: 0
+    },
+    overflow: "auto",
+    paddingTop: 0,
+    ...removePadding && { padding: 0 }
+  }
+}));
+var CardContentExWithRef = forwardRef(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {
+  const sharedRef = useShareForwardedRef(ref, refreshRef);
+  useEffect(() => {
+    if (sharedRef && scrollToTop) {
+      sharedRef.current?.scroll({ behavior: "smooth", top: 0 });
+    }
+  }, [sharedRef, scrollToTop]);
+  return /* @__PURE__ */ jsx(CardContentExRoot, { ref: sharedRef, ...props });
+});
+CardContentExWithRef.displayName = "CardContentEx";
+var CardContentEx = CardContentExWithRef;
+
+// src/components/CardEx.tsx
+import { Card } from "@mui/material";
+import { useGradientStyles } from "@xyo-network/react-shared";
+import { forwardRef as forwardRef2 } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var CardExWithRef = forwardRef2(({ style, gradient, ...props }, ref) => {
+  const { styles } = useGradientStyles();
+  const gradientStyle = gradient === "border" ? styles.border : gradient === "background" ? styles.background : {};
+  return /* @__PURE__ */ jsx2(
+    Card,
+    {
+      style: {
+        ...gradientStyle,
+        ...style
+      },
+      ref,
+      ...props
+    }
+  );
+});
+CardExWithRef.displayName = "CardEx";
+var CardEx = CardExWithRef;
+
+// src/components/FullWidthCard/FullWidthCard.tsx
+import { ArrowForwardRounded as ArrowForwardRoundedIcon } from "@mui/icons-material";
+import { alpha, Card as Card2, CardActions, CardContent as CardContent2, CardMedia, Grid, IconButton, Typography, useTheme, Zoom } from "@mui/material";
+import { FlexGrowCol } from "@xylabs/react-flexbox";
+import { useIsMobile } from "@xyo-network/react-shared";
+import { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
+var FullWidthCard = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {
+  const theme = useTheme();
+  const [raised, setRaised] = useState(false);
+  const navigate = useNavigate();
+  const isMobile = useIsMobile();
+  const localRouteChange = (to2) => {
+    to2 ? navigate(to2) : navigate("/404");
+  };
+  const externalRouteChange = (href2) => {
+    href2 ? window.open(href2) : navigate("/404");
+  };
+  return /* @__PURE__ */ jsxs(
+    Card2,
+    {
+      elevation: raised ? 3 : 0,
+      style: { height: "100%", width: "100%" },
+      ...props,
+      sx: {
+        "&:hover": {
+          cursor: "pointer"
+        },
+        backgroundColor: alpha(theme.palette.primary.light, 0.05)
+      },
+      onMouseEnter: () => isMobile ? null : cardIsButton ? setRaised(true) : null,
+      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, { item: true, 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, { item: true, xs: 12, md: 5, children: /* @__PURE__ */ jsx3(Typography, { variant: "body1", fontWeight: 400, textAlign: "left", children: desc }) }),
+          /* @__PURE__ */ jsx3(Grid, { item: true, 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(
+          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" })
+          }
+        ) }) })
+      ]
+    }
+  );
+};
+
+// src/components/PageCard.tsx
+import { Refresh as RefreshIcon } from "@mui/icons-material";
+import { CardHeader, IconButton as IconButton2 } from "@mui/material";
+import { TypographyEx } from "@xyo-network/react-shared";
+import { forwardRef as forwardRef3 } from "react";
+import { Fragment, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+var PageCardWithRef = forwardRef3(({ subheader, title, onRefresh, children, action, style, ...props }, ref) => {
+  return /* @__PURE__ */ jsxs2(CardEx, { style: { backgroundColor: "transparent", position: "relative", ...style }, elevation: 0, ref, ...props, children: [
+    /* @__PURE__ */ jsx4(
+      CardHeader,
+      {
+        title: /* @__PURE__ */ jsx4(TypographyEx, { variant: "h5", gutterBottom: true, children: title }),
+        subheader: /* @__PURE__ */ jsx4(TypographyEx, { variant: "subtitle1", children: subheader }),
+        action: action ?? /* @__PURE__ */ jsx4(Fragment, { children: onRefresh ? /* @__PURE__ */ jsx4(IconButton2, { onClick: () => onRefresh?.(), children: /* @__PURE__ */ jsx4(RefreshIcon, {}) }) : null })
+      }
+    ),
+    children
+  ] });
+});
+PageCardWithRef.displayName = "PageCard";
+var PageCard = PageCardWithRef;
+
+// src/components/SimpleCard/SimpleCard.tsx
+import { ArrowForwardRounded as ArrowForwardRoundedIcon2 } from "@mui/icons-material";
+import { alpha as alpha2, CardActions as CardActions2, CardContent as CardContent3, CardMedia as CardMedia2, IconButton as IconButton3, Typography as Typography2, useTheme as useTheme2 } from "@mui/material";
+import { FlexCol, FlexGrowCol as FlexGrowCol2 } from "@xylabs/react-flexbox";
+import { useIsMobile as useIsMobile2 } from "@xyo-network/react-shared";
+import { useState as useState2 } from "react";
+import { useNavigate as useNavigate2 } from "react-router-dom";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+var SimpleCard = ({
+  desc,
+  iconImage,
+  interactionVariant = "card",
+  headline,
+  href,
+  media,
+  small,
+  subtitle,
+  sx,
+  to,
+  ...props
+}) => {
+  const theme = useTheme2();
+  const [raised, setRaised] = useState2(false);
+  const navigate = useNavigate2();
+  const isMobile = useIsMobile2();
+  const localRouteChange = (to2) => {
+    to2 ? navigate(to2) : navigate("/404");
+  };
+  const externalRouteChange = (href2) => {
+    href2 ? window.open(href2) : navigate("/404");
+  };
+  return /* @__PURE__ */ jsxs3(
+    CardEx,
+    {
+      elevation: raised ? 3 : 0,
+      sx: {
+        "&:hover": {
+          cursor: interactionVariant == "button" ? "pointer" : null
+        },
+        backgroundColor: alpha2(theme.palette.primary.light, 0.05),
+        ...sx
+      },
+      onMouseEnter: () => isMobile ? null : interactionVariant == "button" ? setRaised(true) : null,
+      onMouseLeave: () => isMobile ? null : interactionVariant == "button" ? setRaised(false) : null,
+      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 })
+        ] }) }),
+        interactionVariant == "button" ? /* @__PURE__ */ jsx5(CardActions2, { children: /* @__PURE__ */ jsx5(FlexGrowCol2, { 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" })
+          }
+        ) }) }) : null
+      ]
+    }
+  );
+};
+export {
+  CardContentEx,
+  CardContentExWithRef,
+  CardEx,
+  CardExWithRef,
+  FullWidthCard,
+  PageCard,
+  SimpleCard
+};
 //# sourceMappingURL=index.js.map

package/dist/neutral/index.js.map

@@ -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 { CardContent, CardContentProps, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, 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']: {\n      paddingBottom: 0,\n    },\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 = forwardRef<HTMLDivElement | null, CardContentExProps>(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {\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 { Card, CardProps } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport interface CardExProps extends CardProps {\n  gradient?: 'border' | 'background'\n}\n\nexport const CardExWithRef = forwardRef<HTMLDivElement, CardExProps>(({ style, gradient, ...props }, ref) => {\n  const { styles } = useGradientStyles()\n  const gradientStyle =\n    gradient === 'border' ? styles.border\n    : gradient === 'background' ? 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 { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, 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> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n  const theme = useTheme()\n  const [raised, setRaised] = useState(false)\n  const navigate = useNavigate()\n  const isMobile = useIsMobile()\n\n  const localRouteChange = (to: To | undefined) => {\n    to ? navigate(to) : navigate('/404')\n  }\n  const externalRouteChange = (href: string | undefined) => {\n    href ? window.open(href) : 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': {\n          cursor: 'pointer',\n        },\n        backgroundColor: alpha(theme.palette.primary.light, 0.05),\n      }}\n      onMouseEnter={() =>\n        isMobile ? null\n        : cardIsButton ? setRaised(true)\n        : null\n      }\n      onMouseLeave={() =>\n        isMobile ? null\n        : cardIsButton ? setRaised(false)\n        : null\n      }\n      onClick={() =>\n        cardIsButton ?\n          href ? externalRouteChange(href)\n          : to ? localRouteChange(to)\n          : navigate('/404')\n        : null\n      }\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 item xs={12} md={6}>\n            {typeof name === 'string' ?\n              <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n                {name}\n              </Typography>\n            : name}\n          </Grid>\n          <Grid item xs={12} md={5}>\n            <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n              {desc}\n            </Typography>\n          </Grid>\n          <Grid item 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 ? externalRouteChange(href)\n                  : to ? localRouteChange(to)\n                  : navigate('/404')\n                }\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 ? externalRouteChange(href)\n              : to ? localRouteChange(to)\n              : navigate('/404')\n            }\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 { CardHeader, CardHeaderProps, IconButton } from '@mui/material'\nimport { TypographyEx } from '@xyo-network/react-shared'\nimport { forwardRef, ReactNode } from 'react'\n\nimport { CardEx, CardExProps } from './CardEx'\n\nexport interface PageCardProps extends CardExProps {\n  action?: ReactNode\n  onRefresh?: () => void\n  subheader?: CardHeaderProps['subheader']\n}\n\nconst PageCardWithRef = forwardRef<HTMLDivElement, PageCardProps>(({ subheader, title, onRefresh, children, action, style, ...props }, ref) => {\n  return (\n    <CardEx style={{ backgroundColor: 'transparent', position: 'relative', ...style }} elevation={0} ref={ref} {...props}>\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                <IconButton onClick={() => onRefresh?.()}>\n                  <RefreshIcon />\n                </IconButton>\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 { alpha, CardActions, CardContent, CardMedia, IconButton, Typography, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nimport { CardEx, CardExProps } from '../CardEx'\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  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 isMobile = useIsMobile()\n  const localRouteChange = (to: To | undefined) => {\n    to ? navigate(to) : navigate('/404')\n  }\n  const externalRouteChange = (href: string | undefined) => {\n    href ? window.open(href) : navigate('/404')\n  }\n  return (\n    <CardEx\n      elevation={raised ? 3 : 0}\n      sx={{\n        '&:hover': {\n          cursor: interactionVariant == 'button' ? 'pointer' : null,\n        },\n        backgroundColor: alpha(theme.palette.primary.light, 0.05),\n        ...sx,\n      }}\n      onMouseEnter={() =>\n        isMobile ? null\n        : interactionVariant == 'button' ? setRaised(true)\n        : null\n      }\n      onMouseLeave={() =>\n        isMobile ? null\n        : interactionVariant == 'button' ? setRaised(false)\n        : null\n      }\n      onClick={() =>\n        interactionVariant == 'button' ?\n          href ? externalRouteChange(href)\n          : to ? localRouteChange(to)\n          : navigate('/404')\n        : null\n      }\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            <Typography variant={small ? 'body1' : 'h6'} textAlign=\"left\" gutterBottom>\n              {headline}\n            </Typography>\n          : headline}\n          {subtitle ?\n            <Typography variant=\"subtitle2\" textAlign=\"left\" gutterBottom>\n              {subtitle}\n            </Typography>\n          : null}\n          <Typography variant={small ? 'caption' : 'body1'} textAlign=\"left\" gutterBottom>\n            {desc}\n          </Typography>\n        </FlexCol>\n      </CardContent>\n      {interactionVariant == 'button' ?\n        <CardActions>\n          <FlexGrowCol alignItems=\"flex-end\">\n            <IconButton\n              color={raised ? 'secondary' : 'primary'}\n              size={small ? 'small' : 'medium'}\n              onClick={() =>\n                href ? externalRouteChange(href)\n                : to ? localRouteChange(to)\n                : navigate('/404')\n              }\n              disableFocusRipple\n              disableRipple\n              disableTouchRipple\n            >\n              <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n            </IconButton>\n          </FlexGrowCol>\n        </CardActions>\n      : null}\n    </CardEx>\n  )\n}\n"],"mappings":"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","names":["CardContent","styled","useShareForwardedRef","forwardRef","useEffect","jsx","CardContentExRoot","prop","variant","removePadding","CardContentExWithRef","scrollToTop","refreshRef","props","ref","sharedRef","CardContentEx","Card","useGradientStyles","forwardRef","jsx","CardExWithRef","style","gradient","props","ref","styles","gradientStyle","CardEx","ArrowForwardRoundedIcon","alpha","Card","CardActions","CardContent","CardMedia","Grid","IconButton","Typography","useTheme","Zoom","FlexGrowCol","useIsMobile","useState","useNavigate","jsx","jsxs","FullWidthCard","cardIsButton","desc","href","media","name","small","to","props","theme","raised","setRaised","navigate","isMobile","localRouteChange","externalRouteChange","RefreshIcon","CardHeader","IconButton","TypographyEx","forwardRef","Fragment","jsx","jsxs","PageCardWithRef","forwardRef","subheader","title","onRefresh","children","action","style","props","ref","CardEx","CardHeader","TypographyEx","IconButton","RefreshIcon","PageCard","ArrowForwardRoundedIcon","alpha","CardActions","CardContent","CardMedia","IconButton","Typography","useTheme","FlexCol","FlexGrowCol","useIsMobile","useState","useNavigate","jsx","jsxs","SimpleCard","desc","iconImage","interactionVariant","headline","href","media","small","subtitle","sx","to","props","theme","useTheme","raised","setRaised","useState","navigate","useNavigate","isMobile","useIsMobile","localRouteChange","externalRouteChange","CardEx","alpha","CardMedia","CardContent","FlexCol","Typography","CardActions","FlexGrowCol","IconButton","ArrowForwardRoundedIcon"]}
+{"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 { CardContent, CardContentProps, styled } from '@mui/material'\nimport { useShareForwardedRef } from '@xyo-network/react-shared'\nimport { forwardRef, 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']: {\n      paddingBottom: 0,\n    },\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 = forwardRef<HTMLDivElement | null, CardContentExProps>(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {\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 { Card, CardProps } from '@mui/material'\nimport { useGradientStyles } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport interface CardExProps extends CardProps {\n  gradient?: 'border' | 'background'\n}\n\nexport const CardExWithRef = forwardRef<HTMLDivElement, CardExProps>(({ style, gradient, ...props }, ref) => {\n  const { styles } = useGradientStyles()\n  const gradientStyle =\n    gradient === 'border' ? styles.border\n    : gradient === 'background' ? 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 { alpha, Card, CardActions, CardContent, CardMedia, CardProps, Grid, IconButton, Typography, useTheme, Zoom } from '@mui/material'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, 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> = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {\n  const theme = useTheme()\n  const [raised, setRaised] = useState(false)\n  const navigate = useNavigate()\n  const isMobile = useIsMobile()\n\n  const localRouteChange = (to: To | undefined) => {\n    to ? navigate(to) : navigate('/404')\n  }\n  const externalRouteChange = (href: string | undefined) => {\n    href ? window.open(href) : 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': {\n          cursor: 'pointer',\n        },\n        backgroundColor: alpha(theme.palette.primary.light, 0.05),\n      }}\n      onMouseEnter={() =>\n        isMobile ? null\n        : cardIsButton ? setRaised(true)\n        : null\n      }\n      onMouseLeave={() =>\n        isMobile ? null\n        : cardIsButton ? setRaised(false)\n        : null\n      }\n      onClick={() =>\n        cardIsButton ?\n          href ? externalRouteChange(href)\n          : to ? localRouteChange(to)\n          : navigate('/404')\n        : null\n      }\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 item xs={12} md={6}>\n            {typeof name === 'string' ?\n              <Typography fontWeight={700} variant=\"h2\" textAlign=\"left\" paddingBottom={1}>\n                {name}\n              </Typography>\n            : name}\n          </Grid>\n          <Grid item xs={12} md={5}>\n            <Typography variant=\"body1\" fontWeight={400} textAlign=\"left\">\n              {desc}\n            </Typography>\n          </Grid>\n          <Grid item 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 ? externalRouteChange(href)\n                  : to ? localRouteChange(to)\n                  : navigate('/404')\n                }\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 ? externalRouteChange(href)\n              : to ? localRouteChange(to)\n              : navigate('/404')\n            }\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 { CardHeader, CardHeaderProps, IconButton } from '@mui/material'\nimport { TypographyEx } from '@xyo-network/react-shared'\nimport { forwardRef, ReactNode } from 'react'\n\nimport { CardEx, CardExProps } from './CardEx'\n\nexport interface PageCardProps extends CardExProps {\n  action?: ReactNode\n  onRefresh?: () => void\n  subheader?: CardHeaderProps['subheader']\n}\n\nconst PageCardWithRef = forwardRef<HTMLDivElement, PageCardProps>(({ subheader, title, onRefresh, children, action, style, ...props }, ref) => {\n  return (\n    <CardEx style={{ backgroundColor: 'transparent', position: 'relative', ...style }} elevation={0} ref={ref} {...props}>\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                <IconButton onClick={() => onRefresh?.()}>\n                  <RefreshIcon />\n                </IconButton>\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 { alpha, CardActions, CardContent, CardMedia, IconButton, Typography, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useIsMobile } from '@xyo-network/react-shared'\nimport { ReactNode, useState } from 'react'\nimport { To, useNavigate } from 'react-router-dom'\n\nimport { CardEx, CardExProps } from '../CardEx'\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  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 isMobile = useIsMobile()\n  const localRouteChange = (to: To | undefined) => {\n    to ? navigate(to) : navigate('/404')\n  }\n  const externalRouteChange = (href: string | undefined) => {\n    href ? window.open(href) : navigate('/404')\n  }\n  return (\n    <CardEx\n      elevation={raised ? 3 : 0}\n      sx={{\n        '&:hover': {\n          cursor: interactionVariant == 'button' ? 'pointer' : null,\n        },\n        backgroundColor: alpha(theme.palette.primary.light, 0.05),\n        ...sx,\n      }}\n      onMouseEnter={() =>\n        isMobile ? null\n        : interactionVariant == 'button' ? setRaised(true)\n        : null\n      }\n      onMouseLeave={() =>\n        isMobile ? null\n        : interactionVariant == 'button' ? setRaised(false)\n        : null\n      }\n      onClick={() =>\n        interactionVariant == 'button' ?\n          href ? externalRouteChange(href)\n          : to ? localRouteChange(to)\n          : navigate('/404')\n        : null\n      }\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            <Typography variant={small ? 'body1' : 'h6'} textAlign=\"left\" gutterBottom>\n              {headline}\n            </Typography>\n          : headline}\n          {subtitle ?\n            <Typography variant=\"subtitle2\" textAlign=\"left\" gutterBottom>\n              {subtitle}\n            </Typography>\n          : null}\n          <Typography variant={small ? 'caption' : 'body1'} textAlign=\"left\" gutterBottom>\n            {desc}\n          </Typography>\n        </FlexCol>\n      </CardContent>\n      {interactionVariant == 'button' ?\n        <CardActions>\n          <FlexGrowCol alignItems=\"flex-end\">\n            <IconButton\n              color={raised ? 'secondary' : 'primary'}\n              size={small ? 'small' : 'medium'}\n              onClick={() =>\n                href ? externalRouteChange(href)\n                : to ? localRouteChange(to)\n                : navigate('/404')\n              }\n              disableFocusRipple\n              disableRipple\n              disableTouchRipple\n            >\n              <ArrowForwardRoundedIcon fontSize={small ? 'small' : 'medium'} />\n            </IconButton>\n          </FlexGrowCol>\n        </CardActions>\n      : null}\n    </CardEx>\n  )\n}\n"],"mappings":"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","names":["forwardRef","jsx","Card","CardContent","jsx","to","href","IconButton","forwardRef","jsx","jsxs","forwardRef","IconButton","ArrowForwardRoundedIcon","alpha","CardActions","CardContent","CardMedia","IconButton","Typography","useTheme","FlexGrowCol","useIsMobile","useState","useNavigate","jsx","jsxs","useTheme","useState","useNavigate","useIsMobile","to","href","alpha","CardMedia","CardContent","Typography","CardActions","FlexGrowCol","IconButton","ArrowForwardRoundedIcon"]}

package/dist/node/index.cjs

@@ -1,2 +1,259 @@
-"use strict";var F=Object.defineProperty;var $=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var j=Object.prototype.hasOwnProperty;var oo=(t,r)=>{for(var o in r)F(t,o,{get:r[o],enumerable:!0})},eo=(t,r,o,d)=>{if(r&&typeof r=="object"||typeof r=="function")for(let n of V(r))!j.call(t,n)&&n!==o&&F(t,n,{get:()=>r[n],enumerable:!(d=$(r,n))||d.enumerable});return t};var to=t=>eo(F({},"__esModule",{value:!0}),t);var so={};oo(so,{CardContentEx:()=>no,CardContentExWithRef:()=>I,CardEx:()=>b,CardExWithRef:()=>M,FullWidthCard:()=>ao,PageCard:()=>io,SimpleCard:()=>lo});module.exports=to(so);var E=require("@mui/material"),S=require("@xyo-network/react-shared"),P=require("react"),G=require("react/jsx-runtime"),ro=(0,E.styled)(E.CardContent,{name:"CardContentEx",shouldForwardProp:t=>!["variant","removePadding"].includes(t),slot:"Root"})(({variant:t,removePadding:r})=>({...(t==="scrollable"||r)&&{":last-child":{paddingBottom:0},overflow:"auto",paddingTop:0,...r&&{padding:0}}})),I=(0,P.forwardRef)(({scrollToTop:t=0,refreshRef:r=0,...o},d)=>{let n=(0,S.useShareForwardedRef)(d,r);return(0,P.useEffect)(()=>{var l;n&&t&&((l=n.current)==null||l.scroll({behavior:"smooth",top:0}))},[n,t]),(0,G.jsx)(ro,{ref:n,...o})});I.displayName="CardContentEx";var no=I;var W=require("@mui/material"),H=require("@xyo-network/react-shared"),z=require("react"),L=require("react/jsx-runtime"),M=(0,z.forwardRef)(({style:t,gradient:r,...o},d)=>{let{styles:n}=(0,H.useGradientStyles)(),l=r==="border"?n.border:r==="background"?n.background:{};return(0,L.jsx)(W.Card,{style:{...l,...t},ref:d,...o})});M.displayName="CardEx";var b=M;var k=require("@mui/icons-material"),e=require("@mui/material"),D=require("@xylabs/react-flexbox"),Z=require("@xyo-network/react-shared"),X=require("react"),Y=require("react-router-dom"),a=require("react/jsx-runtime"),ao=({cardIsButton:t,desc:r,href:o,media:d,name:n,small:l,to:p,...x})=>{let w=(0,e.useTheme)(),[g,R]=(0,X.useState)(!1),C=(0,Y.useNavigate)(),f=(0,Z.useIsMobile)(),h=c=>{C(c||"/404")},u=c=>{c?window.open(c):C("/404")};return(0,a.jsxs)(e.Card,{elevation:g?3:0,style:{height:"100%",width:"100%"},...x,sx:{"&:hover":{cursor:"pointer"},backgroundColor:(0,e.alpha)(w.palette.primary.light,.05)},onMouseEnter:()=>f?null:t?R(!0):null,onMouseLeave:()=>f?null:t?R(!1):null,onClick:()=>t?o?u(o):p?h(p):C("/404"):null,children:[d?(0,a.jsx)(e.CardMedia,{component:"img",height:"100",image:d,alt:""}):null,(0,a.jsx)(e.CardContent,{children:(0,a.jsxs)(e.Grid,{container:!0,alignItems:"center",paddingY:2,paddingX:2,children:[(0,a.jsx)(e.Grid,{item:!0,xs:12,md:6,children:typeof n=="string"?(0,a.jsx)(e.Typography,{fontWeight:700,variant:"h2",textAlign:"left",paddingBottom:1,children:n}):n}),(0,a.jsx)(e.Grid,{item:!0,xs:12,md:5,children:(0,a.jsx)(e.Typography,{variant:"body1",fontWeight:400,textAlign:"left",children:r})}),(0,a.jsx)(e.Grid,{item:!0,xs:1,display:f?"none":"flex",justifyContent:"center",children:(0,a.jsx)(e.Zoom,{in:g,children:(0,a.jsx)(e.IconButton,{color:"primary",size:l?"small":"medium",onClick:()=>o?u(o):p?h(p):C("/404"),disableFocusRipple:!0,disableRipple:!0,disableTouchRipple:!0,children:(0,a.jsx)(k.ArrowForwardRounded,{fontSize:l?"small":"medium"})})})})]})}),(0,a.jsx)(e.CardActions,{sx:{display:{md:f?"flex":"none"}},children:(0,a.jsx)(D.FlexGrowCol,{alignItems:"flex-end",children:(0,a.jsx)(e.IconButton,{color:"primary",size:l?"small":"medium",onClick:()=>o?u(o):p?h(p):C("/404"),disableFocusRipple:!0,disableRipple:!0,disableTouchRipple:!0,children:(0,a.jsx)(k.ArrowForwardRounded,{fontSize:l?"small":"medium"})})})})]})};var q=require("@mui/icons-material"),v=require("@mui/material"),A=require("@xyo-network/react-shared"),J=require("react");var m=require("react/jsx-runtime"),K=(0,J.forwardRef)(({subheader:t,title:r,onRefresh:o,children:d,action:n,style:l,...p},x)=>(0,m.jsxs)(b,{style:{backgroundColor:"transparent",position:"relative",...l},elevation:0,ref:x,...p,children:[(0,m.jsx)(v.CardHeader,{title:(0,m.jsx)(A.TypographyEx,{variant:"h5",gutterBottom:!0,children:r}),subheader:(0,m.jsx)(A.TypographyEx,{variant:"subtitle1",children:t}),action:n??(0,m.jsx)(m.Fragment,{children:o?(0,m.jsx)(v.IconButton,{onClick:()=>o==null?void 0:o(),children:(0,m.jsx)(q.Refresh,{})}):null})}),d]}));K.displayName="PageCard";var io=K;var O=require("@mui/icons-material"),i=require("@mui/material"),T=require("@xylabs/react-flexbox"),Q=require("@xyo-network/react-shared"),U=require("react"),_=require("react-router-dom");var s=require("react/jsx-runtime"),lo=({desc:t,iconImage:r,interactionVariant:o="card",headline:d,href:n,media:l,small:p,subtitle:x,sx:w,to:g,...R})=>{let C=(0,i.useTheme)(),[f,h]=(0,U.useState)(!1),u=(0,_.useNavigate)(),c=(0,Q.useIsMobile)(),B=y=>{u(y||"/404")},N=y=>{y?window.open(y):u("/404")};return(0,s.jsxs)(b,{elevation:f?3:0,sx:{"&:hover":{cursor:o=="button"?"pointer":null},backgroundColor:(0,i.alpha)(C.palette.primary.light,.05),...w},onMouseEnter:()=>c?null:o=="button"?h(!0):null,onMouseLeave:()=>c?null:o=="button"?h(!1):null,onClick:()=>o=="button"?n?N(n):g?B(g):u("/404"):null,...R,children:[l?(0,s.jsx)(i.CardMedia,{component:"img",height:"100",image:l,alt:""}):null,(0,s.jsx)(i.CardContent,{sx:{height:"100%"},children:(0,s.jsxs)(T.FlexCol,{width:"100%",alignItems:"flex-start",children:[r?(0,s.jsx)("img",{src:r,height:"40px",style:{paddingBottom:"8px"}}):null,typeof d=="string"?(0,s.jsx)(i.Typography,{variant:p?"body1":"h6",textAlign:"left",gutterBottom:!0,children:d}):d,x?(0,s.jsx)(i.Typography,{variant:"subtitle2",textAlign:"left",gutterBottom:!0,children:x}):null,(0,s.jsx)(i.Typography,{variant:p?"caption":"body1",textAlign:"left",gutterBottom:!0,children:t})]})}),o=="button"?(0,s.jsx)(i.CardActions,{children:(0,s.jsx)(T.FlexGrowCol,{alignItems:"flex-end",children:(0,s.jsx)(i.IconButton,{color:f?"secondary":"primary",size:p?"small":"medium",onClick:()=>n?N(n):g?B(g):u("/404"),disableFocusRipple:!0,disableRipple:!0,disableTouchRipple:!0,children:(0,s.jsx)(O.ArrowForwardRounded,{fontSize:p?"small":"medium"})})})}):null]})};0&&(module.exports={CardContentEx,CardContentExWithRef,CardEx,CardExWithRef,FullWidthCard,PageCard,SimpleCard});
+"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, {
+  CardContentEx: () => CardContentEx,
+  CardContentExWithRef: () => CardContentExWithRef,
+  CardEx: () => CardEx,
+  CardExWithRef: () => CardExWithRef,
+  FullWidthCard: () => FullWidthCard,
+  PageCard: () => PageCard,
+  SimpleCard: () => SimpleCard
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/components/CardContentEx.tsx
+var import_material = require("@mui/material");
+var import_react_shared = require("@xyo-network/react-shared");
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var CardContentExRoot = (0, import_material.styled)(import_material.CardContent, {
+  name: "CardContentEx",
+  shouldForwardProp: (prop) => !["variant", "removePadding"].includes(prop),
+  slot: "Root"
+})(({ variant, removePadding }) => ({
+  ...(variant === "scrollable" || removePadding) && {
+    [":last-child"]: {
+      paddingBottom: 0
+    },
+    overflow: "auto",
+    paddingTop: 0,
+    ...removePadding && { padding: 0 }
+  }
+}));
+var CardContentExWithRef = (0, import_react.forwardRef)(({ scrollToTop = 0, refreshRef = 0, ...props }, ref) => {
+  const sharedRef = (0, import_react_shared.useShareForwardedRef)(ref, refreshRef);
+  (0, import_react.useEffect)(() => {
+    var _a;
+    if (sharedRef && scrollToTop) {
+      (_a = sharedRef.current) == null ? void 0 : _a.scroll({ behavior: "smooth", top: 0 });
+    }
+  }, [sharedRef, scrollToTop]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContentExRoot, { ref: sharedRef, ...props });
+});
+CardContentExWithRef.displayName = "CardContentEx";
+var CardContentEx = CardContentExWithRef;
+
+// src/components/CardEx.tsx
+var import_material2 = require("@mui/material");
+var import_react_shared2 = require("@xyo-network/react-shared");
+var import_react2 = require("react");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CardExWithRef = (0, import_react2.forwardRef)(({ style, gradient, ...props }, ref) => {
+  const { styles } = (0, import_react_shared2.useGradientStyles)();
+  const gradientStyle = gradient === "border" ? styles.border : gradient === "background" ? styles.background : {};
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material2.Card,
+    {
+      style: {
+        ...gradientStyle,
+        ...style
+      },
+      ref,
+      ...props
+    }
+  );
+});
+CardExWithRef.displayName = "CardEx";
+var CardEx = CardExWithRef;
+
+// src/components/FullWidthCard/FullWidthCard.tsx
+var import_icons_material = require("@mui/icons-material");
+var import_material3 = require("@mui/material");
+var import_react_flexbox = require("@xylabs/react-flexbox");
+var import_react_shared3 = require("@xyo-network/react-shared");
+var import_react3 = require("react");
+var import_react_router_dom = require("react-router-dom");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var FullWidthCard = ({ cardIsButton, desc, href, media, name, small, to, ...props }) => {
+  const theme = (0, import_material3.useTheme)();
+  const [raised, setRaised] = (0, import_react3.useState)(false);
+  const navigate = (0, import_react_router_dom.useNavigate)();
+  const isMobile = (0, import_react_shared3.useIsMobile)();
+  const localRouteChange = (to2) => {
+    to2 ? navigate(to2) : navigate("/404");
+  };
+  const externalRouteChange = (href2) => {
+    href2 ? window.open(href2) : navigate("/404");
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    import_material3.Card,
+    {
+      elevation: raised ? 3 : 0,
+      style: { height: "100%", width: "100%" },
+      ...props,
+      sx: {
+        "&:hover": {
+          cursor: "pointer"
+        },
+        backgroundColor: (0, import_material3.alpha)(theme.palette.primary.light, 0.05)
+      },
+      onMouseEnter: () => isMobile ? null : cardIsButton ? setRaised(true) : null,
+      onMouseLeave: () => isMobile ? null : cardIsButton ? setRaised(false) : null,
+      onClick: () => cardIsButton ? href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404") : null,
+      children: [
+        media ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.CardMedia, { component: "img", height: "100", image: media, alt: "" }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.CardContent, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_material3.Grid, { container: true, alignItems: "center", paddingY: 2, paddingX: 2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Grid, { item: true, xs: 12, md: 6, children: typeof name === "string" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Typography, { fontWeight: 700, variant: "h2", textAlign: "left", paddingBottom: 1, children: name }) : name }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Grid, { item: true, xs: 12, md: 5, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Typography, { variant: "body1", fontWeight: 400, textAlign: "left", children: desc }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Grid, { item: true, xs: 1, display: isMobile ? "none" : "flex", justifyContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Zoom, { in: raised, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            import_material3.IconButton,
+            {
+              color: "primary",
+              size: small ? "small" : "medium",
+              onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
+              disableFocusRipple: true,
+              disableRipple: true,
+              disableTouchRipple: true,
+              children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
+            }
+          ) }) })
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.CardActions, { sx: { display: { md: isMobile ? "flex" : "none" } }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_flexbox.FlexGrowCol, { alignItems: "flex-end", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          import_material3.IconButton,
+          {
+            color: "primary",
+            size: small ? "small" : "medium",
+            onClick: () => href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404"),
+            disableFocusRipple: true,
+            disableRipple: true,
+            disableTouchRipple: true,
+            children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
+          }
+        ) }) })
+      ]
+    }
+  );
+};
+
+// src/components/PageCard.tsx
+var import_icons_material2 = require("@mui/icons-material");
+var import_material4 = require("@mui/material");
+var import_react_shared4 = require("@xyo-network/react-shared");
+var import_react4 = require("react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var PageCardWithRef = (0, import_react4.forwardRef)(({ subheader, title, onRefresh, children, action, style, ...props }, ref) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(CardEx, { style: { backgroundColor: "transparent", position: "relative", ...style }, elevation: 0, ref, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      import_material4.CardHeader,
+      {
+        title: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_shared4.TypographyEx, { variant: "h5", gutterBottom: true, children: title }),
+        subheader: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_shared4.TypographyEx, { variant: "subtitle1", children: subheader }),
+        action: action ?? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: onRefresh ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material4.IconButton, { onClick: () => onRefresh == null ? void 0 : onRefresh(), children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_icons_material2.Refresh, {}) }) : null })
+      }
+    ),
+    children
+  ] });
+});
+PageCardWithRef.displayName = "PageCard";
+var PageCard = PageCardWithRef;
+
+// src/components/SimpleCard/SimpleCard.tsx
+var import_icons_material3 = require("@mui/icons-material");
+var import_material5 = require("@mui/material");
+var import_react_flexbox2 = require("@xylabs/react-flexbox");
+var import_react_shared5 = require("@xyo-network/react-shared");
+var import_react5 = require("react");
+var import_react_router_dom2 = require("react-router-dom");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var SimpleCard = ({
+  desc,
+  iconImage,
+  interactionVariant = "card",
+  headline,
+  href,
+  media,
+  small,
+  subtitle,
+  sx,
+  to,
+  ...props
+}) => {
+  const theme = (0, import_material5.useTheme)();
+  const [raised, setRaised] = (0, import_react5.useState)(false);
+  const navigate = (0, import_react_router_dom2.useNavigate)();
+  const isMobile = (0, import_react_shared5.useIsMobile)();
+  const localRouteChange = (to2) => {
+    to2 ? navigate(to2) : navigate("/404");
+  };
+  const externalRouteChange = (href2) => {
+    href2 ? window.open(href2) : navigate("/404");
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
+    CardEx,
+    {
+      elevation: raised ? 3 : 0,
+      sx: {
+        "&:hover": {
+          cursor: interactionVariant == "button" ? "pointer" : null
+        },
+        backgroundColor: (0, import_material5.alpha)(theme.palette.primary.light, 0.05),
+        ...sx
+      },
+      onMouseEnter: () => isMobile ? null : interactionVariant == "button" ? setRaised(true) : null,
+      onMouseLeave: () => isMobile ? null : interactionVariant == "button" ? setRaised(false) : null,
+      onClick: () => interactionVariant == "button" ? href ? externalRouteChange(href) : to ? localRouteChange(to) : navigate("/404") : null,
+      ...props,
+      children: [
+        media ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.CardMedia, { component: "img", height: "100", image: media, alt: "" }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.CardContent, { sx: { height: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react_flexbox2.FlexCol, { width: "100%", alignItems: "flex-start", children: [
+          iconImage ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("img", { src: iconImage, height: "40px", style: { paddingBottom: "8px" } }) : null,
+          typeof headline === "string" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.Typography, { variant: small ? "body1" : "h6", textAlign: "left", gutterBottom: true, children: headline }) : headline,
+          subtitle ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.Typography, { variant: "subtitle2", textAlign: "left", gutterBottom: true, children: subtitle }) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.Typography, { variant: small ? "caption" : "body1", textAlign: "left", gutterBottom: true, children: desc })
+        ] }) }),
+        interactionVariant == "button" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.CardActions, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_flexbox2.FlexGrowCol, { alignItems: "flex-end", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+          import_material5.IconButton,
+          {
+            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__ */ (0, import_jsx_runtime5.jsx)(import_icons_material3.ArrowForwardRounded, { fontSize: small ? "small" : "medium" })
+          }
+        ) }) }) : null
+      ]
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CardContentEx,
+  CardContentExWithRef,
+  CardEx,
+  CardExWithRef,
+  FullWidthCard,
+  PageCard,
+  SimpleCard
+});
 //# sourceMappingURL=index.cjs.map