@xyo-network/react-webapp 2.64.9 → 2.65.0

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 (74) hide show
  1. package/package.json +13 -13
  2. package/dist/browser/components/Body.cjs +0 -116
  3. package/dist/browser/components/Body.cjs.map +0 -1
  4. package/dist/browser/components/Body.js +0 -95
  5. package/dist/browser/components/Body.js.map +0 -1
  6. package/dist/browser/components/Chrome.cjs +0 -246
  7. package/dist/browser/components/Chrome.cjs.map +0 -1
  8. package/dist/browser/components/Chrome.js +0 -225
  9. package/dist/browser/components/Chrome.js.map +0 -1
  10. package/dist/browser/components/ErrorPage.cjs +0 -211
  11. package/dist/browser/components/ErrorPage.cjs.map +0 -1
  12. package/dist/browser/components/ErrorPage.js +0 -190
  13. package/dist/browser/components/ErrorPage.js.map +0 -1
  14. package/dist/browser/components/NotFoundPage/Page.cjs +0 -207
  15. package/dist/browser/components/NotFoundPage/Page.cjs.map +0 -1
  16. package/dist/browser/components/NotFoundPage/Page.js +0 -186
  17. package/dist/browser/components/NotFoundPage/Page.js.map +0 -1
  18. package/dist/browser/components/NotFoundPage/index.cjs +0 -209
  19. package/dist/browser/components/NotFoundPage/index.cjs.map +0 -1
  20. package/dist/browser/components/NotFoundPage/index.js +0 -186
  21. package/dist/browser/components/NotFoundPage/index.js.map +0 -1
  22. package/dist/browser/components/Page.cjs +0 -200
  23. package/dist/browser/components/Page.cjs.map +0 -1
  24. package/dist/browser/components/Page.js +0 -179
  25. package/dist/browser/components/Page.js.map +0 -1
  26. package/dist/browser/components/index.cjs +0 -261
  27. package/dist/browser/components/index.cjs.map +0 -1
  28. package/dist/browser/components/index.js +0 -238
  29. package/dist/browser/components/index.js.map +0 -1
  30. package/dist/browser/components/lib/cssValues.cjs +0 -43
  31. package/dist/browser/components/lib/cssValues.cjs.map +0 -1
  32. package/dist/browser/components/lib/cssValues.js +0 -22
  33. package/dist/browser/components/lib/cssValues.js.map +0 -1
  34. package/dist/browser/components/lib/index.cjs +0 -45
  35. package/dist/browser/components/lib/index.cjs.map +0 -1
  36. package/dist/browser/components/lib/index.js +0 -22
  37. package/dist/browser/components/lib/index.js.map +0 -1
  38. package/dist/docs.json +0 -94282
  39. package/dist/node/components/Body.cjs +0 -120
  40. package/dist/node/components/Body.cjs.map +0 -1
  41. package/dist/node/components/Body.js +0 -95
  42. package/dist/node/components/Body.js.map +0 -1
  43. package/dist/node/components/Chrome.cjs +0 -250
  44. package/dist/node/components/Chrome.cjs.map +0 -1
  45. package/dist/node/components/Chrome.js +0 -225
  46. package/dist/node/components/Chrome.js.map +0 -1
  47. package/dist/node/components/ErrorPage.cjs +0 -216
  48. package/dist/node/components/ErrorPage.cjs.map +0 -1
  49. package/dist/node/components/ErrorPage.js +0 -190
  50. package/dist/node/components/ErrorPage.js.map +0 -1
  51. package/dist/node/components/NotFoundPage/Page.cjs +0 -212
  52. package/dist/node/components/NotFoundPage/Page.cjs.map +0 -1
  53. package/dist/node/components/NotFoundPage/Page.js +0 -186
  54. package/dist/node/components/NotFoundPage/Page.js.map +0 -1
  55. package/dist/node/components/NotFoundPage/index.cjs +0 -214
  56. package/dist/node/components/NotFoundPage/index.cjs.map +0 -1
  57. package/dist/node/components/NotFoundPage/index.js +0 -186
  58. package/dist/node/components/NotFoundPage/index.js.map +0 -1
  59. package/dist/node/components/Page.cjs +0 -205
  60. package/dist/node/components/Page.cjs.map +0 -1
  61. package/dist/node/components/Page.js +0 -179
  62. package/dist/node/components/Page.js.map +0 -1
  63. package/dist/node/components/index.cjs +0 -272
  64. package/dist/node/components/index.cjs.map +0 -1
  65. package/dist/node/components/index.js +0 -238
  66. package/dist/node/components/index.js.map +0 -1
  67. package/dist/node/components/lib/cssValues.cjs +0 -50
  68. package/dist/node/components/lib/cssValues.cjs.map +0 -1
  69. package/dist/node/components/lib/cssValues.js +0 -22
  70. package/dist/node/components/lib/cssValues.js.map +0 -1
  71. package/dist/node/components/lib/index.cjs +0 -52
  72. package/dist/node/components/lib/index.cjs.map +0 -1
  73. package/dist/node/components/lib/index.js +0 -22
  74. package/dist/node/components/lib/index.js.map +0 -1
