@xyo-network/react-shared 2.64.8 → 2.64.10

package/dist/node/index.cjs

@@ -650,21 +650,21 @@ var TokenBar = ({ text1, text1Props, text1Suffix, text2, text2Props, text2Suffix
 };
 
 // src/components/TokenData/img/index.ts
-var import_ada = __toESM(require("./components/TokenData/img/ada.png"), 1);
-var import_btc = __toESM(require("./components/TokenData/img/btc.png"), 1);
-var import_busd = __toESM(require("./components/TokenData/img/busd.png"), 1);
-var import_dai = __toESM(require("./components/TokenData/img/dai.png"), 1);
-var import_dogecoin = __toESM(require("./components/TokenData/img/dogecoin.png"), 1);
-var import_dot = __toESM(require("./components/TokenData/img/dot.png"), 1);
-var import_ethereum = __toESM(require("./components/TokenData/img/ethereum.png"), 1);
-var import_frax = __toESM(require("./components/TokenData/img/frax.png"), 1);
-var import_link = __toESM(require("./components/TokenData/img/link.png"), 1);
-var import_sol = __toESM(require("./components/TokenData/img/sol.png"), 1);
-var import_tether = __toESM(require("./components/TokenData/img/tether.png"), 1);
-var import_usd_coin = __toESM(require("./components/TokenData/img/usd-coin.png"), 1);
-var import_weth = __toESM(require("./components/TokenData/img/weth.png"), 1);
-var import_wrapped_bitcoin = __toESM(require("./components/TokenData/img/wrapped-bitcoin.png"), 1);
-var import_xyo = __toESM(require("./components/TokenData/img/xyo.png"), 1);
+var import_ada = __toESM(require("./ada-JCPSRXND.png"), 1);
+var import_btc = __toESM(require("./btc-SRW7TEQV.png"), 1);
+var import_busd = __toESM(require("./busd-RAN4SWCI.png"), 1);
+var import_dai = __toESM(require("./dai-FZSM2RYY.png"), 1);
+var import_dogecoin = __toESM(require("./dogecoin-QOIF7Q5M.png"), 1);
+var import_dot = __toESM(require("./dot-P5Z7IW2O.png"), 1);
+var import_ethereum = __toESM(require("./ethereum-3SLTXYTT.png"), 1);
+var import_frax = __toESM(require("./frax-TQDXCCOP.png"), 1);
+var import_link = __toESM(require("./link-THYNVLXG.png"), 1);
+var import_sol = __toESM(require("./sol-A4J5S4EN.png"), 1);
+var import_tether = __toESM(require("./tether-3X63FB23.png"), 1);
+var import_usd_coin = __toESM(require("./usd-coin-UCS44T5B.png"), 1);
+var import_weth = __toESM(require("./weth-HDGYDSJB.png"), 1);
+var import_wrapped_bitcoin = __toESM(require("./wrapped-bitcoin-TS5QFJLK.png"), 1);
+var import_xyo = __toESM(require("./xyo-RLMLL56X.png"), 1);
 
 // src/components/TokenData/TokenData.ts
 var TokenData = [

package/dist/node/index.js

@@ -564,21 +564,21 @@ var TokenBar = ({ text1, text1Props, text1Suffix, text2, text2Props, text2Suffix
 };
 
 // src/components/TokenData/img/index.ts
-import ada from "./components/TokenData/img/ada.png";
-import btc from "./components/TokenData/img/btc.png";
-import busd from "./components/TokenData/img/busd.png";
-import dai from "./components/TokenData/img/dai.png";
-import dogecoin from "./components/TokenData/img/dogecoin.png";
-import dot from "./components/TokenData/img/dot.png";
-import ethereum from "./components/TokenData/img/ethereum.png";
-import frax from "./components/TokenData/img/frax.png";
-import link from "./components/TokenData/img/link.png";
-import sol from "./components/TokenData/img/sol.png";
-import tether from "./components/TokenData/img/tether.png";
-import usdCoin from "./components/TokenData/img/usd-coin.png";
-import weth from "./components/TokenData/img/weth.png";
-import wrappedBtc from "./components/TokenData/img/wrapped-bitcoin.png";
-import xyo from "./components/TokenData/img/xyo.png";
+import ada from "./ada-JCPSRXND.png";
+import btc from "./btc-SRW7TEQV.png";
+import busd from "./busd-RAN4SWCI.png";
+import dai from "./dai-FZSM2RYY.png";
+import dogecoin from "./dogecoin-QOIF7Q5M.png";
+import dot from "./dot-P5Z7IW2O.png";
+import ethereum from "./ethereum-3SLTXYTT.png";
+import frax from "./frax-TQDXCCOP.png";
+import link from "./link-THYNVLXG.png";
+import sol from "./sol-A4J5S4EN.png";
+import tether from "./tether-3X63FB23.png";
+import usdCoin from "./usd-coin-UCS44T5B.png";
+import weth from "./weth-HDGYDSJB.png";
+import wrappedBtc from "./wrapped-bitcoin-TS5QFJLK.png";
+import xyo from "./xyo-RLMLL56X.png";
 
 // src/components/TokenData/TokenData.ts
 var TokenData = [

package/package.json

@@ -11,22 +11,22 @@
   },
   "dependencies": {
     "@xylabs/pixel": "^1.4.14",
-    "@xylabs/react-appbar": "^3.0.15",
-    "@xylabs/react-button": "^3.0.15",
-    "@xylabs/react-flexbox": "^3.0.15",
-    "@xylabs/react-link": "^3.0.15",
-    "@xylabs/react-promise": "^3.0.15",
-    "@xylabs/react-shared": "^3.0.15",
-    "@xyo-network/core": "^2.75.7",
-    "@xyo-network/payload-model": "^2.75.7",
-    "@xyo-network/react-event": "~2.64.8",
+    "@xylabs/react-appbar": "^3.0.18",
+    "@xylabs/react-button": "^3.0.18",
+    "@xylabs/react-flexbox": "^3.0.18",
+    "@xylabs/react-link": "^3.0.18",
+    "@xylabs/react-promise": "^3.0.18",
+    "@xylabs/react-shared": "^3.0.18",
+    "@xyo-network/core": "^2.75.16",
+    "@xyo-network/payload-model": "^2.75.16",
+    "@xyo-network/react-event": "~2.64.10",
     "react-router-dom": "^6.16.0"
   },
   "devDependencies": {
     "@storybook/react": "^7.4.6",
-    "@xylabs/react-quick-tip-button": "^3.0.15",
-    "@xylabs/ts-scripts-yarn3": "^3.0.82",
-    "@xylabs/tsconfig-react": "^3.0.82",
+    "@xylabs/react-quick-tip-button": "^3.0.18",
+    "@xylabs/ts-scripts-yarn3": "^3.1.3",
+    "@xylabs/tsconfig-react": "^3.1.3",
     "typescript": "^5.2.2"
   },
   "peerDependencies": {
@@ -88,6 +88,6 @@
   },
   "sideEffects": false,
   "types": "dist/browser/index.d.ts",
-  "version": "2.64.8",
+  "version": "2.64.10",
   "type": "module"
 }

package/dist/browser/SizeProp.cjs

@@ -1,19 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-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/SizeProp.ts
-var SizeProp_exports = {};
-module.exports = __toCommonJS(SizeProp_exports);
-//# sourceMappingURL=SizeProp.cjs.map

package/dist/browser/SizeProp.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/SizeProp.ts"],"sourcesContent":["export type SizeProp = 'small' | 'medium' | 'large'\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}

package/dist/browser/SizeProp.js

@@ -1 +0,0 @@
-//# sourceMappingURL=SizeProp.js.map

package/dist/browser/SizeProp.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/browser/components/Ampersand.cjs

@@ -1,31 +0,0 @@
-"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/components/Ampersand.tsx
-var Ampersand_exports = {};
-__export(Ampersand_exports, {
-  Ampersand: () => Ampersand
-});
-module.exports = __toCommonJS(Ampersand_exports);
-var import_material = require("@mui/material");
-var import_jsx_runtime = require("react/jsx-runtime");
-var Ampersand = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { marginX: 1, component: "span", ...props, children: "&" });
-};
-//# sourceMappingURL=Ampersand.cjs.map

