@xyo-network/react-webapp 2.64.0-rc.6 → 2.64.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 (132) hide show
  1. package/dist/browser/components/Body.cjs +116 -0
  2. package/dist/browser/components/Body.cjs.map +1 -0
  3. package/dist/browser/components/Body.d.cts +12 -0
  4. package/dist/browser/components/Body.d.cts.map +1 -0
  5. package/dist/browser/components/Chrome.cjs +246 -0
  6. package/dist/browser/components/Chrome.cjs.map +1 -0
  7. package/dist/browser/components/Chrome.d.cts +14 -0
  8. package/dist/browser/components/Chrome.d.cts.map +1 -0
  9. package/dist/browser/components/ErrorPage.cjs +211 -0
  10. package/dist/browser/components/ErrorPage.cjs.map +1 -0
  11. package/dist/browser/components/ErrorPage.d.cts +9 -0
  12. package/dist/browser/components/ErrorPage.d.cts.map +1 -0
  13. package/dist/browser/components/NotFoundPage/Page.cjs +207 -0
  14. package/dist/browser/components/NotFoundPage/Page.cjs.map +1 -0
  15. package/dist/browser/components/NotFoundPage/Page.d.cts +6 -0
  16. package/dist/browser/components/NotFoundPage/Page.d.cts.map +1 -0
  17. package/dist/browser/components/NotFoundPage/index.cjs +209 -0
  18. package/dist/browser/components/NotFoundPage/index.cjs.map +1 -0
  19. package/dist/browser/components/NotFoundPage/index.d.cts +2 -0
  20. package/dist/browser/components/NotFoundPage/index.d.cts.map +1 -0
  21. package/dist/browser/components/Page.cjs +200 -0
  22. package/dist/browser/components/Page.cjs.map +1 -0
  23. package/dist/browser/components/Page.d.cts +13 -0
  24. package/dist/browser/components/Page.d.cts.map +1 -0
  25. package/dist/browser/components/index.cjs +261 -0
  26. package/dist/browser/components/index.cjs.map +1 -0
  27. package/dist/browser/components/index.d.cts +6 -0
  28. package/dist/browser/components/index.d.cts.map +1 -0
  29. package/dist/browser/components/lib/cssValues.cjs +43 -0
  30. package/dist/{node/components/lib/cssValues.mjs.map → browser/components/lib/cssValues.cjs.map} +1 -1
  31. package/dist/browser/components/lib/cssValues.d.cts +6 -0
  32. package/dist/browser/components/lib/cssValues.d.cts.map +1 -0
  33. package/dist/browser/components/lib/index.cjs +45 -0
  34. package/dist/browser/components/lib/index.cjs.map +1 -0
  35. package/dist/browser/components/lib/index.d.cts +2 -0
  36. package/dist/browser/components/lib/index.d.cts.map +1 -0
  37. package/dist/browser/index.cjs +261 -0
  38. package/dist/browser/index.cjs.map +1 -0
  39. package/dist/browser/index.d.cts +2 -0
  40. package/dist/browser/index.d.cts.map +1 -0
  41. package/dist/docs.json +94282 -0
  42. package/dist/node/components/Body.cjs +120 -0
  43. package/dist/node/components/Body.cjs.map +1 -0
  44. package/dist/node/components/Body.d.cts +12 -0
  45. package/dist/node/components/Body.d.cts.map +1 -0
  46. package/dist/node/components/Body.js +34 -40
  47. package/dist/node/components/Body.js.map +1 -1
  48. package/dist/node/components/Chrome.cjs +250 -0
  49. package/dist/node/components/Chrome.cjs.map +1 -0
  50. package/dist/node/components/Chrome.d.cts +14 -0
  51. package/dist/node/components/Chrome.d.cts.map +1 -0
  52. package/dist/node/components/Chrome.js +207 -44
  53. package/dist/node/components/Chrome.js.map +1 -1
  54. package/dist/node/components/ErrorPage.cjs +216 -0
  55. package/dist/node/components/ErrorPage.cjs.map +1 -0
  56. package/dist/node/components/ErrorPage.d.cts +9 -0
  57. package/dist/node/components/ErrorPage.d.cts.map +1 -0
  58. package/dist/node/components/ErrorPage.js +185 -34
  59. package/dist/node/components/ErrorPage.js.map +1 -1
  60. package/dist/node/components/NotFoundPage/Page.cjs +212 -0
  61. package/dist/node/components/NotFoundPage/Page.cjs.map +1 -0
  62. package/dist/node/components/NotFoundPage/Page.d.cts +6 -0
  63. package/dist/node/components/NotFoundPage/Page.d.cts.map +1 -0
  64. package/dist/node/components/NotFoundPage/Page.js +182 -31
  65. package/dist/node/components/NotFoundPage/Page.js.map +1 -1
  66. package/dist/node/components/NotFoundPage/index.cjs +214 -0
  67. package/dist/node/components/NotFoundPage/index.cjs.map +1 -0
  68. package/dist/node/components/NotFoundPage/index.d.cts +2 -0
  69. package/dist/node/components/NotFoundPage/index.d.cts.map +1 -0
  70. package/dist/node/components/NotFoundPage/index.js +184 -21
  71. package/dist/node/components/NotFoundPage/index.js.map +1 -1
  72. package/dist/node/components/Page.cjs +205 -0
  73. package/dist/node/components/Page.cjs.map +1 -0
  74. package/dist/node/components/Page.d.cts +13 -0
  75. package/dist/node/components/Page.d.cts.map +1 -0
  76. package/dist/node/components/Page.js +117 -49
  77. package/dist/node/components/Page.js.map +1 -1
  78. package/dist/node/components/index.cjs +272 -0
  79. package/dist/node/components/index.cjs.map +1 -0
  80. package/dist/node/components/index.d.cts +6 -0
  81. package/dist/node/components/index.d.cts.map +1 -0
  82. package/dist/node/components/index.js +236 -29
  83. package/dist/node/components/index.js.map +1 -1
  84. package/dist/node/components/{NotFoundPage/Page.stories.js → lib/cssValues.cjs} +26 -23
  85. package/dist/node/components/lib/cssValues.cjs.map +1 -0
  86. package/dist/node/components/lib/cssValues.d.cts +6 -0
  87. package/dist/node/components/lib/cssValues.d.cts.map +1 -0
  88. package/dist/node/components/lib/cssValues.js +7 -33
  89. package/dist/node/components/lib/cssValues.js.map +1 -1
  90. package/dist/node/components/lib/index.cjs +52 -0
  91. package/dist/node/components/lib/index.cjs.map +1 -0
  92. package/dist/node/components/lib/index.d.cts +2 -0
  93. package/dist/node/components/lib/index.d.cts.map +1 -0
  94. package/dist/node/components/lib/index.js +20 -21
  95. package/dist/node/components/lib/index.js.map +1 -1
  96. package/dist/node/index.cjs +272 -0
  97. package/dist/node/index.cjs.map +1 -0
  98. package/dist/node/index.d.cts +2 -0
  99. package/dist/node/index.d.cts.map +1 -0
  100. package/dist/node/index.js +236 -21
  101. package/dist/node/index.js.map +1 -1
  102. package/package.json +25 -25
  103. package/dist/browser/components/Chrome.stories.js +0 -53
  104. package/dist/browser/components/Chrome.stories.js.map +0 -1
  105. package/dist/browser/components/NotFoundPage/Page.stories.js +0 -23
  106. package/dist/browser/components/NotFoundPage/Page.stories.js.map +0 -1
  107. package/dist/node/components/Body.mjs +0 -77
  108. package/dist/node/components/Body.mjs.map +0 -1
  109. package/dist/node/components/Chrome.mjs +0 -38
  110. package/dist/node/components/Chrome.mjs.map +0 -1
  111. package/dist/node/components/Chrome.stories.js +0 -79
  112. package/dist/node/components/Chrome.stories.js.map +0 -1
  113. package/dist/node/components/Chrome.stories.mjs +0 -53
  114. package/dist/node/components/Chrome.stories.mjs.map +0 -1
  115. package/dist/node/components/ErrorPage.mjs +0 -14
  116. package/dist/node/components/ErrorPage.mjs.map +0 -1
  117. package/dist/node/components/NotFoundPage/Page.mjs +0 -10
  118. package/dist/node/components/NotFoundPage/Page.mjs.map +0 -1
  119. package/dist/node/components/NotFoundPage/Page.stories.js.map +0 -1
  120. package/dist/node/components/NotFoundPage/Page.stories.mjs +0 -23
  121. package/dist/node/components/NotFoundPage/Page.stories.mjs.map +0 -1
  122. package/dist/node/components/NotFoundPage/index.mjs +0 -2
  123. package/dist/node/components/NotFoundPage/index.mjs.map +0 -1
  124. package/dist/node/components/Page.mjs +0 -86
  125. package/dist/node/components/Page.mjs.map +0 -1
  126. package/dist/node/components/index.mjs +0 -6
  127. package/dist/node/components/index.mjs.map +0 -1
  128. package/dist/node/components/lib/cssValues.mjs +0 -21
  129. package/dist/node/components/lib/index.mjs +0 -2
  130. package/dist/node/components/lib/index.mjs.map +0 -1
  131. package/dist/node/index.mjs +0 -2
  132. package/dist/node/index.mjs.map +0 -1
