@xyo-network/react-webapp 2.47.4 → 2.47.6

package/dist/esm/components/Chrome.js

@@ -4,11 +4,13 @@ import { FlexCol, FlexGrowCol, FlexGrowRow } from '@xylabs/react-flexbox';
 import { ApplicationAppBar, SystemToolbar } from '@xyo-network/react-appbar';
 import { Footer } from '@xyo-network/react-footer';
 import { ErrorBoundary } from '@xyo-network/react-shared';
+import { forwardRef } from 'react';
 import { Helmet } from 'react-helmet';
 import { WebAppErrorPage } from './ErrorPage';
-export const WebAppChrome = ({ appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props }) => {
-    return (_jsxs(FlexCol, { id: "web-chrome-flex", alignItems: "stretch", overflow: "hidden", height: "100vh", ...props, children: [_jsx(Helmet, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: _jsx("meta", { content: "website", property: "og:type" }) }), appbar ?? _jsx(ApplicationAppBar, { systemToolbar: _jsx(SystemToolbar, { menuItems: navigationType === 'menu' ? menuItems : undefined }) }), _jsxs(FlexGrowRow, { id: "sidebar-nav-flex", overflow: "hidden", alignItems: "stretch", children: [navigationType !== 'menu' ? (_jsxs(_Fragment, { children: [menuItems, _jsx(Divider, { orientation: "vertical" })] })) : null, _jsx(FlexGrowCol, { id: "main-flex", justifyContent: "flex-start", alignItems: "stretch", children: _jsx(ErrorBoundary, { fallbackWithError: (error) => {
+export const WebAppChrome = forwardRef(({ appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props }, ref) => {
+    return (_jsxs(FlexCol, { id: "web-chrome-flex", alignItems: "stretch", overflow: "hidden", height: "100vh", ref: ref, ...props, children: [_jsx(Helmet, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: _jsx("meta", { content: "website", property: "og:type" }) }), appbar ?? _jsx(ApplicationAppBar, { systemToolbar: _jsx(SystemToolbar, { menuItems: navigationType === 'menu' ? menuItems : undefined }) }), _jsxs(FlexGrowRow, { id: "sidebar-nav-flex", overflow: "hidden", alignItems: "stretch", children: [navigationType !== 'menu' ? (_jsxs(_Fragment, { children: [menuItems, _jsx(Divider, { orientation: "vertical" })] })) : null, _jsx(FlexGrowCol, { id: "main-flex", justifyContent: "flex-start", alignItems: "stretch", children: _jsx(ErrorBoundary, { fallbackWithError: (error) => {
                                 return errorPage ?? _jsx(WebAppErrorPage, { error: error });
                             }, children: children }) })] }), _jsx(FlexCol, { id: "footer-flex", alignItems: "stretch", children: _jsx(Paper, { elevation: footerElevation, square: true, children: footer ?? _jsx(Footer, { dynamicHeight: true }) }) })] }));
-};
+});
+WebAppChrome.displayName = 'WebAppChrome';
 //# sourceMappingURL=Chrome.js.map

package/dist/esm/components/Chrome.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chrome.js","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAgB,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAEvF,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEzD,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AAErC,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAY7C,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EACxD,OAAO,EACP,MAAM,EACN,QAAQ,EACR,SAAS,EACT,MAAM,EACN,eAAe,GAAG,CAAC,EACnB,SAAS,EACT,cAAc,GAAG,MAAM,EACvB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,OAAO,CACL,MAAC,OAAO,IAAC,EAAE,EAAC,iBAAiB,EAAC,UAAU,EAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAC,MAAM,EAAC,OAAO,KAAK,KAAK,aAC3F,KAAC,MAAM,IAAC,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,OAAO,EAAE,YAC7D,eAAM,OAAO,EAAC,SAAS,EAAC,QAAQ,EAAC,SAAS,GAAG,GACtC,EACR,MAAM,IAAI,KAAC,iBAAiB,IAAC,aAAa,EAAE,KAAC,aAAa,IAAC,SAAS,EAAE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GAAI,GAAI,EAChI,MAAC,WAAW,IAAC,EAAE,EAAC,kBAAkB,EAAC,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAC,SAAS,aACtE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,CAC3B,8BACG,SAAS,EACV,KAAC,OAAO,IAAC,WAAW,EAAC,UAAU,GAAG,IACjC,CACJ,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,WAAW,IAAC,EAAE,EAAC,WAAW,EAAC,cAAc,EAAC,YAAY,EAAC,UAAU,EAAC,SAAS,YAC1E,KAAC,aAAa,IACZ,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE;gCAC3B,OAAO,SAAS,IAAI,KAAC,eAAe,IAAC,KAAK,EAAE,KAAK,GAAI,CAAA;4BACvD,CAAC,YAEA,QAAQ,GACK,GACJ,IACF,EACd,KAAC,OAAO,IAAC,EAAE,EAAC,aAAa,EAAC,UAAU,EAAC,SAAS,YAC5C,KAAC,KAAK,IAAC,SAAS,EAAE,eAAe,EAAE,MAAM,kBACtC,MAAM,IAAI,KAAC,MAAM,IAAC,aAAa,SAAG,GAC7B,GACA,IACF,CACX,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Chrome.js","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AAC9C,OAAO,EAAgB,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAEvF,OAAO,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAA;AACzD,OAAO,EAAE,UAAU,EAAa,MAAM,OAAO,CAAA;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AAErC,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AAY7C,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,cAAc,GAAG,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC3H,OAAO,CACL,MAAC,OAAO,IAAC,EAAE,EAAC,iBAAiB,EAAC,UAAU,EAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAC,MAAM,EAAC,OAAO,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,aACrG,KAAC,MAAM,IAAC,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,OAAO,EAAE,YAC7D,eAAM,OAAO,EAAC,SAAS,EAAC,QAAQ,EAAC,SAAS,GAAG,GACtC,EACR,MAAM,IAAI,KAAC,iBAAiB,IAAC,aAAa,EAAE,KAAC,aAAa,IAAC,SAAS,EAAE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GAAI,GAAI,EAChI,MAAC,WAAW,IAAC,EAAE,EAAC,kBAAkB,EAAC,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAC,SAAS,aACtE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,CAC3B,8BACG,SAAS,EACV,KAAC,OAAO,IAAC,WAAW,EAAC,UAAU,GAAG,IACjC,CACJ,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,WAAW,IAAC,EAAE,EAAC,WAAW,EAAC,cAAc,EAAC,YAAY,EAAC,UAAU,EAAC,SAAS,YAC1E,KAAC,aAAa,IACZ,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE;gCAC3B,OAAO,SAAS,IAAI,KAAC,eAAe,IAAC,KAAK,EAAE,KAAK,GAAI,CAAA;4BACvD,CAAC,YAEA,QAAQ,GACK,GACJ,IACF,EACd,KAAC,OAAO,IAAC,EAAE,EAAC,aAAa,EAAC,UAAU,EAAC,SAAS,YAC5C,KAAC,KAAK,IAAC,SAAS,EAAE,eAAe,EAAE,MAAM,kBACtC,MAAM,IAAI,KAAC,MAAM,IAAC,aAAa,SAAG,GAC7B,GACA,IACF,CACX,CAAA;AACH,CAAC,CACF,CAAA;AAED,YAAY,CAAC,WAAW,GAAG,cAAc,CAAA"}

package/dist/types/components/Chrome.d.ts

@@ -10,5 +10,5 @@ export interface WebAppChromeProps extends FlexBoxProps {
     menuItems?: ReactNode;
     navigationType?: WebAppNavigationType;
 }
-export declare const WebAppChrome: React.FC<WebAppChromeProps>;
+export declare const WebAppChrome: import("react").ForwardRefExoticComponent<WebAppChromeProps & import("react").RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=Chrome.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Chrome.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAqC,MAAM,uBAAuB,CAAA;AACvF,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAA;AAItE,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKjC,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,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,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyCpD,CAAA"}
+{"version":3,"file":"Chrome.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAqC,MAAM,uBAAuB,CAAA;AACvF,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAA;AAItE,OAAO,EAAc,SAAS,EAAE,MAAM,OAAO,CAAA;AAK7C,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,OAAO,EAAE,MAAM,CAAA;IACf,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,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,8GAiCxB,CAAA"}

package/package.json

@@ -10,10 +10,10 @@
     "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
   },
   "dependencies": {
-    "@xyo-network/react-app-settings": "^2.47.4",
-    "@xyo-network/react-appbar": "^2.47.4",
-    "@xyo-network/react-footer": "^2.47.4",
-    "@xyo-network/react-shared": "^2.47.4"
+    "@xyo-network/react-app-settings": "^2.47.6",
+    "@xyo-network/react-appbar": "^2.47.6",
+    "@xyo-network/react-footer": "^2.47.6",
+    "@xyo-network/react-shared": "^2.47.6"
   },
   "peerDependencies": {
     "@mui/icons-material": "^5",
@@ -90,5 +90,5 @@
   },
   "sideEffects": false,
   "types": "dist/types/index.d.ts",
-  "version": "2.47.4"
+  "version": "2.47.6"
 }

package/src/components/Chrome.tsx

@@ -4,7 +4,7 @@ import { WebAppNavigationType } from '@xyo-network/react-app-settings'
 import { ApplicationAppBar, SystemToolbar } from '@xyo-network/react-appbar'
 import { Footer } from '@xyo-network/react-footer'
 import { ErrorBoundary } from '@xyo-network/react-shared'
-import { ReactNode } from 'react'
+import { forwardRef, ReactNode } from 'react'
 import { Helmet } from 'react-helmet'
 
 import { WebAppErrorPage } from './ErrorPage'
@@ -19,45 +19,39 @@ export interface WebAppChromeProps extends FlexBoxProps {
   navigationType?: WebAppNavigationType
 }
 
-export const WebAppChrome: React.FC<WebAppChromeProps> = ({
-  appName,
-  appbar,
-  children,
-  errorPage,
-  footer,
-  footerElevation = 4,
-  menuItems,
-  navigationType = 'menu',
-  ...props
-}) => {
-  return (
-    <FlexCol id="web-chrome-flex" alignItems="stretch" overflow="hidden" height="100vh" {...props}>
-      <Helmet defaultTitle={appName} titleTemplate={`%s | ${appName}`}>
-        <meta content="website" property="og:type" />
-      </Helmet>
-      {appbar ?? <ApplicationAppBar systemToolbar={<SystemToolbar menuItems={navigationType === 'menu' ? menuItems : undefined} />} />}
-      <FlexGrowRow id="sidebar-nav-flex" overflow="hidden" alignItems="stretch">
-        {navigationType !== 'menu' ? (
-          <>
-            {menuItems}
-            <Divider orientation="vertical" />
-          </>
-        ) : null}
-        <FlexGrowCol id="main-flex" justifyContent="flex-start" alignItems="stretch">
-          <ErrorBoundary
-            fallbackWithError={(error) => {
-              return errorPage ?? <WebAppErrorPage error={error} />
-            }}
-          >
-            {children}
-          </ErrorBoundary>
-        </FlexGrowCol>
-      </FlexGrowRow>
-      <FlexCol id="footer-flex" alignItems="stretch">
-        <Paper elevation={footerElevation} square>
-          {footer ?? <Footer dynamicHeight />}
-        </Paper>
+export const WebAppChrome = forwardRef<HTMLDivElement, WebAppChromeProps>(
+  ({ appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props }, ref) => {
+    return (
+      <FlexCol id="web-chrome-flex" alignItems="stretch" overflow="hidden" height="100vh" ref={ref} {...props}>
+        <Helmet defaultTitle={appName} titleTemplate={`%s | ${appName}`}>
+          <meta content="website" property="og:type" />
+        </Helmet>
+        {appbar ?? <ApplicationAppBar systemToolbar={<SystemToolbar menuItems={navigationType === 'menu' ? menuItems : undefined} />} />}
+        <FlexGrowRow id="sidebar-nav-flex" overflow="hidden" alignItems="stretch">
+          {navigationType !== 'menu' ? (
+            <>
+              {menuItems}
+              <Divider orientation="vertical" />
+            </>
+          ) : null}
+          <FlexGrowCol id="main-flex" justifyContent="flex-start" alignItems="stretch">
+            <ErrorBoundary
+              fallbackWithError={(error) => {
+                return errorPage ?? <WebAppErrorPage error={error} />
+              }}
+            >
+              {children}
+            </ErrorBoundary>
+          </FlexGrowCol>
+        </FlexGrowRow>
+        <FlexCol id="footer-flex" alignItems="stretch">
+          <Paper elevation={footerElevation} square>
+            {footer ?? <Footer dynamicHeight />}
+          </Paper>
+        </FlexCol>
       </FlexCol>
-    </FlexCol>
-  )
-}
+    )
+  },
+)
+
+WebAppChrome.displayName = 'WebAppChrome'