package/dist/browser/components/Ampersand.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/Ampersand.tsx"],"sourcesContent":["import { Typography, TypographyProps } from '@mui/material'\n\nexport const Ampersand: React.FC<TypographyProps> = (props) => {\n  return (\n    <Typography marginX={1} component=\"span\" {...props}>\n      &amp;\n    </Typography>\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAA4C;AAIxC;AAFG,IAAM,YAAuC,CAAC,UAAU;AAC7D,SACE,4CAAC,8BAAW,SAAS,GAAG,WAAU,QAAQ,GAAG,OAAO,eAEpD;AAEJ;","names":[]}

package/dist/browser/components/Ampersand.js

@@ -1,10 +0,0 @@
-// src/components/Ampersand.tsx
-import { Typography } from "@mui/material";
-import { jsx } from "react/jsx-runtime";
-var Ampersand = (props) => {
-  return /* @__PURE__ */ jsx(Typography, { marginX: 1, component: "span", ...props, children: "&" });
-};
-export {
-  Ampersand
-};
-//# sourceMappingURL=Ampersand.js.map

package/dist/browser/components/Ampersand.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/components/Ampersand.tsx"],"sourcesContent":["import { Typography, TypographyProps } from '@mui/material'\n\nexport const Ampersand: React.FC<TypographyProps> = (props) => {\n  return (\n    <Typography marginX={1} component=\"span\" {...props}>\n      &amp;\n    </Typography>\n  )\n}\n"],"mappings":";AAAA,SAAS,kBAAmC;AAIxC;AAFG,IAAM,YAAuC,CAAC,UAAU;AAC7D,SACE,oBAAC,cAAW,SAAS,GAAG,WAAU,QAAQ,GAAG,OAAO,eAEpD;AAEJ;","names":[]}

package/dist/browser/components/BasicHero/BasicHero.cjs

@@ -1,225 +0,0 @@
-"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/components/BasicHero/BasicHero.tsx
-var BasicHero_exports = {};
-__export(BasicHero_exports, {
-  BasicHero: () => BasicHero
-});
-module.exports = __toCommonJS(BasicHero_exports);
-var import_material4 = require("@mui/material");
-var import_react_button = require("@xylabs/react-button");
-var import_react_flexbox = require("@xylabs/react-flexbox");
-var import_react_link = require("@xylabs/react-link");
-
-// src/hooks/GradientStyles/GradientStyles.tsx
-var import_material = require("@mui/material");
-var import_styles = require("@mui/styles");
-var colorfulGradientLightMode = () => {
-  return {
-    background: {
-      backgroundImage: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)"
-    },
-    border: {
-      borderImage: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)",
-      borderImageSlice: 1,
-      borderImageSource: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)",
-      borderRadius: 0,
-      borderStyle: "solid",
-      borderWidth: "2px"
-    },
-    heading: {
-      WebkitBackgroundClip: "text",
-      WebkitTextFillColor: "transparent",
-      background: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)",
-      display: "inline-block"
-    }
-  };
-};
-var colorfulGradientDarkMode = () => {
-  return {
-    background: {
-      backgroundImage: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)"
-    },
-    border: {
-      borderImage: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)",
-      borderImageSlice: 1,
-      borderImageSource: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)",
-      borderRadius: 0,
-      borderStyle: "solid",
-      borderWidth: "2px"
-    },
-    heading: {
-      WebkitBackgroundClip: "text",
-      WebkitTextFillColor: "transparent",
-      background: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)",
-      display: "inline-block"
-    }
-  };
-};
-var useGradientStyles = () => {
-  const theme = (0, import_material.useTheme)();
-  const styles = theme.palette.mode === "dark" ? colorfulGradientDarkMode() : colorfulGradientLightMode();
-  const classes = (0, import_styles.makeStyles)(styles);
-  return { classes, styles };
-};
-
-// src/hooks/useIsMobile.ts
-var import_material3 = require("@mui/material");
-
-// src/hooks/useMediaQuery.ts
-var import_material2 = require("@mui/material");
-
-// src/hooks/useIsMobile.ts
-var useIsMobile = () => {
-  const theme = (0, import_material3.useTheme)();
-  return (0, import_material2.useMediaQuery)(theme.breakpoints.down("md"));
-};
-
-// src/components/BasicHero/BasicHero.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
-var SubLinkSection = ({ backgroundImageAlignment, subLinkIcon, subLinkPath, subLinkText1, subLinkText2 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    import_react_flexbox.FlexGrowRow,
-    {
-      width: "100%",
-      sx: { flexDirection: { md: "row", xs: "column" }, justifyContent: { md: backgroundImageAlignment ? "flex-start" : "center", xs: "center" } },
-      children: [
-        subLinkIcon ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
-          subLinkIcon,
-          "\xA0"
-        ] }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material4.Typography, { children: [
-          subLinkText1,
-          "\xA0"
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_link.LinkEx, { href: subLinkPath, underline: "always", target: "_blank", color: "inherit", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material4.Typography, { children: subLinkText2 }) })
-      ]
-    }
-  );
-};
-var ButtonSection = ({ href, to, buttonText }) => {
-  const isMobile = useIsMobile();
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_react_button.ButtonEx,
-    {
-      fullWidth: true,
-      marginTop: 1,
-      marginBottom: 1,
-      marginRight: isMobile ? 2 : 1,
-      marginLeft: isMobile ? 2 : 0,
-      target: href ?? "_blank",
-      to,
-      href,
-      color: "primary",
-      variant: "contained",
-      paddingX: 3,
-      sx: { display: href || to ? "flex" : "none" },
-      children: buttonText
-    }
-  );
-};
-var BasicHero = ({
-  backgroundImage,
-  title,
-  gradientTitle,
-  backgroundColor,
-  textColor,
-  desc,
-  heroImage,
-  title2,
-  subLinkText1,
-  subLinkText2,
-  subLinkPath,
-  button1Text,
-  button2Text,
-  button2To,
-  button1To,
-  button2Href,
-  button1Href,
-  subLinkIcon,
-  sx,
-  ...props
-}) => {
-  const isMobile = useIsMobile();
-  const { classes } = useGradientStyles();
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_react_flexbox.FlexGrowCol,
-    {
-      sx: {
-        backgroundImage: `url(${backgroundImage})`,
-        backgroundPosition: { lg: "bottom", md: "center left", xs: "top left" },
-        minHeight: {
-          md: "500px",
-          sm: "400px",
-          xs: "200px"
-        },
-        ...sx ?? {}
-      },
-      style: {
-        backgroundColor: backgroundColor ?? "",
-        backgroundRepeat: "no-repeat",
-        backgroundSize: "cover",
-        color: textColor ?? ""
-      },
-      ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material4.Container, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-        import_material4.Grid,
-        {
-          container: true,
-          justifyContent: "center",
-          alignItems: "center",
-          sx: {
-            alignItems: { xs: "center" },
-            justifyContent: { xs: "center" }
-          },
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material4.Grid, { item: true, xs: 12, sm: 8, md: backgroundImage ? 6 : 8, lg: backgroundImage ? 6 : 8, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_flexbox.FlexGrowCol, { paddingY: 2, sx: { alignItems: { xs: backgroundImage && !isMobile ? "flex-start" : "center" } }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material4.Typography, { variant: "h1", component: "h1", gutterBottom: true, textAlign: backgroundImage && !isMobile ? "left" : "center", children: [
-                title ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: `${title} ` }) : null,
-                gradientTitle ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: classes().heading, children: [
-                  " ",
-                  ` ${gradientTitle}`
-                ] }) : null,
-                title2 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: ` ${title2}` }) : null
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material4.Typography, { variant: "body1", component: "h2", gutterBottom: true, textAlign: backgroundImage && !isMobile ? "left" : "center", children: desc }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_flexbox.FlexGrowRow, { sx: { flexDirection: { lg: "row", xs: "column" } }, width: "100%", marginTop: 1, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonSection, { href: button1Href, to: button1To, buttonText: button1Text }),
-                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonSection, { href: button2Href, to: button2To, buttonText: button2Text })
-              ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-                SubLinkSection,
-                {
-                  subLinkIcon,
-                  subLinkText1,
-                  subLinkText2,
-                  subLinkPath,
-                  backgroundImageAlignment: backgroundImage ? true : false
-                }
-              )
-            ] }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material4.Grid, { item: true, xs: 12, md: 6, children: heroImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: heroImage, width: "100%" }) : null })
-          ]
-        }
-      ) })
-    }
-  );
-};
-//# sourceMappingURL=BasicHero.cjs.map

