@xyo-network/react-webapp 2.25.64 → 2.25.67

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/esm/components/Chrome.js +1 -1
  2. package/dist/esm/components/Chrome.js.map +1 -1
  3. package/package.json +10 -10
  4. package/src/components/Chrome.stories.tsx +12 -2
  5. package/src/components/Chrome.tsx +8 -6
package/dist/esm/components/Chrome.js CHANGED
@@ -7,6 +7,6 @@ import { ErrorBoundary } from '@xyo-network/react-shared';
7
7
  import { Helmet } from 'react-helmet';
8
8
  import { WebAppErrorPage } from './ErrorPage';
9
9
  export const WebAppChrome = ({ menuItems, navigationType = 'menu', footerElevation = 4, errorPage, appbar, footer, children, appName, ...props }) => {
10
- return (_jsxs(FlexCol, { alignItems: "stretch", height: "100vh", ...props, children: [_jsx(Helmet, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: _jsx("meta", { content: "website", property: "og:type" }) }), appbar ?? _jsx(ApplicationAppBar, { menuItems: navigationType === 'menu' ? menuItems : undefined }), _jsxs(FlexGrowRow, { alignItems: "stretch", children: [navigationType !== 'menu' ? (_jsxs(_Fragment, { children: [menuItems, _jsx(Divider, { orientation: "vertical" })] })) : null, _jsx(FlexGrowCol, { overflow: "hidden", justifyContent: "flex-start", alignItems: "stretch", children: _jsx(ErrorBoundary, { fallback: errorPage ?? _jsx(WebAppErrorPage, {}), children: children }) })] }), _jsx(Paper, { elevation: footerElevation, square: true, children: footer ?? _jsx(Footer, { dynamicHeight: true }) })] }));
10
+ return (_jsxs(FlexCol, { 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, { menuItems: navigationType === 'menu' ? menuItems : undefined }), _jsxs(FlexGrowRow, { overflow: "hidden", alignItems: "stretch", children: [navigationType !== 'menu' ? (_jsxs(_Fragment, { children: [menuItems, _jsx(Divider, { orientation: "vertical" })] })) : null, _jsx(FlexGrowCol, { justifyContent: "flex-start", alignItems: "stretch", children: _jsx(ErrorBoundary, { fallback: errorPage ?? _jsx(WebAppErrorPage, {}), children: children }) })] }), _jsx(FlexCol, { alignItems: "stretch", children: _jsx(Paper, { elevation: footerElevation, square: true, children: footer ?? _jsx(Footer, { dynamicHeight: true }) }) })] }));
11
11
  };
12
12
  //# sourceMappingURL=Chrome.js.map
package/dist/esm/components/Chrome.js.map CHANGED
@@ -1 +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,EAAW,MAAM,uBAAuB,CAAA;AAEhG,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AAC7D,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,EAAE,SAAS,EAAE,cAAc,GAAG,MAAM,EAAE,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC/K,OAAO,CACL,MAAC,OAAO,IAAC,UAAU,EAAC,SAAS,EAAC,MAAM,EAAC,OAAO,KAAK,KAAK,aACpD,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,SAAS,EAAE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GAAI,EAC9F,MAAC,WAAW,IAAC,UAAU,EAAC,SAAS,aAC9B,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,QAAQ,EAAC,QAAQ,EAAC,cAAc,EAAC,YAAY,EAAC,UAAU,EAAC,SAAS,YAC7E,KAAC,aAAa,IAAC,QAAQ,EAAE,SAAS,IAAI,KAAC,eAAe,KAAG,YAAG,QAAQ,GAAiB,GACzE,IACF,EACd,KAAC,KAAK,IAAC,SAAS,EAAE,eAAe,EAAE,MAAM,kBACtC,MAAM,IAAI,KAAC,MAAM,IAAC,aAAa,SAAG,GAC7B,IACA,CACX,CAAA;AACH,CAAC,CAAA"}
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,EAAW,MAAM,uBAAuB,CAAA;AAEhG,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AAC7D,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,EAAE,SAAS,EAAE,cAAc,GAAG,MAAM,EAAE,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC/K,OAAO,CACL,MAAC,OAAO,IAAC,UAAU,EAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAC,MAAM,EAAC,OAAO,KAAK,KAAK,aACtE,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,SAAS,EAAE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GAAI,EAC9F,MAAC,WAAW,IAAC,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAC,SAAS,aAChD,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,cAAc,EAAC,YAAY,EAAC,UAAU,EAAC,SAAS,YAC3D,KAAC,aAAa,IAAC,QAAQ,EAAE,SAAS,IAAI,KAAC,eAAe,KAAG,YAAG,QAAQ,GAAiB,GACzE,IACF,EACd,KAAC,OAAO,IAAC,UAAU,EAAC,SAAS,YAC3B,KAAC,KAAK,IAAC,SAAS,EAAE,eAAe,EAAE,MAAM,kBACtC,MAAM,IAAI,KAAC,MAAM,IAAC,aAAa,SAAG,GAC7B,GACA,IACF,CACX,CAAA;AACH,CAAC,CAAA"}
package/package.json CHANGED
@@ -13,14 +13,14 @@
13
13
  "@emotion/react": "^11.9.3",
14
14
  "@emotion/styled": "^11.9.3",
15
15
  "@mui/material": "^5.8.4",