@@ -1,23 +1,186 @@
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 __copyProps = (to, from, except, desc) => {
7
- if (from && typeof from === "object" || typeof from === "function") {
8
- for (let key of __getOwnPropNames(from))
9
- if (!__hasOwnProp.call(to, key) && key !== except)
10
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
11
- }
12
- return to;
13
- };
14
- var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
15
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
16
- var NotFoundPage_exports = {};
17
- module.exports = __toCommonJS(NotFoundPage_exports);
18
- __reExport(NotFoundPage_exports, require("./Page"), module.exports);
19
- // Annotate the CommonJS export names for ESM import in node:
20
- 0 && (module.exports = {
21
- ...require("./Page")
1
+ // src/components/NotFoundPage/Page.tsx
2
+ import { NotFound } from "@xyo-network/react-shared";
3
+
4
+ // src/components/Page.tsx
5
+ import { Container, styled as styled2 } from "@mui/material";
6
+ import { useAsyncEffect } from "@xylabs/react-async-effect";
7
+ import { FlexGrowCol as FlexGrowCol2 } from "@xylabs/react-flexbox";
8
+ import { useUserEvents } from "@xylabs/react-pixel";
9
+ import { Helmet } from "react-helmet";
10
+ import { useLocation } from "react-router-dom";
11
+
12
+ // src/components/Body.tsx
13
+ import { styled } from "@mui/material";
14
+ import { FlexGrowCol, FlexRow } from "@xylabs/react-flexbox";
15
+
16
+ // src/components/lib/cssValues.ts
17
+ var scrollableWrap = {
18
+ inset: 0,
19
+ position: "absolute"
20
+ };
21
+ var fixedWrap = {
22
+ inset: "unset",
23
+ position: "relative"
24
+ };
25
+ var scrollableContent = {
26
+ ...fixedWrap
27
+ };
28
+ var fixedContent = {
29
+ ...scrollableWrap
30
+ };
31
+
32
+ // src/components/Body.tsx
33
+ import { jsx, jsxs } from "react/jsx-runtime";
34
+ var WebAppBodyName = "WebAppBody";
35
+ var propsNotForwarded = ["mobileScrollingBreakpoint", "variant", "spacing", "disableBreadcrumbGutter"];
36
+ var defaultStyledOptions = {
37
+ shouldForwardProp: (prop) => !propsNotForwarded.includes(prop)
38
+ };
39
+ var WebAppBodyRoot = styled(FlexGrowCol, {
40
+ ...defaultStyledOptions,
41
+ name: WebAppBodyName,
42
+ slot: "Root"
43
+ })(({ spacing, theme, mobileScrollingBreakpoint = "sm", variant }) => {
44
+ const scrollable = variant === "scrollable";
45
+ return theme.unstable_sx({
46
+ alignItems: "stretch",
47
+ gap: 1,
48
+ justifyContent: "flex-start",
49
+ overflowX: "visible",
50
+ overflowY: scrollable ? "scroll" : "hidden",
51
+ paddingY: spacing,
52
+ [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
53
+ overflowY: "scroll"
54
+ }
55
+ });
22
56
  });
57
+ var WebAppBodyBreadcrumb = styled(FlexRow, {
58
+ ...defaultStyledOptions,
59
+ name: WebAppBodyName,
60
+ slot: "Breadcrumb"
61
+ })(
62
+ ({ theme, disableBreadcrumbGutter, spacing }) => theme.unstable_sx({
63
+ justifyContent: "start",
64
+ marginX: disableBreadcrumbGutter ? 0 : spacing
65
+ })
66
+ );
67
+ var WebAppBodyScrollableWrapper = styled(FlexGrowCol, {
68
+ name: WebAppBodyName,
69
+ slot: "ScrollableWrapper"
70
+ })(() => ({
71
+ alignItems: "stretch"
72
+ }));
73
+ var WebAppBodyScrollable = styled(FlexGrowCol, {
74
+ ...defaultStyledOptions,
75
+ name: WebAppBodyName,
76
+ slot: "Scrollable"
77
+ })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
78
+ const props = variant === "scrollable" ? scrollableContent : fixedContent;
79
+ return {
80
+ ...props,
81
+ alignItems: "stretch",
82
+ justifyContent: "start",
83
+ [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
84
+ inset: "unset",
85
+ position: "relative"
86
+ }
87
+ };
88
+ });
89
+ var WebAppBody = ({
90
+ children,
91
+ breadcrumbs,
92
+ disableBreadcrumbGutter,
93
+ mobileScrollingBreakpoint,
94
+ spacing = 1,
95
+ variant,
96
+ ...props
97
+ }) => {
98
+ return /* @__PURE__ */ jsxs(WebAppBodyRoot, { mobileScrollingBreakpoint, spacing, variant, ...props, children: [
99
+ breadcrumbs ? /* @__PURE__ */ jsx(WebAppBodyBreadcrumb, { disableBreadcrumbGutter, spacing, children: breadcrumbs }) : null,
100
+ /* @__PURE__ */ jsx(WebAppBodyScrollableWrapper, { children: /* @__PURE__ */ jsx(WebAppBodyScrollable, { mobileScrollingBreakpoint, variant, children }) })
101
+ ] });
102
+ };
103
+
104
+ // src/components/Page.tsx
105
+ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
106
+ var WebAppPageRoot = styled2(FlexGrowCol2, {
107
+ name: "WebAppPage",
108
+ shouldForwardProp: (propName) => propName !== "mobileScrollingBreakpoint" && propName !== "variant",
109
+ slot: "Root"
110
+ })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
111
+ const props = variant === "scrollable" ? scrollableWrap : fixedWrap;
112
+ return {
113
+ ...props,
114
+ alignItems: "stretch",
115
+ justifyContent: "start",
116
+ maxWidth: "100vw",
117
+ [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
118
+ inset: 0,
119
+ position: "absolute"
120
+ }
121
+ };
122
+ });
123
+ var WebAppPage = ({
124
+ disableGutters,
125
+ disableBreadcrumbGutter,
126
+ title,
127
+ container,
128
+ children,
129
+ breadcrumbs,
130
+ mobileScrollingBreakpoint,
131
+ variant = "scrollable",
132
+ ...props
133
+ }) => {
134
+ const userEvents = useUserEvents();
135
+ const { pathname } = useLocation();
136
+ useAsyncEffect(
137
+ // eslint-disable-next-line react-hooks/exhaustive-deps
138
+ async () => {
139
+ await (userEvents == null ? void 0 : userEvents.viewContent({ name: title ?? "NodeBasePage", path: location.pathname }));
140
+ },
141
+ [pathname, title, userEvents]
142
+ );
143
+ return /* @__PURE__ */ jsxs2(WebAppPageRoot, { mobileScrollingBreakpoint, variant, ...props, children: [
144
+ /* @__PURE__ */ jsx2(Helmet, { title }),
145
+ container && container !== "none" ? /* @__PURE__ */ jsx2(
146
+ Container,
147
+ {
148
+ disableGutters,
149
+ style: { alignItems: "stretch", display: "flex", flexDirection: "column", flexGrow: 1, justifyContent: "flex-start" },
150
+ maxWidth: container,
151
+ children: /* @__PURE__ */ jsx2(
152
+ WebAppBody,
153
+ {
154
+ disableBreadcrumbGutter,
155
+ breadcrumbs,
156
+ mobileScrollingBreakpoint,
157
+ variant,
158
+ ...props,
159
+ children
160
+ }
161
+ )
162
+ }
163
+ ) : /* @__PURE__ */ jsx2(
164
+ WebAppBody,
165
+ {
166
+ disableBreadcrumbGutter,
167
+ breadcrumbs,
168
+ mobileScrollingBreakpoint,
169
+ paddingX: disableGutters ? 0 : 1,
170
+ variant,
171
+ ...props,
172
+ children
173
+ }
174
+ )
175
+ ] });
176
+ };
177
+
178
+ // src/components/NotFoundPage/Page.tsx
179
+ import { jsx as jsx3 } from "react/jsx-runtime";
180
+ var WebAppNotFoundPage = ({ title, ...props }) => /* @__PURE__ */ jsx3(WebAppPage, { title: title ?? "Sorry! Page Not Found", ...props, children: /* @__PURE__ */ jsx3(NotFound, {}) });
181
+ var NotFoundPage = WebAppNotFoundPage;
182
+ export {
183
+ NotFoundPage,
184
+ WebAppNotFoundPage
185
+ };
23
186
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/NotFoundPage/index.ts"],"sourcesContent":["export * from './Page'\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,iCAAc,mBAAd;","names":[]}
1
+ {"version":3,"sources":["../../../../src/components/NotFoundPage/Page.tsx","../../../../src/components/Page.tsx","../../../../src/components/Body.tsx","../../../../src/components/lib/cssValues.ts"],"sourcesContent":["import { NotFound } from '@xyo-network/react-shared'\n\nimport { WebAppPage, WebAppPageProps } from '../Page'\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","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":["styled","FlexGrowCol","jsx","jsxs","styled","FlexGrowCol","jsx"]}
@@ -0,0 +1,205 @@
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/Page.tsx
21
+ var Page_exports = {};
22
+ __export(Page_exports, {
23
+ FlexPage: () => FlexPage,
24
+ WebAppPage: () => WebAppPage
25
+ });
26
+ module.exports = __toCommonJS(Page_exports);
27
+ var import_material2 = require("@mui/material");
28
+ var import_react_async_effect = require("@xylabs/react-async-effect");
29
+ var import_react_flexbox2 = require("@xylabs/react-flexbox");
30
+ var import_react_pixel = require("@xylabs/react-pixel");
31
+ var import_react_helmet = require("react-helmet");
32
+ var import_react_router_dom = require("react-router-dom");
33
+
34
+ // src/components/Body.tsx
35
+ var import_material = require("@mui/material");
36
+ var import_react_flexbox = require("@xylabs/react-flexbox");
37
+
38
+ // src/components/lib/cssValues.ts
39
+ var scrollableWrap = {
40
+ inset: 0,
41
+ position: "absolute"
42
+ };
43
+ var fixedWrap = {
44
+ inset: "unset",
45
+ position: "relative"
46
+ };
47
+ var scrollableContent = {
48
+ ...fixedWrap
49
+ };
50
+ var fixedContent = {
51
+ ...scrollableWrap
52
+ };
53
+
54
+ // src/components/Body.tsx
55
+ var import_jsx_runtime = require("react/jsx-runtime");
56
+ var WebAppBodyName = "WebAppBody";
57
+ var propsNotForwarded = ["mobileScrollingBreakpoint", "variant", "spacing", "disableBreadcrumbGutter"];
58
+ var defaultStyledOptions = {
59
+ shouldForwardProp: (prop) => !propsNotForwarded.includes(prop)
60
+ };
61
+ var WebAppBodyRoot = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
62
+ ...defaultStyledOptions,
63
+ name: WebAppBodyName,
64
+ slot: "Root"
65
+ })(({ spacing, theme, mobileScrollingBreakpoint = "sm", variant }) => {
66
+ const scrollable = variant === "scrollable";
67
+ return theme.unstable_sx({
68
+ alignItems: "stretch",
69
+ gap: 1,
70
+ justifyContent: "flex-start",
71
+ overflowX: "visible",
72
+ overflowY: scrollable ? "scroll" : "hidden",
73
+ paddingY: spacing,
74
+ [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
75
+ overflowY: "scroll"
76
+ }
77
+ });
78
+ });
79
+ var WebAppBodyBreadcrumb = (0, import_material.styled)(import_react_flexbox.FlexRow, {
80
+ ...defaultStyledOptions,
81
+ name: WebAppBodyName,
82
+ slot: "Breadcrumb"
83
+ })(
84
+ ({ theme, disableBreadcrumbGutter, spacing }) => theme.unstable_sx({
85
+ justifyContent: "start",
86
+ marginX: disableBreadcrumbGutter ? 0 : spacing
87
+ })
88
+ );
89
+ var WebAppBodyScrollableWrapper = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
90
+ name: WebAppBodyName,
91
+ slot: "ScrollableWrapper"
92
+ })(() => ({
93
+ alignItems: "stretch"
94
+ }));
95
+ var WebAppBodyScrollable = (0, import_material.styled)(import_react_flexbox.FlexGrowCol, {
96
+ ...defaultStyledOptions,
97
+ name: WebAppBodyName,
98
+ slot: "Scrollable"
99
+ })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
100
+ const props = variant === "scrollable" ? scrollableContent : fixedContent;
101
+ return {
102
+ ...props,
103
+ alignItems: "stretch",
104
+ justifyContent: "start",
105
+ [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
106
+ inset: "unset",
107
+ position: "relative"
108
+ }
109
+ };
110
+ });
111
+ var WebAppBody = ({
112
+ children,
113
+ breadcrumbs,
114
+ disableBreadcrumbGutter,
115
+ mobileScrollingBreakpoint,
116
+ spacing = 1,
117
+ variant,
118
+ ...props
119
+ }) => {
120
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(WebAppBodyRoot, { mobileScrollingBreakpoint, spacing, variant, ...props, children: [
121
+ breadcrumbs ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyBreadcrumb, { disableBreadcrumbGutter, spacing, children: breadcrumbs }) : null,
122
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyScrollableWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WebAppBodyScrollable, { mobileScrollingBreakpoint, variant, children }) })
123
+ ] });
124
+ };
125
+
126
+ // src/components/Page.tsx
127
+ var import_jsx_runtime2 = require("react/jsx-runtime");
128
+ var WebAppPageRoot = (0, import_material2.styled)(import_react_flexbox2.FlexGrowCol, {
129
+ name: "WebAppPage",
130
+ shouldForwardProp: (propName) => propName !== "mobileScrollingBreakpoint" && propName !== "variant",
131
+ slot: "Root"
132
+ })(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
133
+ const props = variant === "scrollable" ? scrollableWrap : fixedWrap;
134
+ return {
135
+ ...props,
136
+ alignItems: "stretch",
137
+ justifyContent: "start",
138
+ maxWidth: "100vw",
139
+ [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
140
+ inset: 0,
141
+ position: "absolute"
142
+ }
143
+ };
144
+ });
145
+ var WebAppPage = ({
146
+ disableGutters,
147
+ disableBreadcrumbGutter,
148
+ title,
149
+ container,
150
+ children,
151
+ breadcrumbs,
152
+ mobileScrollingBreakpoint,
153
+ variant = "scrollable",
154
+ ...props
155
+ }) => {
156
+ const userEvents = (0, import_react_pixel.useUserEvents)();
157
+ const { pathname } = (0, import_react_router_dom.useLocation)();
158
+ (0, import_react_async_effect.useAsyncEffect)(
159
+ // eslint-disable-next-line react-hooks/exhaustive-deps
160
+ async () => {
161
+ await (userEvents == null ? void 0 : userEvents.viewContent({ name: title ?? "NodeBasePage", path: location.pathname }));
162
+ },
163
+ [pathname, title, userEvents]
164
+ );
165
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(WebAppPageRoot, { mobileScrollingBreakpoint, variant, ...props, children: [
166
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_helmet.Helmet, { title }),
167
+ container && container !== "none" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
168
+ import_material2.Container,
169
+ {
170
+ disableGutters,
171
+ style: { alignItems: "stretch", display: "flex", flexDirection: "column", flexGrow: 1, justifyContent: "flex-start" },
172
+ maxWidth: container,
173
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
174
+ WebAppBody,
175
+ {
176
+ disableBreadcrumbGutter,
177
+ breadcrumbs,
178
+ mobileScrollingBreakpoint,
179
+ variant,
180
+ ...props,
181
+ children
182
+ }
183
+ )
184
+ }
185
+ ) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
186
+ WebAppBody,
187
+ {
188
+ disableBreadcrumbGutter,
189
+ breadcrumbs,
190
+ mobileScrollingBreakpoint,
191
+ paddingX: disableGutters ? 0 : 1,
192
+ variant,
193
+ ...props,
194
+ children
195
+ }
196
+ )
197
+ ] });
198
+ };
199
+ var FlexPage = WebAppPage;
200
+ // Annotate the CommonJS export names for ESM import in node:
201
+ 0 && (module.exports = {
202
+ FlexPage,
203
+ WebAppPage
204
+ });
205
+ //# sourceMappingURL=Page.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/Page.tsx","../../../src/components/Body.tsx","../../../src/components/lib/cssValues.ts"],"sourcesContent":["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":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAAA,mBAAkD;AAClD,gCAA+B;AAC/B,IAAAC,wBAA0C;AAC1C,yBAA8B;AAE9B,0BAAuB;AACvB,8BAA4B;;;ACN5B,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;;;ADxCI,IAAAC,sBAAA;AA9CJ,IAAM,qBAAiB,yBAAO,mCAAa;AAAA,EACzC,MAAM;AAAA,EACN,mBAAmB,CAAC,aAAa,aAAa,+BAA+B,aAAa;AAAA,EAC1F,MAAM;AACR,CAAC,EAAmB,CAAC,EAAE,OAAO,4BAA4B,MAAM,QAAQ,MAAM;AAC5E,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,aAAsD,CAAC;AAAA,EAClE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AACJ,QAAM,iBAAa,kCAAc;AACjC,QAAM,EAAE,SAAS,QAAI,qCAAY;AAEjC;AAAA;AAAA,IAEE,YAAY;AACV,aAAM,yCAAY,YAAY,EAAE,MAAM,SAAS,gBAAgB,MAAM,SAAS,SAAS;AAAA,IACzF;AAAA,IACA,CAAC,UAAU,OAAO,UAAU;AAAA,EAC9B;AAEA,SACE,8CAAC,kBAAe,2BAAsD,SAAmB,GAAG,OAC1F;AAAA,iDAAC,8BAAO,OAAc;AAAA,IACrB,aAAa,cAAc,SAC1B;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO,EAAE,YAAY,WAAW,SAAS,QAAQ,eAAe,UAAU,UAAU,GAAG,gBAAgB,aAAa;AAAA,QACpH,UAAU;AAAA,QAEV;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACC,GAAG;AAAA,YAEH;AAAA;AAAA,QACH;AAAA;AAAA,IACF,IAEA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,iBAAiB,IAAI;AAAA,QAC/B;AAAA,QACC,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,KAEJ;AAEJ;AAGO,IAAM,WAAW;","names":["import_material","import_react_flexbox","import_jsx_runtime"]}
@@ -0,0 +1,13 @@
1
+ /// <reference types="react" />
2
+ import { ContainerProps } from '@mui/material';
3
+ import { FlexBoxProps } from '@xylabs/react-flexbox';
4
+ import { WithChildren } from '@xylabs/react-shared';
5
+ import { WebAppBodyProps } from './Body';
6
+ export interface WebAppPageProps extends WebAppBodyProps, FlexBoxProps {
7
+ container?: ContainerProps['maxWidth'] | 'none';
8
+ disableGutters?: boolean;
9
+ }
10
+ export declare const WebAppPage: React.FC<WithChildren<WebAppPageProps>>;
11
+ /** @deprecated use WebAppPagePage instead */
12
+ export declare const FlexPage: import("react").FC<WithChildren<WebAppPageProps>>;
13
+ //# sourceMappingURL=Page.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Page.d.ts","sourceRoot":"","sources":["../../../src/components/Page.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAa,cAAc,EAAU,MAAM,eAAe,CAAA;AAEjE,OAAO,EAAE,YAAY,EAAe,MAAM,uBAAuB,CAAA;AAEjE,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAInD,OAAO,EAAc,eAAe,EAAE,MAAM,QAAQ,CAAA;AAqBpD,MAAM,WAAW,eAAgB,SAAQ,eAAe,EAAE,YAAY;IACpE,SAAS,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,GAAG,MAAM,CAAA;IAC/C,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,eAAe,CAAC,CAuD9D,CAAA;AAED,6CAA6C;AAC7C,eAAO,MAAM,QAAQ,mDAAa,CAAA"}