package/dist/browser/components/BasicHero/BasicHero.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/components/BasicHero/BasicHero.tsx","../../../../src/hooks/GradientStyles/GradientStyles.tsx","../../../../src/hooks/useIsMobile.ts","../../../../src/hooks/useMediaQuery.ts"],"sourcesContent":["import { Container, Grid, Typography } from '@mui/material'\nimport { ButtonEx } from '@xylabs/react-button'\nimport { FlexBoxProps, FlexGrowCol, FlexGrowRow } from '@xylabs/react-flexbox'\nimport { LinkEx } from '@xylabs/react-link'\nimport { ReactElement } from 'react'\n\nimport { useGradientStyles, useIsMobile } from '../../hooks'\n\nexport interface BasicHeroProps extends FlexBoxProps {\n  backgroundColor?: string\n  backgroundImage?: string\n  button1Href?: string\n  button1Text?: string\n  button1To?: string\n  button2Href?: string\n  button2Text?: string\n  button2To?: string\n  desc: string\n  gradientTitle?: string\n  heroImage?: string\n  subLinkIcon?: ReactElement\n  subLinkPath?: string\n  subLinkText1?: string\n  subLinkText2?: string\n  sx?: Record<string, string>\n  textColor?: string\n  title: string\n  title2?: string\n}\n\ninterface SubLinkSectionProps {\n  backgroundImageAlignment?: boolean\n  subLinkIcon?: ReactElement\n  subLinkPath?: string\n  subLinkText1?: string\n  subLinkText2?: string\n}\n\ninterface ButtonSectionProps {\n  buttonText?: string\n  href?: string\n  to?: string\n}\nconst SubLinkSection: React.FC<SubLinkSectionProps> = ({ backgroundImageAlignment, subLinkIcon, subLinkPath, subLinkText1, subLinkText2 }) => {\n  return (\n    <FlexGrowRow\n      width=\"100%\"\n      sx={{ flexDirection: { md: 'row', xs: 'column' }, justifyContent: { md: backgroundImageAlignment ? 'flex-start' : 'center', xs: 'center' } }}\n    >\n      {subLinkIcon ? <span>{subLinkIcon}&nbsp;</span> : null}\n      <Typography>{subLinkText1}&nbsp;</Typography>\n      <LinkEx href={subLinkPath} underline=\"always\" target=\"_blank\" color=\"inherit\">\n        <Typography>{subLinkText2}</Typography>\n      </LinkEx>\n    </FlexGrowRow>\n  )\n}\n\nconst ButtonSection: React.FC<ButtonSectionProps> = ({ href, to, buttonText }) => {\n  const isMobile = useIsMobile()\n  return (\n    <ButtonEx\n      fullWidth={true}\n      marginTop={1}\n      marginBottom={1}\n      marginRight={isMobile ? 2 : 1}\n      marginLeft={isMobile ? 2 : 0}\n      target={href ?? '_blank'}\n      to={to}\n      href={href}\n      color=\"primary\"\n      variant=\"contained\"\n      paddingX={3}\n      sx={{ display: href || to ? 'flex' : 'none' }}\n    >\n      {buttonText}\n    </ButtonEx>\n  )\n}\n\nexport const BasicHero: React.FC<BasicHeroProps> = ({\n  backgroundImage,\n  title,\n  gradientTitle,\n  backgroundColor,\n  textColor,\n  desc,\n  heroImage,\n  title2,\n  subLinkText1,\n  subLinkText2,\n  subLinkPath,\n  button1Text,\n  button2Text,\n  button2To,\n  button1To,\n  button2Href,\n  button1Href,\n  subLinkIcon,\n  sx,\n  ...props\n}) => {\n  const isMobile = useIsMobile()\n  const { classes } = useGradientStyles()\n  return (\n    <FlexGrowCol\n      sx={{\n        backgroundImage: `url(${backgroundImage})`,\n        backgroundPosition: { lg: 'bottom', md: 'center left', xs: 'top left' },\n        minHeight: {\n          md: '500px',\n          sm: '400px',\n          xs: '200px',\n        },\n        ...(sx ?? {}),\n      }}\n      style={{\n        backgroundColor: backgroundColor ?? '',\n        backgroundRepeat: 'no-repeat',\n        backgroundSize: 'cover',\n        color: textColor ?? '',\n      }}\n      {...props}\n    >\n      <Container>\n        <Grid\n          container\n          justifyContent=\"center\"\n          alignItems=\"center\"\n          sx={{\n            alignItems: { xs: 'center' },\n            justifyContent: { xs: 'center' },\n          }}\n        >\n          <Grid item xs={12} sm={8} md={backgroundImage ? 6 : 8} lg={backgroundImage ? 6 : 8}>\n            <FlexGrowCol paddingY={2} sx={{ alignItems: { xs: backgroundImage && !isMobile ? 'flex-start' : 'center' } }}>\n              <Typography variant=\"h1\" component=\"h1\" gutterBottom textAlign={backgroundImage && !isMobile ? 'left' : 'center'}>\n                {title ? <span>{`${title} `}</span> : null}\n                {gradientTitle ? <span className={classes().heading}> {` ${gradientTitle}`}</span> : null}\n                {title2 ? <span>{` ${title2}`}</span> : null}\n              </Typography>\n              <Typography variant=\"body1\" component=\"h2\" gutterBottom textAlign={backgroundImage && !isMobile ? 'left' : 'center'}>\n                {desc}\n              </Typography>\n              <FlexGrowRow sx={{ flexDirection: { lg: 'row', xs: 'column' } }} width=\"100%\" marginTop={1}>\n                <ButtonSection href={button1Href} to={button1To} buttonText={button1Text} />\n                <ButtonSection href={button2Href} to={button2To} buttonText={button2Text} />\n              </FlexGrowRow>\n              <SubLinkSection\n                subLinkIcon={subLinkIcon}\n                subLinkText1={subLinkText1}\n                subLinkText2={subLinkText2}\n                subLinkPath={subLinkPath}\n                backgroundImageAlignment={backgroundImage ? true : false}\n              />\n            </FlexGrowCol>\n          </Grid>\n          <Grid item xs={12} md={6}>\n            {heroImage ? <img src={heroImage} width=\"100%\" /> : null}\n          </Grid>\n        </Grid>\n      </Container>\n    </FlexGrowCol>\n  )\n}\n","import { useTheme } from '@mui/material'\nimport { makeStyles } from '@mui/styles'\nimport { CSSProperties } from 'react'\n\nexport interface GradientStyles {\n  background: CSSProperties\n  border: CSSProperties\n  heading: CSSProperties\n}\n\nexport const colorfulGradientLightMode = () => {\n  return {\n    background: {\n      backgroundImage: '-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)',\n    },\n    border: {\n      borderImage: '-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)',\n      borderImageSlice: 1,\n      borderImageSource: '-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)',\n      borderRadius: 0,\n      borderStyle: 'solid',\n      borderWidth: '2px',\n    },\n    heading: {\n      WebkitBackgroundClip: 'text',\n      WebkitTextFillColor: 'transparent',\n      background: '-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)',\n      display: 'inline-block',\n    },\n  }\n}\n\nexport const colorfulGradientDarkMode = () => {\n  return {\n    background: {\n      backgroundImage: '-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)',\n    },\n    border: {\n      borderImage: '-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)',\n      borderImageSlice: 1,\n      borderImageSource: '-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)',\n      borderRadius: 0,\n      borderStyle: 'solid',\n      borderWidth: '2px',\n    },\n    heading: {\n      WebkitBackgroundClip: 'text',\n      WebkitTextFillColor: 'transparent',\n      background: '-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)',\n      display: 'inline-block',\n    },\n  }\n}\n\nexport const useGradientStyles = () => {\n  const theme = useTheme()\n  const styles = theme.palette.mode === 'dark' ? colorfulGradientDarkMode() : colorfulGradientLightMode()\n  const classes = makeStyles(styles)\n  return { classes, styles }\n}\n","import { useTheme } from '@mui/material'\n\nimport { useMediaQuery } from './useMediaQuery'\n\nexport const useIsMobile = () => {\n  const theme = useTheme()\n  return useMediaQuery(theme.breakpoints.down('md'))\n}\n","// eslint-disable-next-line import/no-deprecated\nimport { useMediaQuery } from '@mui/material'\n\n// eslint-disable-next-line import/no-deprecated\nexport { useMediaQuery }\n\n/* This file only exists to deal with the false positve lint error */\n"],"mappings":"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","names":["import_material","import_material","import_material"]}