16
- "@xylabs/react-button": "^2.14.3",
17
- "@xylabs/react-flexbox": "^2.14.3",
18
- "@xylabs/react-pixel": "^2.14.3",
19
- "@xylabs/react-shared": "^2.14.3",
20
- "@xyo-network/react-app-settings": "^2.25.63",
21
- "@xyo-network/react-appbar": "^2.25.64",
22
- "@xyo-network/react-footer": "^2.25.64",
23
- "@xyo-network/react-shared": "^2.25.64",
16
+ "@xylabs/react-button": "^2.14.4",
17
+ "@xylabs/react-flexbox": "^2.14.4",
18
+ "@xylabs/react-pixel": "^2.14.4",
19
+ "@xylabs/react-shared": "^2.14.4",
20
+ "@xyo-network/react-app-settings": "^2.25.66",
21
+ "@xyo-network/react-appbar": "^2.25.67",
22
+ "@xyo-network/react-footer": "^2.25.67",
23
+ "@xyo-network/react-shared": "^2.25.67",
24
24
  "react": "^18.2.0",
25
25
  "react-dom": "^18.2.0",
26
26
  "react-helmet": "^6.1.0",
@@ -33,7 +33,7 @@
33
33
  "@babel/preset-env": "^7.18.2",
34
34
  "@storybook/react": "^6.5.9",
35
35
  "@types/react-helmet": "^6.1.5",
36
- "@xylabs/react-common": "^2.14.3",
36
+ "@xylabs/react-common": "^2.14.4",
37
37
  "@xylabs/tsconfig": "^1.0.13"
38
38
  },
39
39
  "browser": "dist/esm/index.js",
@@ -85,6 +85,6 @@
85
85
  },
86
86
  "sideEffects": false,
87
87
  "types": "dist/esm/index.d.ts",
88
- "version": "2.25.64",
88
+ "version": "2.25.67",
89
89
  "packageManager": "yarn@3.1.1"
90
90
  }
package/src/components/Chrome.stories.tsx CHANGED
@@ -2,7 +2,7 @@
2
2
  import { Breadcrumbs, List } from '@mui/material'
3
3
  import { ComponentMeta, ComponentStory } from '@storybook/react'
4
4
  import { LinkEx } from '@xylabs/react-common'
5
- import { FlexCol } from '@xylabs/react-flexbox'
5
+ import { FlexCol, FlexRow } from '@xylabs/react-flexbox'
6
6
  import { SiteMenuListItem } from '@xyo-network/react-appbar'
7
7
  import { BrowserRouter } from 'react-router-dom'
8
8
 
@@ -20,6 +20,8 @@ const StorybookEntry = {
20
20
  title: 'webapp/WebAppChrome',
21
21
  } as ComponentMeta<typeof WebAppChrome>
22
22
 
23
+ const rowArray = [32, 64, 128, 256, 512, 1024]
24
+
23
25
  const Template: ComponentStory<typeof WebAppChrome> = (args) => {
24
26
  return (
25
27
  <FlexCol height="80vh" alignItems="stretch" overflow="hidden">
@@ -38,7 +40,15 @@ const Template: ComponentStory<typeof WebAppChrome> = (args) => {
38
40
  <LinkEx>BreadCrumbs</LinkEx>
39
41
  </Breadcrumbs>
40
42
  }
41
- />
43
+ >
44
+ {rowArray.map((height) => {
45
+ return (
46
+ <FlexRow key={height} bgcolor="red" height={height}>
47
+ {height}
48
+ </FlexRow>
49
+ )
50
+ })}
51
+ </WebAppPage>
42
52
  </WebAppChrome>
43
53
  </BrowserRouter>
44
54
  </FlexCol>
package/src/components/Chrome.tsx CHANGED
@@ -21,25 +21,27 @@ export interface WebAppChromeProps extends FlexBoxProps {
21
21
 
22
22
  export const WebAppChrome: React.FC<WebAppChromeProps> = ({ menuItems, navigationType = 'menu', footerElevation = 4, errorPage, appbar, footer, children, appName, ...props }) => {
23
23
  return (
24
- <FlexCol alignItems="stretch" height="100vh" {...props}>
24
+ <FlexCol alignItems="stretch" overflow="hidden" height="100vh" {...props}>
25
25
  <Helmet defaultTitle={appName} titleTemplate={`%s | ${appName}`}>
26
26
  <meta content="website" property="og:type" />
27
27
  </Helmet>
28
28
  {appbar ?? <ApplicationAppBar menuItems={navigationType === 'menu' ? menuItems : undefined} />}
29
- <FlexGrowRow alignItems="stretch">
29
+ <FlexGrowRow overflow="hidden" alignItems="stretch">
30
30
  {navigationType !== 'menu' ? (
31
31
  <>
32
32
  {menuItems}
33
33
  <Divider orientation="vertical" />
34
34
  </>
35
35
  ) : null}
36
- <FlexGrowCol overflow="hidden" justifyContent="flex-start" alignItems="stretch">
36
+ <FlexGrowCol justifyContent="flex-start" alignItems="stretch">
37
37
  <ErrorBoundary fallback={errorPage ?? <WebAppErrorPage />}>{children}</ErrorBoundary>
38
38
  </FlexGrowCol>
39
39
  </FlexGrowRow>
40
- <Paper elevation={footerElevation} square>
41
- {footer ?? <Footer dynamicHeight />}
42
- </Paper>
40
+ <FlexCol alignItems="stretch">
41
+ <Paper elevation={footerElevation} square>
42
+ {footer ?? <Footer dynamicHeight />}
43
+ </Paper>
44
+ </FlexCol>
43
45
  </FlexCol>
44
46
  )
45
47
  }