package/package.json CHANGED
@@ -10,11 +10,11 @@
10
10
  "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
11
11
  },
12
12
  "dependencies": {
13
- "@xylabs/react-async-effect": "^3.0.15",
14
- "@xyo-network/react-app-settings": "~2.64.9",
15
- "@xyo-network/react-appbar": "~2.64.9",
16
- "@xyo-network/react-footer": "~2.64.9",
17
- "@xyo-network/react-shared": "~2.64.9",
13
+ "@xylabs/react-async-effect": "^3.0.18",
14
+ "@xyo-network/react-app-settings": "~2.65.0",
15
+ "@xyo-network/react-appbar": "~2.65.0",
16
+ "@xyo-network/react-footer": "~2.65.0",
17
+ "@xyo-network/react-shared": "~2.65.0",
18
18
  "react-router-dom": "^6.16.0"
19
19
  },
20
20
  "peerDependencies": {
@@ -36,13 +36,13 @@
36
36
  "@storybook/react": "^7.4.6",
37
37
  "@types/react-helmet": "^6.1.7",
38
38
  "@xylabs/pixel": "^1.4.14",
39
- "@xylabs/react-button": "^3.0.15",
40
- "@xylabs/react-flexbox": "^3.0.15",
41
- "@xylabs/react-link": "^3.0.15",
42
- "@xylabs/react-pixel": "^3.0.15",
43
- "@xylabs/react-shared": "^3.0.15",
44
- "@xylabs/ts-scripts-yarn3": "^3.0.82",
45
- "@xylabs/tsconfig-react": "^3.0.82",
39
+ "@xylabs/react-button": "^3.0.18",
40
+ "@xylabs/react-flexbox": "^3.0.18",
41
+ "@xylabs/react-link": "^3.0.18",
42
+ "@xylabs/react-pixel": "^3.0.18",
43
+ "@xylabs/react-shared": "^3.0.18",
44
+ "@xylabs/ts-scripts-yarn3": "^3.1.9",
45
+ "@xylabs/tsconfig-react": "^3.1.9",
46
46
  "axios": "^1.5.1",
47
47
  "typescript": "^5.2.2"
48
48
  },
@@ -97,6 +97,6 @@
97
97
  },
98
98
  "sideEffects": false,
99
99
  "types": "dist/browser/index.d.ts",
100
- "version": "2.64.9",
100
+ "version": "2.65.0",
101
101
  "type": "module"
102
102
  }