package/dist/browser/components/BasicHero/BasicHero.js

@@ -1,204 +0,0 @@
-// src/components/BasicHero/BasicHero.tsx
-import { Container, Grid, Typography } from "@mui/material";
-import { ButtonEx } from "@xylabs/react-button";
-import { FlexGrowCol, FlexGrowRow } from "@xylabs/react-flexbox";
-import { LinkEx } from "@xylabs/react-link";
-
-// src/hooks/GradientStyles/GradientStyles.tsx
-import { useTheme } from "@mui/material";
-import { makeStyles } from "@mui/styles";
-var colorfulGradientLightMode = () => {
-  return {
-    background: {
-      backgroundImage: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)"
-    },
-    border: {
-      borderImage: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)",
-      borderImageSlice: 1,
-      borderImageSource: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)",
-      borderRadius: 0,
-      borderStyle: "solid",
-      borderWidth: "2px"
-    },
-    heading: {
-      WebkitBackgroundClip: "text",
-      WebkitTextFillColor: "transparent",
-      background: "-webkit-linear-gradient(232deg, #e17751, #d84e7a, #5898dd, #8c8ee5)",
-      display: "inline-block"
-    }
-  };
-};
-var colorfulGradientDarkMode = () => {
-  return {
-    background: {
-      backgroundImage: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)"
-    },
-    border: {
-      borderImage: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)",
-      borderImageSlice: 1,
-      borderImageSource: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)",
-      borderRadius: 0,
-      borderStyle: "solid",
-      borderWidth: "2px"
-    },
-    heading: {
-      WebkitBackgroundClip: "text",
-      WebkitTextFillColor: "transparent",
-      background: "-webkit-linear-gradient(232deg, #F17938, #FF5BDC, #5898dd, #B2FFFD)",
-      display: "inline-block"
-    }
-  };
-};
-var useGradientStyles = () => {
-  const theme = useTheme();
-  const styles = theme.palette.mode === "dark" ? colorfulGradientDarkMode() : colorfulGradientLightMode();
-  const classes = makeStyles(styles);
-  return { classes, styles };
-};
-
-// src/hooks/useIsMobile.ts
-import { useTheme as useTheme2 } from "@mui/material";
-
-// src/hooks/useMediaQuery.ts
-import { useMediaQuery } from "@mui/material";
-
-// src/hooks/useIsMobile.ts
-var useIsMobile = () => {
-  const theme = useTheme2();
-  return useMediaQuery(theme.breakpoints.down("md"));
-};
-
-// src/components/BasicHero/BasicHero.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var SubLinkSection = ({ backgroundImageAlignment, subLinkIcon, subLinkPath, subLinkText1, subLinkText2 }) => {
-  return /* @__PURE__ */ jsxs(
-    FlexGrowRow,
-    {
-      width: "100%",
-      sx: { flexDirection: { md: "row", xs: "column" }, justifyContent: { md: backgroundImageAlignment ? "flex-start" : "center", xs: "center" } },
-      children: [
-        subLinkIcon ? /* @__PURE__ */ jsxs("span", { children: [
-          subLinkIcon,
-          "\xA0"
-        ] }) : null,
-        /* @__PURE__ */ jsxs(Typography, { children: [
-          subLinkText1,
-          "\xA0"
-        ] }),
-        /* @__PURE__ */ jsx(LinkEx, { href: subLinkPath, underline: "always", target: "_blank", color: "inherit", children: /* @__PURE__ */ jsx(Typography, { children: subLinkText2 }) })
-      ]
-    }
-  );
-};
-var ButtonSection = ({ href, to, buttonText }) => {
-  const isMobile = useIsMobile();
-  return /* @__PURE__ */ jsx(
-    ButtonEx,
-    {
-      fullWidth: true,
-      marginTop: 1,
-      marginBottom: 1,
-      marginRight: isMobile ? 2 : 1,
-      marginLeft: isMobile ? 2 : 0,
-      target: href ?? "_blank",
-      to,
-      href,
-      color: "primary",
-      variant: "contained",
-      paddingX: 3,
-      sx: { display: href || to ? "flex" : "none" },
-      children: buttonText
-    }
-  );
-};
-var BasicHero = ({
-  backgroundImage,
-  title,
-  gradientTitle,
-  backgroundColor,
-  textColor,
-  desc,
-  heroImage,
-  title2,
-  subLinkText1,
-  subLinkText2,
-  subLinkPath,
-  button1Text,
-  button2Text,
-  button2To,
-  button1To,
-  button2Href,
-  button1Href,
-  subLinkIcon,
-  sx,
-  ...props
-}) => {
-  const isMobile = useIsMobile();
-  const { classes } = useGradientStyles();
-  return /* @__PURE__ */ jsx(
-    FlexGrowCol,
-    {
-      sx: {
-        backgroundImage: `url(${backgroundImage})`,
-        backgroundPosition: { lg: "bottom", md: "center left", xs: "top left" },
-        minHeight: {
-          md: "500px",
-          sm: "400px",
-          xs: "200px"
-        },
-        ...sx ?? {}
-      },
-      style: {
-        backgroundColor: backgroundColor ?? "",
-        backgroundRepeat: "no-repeat",
-        backgroundSize: "cover",
-        color: textColor ?? ""
-      },
-      ...props,
-      children: /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsxs(
-        Grid,
-        {
-          container: true,
-          justifyContent: "center",
-          alignItems: "center",
-          sx: {
-            alignItems: { xs: "center" },
-            justifyContent: { xs: "center" }
-          },
-          children: [
-            /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, sm: 8, md: backgroundImage ? 6 : 8, lg: backgroundImage ? 6 : 8, children: /* @__PURE__ */ jsxs(FlexGrowCol, { paddingY: 2, sx: { alignItems: { xs: backgroundImage && !isMobile ? "flex-start" : "center" } }, children: [
-              /* @__PURE__ */ jsxs(Typography, { variant: "h1", component: "h1", gutterBottom: true, textAlign: backgroundImage && !isMobile ? "left" : "center", children: [
-                title ? /* @__PURE__ */ jsx("span", { children: `${title} ` }) : null,
-                gradientTitle ? /* @__PURE__ */ jsxs("span", { className: classes().heading, children: [
-                  " ",
-                  ` ${gradientTitle}`
-                ] }) : null,
-                title2 ? /* @__PURE__ */ jsx("span", { children: ` ${title2}` }) : null
-              ] }),
-              /* @__PURE__ */ jsx(Typography, { variant: "body1", component: "h2", gutterBottom: true, textAlign: backgroundImage && !isMobile ? "left" : "center", children: desc }),
-              /* @__PURE__ */ jsxs(FlexGrowRow, { sx: { flexDirection: { lg: "row", xs: "column" } }, width: "100%", marginTop: 1, children: [
-                /* @__PURE__ */ jsx(ButtonSection, { href: button1Href, to: button1To, buttonText: button1Text }),
-                /* @__PURE__ */ jsx(ButtonSection, { href: button2Href, to: button2To, buttonText: button2Text })
-              ] }),
-              /* @__PURE__ */ jsx(
-                SubLinkSection,
-                {
-                  subLinkIcon,
-                  subLinkText1,
-                  subLinkText2,
-                  subLinkPath,
-                  backgroundImageAlignment: backgroundImage ? true : false
-                }
-              )
-            ] }) }),
-            /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, md: 6, children: heroImage ? /* @__PURE__ */ jsx("img", { src: heroImage, width: "100%" }) : null })
-          ]
-        }
-      ) })
-    }
-  );
-};
-export {
-  BasicHero
-};
-//# sourceMappingURL=BasicHero.js.map