@xylabs/react-webapp 7.2.4 → 8.0.0

package/dist/browser/components/Chrome.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chrome.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAGtE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAIzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMtC,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,cAAc,CAAC,EAAE,oBAAoB,CAAA;CACtC;AAED,eAAO,MAAM,YAAY;iIAEtB,iBAAiB;;CAqCnB,CAAA"}
+{"version":3,"file":"Chrome.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAA;AAGtE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAIzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAMtC,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,cAAc,CAAC,EAAE,oBAAoB,CAAA;CACtC;AAED,eAAO,MAAM,YAAY;iIAEtB,iBAAiB;;CA6DnB,CAAA"}

package/dist/browser/index.mjs

@@ -186,9 +186,9 @@ var WebAppPage = ({
         disableBreadcrumbGutter,
         breadcrumbs,
         mobileScrollingBreakpoint,
-        paddingX: disableGutters ? 0 : 1,
         variant,
         ...props,
+        sx: { paddingX: disableGutters ? 0 : 1 },
         children
       }
     )
@@ -220,26 +220,66 @@ var WebAppChrome = ({
   navigationType = "menu",
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs4(FlexCol, { id: "web-chrome-flex", alignItems: "stretch", overflow: "hidden", height: "100vh", ref, ...props, children: [
-    /* @__PURE__ */ jsx4(Helmet2, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: /* @__PURE__ */ jsx4("meta", { content: "website", property: "og:type" }) }),
-    appbar ?? /* @__PURE__ */ jsx4(ApplicationAppBar, { systemToolbar: /* @__PURE__ */ jsx4(SystemToolbar, { menuItems: navigationType === "menu" ? menuItems : void 0 }) }),
-    /* @__PURE__ */ jsxs4(FlexGrowRow, { id: "sidebar-nav-flex", overflow: "hidden", alignItems: "stretch", children: [
-      navigationType === "menu" ? null : /* @__PURE__ */ jsxs4(Fragment, { children: [
-        menuItems,
-        /* @__PURE__ */ jsx4(Divider, { orientation: "vertical" })
-      ] }),
-      /* @__PURE__ */ jsx4(FlexGrowCol3, { id: "main-flex", justifyContent: "flex-start", alignItems: "stretch", children: errorBoundary ? /* @__PURE__ */ jsx4(
-        ErrorBoundary,
-        {
-          fallbackWithError: (error) => {
-            return errorPage ?? /* @__PURE__ */ jsx4(WebAppErrorPage, { error });
-          },
-          children
-        }
-      ) : children })
-    ] }),
-    /* @__PURE__ */ jsx4(FlexCol, { id: "footer-flex", alignItems: "stretch", children: /* @__PURE__ */ jsx4(Paper, { elevation: footerElevation, square: true, children: footer }) })
-  ] });
+  return /* @__PURE__ */ jsxs4(
+    FlexCol,
+    {
+      id: "web-chrome-flex",
+      ref,
+      ...props,
+      sx: {
+        alignItems: "stretch",
+        overflow: "hidden",
+        height: "100vh"
+      },
+      children: [
+        /* @__PURE__ */ jsx4(Helmet2, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: /* @__PURE__ */ jsx4("meta", { content: "website", property: "og:type" }) }),
+        appbar ?? /* @__PURE__ */ jsx4(ApplicationAppBar, { systemToolbar: /* @__PURE__ */ jsx4(SystemToolbar, { menuItems: navigationType === "menu" ? menuItems : void 0 }) }),
+        /* @__PURE__ */ jsxs4(
+          FlexGrowRow,
+          {
+            id: "sidebar-nav-flex",
+            sx: {
+              overflow: "hidden",
+              alignItems: "stretch"
+            },
+            children: [
+              navigationType === "menu" ? null : /* @__PURE__ */ jsxs4(Fragment, { children: [
+                menuItems,
+                /* @__PURE__ */ jsx4(Divider, { orientation: "vertical" })
+              ] }),
+              /* @__PURE__ */ jsx4(
+                FlexGrowCol3,
+                {
+                  id: "main-flex",
+                  sx: {
+                    justifyContent: "flex-start",
+                    alignItems: "stretch"
+                  },
+                  children: errorBoundary ? /* @__PURE__ */ jsx4(
+                    ErrorBoundary,
+                    {
+                      fallbackWithError: (error) => {
+                        return errorPage ?? /* @__PURE__ */ jsx4(WebAppErrorPage, { error });
+                      },
+                      children
+                    }
+                  ) : children
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          FlexCol,
+          {
+            id: "footer-flex",
+            sx: { alignItems: "stretch" },
+            children: /* @__PURE__ */ jsx4(Paper, { elevation: footerElevation, square: true, children: footer })
+          }
+        )
+      ]
+    }
+  );
 };
 WebAppChrome.displayName = "WebAppChrome";
 

package/dist/browser/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/Body.tsx","../../src/components/lib/cssValues.ts","../../src/components/Chrome.tsx","../../src/components/ErrorPage.tsx","../../src/components/Page.tsx","../../src/components/NotFoundPage/Page.tsx"],"sourcesContent":["import type { Breakpoint } from '@mui/material'\nimport { styled } from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport type { ReactNode } from 'react'\nimport React from 'react'\n\nimport { fixedContent, scrollableContent } from './lib/index.ts'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = new Set(['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter'])\nconst defaultStyledOptions = { shouldForwardProp: (prop: string) => !propsNotForwarded.has(prop) }\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n  ...defaultStyledOptions,\n  name: WebAppBodyName,\n  slot: 'Root',\n})<WebAppBodyProps>(({\n  spacing, theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\n  const scrollable = variant === 'scrollable'\n  return theme.unstable_sx({\n    alignItems: 'stretch',\n    gap: 1,\n    justifyContent: 'flex-start',\n    overflowX: 'visible',\n    overflowY: scrollable ? 'scroll' : 'hidden',\n    paddingY: spacing,\n    [theme.breakpoints.down(mobileScrollingBreakpoint)]: { overflowY: 'scroll' },\n  })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n  ...defaultStyledOptions,\n  name: WebAppBodyName,\n  slot: 'Breadcrumb',\n})<WebAppBodyProps>(({\n  theme, disableBreadcrumbGutter, spacing,\n}) =>\n  theme.unstable_sx({\n    justifyContent: 'start',\n    marginX: disableBreadcrumbGutter ? 0 : spacing,\n  }))\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n  name: WebAppBodyName,\n  slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({ alignItems: 'stretch' }))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n  ...defaultStyledOptions,\n  name: WebAppBodyName,\n  slot: 'Scrollable',\n})<WebAppBodyProps>(({\n  theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\n  const props = variant === 'scrollable' ? scrollableContent : fixedContent\n  return {\n    ...props,\n    alignItems: 'stretch',\n    justifyContent: 'start',\n    [theme.breakpoints.down(mobileScrollingBreakpoint)]: {\n      inset: 'unset',\n      position: 'relative',\n    },\n  }\n})\n\nexport interface WebAppBodyProps extends FlexBoxProps {\n  breadcrumbs?: ReactNode\n  disableBreadcrumbGutter?: boolean\n  mobileScrollingBreakpoint?: Breakpoint\n  spacing?: string | number\n  variant?: 'scrollable' | 'fixed'\n}\n\nexport const WebAppBody: React.FC<WebAppBodyProps> = ({\n  children,\n  breadcrumbs,\n  disableBreadcrumbGutter,\n  mobileScrollingBreakpoint,\n  spacing = 1,\n  variant,\n  ...props\n}) => {\n  return (\n    <WebAppBodyRoot mobileScrollingBreakpoint={mobileScrollingBreakpoint} spacing={spacing} variant={variant} {...props}>\n      {breadcrumbs\n        ? (\n            <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n              {breadcrumbs}\n            </WebAppBodyBreadcrumb>\n          )\n        : null}\n      <WebAppBodyScrollableWrapper>\n        <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n          {children}\n        </WebAppBodyScrollable>\n      </WebAppBodyScrollableWrapper>\n    </WebAppBodyRoot>\n  )\n}\n","import type { CSSProperties } from 'react'\n\nexport const scrollableWrap: CSSProperties = {\n  inset: 0,\n  position: 'absolute',\n} as const\n\nexport const fixedWrap: CSSProperties = {\n  inset: 'unset',\n  position: 'relative',\n} as const\n\n// Making a scrollable vs fixed wrapper and content is an inversion of the wrap and content styles\nexport const scrollableContent: CSSProperties = { ...fixedWrap } as const\n\nexport const fixedContent: CSSProperties = { ...scrollableWrap } as const\n","import { Divider, Paper } from '@mui/material'\nimport type { WebAppNavigationType } from '@xylabs/react-app-settings'\nimport { ApplicationAppBar, SystemToolbar } from '@xylabs/react-appbar'\nimport { ErrorBoundary } from '@xylabs/react-error'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport {\n  FlexCol, FlexGrowCol, FlexGrowRow,\n} from '@xylabs/react-flexbox'\nimport type { ReactNode } from 'react'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\n\nimport { WebAppErrorPage } from './ErrorPage.tsx'\n\nexport interface WebAppChromeProps extends FlexBoxProps {\n  appName: string\n  appbar?: ReactNode\n  errorBoundary?: boolean\n  errorPage?: ReactNode\n  footer?: ReactNode\n  footerElevation?: number\n  menuItems?: ReactNode\n  navigationType?: WebAppNavigationType\n}\n\nexport const WebAppChrome = ({\n  ref, appName, appbar, children, errorBoundary, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props\n}: WebAppChromeProps) => {\n  return (\n    <FlexCol id=\"web-chrome-flex\" alignItems=\"stretch\" overflow=\"hidden\" height=\"100vh\" ref={ref} {...props}>\n      <Helmet defaultTitle={appName} titleTemplate={`%s | ${appName}`}>\n        <meta content=\"website\" property=\"og:type\" />\n      </Helmet>\n      {appbar ?? <ApplicationAppBar systemToolbar={<SystemToolbar menuItems={navigationType === 'menu' ? menuItems : undefined} />} />}\n      <FlexGrowRow id=\"sidebar-nav-flex\" overflow=\"hidden\" alignItems=\"stretch\">\n        {navigationType === 'menu'\n          ? null\n          : (\n              <>\n                {menuItems}\n                <Divider orientation=\"vertical\" />\n              </>\n            )}\n        <FlexGrowCol id=\"main-flex\" justifyContent=\"flex-start\" alignItems=\"stretch\">\n          {errorBoundary\n            ? (\n                <ErrorBoundary\n                  fallbackWithError={(error) => {\n                    return errorPage ?? <WebAppErrorPage error={error} />\n                  }}\n                >\n                  {children}\n                </ErrorBoundary>\n              )\n            : children}\n        </FlexGrowCol>\n      </FlexGrowRow>\n      <FlexCol id=\"footer-flex\" alignItems=\"stretch\">\n        <Paper elevation={footerElevation} square>\n          {footer}\n        </Paper>\n      </FlexCol>\n    </FlexCol>\n  )\n}\n\nWebAppChrome.displayName = 'WebAppChrome'\n","import { ButtonEx } from '@xylabs/react-button'\nimport React from 'react'\n\nimport type { WebAppPageProps } from './Page.tsx'\nimport { WebAppPage } from './Page.tsx'\n\nexport interface WebAppErrorPageProps extends WebAppPageProps {\n  error?: Error\n}\n\nexport const WebAppErrorPage: React.FC<WebAppErrorPageProps> = ({ error, ...props }) => (\n  <WebAppPage title=\"Oops! Something went wrong\" {...props}>\n    <h1>Oops! Something went wrong!</h1>\n    <p>{`${error}`}</p>\n    <ButtonEx href=\"/\" variant=\"contained\">\n      Homepage\n    </ButtonEx>\n  </WebAppPage>\n)\n\n/** @deprecated use WebAppErrorPage instead */\nexport const ErrorPage = WebAppErrorPage\n","import type { ContainerProps } from '@mui/material'\nimport { Container, styled } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useUserEvents } from '@xylabs/react-pixel'\nimport { isDefined } from '@xylabs/sdk-js'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\nimport { useLocation } from 'react-router-dom'\n\nimport type { WebAppBodyProps } from './Body.tsx'\nimport { WebAppBody } from './Body.tsx'\nimport { fixedWrap, scrollableWrap } from './lib/index.ts'\n\nconst WebAppPageRoot = styled(FlexGrowCol, {\n  name: 'WebAppPage',\n  shouldForwardProp: propName => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',\n  slot: 'Root',\n})<WebAppPageProps>(({\n  theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\n  const props = variant === 'scrollable' ? scrollableWrap : fixedWrap\n  return {\n    ...props,\n    alignItems: 'stretch',\n    justifyContent: 'start',\n    maxWidth: '100vw',\n    [theme.breakpoints.down(mobileScrollingBreakpoint)]: {\n      inset: 0,\n      position: 'absolute',\n    },\n  }\n})\n\nexport interface WebAppPageProps extends WebAppBodyProps, FlexBoxProps {\n  container?: ContainerProps['maxWidth'] | 'none'\n  disableGutters?: boolean\n}\n\nexport const WebAppPage: React.FC<PropsWithChildren<WebAppPageProps>> = ({\n  disableGutters,\n  disableBreadcrumbGutter,\n  title,\n  container,\n  children,\n  breadcrumbs,\n  mobileScrollingBreakpoint,\n  variant = 'scrollable',\n  ...props\n}) => {\n  const userEvents = useUserEvents()\n  const { pathname } = useLocation()\n\n  useAsyncEffect(\n    async () => {\n      await userEvents?.viewContent({ name: title ?? 'NodeBasePage', path: location.pathname })\n    },\n    [pathname, title, userEvents],\n  )\n\n  return (\n    <WebAppPageRoot mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant} {...props}>\n      <Helmet title={title} />\n      {isDefined(container) && container !== 'none'\n        ? (\n            <Container\n              disableGutters={disableGutters}\n              style={{\n                alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start',\n              }}\n              maxWidth={container}\n            >\n              <WebAppBody\n                disableBreadcrumbGutter={disableBreadcrumbGutter}\n                breadcrumbs={breadcrumbs}\n                mobileScrollingBreakpoint={mobileScrollingBreakpoint}\n                variant={variant}\n                {...props}\n              >\n                {children}\n              </WebAppBody>\n            </Container>\n          )\n        : (\n            <WebAppBody\n              disableBreadcrumbGutter={disableBreadcrumbGutter}\n              breadcrumbs={breadcrumbs}\n              mobileScrollingBreakpoint={mobileScrollingBreakpoint}\n              paddingX={disableGutters ? 0 : 1}\n              variant={variant}\n              {...props}\n            >\n              {children}\n            </WebAppBody>\n          )}\n    </WebAppPageRoot>\n  )\n}\n\n/** @deprecated use WebAppPagePage instead */\nexport const FlexPage = WebAppPage\n","import { NotFound } from '@xylabs/react-shared'\nimport React from 'react'\n\nimport type { WebAppPageProps } from '../Page.tsx'\nimport { WebAppPage } from '../Page.tsx'\n\nexport const WebAppNotFoundPage: React.FC<WebAppPageProps> = ({ title, ...props }) => (\n  <WebAppPage title={title ?? 'Sorry! Page Not Found'} {...props}>\n    <NotFound />\n  </WebAppPage>\n)\n\n/** @deprecated  use WebAppNotFoundPage instead */\nexport const NotFoundPage = WebAppNotFoundPage\n"],"mappings":"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","names":["FlexGrowCol","Helmet","styled","FlexGrowCol","jsx","jsxs","styled","FlexGrowCol","jsx","jsxs","jsx","jsxs","Helmet","FlexGrowCol","jsx"]}
+{"version":3,"sources":["../../src/components/Body.tsx","../../src/components/lib/cssValues.ts","../../src/components/Chrome.tsx","../../src/components/ErrorPage.tsx","../../src/components/Page.tsx","../../src/components/NotFoundPage/Page.tsx"],"sourcesContent":["import type { Breakpoint } from '@mui/material'\nimport { styled } from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport type { ReactNode } from 'react'\nimport React from 'react'\n\nimport { fixedContent, scrollableContent } from './lib/index.ts'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = new Set(['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter'])\nconst defaultStyledOptions = { shouldForwardProp: (prop: string) => !propsNotForwarded.has(prop) }\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n  ...defaultStyledOptions,\n  name: WebAppBodyName,\n  slot: 'Root',\n})<WebAppBodyProps>(({\n  spacing, theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\n  const scrollable = variant === 'scrollable'\n  return theme.unstable_sx({\n    alignItems: 'stretch',\n    gap: 1,\n    justifyContent: 'flex-start',\n    overflowX: 'visible',\n    overflowY: scrollable ? 'scroll' : 'hidden',\n    paddingY: spacing,\n    [theme.breakpoints.down(mobileScrollingBreakpoint)]: { overflowY: 'scroll' },\n  })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n  ...defaultStyledOptions,\n  name: WebAppBodyName,\n  slot: 'Breadcrumb',\n})<WebAppBodyProps>(({\n  theme, disableBreadcrumbGutter, spacing,\n}) =>\n  theme.unstable_sx({\n    justifyContent: 'start',\n    marginX: disableBreadcrumbGutter ? 0 : spacing,\n  }))\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n  name: WebAppBodyName,\n  slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({ alignItems: 'stretch' }))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n  ...defaultStyledOptions,\n  name: WebAppBodyName,\n  slot: 'Scrollable',\n})<WebAppBodyProps>(({\n  theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\n  const props = variant === 'scrollable' ? scrollableContent : fixedContent\n  return {\n    ...props,\n    alignItems: 'stretch',\n    justifyContent: 'start',\n    [theme.breakpoints.down(mobileScrollingBreakpoint)]: {\n      inset: 'unset',\n      position: 'relative',\n    },\n  }\n})\n\nexport interface WebAppBodyProps extends FlexBoxProps {\n  breadcrumbs?: ReactNode\n  disableBreadcrumbGutter?: boolean\n  mobileScrollingBreakpoint?: Breakpoint\n  spacing?: string | number\n  variant?: 'scrollable' | 'fixed'\n}\n\nexport const WebAppBody: React.FC<WebAppBodyProps> = ({\n  children,\n  breadcrumbs,\n  disableBreadcrumbGutter,\n  mobileScrollingBreakpoint,\n  spacing = 1,\n  variant,\n  ...props\n}) => {\n  return (\n    <WebAppBodyRoot mobileScrollingBreakpoint={mobileScrollingBreakpoint} spacing={spacing} variant={variant} {...props}>\n      {breadcrumbs\n        ? (\n            <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n              {breadcrumbs}\n            </WebAppBodyBreadcrumb>\n          )\n        : null}\n      <WebAppBodyScrollableWrapper>\n        <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n          {children}\n        </WebAppBodyScrollable>\n      </WebAppBodyScrollableWrapper>\n    </WebAppBodyRoot>\n  )\n}\n","import type { CSSProperties } from 'react'\n\nexport const scrollableWrap: CSSProperties = {\n  inset: 0,\n  position: 'absolute',\n} as const\n\nexport const fixedWrap: CSSProperties = {\n  inset: 'unset',\n  position: 'relative',\n} as const\n\n// Making a scrollable vs fixed wrapper and content is an inversion of the wrap and content styles\nexport const scrollableContent: CSSProperties = { ...fixedWrap } as const\n\nexport const fixedContent: CSSProperties = { ...scrollableWrap } as const\n","import { Divider, Paper } from '@mui/material'\nimport type { WebAppNavigationType } from '@xylabs/react-app-settings'\nimport { ApplicationAppBar, SystemToolbar } from '@xylabs/react-appbar'\nimport { ErrorBoundary } from '@xylabs/react-error'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport {\n  FlexCol, FlexGrowCol, FlexGrowRow,\n} from '@xylabs/react-flexbox'\nimport type { ReactNode } from 'react'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\n\nimport { WebAppErrorPage } from './ErrorPage.tsx'\n\nexport interface WebAppChromeProps extends FlexBoxProps {\n  appName: string\n  appbar?: ReactNode\n  errorBoundary?: boolean\n  errorPage?: ReactNode\n  footer?: ReactNode\n  footerElevation?: number\n  menuItems?: ReactNode\n  navigationType?: WebAppNavigationType\n}\n\nexport const WebAppChrome = ({\n  ref, appName, appbar, children, errorBoundary, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props\n}: WebAppChromeProps) => {\n  return (\n    <FlexCol\n      id=\"web-chrome-flex\"\n      ref={ref}\n      {...props}\n      sx={{\n        alignItems: 'stretch',\n        overflow: 'hidden',\n        height: '100vh',\n      }}\n    >\n      <Helmet defaultTitle={appName} titleTemplate={`%s | ${appName}`}>\n        <meta content=\"website\" property=\"og:type\" />\n      </Helmet>\n      {appbar ?? <ApplicationAppBar systemToolbar={<SystemToolbar menuItems={navigationType === 'menu' ? menuItems : undefined} />} />}\n      <FlexGrowRow\n        id=\"sidebar-nav-flex\"\n        sx={{\n          overflow: 'hidden',\n          alignItems: 'stretch',\n        }}\n      >\n        {navigationType === 'menu'\n          ? null\n          : (\n              <>\n                {menuItems}\n                <Divider orientation=\"vertical\" />\n              </>\n            )}\n        <FlexGrowCol\n          id=\"main-flex\"\n          sx={{\n            justifyContent: 'flex-start',\n            alignItems: 'stretch',\n          }}\n        >\n          {errorBoundary\n            ? (\n                <ErrorBoundary\n                  fallbackWithError={(error) => {\n                    return errorPage ?? <WebAppErrorPage error={error} />\n                  }}\n                >\n                  {children}\n                </ErrorBoundary>\n              )\n            : children}\n        </FlexGrowCol>\n      </FlexGrowRow>\n      <FlexCol\n        id=\"footer-flex\"\n        sx={{ alignItems: 'stretch' }}\n      >\n        <Paper elevation={footerElevation} square>\n          {footer}\n        </Paper>\n      </FlexCol>\n    </FlexCol>\n  )\n}\n\nWebAppChrome.displayName = 'WebAppChrome'\n","import { ButtonEx } from '@xylabs/react-button'\nimport React from 'react'\n\nimport type { WebAppPageProps } from './Page.tsx'\nimport { WebAppPage } from './Page.tsx'\n\nexport interface WebAppErrorPageProps extends WebAppPageProps {\n  error?: Error\n}\n\nexport const WebAppErrorPage: React.FC<WebAppErrorPageProps> = ({ error, ...props }) => (\n  <WebAppPage title=\"Oops! Something went wrong\" {...props}>\n    <h1>Oops! Something went wrong!</h1>\n    <p>{`${error}`}</p>\n    <ButtonEx href=\"/\" variant=\"contained\">\n      Homepage\n    </ButtonEx>\n  </WebAppPage>\n)\n\n/** @deprecated use WebAppErrorPage instead */\nexport const ErrorPage = WebAppErrorPage\n","import type { ContainerProps } from '@mui/material'\nimport { Container, styled } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useUserEvents } from '@xylabs/react-pixel'\nimport { isDefined } from '@xylabs/sdk-js'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\nimport { useLocation } from 'react-router-dom'\n\nimport type { WebAppBodyProps } from './Body.tsx'\nimport { WebAppBody } from './Body.tsx'\nimport { fixedWrap, scrollableWrap } from './lib/index.ts'\n\nconst WebAppPageRoot = styled(FlexGrowCol, {\n  name: 'WebAppPage',\n  shouldForwardProp: propName => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',\n  slot: 'Root',\n})<WebAppPageProps>(({\n  theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\n  const props = variant === 'scrollable' ? scrollableWrap : fixedWrap\n  return {\n    ...props,\n    alignItems: 'stretch',\n    justifyContent: 'start',\n    maxWidth: '100vw',\n    [theme.breakpoints.down(mobileScrollingBreakpoint)]: {\n      inset: 0,\n      position: 'absolute',\n    },\n  }\n})\n\nexport interface WebAppPageProps extends WebAppBodyProps, FlexBoxProps {\n  container?: ContainerProps['maxWidth'] | 'none'\n  disableGutters?: boolean\n}\n\nexport const WebAppPage: React.FC<PropsWithChildren<WebAppPageProps>> = ({\n  disableGutters,\n  disableBreadcrumbGutter,\n  title,\n  container,\n  children,\n  breadcrumbs,\n  mobileScrollingBreakpoint,\n  variant = 'scrollable',\n  ...props\n}) => {\n  const userEvents = useUserEvents()\n  const { pathname } = useLocation()\n\n  useAsyncEffect(\n    async () => {\n      await userEvents?.viewContent({ name: title ?? 'NodeBasePage', path: location.pathname })\n    },\n    [pathname, title, userEvents],\n  )\n\n  return (\n    <WebAppPageRoot mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant} {...props}>\n      <Helmet title={title} />\n      {isDefined(container) && container !== 'none'\n        ? (\n            <Container\n              disableGutters={disableGutters}\n              style={{\n                alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start',\n              }}\n              maxWidth={container}\n            >\n              <WebAppBody\n                disableBreadcrumbGutter={disableBreadcrumbGutter}\n                breadcrumbs={breadcrumbs}\n                mobileScrollingBreakpoint={mobileScrollingBreakpoint}\n                variant={variant}\n                {...props}\n              >\n                {children}\n              </WebAppBody>\n            </Container>\n          )\n        : (\n            <WebAppBody\n              disableBreadcrumbGutter={disableBreadcrumbGutter}\n              breadcrumbs={breadcrumbs}\n              mobileScrollingBreakpoint={mobileScrollingBreakpoint}\n              variant={variant}\n              {...props}\n              sx={{ paddingX: disableGutters ? 0 : 1 }}\n            >\n              {children}\n            </WebAppBody>\n          )}\n    </WebAppPageRoot>\n  )\n}\n\n/** @deprecated use WebAppPagePage instead */\nexport const FlexPage = WebAppPage\n","import { NotFound } from '@xylabs/react-shared'\nimport React from 'react'\n\nimport type { WebAppPageProps } from '../Page.tsx'\nimport { WebAppPage } from '../Page.tsx'\n\nexport const WebAppNotFoundPage: React.FC<WebAppPageProps> = ({ title, ...props }) => (\n  <WebAppPage title={title ?? 'Sorry! Page Not Found'} {...props}>\n    <NotFound />\n  </WebAppPage>\n)\n\n/** @deprecated  use WebAppNotFoundPage instead */\nexport const NotFoundPage = WebAppNotFoundPage\n"],"mappings":";AACA,SAAS,cAAc;AAEvB,SAAS,aAAa,eAAe;;;ACD9B,IAAM,iBAAgC;AAAA,EAC3C,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,IAAM,YAA2B;AAAA,EACtC,OAAO;AAAA,EACP,UAAU;AACZ;AAGO,IAAM,oBAAmC,EAAE,GAAG,UAAU;AAExD,IAAM,eAA8B,EAAE,GAAG,eAAe;;;ADuE3D,SAGQ,KAHR;AA7EJ,IAAM,iBAAiB;AACvB,IAAM,oBAAoB,oBAAI,IAAI,CAAC,6BAA6B,WAAW,WAAW,yBAAyB,CAAC;AAChH,IAAM,uBAAuB,EAAE,mBAAmB,CAAC,SAAiB,CAAC,kBAAkB,IAAI,IAAI,EAAE;AAEjG,IAAM,iBAAiB,OAAO,aAAa;AAAA,EACzC,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAS;AAAA,EAAO,4BAA4B;AAAA,EAAM;AACpD,MAAM;AACJ,QAAM,aAAa,YAAY;AAC/B,SAAO,MAAM,YAAY;AAAA,IACvB,YAAY;AAAA,IACZ,KAAK;AAAA,IACL,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,WAAW,aAAa,WAAW;AAAA,IACnC,UAAU;AAAA,IACV,CAAC,MAAM,YAAY,KAAK,yBAAyB,CAAC,GAAG,EAAE,WAAW,SAAS;AAAA,EAC7E,CAAC;AACH,CAAC;AAED,IAAM,uBAAuB,OAAO,SAAS;AAAA,EAC3C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAO;AAAA,EAAyB;AAClC,MACE,MAAM,YAAY;AAAA,EAChB,gBAAgB;AAAA,EAChB,SAAS,0BAA0B,IAAI;AACzC,CAAC,CAAC;AAEJ,IAAM,8BAA8B,OAAO,aAAa;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,OAAO,EAAE,YAAY,UAAU,EAAE;AAErD,IAAM,uBAAuB,OAAO,aAAa;AAAA,EAC/C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAO,4BAA4B;AAAA,EAAM;AAC3C,MAAM;AACJ,QAAM,QAAQ,YAAY,eAAe,oBAAoB;AAC7D,SAAO;AAAA,IACL,GAAG;AAAA,IACH,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,CAAC,MAAM,YAAY,KAAK,yBAAyB,CAAC,GAAG;AAAA,MACnD,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,EACF;AACF,CAAC;AAUM,IAAM,aAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,GAAG;AACL,MAAM;AACJ,SACE,qBAAC,kBAAe,2BAAsD,SAAkB,SAAmB,GAAG,OAC3G;AAAA,kBAEK,oBAAC,wBAAqB,yBAAkD,SACrE,uBACH,IAEF;AAAA,IACJ,oBAAC,+BACC,8BAAC,wBAAqB,2BAAsD,SACzE,UACH,GACF;AAAA,KACF;AAEJ;;;AErGA,SAAS,SAAS,aAAa;AAE/B,SAAS,mBAAmB,qBAAqB;AACjD,SAAS,qBAAqB;AAE9B;AAAA,EACE;AAAA,EAAS,eAAAA;AAAA,EAAa;AAAA,OACjB;AAGP,SAAS,UAAAC,eAAc;;;ACVvB,SAAS,gBAAgB;;;ACCzB,SAAS,WAAW,UAAAC,eAAc;AAClC,SAAS,sBAAsB;AAE/B,SAAS,eAAAC,oBAAmB;AAC5B,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAG1B,SAAS,cAAc;AACvB,SAAS,mBAAmB;AAqDxB,SACE,OAAAC,MADF,QAAAC,aAAA;AA/CJ,IAAM,iBAAiBC,QAAOC,cAAa;AAAA,EACzC,MAAM;AAAA,EACN,mBAAmB,cAAY,aAAa,+BAA+B,aAAa;AAAA,EACxF,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAO,4BAA4B;AAAA,EAAM;AAC3C,MAAM;AACJ,QAAM,QAAQ,YAAY,eAAe,iBAAiB;AAC1D,SAAO;AAAA,IACL,GAAG;AAAA,IACH,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,CAAC,MAAM,YAAY,KAAK,yBAAyB,CAAC,GAAG;AAAA,MACnD,OAAO;AAAA,MACP,UAAU;AAAA,IACZ;AAAA,EACF;AACF,CAAC;AAOM,IAAM,aAA2D,CAAC;AAAA,EACvE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AACJ,QAAM,aAAa,cAAc;AACjC,QAAM,EAAE,SAAS,IAAI,YAAY;AAEjC;AAAA,IACE,YAAY;AACV,YAAM,YAAY,YAAY,EAAE,MAAM,SAAS,gBAAgB,MAAM,SAAS,SAAS,CAAC;AAAA,IAC1F;AAAA,IACA,CAAC,UAAU,OAAO,UAAU;AAAA,EAC9B;AAEA,SACE,gBAAAF,MAAC,kBAAe,2BAAsD,SAAmB,GAAG,OAC1F;AAAA,oBAAAD,KAAC,UAAO,OAAc;AAAA,IACrB,UAAU,SAAS,KAAK,cAAc,SAEjC,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,UACL,YAAY;AAAA,UAAW,SAAS;AAAA,UAAQ,eAAe;AAAA,UAAU,UAAU;AAAA,UAAG,gBAAgB;AAAA,QAChG;AAAA,QACA,UAAU;AAAA,QAEV,0BAAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACC,GAAG;AAAA,YAEH;AAAA;AAAA,QACH;AAAA;AAAA,IACF,IAGA,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QACJ,IAAI,EAAE,UAAU,iBAAiB,IAAI,EAAE;AAAA,QAEtC;AAAA;AAAA,IACH;AAAA,KAER;AAEJ;AAGO,IAAM,WAAW;;;AD3FtB,SACE,OAAAI,MADF,QAAAC,aAAA;AADK,IAAM,kBAAkD,CAAC,EAAE,OAAO,GAAG,MAAM,MAChF,gBAAAA,MAAC,cAAW,OAAM,8BAA8B,GAAG,OACjD;AAAA,kBAAAD,KAAC,QAAG,yCAA2B;AAAA,EAC/B,gBAAAA,KAAC,OAAG,aAAG,KAAK,IAAG;AAAA,EACf,gBAAAA,KAAC,YAAS,MAAK,KAAI,SAAQ,aAAY,sBAEvC;AAAA,GACF;AAIK,IAAM,YAAY;;;ADmBjB,SAaM,UAbN,OAAAE,MAaM,QAAAC,aAbN;AAfD,IAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EAAK;AAAA,EAAS;AAAA,EAAQ;AAAA,EAAU;AAAA,EAAe;AAAA,EAAW;AAAA,EAAQ,kBAAkB;AAAA,EAAG;AAAA,EAAW,iBAAiB;AAAA,EAAQ,GAAG;AAChI,MAAyB;AACvB,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH;AAAA,MACC,GAAG;AAAA,MACJ,IAAI;AAAA,QACF,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,QAAQ;AAAA,MACV;AAAA,MAEA;AAAA,wBAAAD,KAACE,SAAA,EAAO,cAAc,SAAS,eAAe,QAAQ,OAAO,IAC3D,0BAAAF,KAAC,UAAK,SAAQ,WAAU,UAAS,WAAU,GAC7C;AAAA,QACC,UAAU,gBAAAA,KAAC,qBAAkB,eAAe,gBAAAA,KAAC,iBAAc,WAAW,mBAAmB,SAAS,YAAY,QAAW,GAAI;AAAA,QAC9H,gBAAAC;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAI;AAAA,cACF,UAAU;AAAA,cACV,YAAY;AAAA,YACd;AAAA,YAEC;AAAA,iCAAmB,SAChB,OAEE,gBAAAA,MAAA,YACG;AAAA;AAAA,gBACD,gBAAAD,KAAC,WAAQ,aAAY,YAAW;AAAA,iBAClC;AAAA,cAEN,gBAAAA;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,IAAG;AAAA,kBACH,IAAI;AAAA,oBACF,gBAAgB;AAAA,oBAChB,YAAY;AAAA,kBACd;AAAA,kBAEC,0BAEK,gBAAAH;AAAA,oBAAC;AAAA;AAAA,sBACC,mBAAmB,CAAC,UAAU;AAC5B,+BAAO,aAAa,gBAAAA,KAAC,mBAAgB,OAAc;AAAA,sBACrD;AAAA,sBAEC;AAAA;AAAA,kBACH,IAEF;AAAA;AAAA,cACN;AAAA;AAAA;AAAA,QACF;AAAA,QACA,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAI,EAAE,YAAY,UAAU;AAAA,YAE5B,0BAAAA,KAAC,SAAM,WAAW,iBAAiB,QAAM,MACtC,kBACH;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,aAAa,cAAc;;;AG1F3B,SAAS,gBAAgB;AAQrB,gBAAAI,YAAA;AAFG,IAAM,qBAAgD,CAAC,EAAE,OAAO,GAAG,MAAM,MAC9E,gBAAAA,KAAC,cAAW,OAAO,SAAS,yBAA0B,GAAG,OACvD,0BAAAA,KAAC,YAAS,GACZ;AAIK,IAAM,eAAe;","names":["FlexGrowCol","Helmet","styled","FlexGrowCol","jsx","jsxs","styled","FlexGrowCol","jsx","jsxs","jsx","jsxs","Helmet","FlexGrowCol","jsx"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xylabs/react-webapp",
-  "version": "7.2.4",
+  "version": "8.0.0",
   "description": "Common React library for all XY Labs projects that use React",
   "keywords": [
     "utility",
@@ -40,30 +40,30 @@
     "README.md"
   ],
   "dependencies": {
-    "@xylabs/react-app-settings": "~7.2.4",
-    "@xylabs/react-async-effect": "~7.2.4",
-    "@xylabs/react-appbar": "~7.2.4",
-    "@xylabs/react-error": "~7.2.4",
-    "@xylabs/react-flexbox": "~7.2.4",
-    "@xylabs/react-button": "~7.2.4",
-    "@xylabs/react-pixel": "~7.2.4",
-    "@xylabs/react-shared": "~7.2.4"
+    "@xylabs/react-app-settings": "~8.0.0",
+    "@xylabs/react-appbar": "~8.0.0",
+    "@xylabs/react-async-effect": "~8.0.0",
+    "@xylabs/react-button": "~8.0.0",
+    "@xylabs/react-error": "~8.0.0",
+    "@xylabs/react-flexbox": "~8.0.0",
+    "@xylabs/react-pixel": "~8.0.0",
+    "@xylabs/react-shared": "~8.0.0"
   },
   "devDependencies": {
-    "@mui/icons-material": "~7.3.10",
-    "@mui/material": "~7.3.10",
+    "@mui/icons-material": "~9.0.0",
+    "@mui/material": "~9.0.0",
     "@opentelemetry/api": "^1.9.1",
     "@opentelemetry/sdk-trace-base": "~2.7.1",
     "@react-spring/web": "~10.0.3",
     "@storybook/react-vite": "~10.3.6",
     "@types/react": "^19.2.14",
     "@types/react-helmet": "~6.1.11",
-    "@xylabs/pixel": "^5.1.2",
-    "@xylabs/sdk-js": "^5.1.2",
-    "@xylabs/toolchain": "~7.13.15",
-    "@xylabs/tsconfig": "~7.13.15",
-    "@xylabs/tsconfig-dom": "~7.13.15",
-    "@xylabs/tsconfig-react": "~7.13.15",
+    "@xylabs/pixel": "^5.1.0",
+    "@xylabs/sdk-js": "^5.1.0",
+    "@xylabs/toolchain": "~7.13.0",
+    "@xylabs/tsconfig": "~7.13.0",
+    "@xylabs/tsconfig-dom": "~7.13.0",
+    "@xylabs/tsconfig-react": "~7.13.0",
     "async-mutex": "~0.5.0",
     "bn.js": "~5.2.3",
     "bowser": "~2.14.1",
@@ -76,10 +76,10 @@
     "mixpanel-browser": "^2.78.0",
     "pako": "~2.1.0",
     "query-string": "~9.3.1",
-    "react": "^19.2.6",
-    "react-dom": "^19.2.6",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
     "react-helmet": "~6.1.0",
-    "react-is": "^19.2.6",
+    "react-is": "^19.2.5",
     "react-router-dom": "^7.15.0",
     "recharts": "~3.8.1",
     "spark-md5": "~3.0.2",
@@ -87,35 +87,35 @@
     "typescript": "^5.9.3",
     "vite": "~8.0.10",
     "zod": "^4.4.3",
-    "@xylabs/react-link": "~7.2.4"
+    "@xylabs/react-link": "~8.0.0"
   },
   "peerDependencies": {
-    "@mui/icons-material": "~7.3",
-    "@mui/material": "~7.3",
-    "@opentelemetry/api": "^1.9",
-    "@opentelemetry/sdk-trace-base": "~2.7",
-    "@react-spring/web": "~10.0",
-    "@xylabs/pixel": "^5.1",
-    "@xylabs/sdk-js": "^5.1",
-    "async-mutex": "~0.5",
-    "bn.js": "~5.2",
-    "bowser": "~2.14",
-    "buffer": "~6.0",
-    "chalk": "~5.6",
-    "ethers": "~6.16",
-    "fast-deep-equal": "~3.1",
-    "js-cookie": "~3.0",
-    "mixpanel-browser": "^2.78",
-    "pako": "~2.1",
-    "query-string": "~9.3",
-    "react": "^19.2",
-    "react-dom": "^19.2",
-    "react-helmet": "~6.1",
-    "react-is": "^19.2",
-    "react-router-dom": "^7.15",
-    "recharts": "~3.8",
-    "spark-md5": "~3.0",
-    "zod": "^4.4"
+    "@mui/icons-material": ">=9.0.0 <9.1",
+    "@mui/material": ">=9.0.0 <9.1",
+    "@opentelemetry/api": ">=1.9.1 <2",
+    "@opentelemetry/sdk-trace-base": ">=2.7.1 <2.8",
+    "@react-spring/web": ">=10.0.3 <10.1",
+    "@xylabs/pixel": ">=5.1.0 <6",
+    "@xylabs/sdk-js": ">=5.1.0 <6",
+    "async-mutex": ">=0.5.0 <0.6",
+    "bn.js": ">=5.2.3 <5.3",
+    "bowser": ">=2.14.1 <2.15",
+    "buffer": ">=6.0.3 <6.1",
+    "chalk": ">=5.6.2 <5.7",
+    "ethers": ">=6.16.0 <6.17",
+    "fast-deep-equal": ">=3.1.3 <3.2",
+    "js-cookie": ">=3.0.5 <3.1",
+    "mixpanel-browser": ">=2.78.0 <3",
+    "pako": ">=2.1.0 <2.2",
+    "query-string": ">=9.3.1 <9.4",
+    "react": ">=19.2.5 <20",
+    "react-dom": ">=19.2.5 <20",
+    "react-helmet": ">=6.1.0 <6.2",
+    "react-is": ">=19.2.5 <20",
+    "react-router-dom": ">=7.15.0 <8",
+    "recharts": ">=3.8.1 <3.9",
+    "spark-md5": ">=3.0.2 <3.1",
+    "zod": ">=4.4.3 <5"
   },
   "publishConfig": {
     "access": "public"