@@ -1,116 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/components/Body.tsx
21
- var Body_exports = {};
22
- __export(Body_exports, {
23
- WebAppBody: () => WebAppBody
24
- });
25
- module.exports = __toCommonJS(Body_exports);
26
- var import_material = require("@mui/material");
27
- var import_react_flexbox = require("@xylabs/react-flexbox");
28
-
29
- // src/components/lib/cssValues.ts
30
- var scrollableWrap = {
31
- inset: 0,
32
- position: "absolute"
33
- };
34
- var fixedWrap = {
35
- inset: "unset",
36
- position: "relative"
37
- };
38
- var scrollableContent = {
39
- ...fixedWrap
40
- };
41
- var fixedContent = {
42
- ...scrollableWrap
43
- };
44
-
45
- // src/components/Body.tsx
46
- var import_jsx_runtime = require("react/jsx-runtime");
47
- var WebAppBodyName = "WebAppBody";
48
- var propsNotForwarded = ["mobileScrollingBreakpoint", "variant", "spacing", "disableBreadcrumbGutter"];
49
- var defaultStyledOptions = {
50
- shouldForwardProp: (prop) => !propsNotForwarded.includes(prop)
51
- };
52
- var WebAppBodyRoot = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
53
- ...defaultStyledOptions,
54
- name: WebAppBodyName,
55
- slot: "Root"
56
- })(({ spacing, theme, mobileScrollingBreakpoint = "sm", variant }) => {
57
- const scrollable = variant === "scrollable";
58
- return theme.unstable_sx({
59
- alignItems: "stretch",
60
- gap: 1,
61
- justifyContent: "flex-start",
62
- overflowX: "visible",
63
- overflowY: scrollable ? "scroll" : "hidden",
64
- paddingY: spacing,
65
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
66
- overflowY: "scroll"
67
- }
68
- });
69
- });
70
- var WebAppBodyBreadcrumb = (0, import_material.styled)(import_react_flexbox.FlexRow, {
71
- ...defaultStyledOptions,
72
- name: WebAppBodyName,
73
- slot: "Breadcrumb"
74
- })(
75
- ({ theme, disableBreadcrumbGutter, spacing }) => theme.unstable_sx({
76
- justifyContent: "start",
77
- marginX: disableBreadcrumbGutter ? 0 : spacing
78
- })
79
- );
80
- var WebAppBodyScrollableWrapper = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
81
- name: WebAppBodyName,
82
- slot: "ScrollableWrapper"
83
- })(() => ({
84
- alignItems: "stretch"
85
- }));
86
- var WebAppBodyScrollable = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
87
- ...defaultStyledOptions,
88
- name: WebAppBodyName,
89
- slot: "Scrollable"
90
- })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
91
- const props = variant === "scrollable" ? scrollableContent : fixedContent;
92
- return {
93
- ...props,
94
- alignItems: "stretch",
95
- justifyContent: "start",
96
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
97
- inset: "unset",
98
- position: "relative"
99
- }
100
- };
101
- });
102
- var WebAppBody = ({
103
- children,
104
- breadcrumbs,
105
- disableBreadcrumbGutter,
106
- mobileScrollingBreakpoint,
107
- spacing = 1,
108
- variant,
109
- ...props
110
- }) => {
111
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(WebAppBodyRoot, { mobileScrollingBreakpoint, spacing, variant, ...props, children: [
112
- breadcrumbs ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyBreadcrumb, { disableBreadcrumbGutter, spacing, children: breadcrumbs }) : null,
113
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyScrollableWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyScrollable, { mobileScrollingBreakpoint, variant, children }) })
114
- ] });
115
- };
116
- //# sourceMappingURL=Body.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Body.tsx","../../../src/components/lib/cssValues.ts"],"sourcesContent":["import { Breakpoint, styled } from '@mui/material'\nimport { FlexBoxProps, FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport React, { ReactNode } from 'react'\n\nimport { fixedContent, scrollableContent } from './lib'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = ['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter']\nconst defaultStyledOptions = {\n shouldForwardProp: (prop: string) => !propsNotForwarded.includes(prop),\n}\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Root',\n})<WebAppBodyProps>(({ spacing, theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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)]: {\n overflowY: 'scroll',\n },\n })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Breadcrumb',\n})<WebAppBodyProps>(({ theme, disableBreadcrumbGutter, spacing }) =>\n theme.unstable_sx({\n justifyContent: 'start',\n marginX: disableBreadcrumbGutter ? 0 : spacing,\n }),\n)\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n name: WebAppBodyName,\n slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({\n alignItems: 'stretch',\n}))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Scrollable',\n})<WebAppBodyProps>(({ theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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 <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n {breadcrumbs}\n </WebAppBodyBreadcrumb>\n ) : null}\n <WebAppBodyScrollableWrapper>\n <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n {children}\n </WebAppBodyScrollable>\n </WebAppBodyScrollableWrapper>\n </WebAppBodyRoot>\n )\n}\n","import { 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 = {\n ...fixedWrap,\n} as const\n\nexport const fixedContent: CSSProperties = {\n ...scrollableWrap,\n} as const\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAmC;AACnC,2BAAmD;;;ACC5C,IAAM,iBAAgC;AAAA,EAC3C,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,IAAM,YAA2B;AAAA,EACtC,OAAO;AAAA,EACP,UAAU;AACZ;AAGO,IAAM,oBAAmC;AAAA,EAC9C,GAAG;AACL;AAEO,IAAM,eAA8B;AAAA,EACzC,GAAG;AACL;;;ADiEI;AA9EJ,IAAM,iBAAiB;AACvB,IAAM,oBAAoB,CAAC,6BAA6B,WAAW,WAAW,yBAAyB;AACvG,IAAM,uBAAuB;AAAA,EAC3B,mBAAmB,CAAC,SAAiB,CAAC,kBAAkB,SAAS,IAAI;AACvE;AAEA,IAAM,qBAAiB,wBAAO,kCAAa;AAAA,EACzC,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC,EAAE,SAAS,OAAO,4BAA4B,MAAM,QAAQ,MAAM;AACrF,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;AAAA,MACnD,WAAW;AAAA,IACb;AAAA,EACF,CAAC;AACH,CAAC;AAED,IAAM,2BAAuB,wBAAO,8BAAS;AAAA,EAC3C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC;AAAA,EAAmB,CAAC,EAAE,OAAO,yBAAyB,QAAQ,MAC7D,MAAM,YAAY;AAAA,IAChB,gBAAgB;AAAA,IAChB,SAAS,0BAA0B,IAAI;AAAA,EACzC,CAAC;AACH;AAEA,IAAM,kCAA8B,wBAAO,kCAAa;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,OAAO;AAAA,EACzB,YAAY;AACd,EAAE;AAEF,IAAM,2BAAuB,wBAAO,kCAAa;AAAA,EAC/C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC,EAAE,OAAO,4BAA4B,MAAM,QAAQ,MAAM;AAC5E,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,6CAAC,kBAAe,2BAAsD,SAAkB,SAAmB,GAAG,OAC3G;AAAA,kBACC,4CAAC,wBAAqB,yBAAkD,SACrE,uBACH,IACE;AAAA,IACJ,4CAAC,+BACC,sDAAC,wBAAqB,2BAAsD,SACzE,UACH,GACF;AAAA,KACF;AAEJ;","names":[]}
@@ -1,95 +0,0 @@
1
- // src/components/Body.tsx
2
- import { styled } from "@mui/material";
3
- import { FlexGrowCol, FlexRow } from "@xylabs/react-flexbox";
4
-
5
- // src/components/lib/cssValues.ts
6
- var scrollableWrap = {
7
- inset: 0,
8
- position: "absolute"
9
- };
10
- var fixedWrap = {
11
- inset: "unset",
12
- position: "relative"
13
- };
14
- var scrollableContent = {
15
- ...fixedWrap
16
- };
17
- var fixedContent = {
18
- ...scrollableWrap
19
- };
20
-
21
- // src/components/Body.tsx
22
- import { jsx, jsxs } from "react/jsx-runtime";
23
- var WebAppBodyName = "WebAppBody";
24
- var propsNotForwarded = ["mobileScrollingBreakpoint", "variant", "spacing", "disableBreadcrumbGutter"];
25
- var defaultStyledOptions = {
26
- shouldForwardProp: (prop) => !propsNotForwarded.includes(prop)
27
- };
28
- var WebAppBodyRoot = styled(FlexGrowCol, {
29
- ...defaultStyledOptions,
30
- name: WebAppBodyName,
31
- slot: "Root"
32
- })(({ spacing, theme, mobileScrollingBreakpoint = "sm", variant }) => {
33
- const scrollable = variant === "scrollable";
34
- return theme.unstable_sx({
35
- alignItems: "stretch",
36
- gap: 1,
37
- justifyContent: "flex-start",
38
- overflowX: "visible",
39
- overflowY: scrollable ? "scroll" : "hidden",
40
- paddingY: spacing,
41
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
42
- overflowY: "scroll"
43
- }
44
- });
45
- });
46
- var WebAppBodyBreadcrumb = styled(FlexRow, {
47
- ...defaultStyledOptions,
48
- name: WebAppBodyName,
49
- slot: "Breadcrumb"
50
- })(
51
- ({ theme, disableBreadcrumbGutter, spacing }) => theme.unstable_sx({
52
- justifyContent: "start",
53
- marginX: disableBreadcrumbGutter ? 0 : spacing
54
- })
55
- );
56
- var WebAppBodyScrollableWrapper = styled(FlexGrowCol, {
57
- name: WebAppBodyName,
58
- slot: "ScrollableWrapper"
59
- })(() => ({
60
- alignItems: "stretch"
61
- }));
62
- var WebAppBodyScrollable = styled(FlexGrowCol, {
63
- ...defaultStyledOptions,
64
- name: WebAppBodyName,
65
- slot: "Scrollable"
66
- })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
67
- const props = variant === "scrollable" ? scrollableContent : fixedContent;
68
- return {
69
- ...props,
70
- alignItems: "stretch",
71
- justifyContent: "start",
72
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
73
- inset: "unset",
74
- position: "relative"
75
- }
76
- };
77
- });
78
- var WebAppBody = ({
79
- children,
80
- breadcrumbs,
81
- disableBreadcrumbGutter,
82
- mobileScrollingBreakpoint,
83
- spacing = 1,
84
- variant,
85
- ...props
86
- }) => {
87
- return /* @__PURE__ */ jsxs(WebAppBodyRoot, { mobileScrollingBreakpoint, spacing, variant, ...props, children: [
88
- breadcrumbs ? /* @__PURE__ */ jsx(WebAppBodyBreadcrumb, { disableBreadcrumbGutter, spacing, children: breadcrumbs }) : null,
89
- /* @__PURE__ */ jsx(WebAppBodyScrollableWrapper, { children: /* @__PURE__ */ jsx(WebAppBodyScrollable, { mobileScrollingBreakpoint, variant, children }) })
90
- ] });
91
- };
92
- export {
93
- WebAppBody
94
- };
95
- //# sourceMappingURL=Body.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Body.tsx","../../../src/components/lib/cssValues.ts"],"sourcesContent":["import { Breakpoint, styled } from '@mui/material'\nimport { FlexBoxProps, FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport React, { ReactNode } from 'react'\n\nimport { fixedContent, scrollableContent } from './lib'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = ['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter']\nconst defaultStyledOptions = {\n shouldForwardProp: (prop: string) => !propsNotForwarded.includes(prop),\n}\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Root',\n})<WebAppBodyProps>(({ spacing, theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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)]: {\n overflowY: 'scroll',\n },\n })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Breadcrumb',\n})<WebAppBodyProps>(({ theme, disableBreadcrumbGutter, spacing }) =>\n theme.unstable_sx({\n justifyContent: 'start',\n marginX: disableBreadcrumbGutter ? 0 : spacing,\n }),\n)\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n name: WebAppBodyName,\n slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({\n alignItems: 'stretch',\n}))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Scrollable',\n})<WebAppBodyProps>(({ theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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 <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n {breadcrumbs}\n </WebAppBodyBreadcrumb>\n ) : null}\n <WebAppBodyScrollableWrapper>\n <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n {children}\n </WebAppBodyScrollable>\n </WebAppBodyScrollableWrapper>\n </WebAppBodyRoot>\n )\n}\n","import { 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 = {\n ...fixedWrap,\n} as const\n\nexport const fixedContent: CSSProperties = {\n ...scrollableWrap,\n} as const\n"],"mappings":";AAAA,SAAqB,cAAc;AACnC,SAAuB,aAAa,eAAe;;;ACC5C,IAAM,iBAAgC;AAAA,EAC3C,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,IAAM,YAA2B;AAAA,EACtC,OAAO;AAAA,EACP,UAAU;AACZ;AAGO,IAAM,oBAAmC;AAAA,EAC9C,GAAG;AACL;AAEO,IAAM,eAA8B;AAAA,EACzC,GAAG;AACL;;;ADiEI,SAEI,KAFJ;AA9EJ,IAAM,iBAAiB;AACvB,IAAM,oBAAoB,CAAC,6BAA6B,WAAW,WAAW,yBAAyB;AACvG,IAAM,uBAAuB;AAAA,EAC3B,mBAAmB,CAAC,SAAiB,CAAC,kBAAkB,SAAS,IAAI;AACvE;AAEA,IAAM,iBAAiB,OAAO,aAAa;AAAA,EACzC,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC,EAAE,SAAS,OAAO,4BAA4B,MAAM,QAAQ,MAAM;AACrF,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;AAAA,MACnD,WAAW;AAAA,IACb;AAAA,EACF,CAAC;AACH,CAAC;AAED,IAAM,uBAAuB,OAAO,SAAS;AAAA,EAC3C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC;AAAA,EAAmB,CAAC,EAAE,OAAO,yBAAyB,QAAQ,MAC7D,MAAM,YAAY;AAAA,IAChB,gBAAgB;AAAA,IAChB,SAAS,0BAA0B,IAAI;AAAA,EACzC,CAAC;AACH;AAEA,IAAM,8BAA8B,OAAO,aAAa;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,OAAO;AAAA,EACzB,YAAY;AACd,EAAE;AAEF,IAAM,uBAAuB,OAAO,aAAa;AAAA,EAC/C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC,EAAE,OAAO,4BAA4B,MAAM,QAAQ,MAAM;AAC5E,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,kBACC,oBAAC,wBAAqB,yBAAkD,SACrE,uBACH,IACE;AAAA,IACJ,oBAAC,+BACC,8BAAC,wBAAqB,2BAAsD,SACzE,UACH,GACF;AAAA,KACF;AAEJ;","names":[]}
@@ -1,246 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/components/Chrome.tsx
21
- var Chrome_exports = {};
22
- __export(Chrome_exports, {
23
- WebAppChrome: () => WebAppChrome
24
- });
25
- module.exports = __toCommonJS(Chrome_exports);
26
- var import_material3 = require("@mui/material");
27
- var import_react_flexbox3 = require("@xylabs/react-flexbox");
28
- var import_react_appbar = require("@xyo-network/react-appbar");
29
- var import_react_footer = require("@xyo-network/react-footer");
30
- var import_react_shared = require("@xyo-network/react-shared");
31
- var import_react = require("react");
32
- var import_react_helmet2 = require("react-helmet");
33
-
34
- // src/components/ErrorPage.tsx
35
- var import_react_button = require("@xylabs/react-button");
36
-
37
- // src/components/Page.tsx
38
- var import_material2 = require("@mui/material");
39
- var import_react_async_effect = require("@xylabs/react-async-effect");
40
- var import_react_flexbox2 = require("@xylabs/react-flexbox");
41
- var import_react_pixel = require("@xylabs/react-pixel");
42
- var import_react_helmet = require("react-helmet");
43
- var import_react_router_dom = require("react-router-dom");
44
-
45
- // src/components/Body.tsx
46
- var import_material = require("@mui/material");
47
- var import_react_flexbox = require("@xylabs/react-flexbox");
48
-
49
- // src/components/lib/cssValues.ts
50
- var scrollableWrap = {
51
- inset: 0,
52
- position: "absolute"
53
- };
54
- var fixedWrap = {
55
- inset: "unset",
56
- position: "relative"
57
- };
58
- var scrollableContent = {
59
- ...fixedWrap
60
- };
61
- var fixedContent = {
62
- ...scrollableWrap
63
- };
64
-
65
- // src/components/Body.tsx
66
- var import_jsx_runtime = require("react/jsx-runtime");
67
- var WebAppBodyName = "WebAppBody";
68
- var propsNotForwarded = ["mobileScrollingBreakpoint", "variant", "spacing", "disableBreadcrumbGutter"];
69
- var defaultStyledOptions = {
70
- shouldForwardProp: (prop) => !propsNotForwarded.includes(prop)
71
- };
72
- var WebAppBodyRoot = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
73
- ...defaultStyledOptions,
74
- name: WebAppBodyName,
75
- slot: "Root"
76
- })(({ spacing, theme, mobileScrollingBreakpoint = "sm", variant }) => {
77
- const scrollable = variant === "scrollable";
78
- return theme.unstable_sx({
79
- alignItems: "stretch",
80
- gap: 1,
81
- justifyContent: "flex-start",
82
- overflowX: "visible",
83
- overflowY: scrollable ? "scroll" : "hidden",
84
- paddingY: spacing,
85
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
86
- overflowY: "scroll"
87
- }
88
- });
89
- });
90
- var WebAppBodyBreadcrumb = (0, import_material.styled)(import_react_flexbox.FlexRow, {
91
- ...defaultStyledOptions,
92
- name: WebAppBodyName,
93
- slot: "Breadcrumb"
94
- })(
95
- ({ theme, disableBreadcrumbGutter, spacing }) => theme.unstable_sx({
96
- justifyContent: "start",
97
- marginX: disableBreadcrumbGutter ? 0 : spacing
98
- })
99
- );
100
- var WebAppBodyScrollableWrapper = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
101
- name: WebAppBodyName,
102
- slot: "ScrollableWrapper"
103
- })(() => ({
104
- alignItems: "stretch"
105
- }));
106
- var WebAppBodyScrollable = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
107
- ...defaultStyledOptions,
108
- name: WebAppBodyName,
109
- slot: "Scrollable"
110
- })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
111
- const props = variant === "scrollable" ? scrollableContent : fixedContent;
112
- return {
113
- ...props,
114
- alignItems: "stretch",
115
- justifyContent: "start",
116
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
117
- inset: "unset",
118
- position: "relative"
119
- }
120
- };
121
- });
122
- var WebAppBody = ({
123
- children,
124
- breadcrumbs,
125
- disableBreadcrumbGutter,
126
- mobileScrollingBreakpoint,
127
- spacing = 1,
128
- variant,
129
- ...props
130
- }) => {
131
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(WebAppBodyRoot, { mobileScrollingBreakpoint, spacing, variant, ...props, children: [
132
- breadcrumbs ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyBreadcrumb, { disableBreadcrumbGutter, spacing, children: breadcrumbs }) : null,
133
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyScrollableWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyScrollable, { mobileScrollingBreakpoint, variant, children }) })
134
- ] });
135
- };
136
-
137
- // src/components/Page.tsx
138
- var import_jsx_runtime2 = require("react/jsx-runtime");
139
- var WebAppPageRoot = (0, import_material2.styled)(import_react_flexbox2.FlexGrowCol, {
140
- name: "WebAppPage",
141
- shouldForwardProp: (propName) => propName !== "mobileScrollingBreakpoint" && propName !== "variant",
142
- slot: "Root"
143
- })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
144
- const props = variant === "scrollable" ? scrollableWrap : fixedWrap;
145
- return {
146
- ...props,
147
- alignItems: "stretch",
148
- justifyContent: "start",
149
- maxWidth: "100vw",
150
- [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
151
- inset: 0,
152
- position: "absolute"
153
- }
154
- };
155
- });
156
- var WebAppPage = ({
157
- disableGutters,
158
- disableBreadcrumbGutter,
159
- title,
160
- container,
161
- children,
162
- breadcrumbs,
163
- mobileScrollingBreakpoint,
164
- variant = "scrollable",
165
- ...props
166
- }) => {
167
- const userEvents = (0, import_react_pixel.useUserEvents)();
168
- const { pathname } = (0, import_react_router_dom.useLocation)();
169
- (0, import_react_async_effect.useAsyncEffect)(
170
- // eslint-disable-next-line react-hooks/exhaustive-deps
171
- async () => {
172
- await userEvents?.viewContent({ name: title ?? "NodeBasePage", path: location.pathname });
173
- },
174
- [pathname, title, userEvents]
175
- );
176
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(WebAppPageRoot, { mobileScrollingBreakpoint, variant, ...props, children: [
177
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_helmet.Helmet, { title }),
178
- container && container !== "none" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
179
- import_material2.Container,
180
- {
181
- disableGutters,
182
- style: { alignItems: "stretch", display: "flex", flexDirection: "column", flexGrow: 1, justifyContent: "flex-start" },
183
- maxWidth: container,
184
- children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
185
- WebAppBody,
186
- {
187
- disableBreadcrumbGutter,
188
- breadcrumbs,
189
- mobileScrollingBreakpoint,
190
- variant,
191
- ...props,
192
- children
193
- }
194
- )
195
- }
196
- ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
197
- WebAppBody,
198
- {
199
- disableBreadcrumbGutter,
200
- breadcrumbs,
201
- mobileScrollingBreakpoint,
202
- paddingX: disableGutters ? 0 : 1,
203
- variant,
204
- ...props,
205
- children
206
- }
207
- )
208
- ] });
209
- };
210
-
211
- // src/components/ErrorPage.tsx
212
- var import_jsx_runtime3 = require("react/jsx-runtime");
213
- var WebAppErrorPage = ({ error, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(WebAppPage, { title: "Oops! Something went wrong", ...props, children: [
214
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("h1", { children: "Oops! Something went wrong!" }),
215
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { children: `${error}` }),
216
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react_button.ButtonEx, { href: "/", variant: "contained", children: "Homepage" })
217
- ] });
218
-
219
- // src/components/Chrome.tsx
220
- var import_jsx_runtime4 = require("react/jsx-runtime");
221
- var WebAppChrome = (0, import_react.forwardRef)(
222
- ({ appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = "menu", ...props }, ref) => {
223
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react_flexbox3.FlexCol, { id: "web-chrome-flex", alignItems: "stretch", overflow: "hidden", height: "100vh", ref, ...props, children: [
224
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_helmet2.Helmet, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("meta", { content: "website", property: "og:type" }) }),
225
- appbar ?? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_appbar.ApplicationAppBar, { systemToolbar: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_appbar.SystemToolbar, { menuItems: navigationType === "menu" ? menuItems : void 0 }) }),
226
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react_flexbox3.FlexGrowRow, { id: "sidebar-nav-flex", overflow: "hidden", alignItems: "stretch", children: [
227
- navigationType !== "menu" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
228
- menuItems,
229
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material3.Divider, { orientation: "vertical" })
230
- ] }) : null,
231
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_flexbox3.FlexGrowCol, { id: "main-flex", justifyContent: "flex-start", alignItems: "stretch", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
232
- import_react_shared.ErrorBoundary,
233
- {
234
- fallbackWithError: (error) => {
235
- return errorPage ?? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(WebAppErrorPage, { error });
236
- },
237
- children
238
- }
239
- ) })
240
- ] }),
241
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_flexbox3.FlexCol, { id: "footer-flex", alignItems: "stretch", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material3.Paper, { elevation: footerElevation, square: true, children: footer ?? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react_footer.Footer, { dynamicHeight: true }) }) })
242
- ] });
243
- }
244
- );
245
- WebAppChrome.displayName = "WebAppChrome";
246
- //# sourceMappingURL=Chrome.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Chrome.tsx","../../../src/components/ErrorPage.tsx","../../../src/components/Page.tsx","../../../src/components/Body.tsx","../../../src/components/lib/cssValues.ts"],"sourcesContent":["import { Divider, Paper } from '@mui/material'\nimport { FlexBoxProps, FlexCol, FlexGrowCol, FlexGrowRow } from '@xylabs/react-flexbox'\nimport { WebAppNavigationType } from '@xyo-network/react-app-settings'\nimport { ApplicationAppBar, SystemToolbar } from '@xyo-network/react-appbar'\nimport { Footer } from '@xyo-network/react-footer'\nimport { ErrorBoundary } from '@xyo-network/react-shared'\nimport { forwardRef, ReactNode } from 'react'\nimport { Helmet } from 'react-helmet'\n\nimport { WebAppErrorPage } from './ErrorPage'\n\nexport interface WebAppChromeProps extends FlexBoxProps {\n appName: string\n appbar?: ReactNode\n errorPage?: ReactNode\n footer?: ReactNode\n footerElevation?: number\n menuItems?: ReactNode\n navigationType?: WebAppNavigationType\n}\n\nexport const WebAppChrome = forwardRef<HTMLDivElement, WebAppChromeProps>(\n ({ appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu', ...props }, ref) => {\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 <>\n {menuItems}\n <Divider orientation=\"vertical\" />\n </>\n ) : null}\n <FlexGrowCol id=\"main-flex\" justifyContent=\"flex-start\" alignItems=\"stretch\">\n <ErrorBoundary\n fallbackWithError={(error) => {\n return errorPage ?? <WebAppErrorPage error={error} />\n }}\n >\n {children}\n </ErrorBoundary>\n </FlexGrowCol>\n </FlexGrowRow>\n <FlexCol id=\"footer-flex\" alignItems=\"stretch\">\n <Paper elevation={footerElevation} square>\n {footer ?? <Footer dynamicHeight />}\n </Paper>\n </FlexCol>\n </FlexCol>\n )\n },\n)\n\nWebAppChrome.displayName = 'WebAppChrome'\n","import { ButtonEx } from '@xylabs/react-button'\n\nimport { WebAppPage, WebAppPageProps } from './Page'\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 { Container, ContainerProps, styled } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport { FlexBoxProps, FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useUserEvents } from '@xylabs/react-pixel'\nimport { WithChildren } from '@xylabs/react-shared'\nimport { Helmet } from 'react-helmet'\nimport { useLocation } from 'react-router-dom'\n\nimport { WebAppBody, WebAppBodyProps } from './Body'\nimport { fixedWrap, scrollableWrap } from './lib'\n\nconst WebAppPageRoot = styled(FlexGrowCol, {\n name: 'WebAppPage',\n shouldForwardProp: (propName) => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',\n slot: 'Root',\n})<WebAppPageProps>(({ theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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<WithChildren<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 // eslint-disable-next-line react-hooks/exhaustive-deps\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 {container && container !== 'none' ? (\n <Container\n disableGutters={disableGutters}\n style={{ alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start' }}\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 <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 { Breakpoint, styled } from '@mui/material'\nimport { FlexBoxProps, FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport React, { ReactNode } from 'react'\n\nimport { fixedContent, scrollableContent } from './lib'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = ['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter']\nconst defaultStyledOptions = {\n shouldForwardProp: (prop: string) => !propsNotForwarded.includes(prop),\n}\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Root',\n})<WebAppBodyProps>(({ spacing, theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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)]: {\n overflowY: 'scroll',\n },\n })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Breadcrumb',\n})<WebAppBodyProps>(({ theme, disableBreadcrumbGutter, spacing }) =>\n theme.unstable_sx({\n justifyContent: 'start',\n marginX: disableBreadcrumbGutter ? 0 : spacing,\n }),\n)\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n name: WebAppBodyName,\n slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({\n alignItems: 'stretch',\n}))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Scrollable',\n})<WebAppBodyProps>(({ theme, mobileScrollingBreakpoint = 'sm', variant }) => {\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 <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n {breadcrumbs}\n </WebAppBodyBreadcrumb>\n ) : null}\n <WebAppBodyScrollableWrapper>\n <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n {children}\n </WebAppBodyScrollable>\n </WebAppBodyScrollableWrapper>\n </WebAppBodyRoot>\n )\n}\n","import { 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 = {\n ...fixedWrap,\n} as const\n\nexport const fixedContent: CSSProperties = {\n ...scrollableWrap,\n} as const\n"],"mappings":"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","names":["import_material","import_react_flexbox","import_react_helmet","import_material","import_react_flexbox","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}