@xyo-network/react-webapp 2.63.1 → 2.64.0-rc.1
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.
- package/dist/components/Body.d.mts.map +1 -0
- package/dist/components/Body.d.ts +12 -0
- package/dist/components/Body.d.ts.map +1 -0
- package/dist/components/Chrome.d.mts.map +1 -0
- package/dist/components/Chrome.d.ts +14 -0
- package/dist/components/Chrome.d.ts.map +1 -0
- package/dist/components/Chrome.stories.d.mts +8 -0
- package/dist/components/Chrome.stories.d.mts.map +1 -0
- package/dist/components/Chrome.stories.d.ts +8 -0
- package/dist/components/Chrome.stories.d.ts.map +1 -0
- package/dist/components/ErrorPage.d.mts.map +1 -0
- package/dist/components/ErrorPage.d.ts +9 -0
- package/dist/components/ErrorPage.d.ts.map +1 -0
- package/dist/components/NotFoundPage/Page.d.mts.map +1 -0
- package/dist/components/NotFoundPage/Page.d.ts +6 -0
- package/dist/components/NotFoundPage/Page.d.ts.map +1 -0
- package/dist/components/NotFoundPage/Page.stories.d.mts +5 -0
- package/dist/components/NotFoundPage/Page.stories.d.mts.map +1 -0
- package/dist/components/NotFoundPage/Page.stories.d.ts +5 -0
- package/dist/components/NotFoundPage/Page.stories.d.ts.map +1 -0
- package/dist/components/NotFoundPage/index.d.mts.map +1 -0
- package/dist/components/NotFoundPage/index.d.ts +2 -0
- package/dist/components/NotFoundPage/index.d.ts.map +1 -0
- package/dist/components/Page.d.mts.map +1 -0
- package/dist/components/Page.d.ts +13 -0
- package/dist/components/Page.d.ts.map +1 -0
- package/dist/components/index.d.mts.map +1 -0
- package/dist/{esm/components/index.js → components/index.d.ts} +1 -1
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/lib/cssValues.d.mts.map +1 -0
- package/dist/components/lib/cssValues.d.ts +6 -0
- package/dist/components/lib/cssValues.d.ts.map +1 -0
- package/dist/components/lib/index.d.mts.map +1 -0
- package/dist/components/lib/index.d.ts +2 -0
- package/dist/components/lib/index.d.ts.map +1 -0
- package/dist/index.d.mts.map +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/{types/index.d.ts.map → index.d.ts.map} +1 -1
- package/dist/index.js +272 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +238 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +34 -25
- package/dist/cjs/components/Body.js +0 -50
- package/dist/cjs/components/Body.js.map +0 -1
- package/dist/cjs/components/Chrome.js +0 -21
- package/dist/cjs/components/Chrome.js.map +0 -1
- package/dist/cjs/components/ErrorPage.js +0 -15
- package/dist/cjs/components/ErrorPage.js.map +0 -1
- package/dist/cjs/components/NotFoundPage/Page.js +0 -15
- package/dist/cjs/components/NotFoundPage/Page.js.map +0 -1
- package/dist/cjs/components/NotFoundPage/index.js +0 -5
- package/dist/cjs/components/NotFoundPage/index.js.map +0 -1
- package/dist/cjs/components/Page.js +0 -39
- package/dist/cjs/components/Page.js.map +0 -1
- package/dist/cjs/components/index.js +0 -9
- package/dist/cjs/components/index.js.map +0 -1
- package/dist/cjs/components/lib/cssValues.js +0 -15
- package/dist/cjs/components/lib/cssValues.js.map +0 -1
- package/dist/cjs/components/lib/index.js +0 -5
- package/dist/cjs/components/lib/index.js.map +0 -1
- package/dist/cjs/index.js +0 -5
- package/dist/cjs/index.js.map +0 -1
- package/dist/docs.json +0 -94282
- package/dist/esm/components/Body.js +0 -61
- package/dist/esm/components/Body.js.map +0 -1
- package/dist/esm/components/Chrome.js +0 -16
- package/dist/esm/components/Chrome.js.map +0 -1
- package/dist/esm/components/ErrorPage.js +0 -7
- package/dist/esm/components/ErrorPage.js.map +0 -1
- package/dist/esm/components/NotFoundPage/Page.js +0 -7
- package/dist/esm/components/NotFoundPage/Page.js.map +0 -1
- package/dist/esm/components/NotFoundPage/index.js +0 -2
- package/dist/esm/components/NotFoundPage/index.js.map +0 -1
- package/dist/esm/components/Page.js +0 -39
- package/dist/esm/components/Page.js.map +0 -1
- package/dist/esm/components/index.js.map +0 -1
- package/dist/esm/components/lib/cssValues.js +0 -16
- package/dist/esm/components/lib/cssValues.js.map +0 -1
- package/dist/esm/components/lib/index.js +0 -2
- package/dist/esm/components/lib/index.js.map +0 -1
- package/dist/esm/index.js +0 -2
- package/dist/esm/index.js.map +0 -1
- package/dist/types/components/Body.d.ts.map +0 -1
- package/dist/types/components/Chrome.d.ts.map +0 -1
- package/dist/types/components/ErrorPage.d.ts.map +0 -1
- package/dist/types/components/NotFoundPage/Page.d.ts.map +0 -1
- package/dist/types/components/NotFoundPage/index.d.ts.map +0 -1
- package/dist/types/components/Page.d.ts.map +0 -1
- package/dist/types/components/index.d.ts.map +0 -1
- package/dist/types/components/lib/cssValues.d.ts.map +0 -1
- package/dist/types/components/lib/index.d.ts.map +0 -1
- /package/dist/{types/components/Body.d.ts → components/Body.d.mts} +0 -0
- /package/dist/{types/components/Chrome.d.ts → components/Chrome.d.mts} +0 -0
- /package/dist/{types/components/ErrorPage.d.ts → components/ErrorPage.d.mts} +0 -0
- /package/dist/{types/components/NotFoundPage/Page.d.ts → components/NotFoundPage/Page.d.mts} +0 -0
- /package/dist/{types/components/NotFoundPage/index.d.ts → components/NotFoundPage/index.d.mts} +0 -0
- /package/dist/{types/components/Page.d.ts → components/Page.d.mts} +0 -0
- /package/dist/{types/components/index.d.ts → components/index.d.mts} +0 -0
- /package/dist/{types/components/lib/cssValues.d.ts → components/lib/cssValues.d.mts} +0 -0
- /package/dist/{types/components/lib/index.d.ts → components/lib/index.d.mts} +0 -0
- /package/dist/{types/index.d.ts → index.d.mts} +0 -0
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,238 @@
|
|
|
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
|
+
|
|
93
|
+
// src/components/Chrome.tsx
|
|
94
|
+
import { Divider, Paper } from "@mui/material";
|
|
95
|
+
import { FlexCol, FlexGrowCol as FlexGrowCol3, FlexGrowRow } from "@xylabs/react-flexbox";
|
|
96
|
+
import { ApplicationAppBar, SystemToolbar } from "@xyo-network/react-appbar";
|
|
97
|
+
import { Footer } from "@xyo-network/react-footer";
|
|
98
|
+
import { ErrorBoundary } from "@xyo-network/react-shared";
|
|
99
|
+
import { forwardRef } from "react";
|
|
100
|
+
import { Helmet as Helmet2 } from "react-helmet";
|
|
101
|
+
|
|
102
|
+
// src/components/ErrorPage.tsx
|
|
103
|
+
import { ButtonEx } from "@xylabs/react-button";
|
|
104
|
+
|
|
105
|
+
// src/components/Page.tsx
|
|
106
|
+
import { Container, styled as styled2 } from "@mui/material";
|
|
107
|
+
import { useAsyncEffect } from "@xylabs/react-async-effect";
|
|
108
|
+
import { FlexGrowCol as FlexGrowCol2 } from "@xylabs/react-flexbox";
|
|
109
|
+
import { useUserEvents } from "@xylabs/react-pixel";
|
|
110
|
+
import { Helmet } from "react-helmet";
|
|
111
|
+
import { useLocation } from "react-router-dom";
|
|
112
|
+
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
113
|
+
var WebAppPageRoot = styled2(FlexGrowCol2, {
|
|
114
|
+
name: "WebAppPage",
|
|
115
|
+
shouldForwardProp: (propName) => propName !== "mobileScrollingBreakpoint" && propName !== "variant",
|
|
116
|
+
slot: "Root"
|
|
117
|
+
})(({ theme, mobileScrollingBreakpoint = "sm", variant }) => {
|
|
118
|
+
const props = variant === "scrollable" ? scrollableWrap : fixedWrap;
|
|
119
|
+
return {
|
|
120
|
+
...props,
|
|
121
|
+
alignItems: "stretch",
|
|
122
|
+
justifyContent: "start",
|
|
123
|
+
maxWidth: "100vw",
|
|
124
|
+
[theme.breakpoints.down(mobileScrollingBreakpoint)]: {
|
|
125
|
+
inset: 0,
|
|
126
|
+
position: "absolute"
|
|
127
|
+
}
|
|
128
|
+
};
|
|
129
|
+
});
|
|
130
|
+
var WebAppPage = ({
|
|
131
|
+
disableGutters,
|
|
132
|
+
disableBreadcrumbGutter,
|
|
133
|
+
title,
|
|
134
|
+
container,
|
|
135
|
+
children,
|
|
136
|
+
breadcrumbs,
|
|
137
|
+
mobileScrollingBreakpoint,
|
|
138
|
+
variant = "scrollable",
|
|
139
|
+
...props
|
|
140
|
+
}) => {
|
|
141
|
+
const userEvents = useUserEvents();
|
|
142
|
+
const { pathname } = useLocation();
|
|
143
|
+
useAsyncEffect(
|
|
144
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
145
|
+
async () => {
|
|
146
|
+
await userEvents?.viewContent({ name: title ?? "NodeBasePage", path: location.pathname });
|
|
147
|
+
},
|
|
148
|
+
[pathname, title, userEvents]
|
|
149
|
+
);
|
|
150
|
+
return /* @__PURE__ */ jsxs2(WebAppPageRoot, { mobileScrollingBreakpoint, variant, ...props, children: [
|
|
151
|
+
/* @__PURE__ */ jsx2(Helmet, { title }),
|
|
152
|
+
container && container !== "none" ? /* @__PURE__ */ jsx2(
|
|
153
|
+
Container,
|
|
154
|
+
{
|
|
155
|
+
disableGutters,
|
|
156
|
+
style: { alignItems: "stretch", display: "flex", flexDirection: "column", flexGrow: 1, justifyContent: "flex-start" },
|
|
157
|
+
maxWidth: container,
|
|
158
|
+
children: /* @__PURE__ */ jsx2(
|
|
159
|
+
WebAppBody,
|
|
160
|
+
{
|
|
161
|
+
disableBreadcrumbGutter,
|
|
162
|
+
breadcrumbs,
|
|
163
|
+
mobileScrollingBreakpoint,
|
|
164
|
+
variant,
|
|
165
|
+
...props,
|
|
166
|
+
children
|
|
167
|
+
}
|
|
168
|
+
)
|
|
169
|
+
}
|
|
170
|
+
) : /* @__PURE__ */ jsx2(
|
|
171
|
+
WebAppBody,
|
|
172
|
+
{
|
|
173
|
+
disableBreadcrumbGutter,
|
|
174
|
+
breadcrumbs,
|
|
175
|
+
mobileScrollingBreakpoint,
|
|
176
|
+
paddingX: disableGutters ? 0 : 1,
|
|
177
|
+
variant,
|
|
178
|
+
...props,
|
|
179
|
+
children
|
|
180
|
+
}
|
|
181
|
+
)
|
|
182
|
+
] });
|
|
183
|
+
};
|
|
184
|
+
var FlexPage = WebAppPage;
|
|
185
|
+
|
|
186
|
+
// src/components/ErrorPage.tsx
|
|
187
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
188
|
+
var WebAppErrorPage = ({ error, ...props }) => /* @__PURE__ */ jsxs3(WebAppPage, { title: "Oops! Something went wrong", ...props, children: [
|
|
189
|
+
/* @__PURE__ */ jsx3("h1", { children: "Oops! Something went wrong!" }),
|
|
190
|
+
/* @__PURE__ */ jsx3("p", { children: `${error}` }),
|
|
191
|
+
/* @__PURE__ */ jsx3(ButtonEx, { href: "/", variant: "contained", children: "Homepage" })
|
|
192
|
+
] });
|
|
193
|
+
var ErrorPage = WebAppErrorPage;
|
|
194
|
+
|
|
195
|
+
// src/components/Chrome.tsx
|
|
196
|
+
import { Fragment, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
197
|
+
var WebAppChrome = forwardRef(
|
|
198
|
+
({ appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = "menu", ...props }, ref) => {
|
|
199
|
+
return /* @__PURE__ */ jsxs4(FlexCol, { id: "web-chrome-flex", alignItems: "stretch", overflow: "hidden", height: "100vh", ref, ...props, children: [
|
|
200
|
+
/* @__PURE__ */ jsx4(Helmet2, { defaultTitle: appName, titleTemplate: `%s | ${appName}`, children: /* @__PURE__ */ jsx4("meta", { content: "website", property: "og:type" }) }),
|
|
201
|
+
appbar ?? /* @__PURE__ */ jsx4(ApplicationAppBar, { systemToolbar: /* @__PURE__ */ jsx4(SystemToolbar, { menuItems: navigationType === "menu" ? menuItems : void 0 }) }),
|
|
202
|
+
/* @__PURE__ */ jsxs4(FlexGrowRow, { id: "sidebar-nav-flex", overflow: "hidden", alignItems: "stretch", children: [
|
|
203
|
+
navigationType !== "menu" ? /* @__PURE__ */ jsxs4(Fragment, { children: [
|
|
204
|
+
menuItems,
|
|
205
|
+
/* @__PURE__ */ jsx4(Divider, { orientation: "vertical" })
|
|
206
|
+
] }) : null,
|
|
207
|
+
/* @__PURE__ */ jsx4(FlexGrowCol3, { id: "main-flex", justifyContent: "flex-start", alignItems: "stretch", children: /* @__PURE__ */ jsx4(
|
|
208
|
+
ErrorBoundary,
|
|
209
|
+
{
|
|
210
|
+
fallbackWithError: (error) => {
|
|
211
|
+
return errorPage ?? /* @__PURE__ */ jsx4(WebAppErrorPage, { error });
|
|
212
|
+
},
|
|
213
|
+
children
|
|
214
|
+
}
|
|
215
|
+
) })
|
|
216
|
+
] }),
|
|
217
|
+
/* @__PURE__ */ jsx4(FlexCol, { id: "footer-flex", alignItems: "stretch", children: /* @__PURE__ */ jsx4(Paper, { elevation: footerElevation, square: true, children: footer ?? /* @__PURE__ */ jsx4(Footer, { dynamicHeight: true }) }) })
|
|
218
|
+
] });
|
|
219
|
+
}
|
|
220
|
+
);
|
|
221
|
+
WebAppChrome.displayName = "WebAppChrome";
|
|
222
|
+
|
|
223
|
+
// src/components/NotFoundPage/Page.tsx
|
|
224
|
+
import { NotFound } from "@xyo-network/react-shared";
|
|
225
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
226
|
+
var WebAppNotFoundPage = ({ title, ...props }) => /* @__PURE__ */ jsx5(WebAppPage, { title: title ?? "Sorry! Page Not Found", ...props, children: /* @__PURE__ */ jsx5(NotFound, {}) });
|
|
227
|
+
var NotFoundPage = WebAppNotFoundPage;
|
|
228
|
+
export {
|
|
229
|
+
ErrorPage,
|
|
230
|
+
FlexPage,
|
|
231
|
+
NotFoundPage,
|
|
232
|
+
WebAppBody,
|
|
233
|
+
WebAppChrome,
|
|
234
|
+
WebAppErrorPage,
|
|
235
|
+
WebAppNotFoundPage,
|
|
236
|
+
WebAppPage
|
|
237
|
+
};
|
|
238
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/Body.tsx","../src/components/lib/cssValues.ts","../src/components/Chrome.tsx","../src/components/ErrorPage.tsx","../src/components/Page.tsx","../src/components/NotFoundPage/Page.tsx"],"sourcesContent":["import { 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","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 { 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"],"mappings":"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","names":["FlexGrowCol","Helmet","styled","FlexGrowCol","jsx","jsxs","styled","FlexGrowCol","jsx","jsxs","jsx","jsxs","Helmet","FlexGrowCol","jsx"]}
|
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": "
|
|
14
|
-
"@xyo-network/react-app-settings": "~2.
|
|
15
|
-
"@xyo-network/react-appbar": "~2.
|
|
16
|
-
"@xyo-network/react-footer": "~2.
|
|
17
|
-
"@xyo-network/react-shared": "~2.
|
|
13
|
+
"@xylabs/react-async-effect": "^3.1.0-rc.3",
|
|
14
|
+
"@xyo-network/react-app-settings": "~2.64.0-rc.1",
|
|
15
|
+
"@xyo-network/react-appbar": "~2.64.0-rc.1",
|
|
16
|
+
"@xyo-network/react-footer": "~2.64.0-rc.1",
|
|
17
|
+
"@xyo-network/react-shared": "~2.64.0-rc.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"@mui/icons-material": "^5",
|
|
@@ -36,38 +36,46 @@
|
|
|
36
36
|
"@storybook/react": "^7.4.3",
|
|
37
37
|
"@types/react-helmet": "^6.1.6",
|
|
38
38
|
"@xylabs/pixel": "^1.4.14",
|
|
39
|
-
"@xylabs/react-button": "
|
|
40
|
-
"@xylabs/react-flexbox": "
|
|
41
|
-
"@xylabs/react-link": "
|
|
42
|
-
"@xylabs/react-pixel": "
|
|
43
|
-
"@xylabs/react-shared": "
|
|
44
|
-
"@xylabs/ts-scripts-yarn3": "^
|
|
45
|
-
"@xylabs/tsconfig-react": "^
|
|
39
|
+
"@xylabs/react-button": "^3.1.0-rc.3",
|
|
40
|
+
"@xylabs/react-flexbox": "^3.1.0-rc.3",
|
|
41
|
+
"@xylabs/react-link": "^3.1.0-rc.3",
|
|
42
|
+
"@xylabs/react-pixel": "^3.1.0-rc.3",
|
|
43
|
+
"@xylabs/react-shared": "^3.1.0-rc.3",
|
|
44
|
+
"@xylabs/ts-scripts-yarn3": "^3.0.28",
|
|
45
|
+
"@xylabs/tsconfig-react": "^3.0.28",
|
|
46
46
|
"axios": "^1.5.0",
|
|
47
47
|
"typescript": "^5.2.2"
|
|
48
48
|
},
|
|
49
49
|
"description": "Common React library for all XYO projects that use React",
|
|
50
|
-
"browser": "dist/esm/index.js",
|
|
51
50
|
"docs": "dist/docs.json",
|
|
52
51
|
"exports": {
|
|
53
52
|
".": {
|
|
54
53
|
"node": {
|
|
55
|
-
"import":
|
|
56
|
-
|
|
54
|
+
"import": {
|
|
55
|
+
"types": "./dist/index.d.mts",
|
|
56
|
+
"default": "./dist/index.mjs"
|
|
57
|
+
},
|
|
58
|
+
"require": {
|
|
59
|
+
"types": "./dist/index.d.ts",
|
|
60
|
+
"default": "./dist/index.js"
|
|
61
|
+
}
|
|
57
62
|
},
|
|
58
63
|
"browser": {
|
|
59
|
-
"import":
|
|
60
|
-
|
|
64
|
+
"import": {
|
|
65
|
+
"types": "./dist/index.d.mts",
|
|
66
|
+
"default": "./dist/index.mjs"
|
|
67
|
+
},
|
|
68
|
+
"require": {
|
|
69
|
+
"types": "./dist/index.d.ts",
|
|
70
|
+
"default": "./dist/index.js"
|
|
71
|
+
}
|
|
61
72
|
},
|
|
62
|
-
"default": "./dist/
|
|
63
|
-
},
|
|
64
|
-
"./dist/docs.json": {
|
|
65
|
-
"default": "./dist/docs.json"
|
|
73
|
+
"default": "./dist/index.mjs"
|
|
66
74
|
},
|
|
67
75
|
"./package.json": "./package.json"
|
|
68
76
|
},
|
|
69
|
-
"main": "dist/
|
|
70
|
-
"module": "dist/
|
|
77
|
+
"main": "dist/index.js",
|
|
78
|
+
"module": "dist/index.mjs",
|
|
71
79
|
"homepage": "https://xyo.network",
|
|
72
80
|
"keywords": [
|
|
73
81
|
"xyo",
|
|
@@ -88,6 +96,7 @@
|
|
|
88
96
|
"license": "yarn license-checker --exclude \"MIT, ISC, Apache-2.0, BSD, BSD-2-Clause, CC-BY-4.0, Unlicense, CC-BY-3.0, CC0-1.0\""
|
|
89
97
|
},
|
|
90
98
|
"sideEffects": false,
|
|
91
|
-
"types": "dist/
|
|
92
|
-
"version": "2.
|
|
99
|
+
"types": "dist/index.d.ts",
|
|
100
|
+
"version": "2.64.0-rc.1",
|
|
101
|
+
"stableVersion": "2.63.1"
|
|
93
102
|
}
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.WebAppBody = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const material_1 = require("@mui/material");
|
|
7
|
-
const react_flexbox_1 = require("@xylabs/react-flexbox");
|
|
8
|
-
const lib_1 = require("./lib");
|
|
9
|
-
const WebAppBodyName = 'WebAppBody';
|
|
10
|
-
const propsNotForwarded = ['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter'];
|
|
11
|
-
const defaultStyledOptions = {
|
|
12
|
-
shouldForwardProp: (prop) => !propsNotForwarded.includes(prop),
|
|
13
|
-
};
|
|
14
|
-
const WebAppBodyRoot = (0, material_1.styled)(react_flexbox_1.FlexGrowCol, Object.assign(Object.assign({}, defaultStyledOptions), { name: WebAppBodyName, slot: 'Root' }))(({ spacing, theme, mobileScrollingBreakpoint = 'sm', variant }) => {
|
|
15
|
-
const scrollable = variant === 'scrollable';
|
|
16
|
-
return theme.unstable_sx({
|
|
17
|
-
alignItems: 'stretch',
|
|
18
|
-
gap: 1,
|
|
19
|
-
justifyContent: 'flex-start',
|
|
20
|
-
overflowX: 'visible',
|
|
21
|
-
overflowY: scrollable ? 'scroll' : 'hidden',
|
|
22
|
-
paddingY: spacing,
|
|
23
|
-
[theme.breakpoints.down(mobileScrollingBreakpoint)]: {
|
|
24
|
-
overflowY: 'scroll',
|
|
25
|
-
},
|
|
26
|
-
});
|
|
27
|
-
});
|
|
28
|
-
const WebAppBodyBreadcrumb = (0, material_1.styled)(react_flexbox_1.FlexRow, Object.assign(Object.assign({}, defaultStyledOptions), { name: WebAppBodyName, slot: 'Breadcrumb' }))(({ theme, disableBreadcrumbGutter, spacing }) => theme.unstable_sx({
|
|
29
|
-
justifyContent: 'start',
|
|
30
|
-
marginX: disableBreadcrumbGutter ? 0 : spacing,
|
|
31
|
-
}));
|
|
32
|
-
const WebAppBodyScrollableWrapper = (0, material_1.styled)(react_flexbox_1.FlexGrowCol, {
|
|
33
|
-
name: WebAppBodyName,
|
|
34
|
-
slot: 'ScrollableWrapper',
|
|
35
|
-
})(() => ({
|
|
36
|
-
alignItems: 'stretch',
|
|
37
|
-
}));
|
|
38
|
-
const WebAppBodyScrollable = (0, material_1.styled)(react_flexbox_1.FlexGrowCol, Object.assign(Object.assign({}, defaultStyledOptions), { name: WebAppBodyName, slot: 'Scrollable' }))(({ theme, mobileScrollingBreakpoint = 'sm', variant }) => {
|
|
39
|
-
const props = variant === 'scrollable' ? lib_1.scrollableContent : lib_1.fixedContent;
|
|
40
|
-
return Object.assign(Object.assign({}, props), { alignItems: 'stretch', justifyContent: 'start', [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
|
|
41
|
-
inset: 'unset',
|
|
42
|
-
position: 'relative',
|
|
43
|
-
} });
|
|
44
|
-
});
|
|
45
|
-
const WebAppBody = (_a) => {
|
|
46
|
-
var { children, breadcrumbs, disableBreadcrumbGutter, mobileScrollingBreakpoint, spacing = 1, variant } = _a, props = tslib_1.__rest(_a, ["children", "breadcrumbs", "disableBreadcrumbGutter", "mobileScrollingBreakpoint", "spacing", "variant"]);
|
|
47
|
-
return ((0, jsx_runtime_1.jsxs)(WebAppBodyRoot, Object.assign({ mobileScrollingBreakpoint: mobileScrollingBreakpoint, spacing: spacing, variant: variant }, props, { children: [breadcrumbs ? ((0, jsx_runtime_1.jsx)(WebAppBodyBreadcrumb, Object.assign({ disableBreadcrumbGutter: disableBreadcrumbGutter, spacing: spacing }, { children: breadcrumbs }))) : null, (0, jsx_runtime_1.jsx)(WebAppBodyScrollableWrapper, { children: (0, jsx_runtime_1.jsx)(WebAppBodyScrollable, Object.assign({ mobileScrollingBreakpoint: mobileScrollingBreakpoint, variant: variant }, { children: children })) })] })));
|
|
48
|
-
};
|
|
49
|
-
exports.WebAppBody = WebAppBody;
|
|
50
|
-
//# sourceMappingURL=Body.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Body.js","sourceRoot":"","sources":["../../../src/components/Body.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.WebAppChrome = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const material_1 = require("@mui/material");
|
|
7
|
-
const react_flexbox_1 = require("@xylabs/react-flexbox");
|
|
8
|
-
const react_appbar_1 = require("@xyo-network/react-appbar");
|
|
9
|
-
const react_footer_1 = require("@xyo-network/react-footer");
|
|
10
|
-
const react_shared_1 = require("@xyo-network/react-shared");
|
|
11
|
-
const react_1 = require("react");
|
|
12
|
-
const react_helmet_1 = require("react-helmet");
|
|
13
|
-
const ErrorPage_1 = require("./ErrorPage");
|
|
14
|
-
exports.WebAppChrome = (0, react_1.forwardRef)((_a, ref) => {
|
|
15
|
-
var { appName, appbar, children, errorPage, footer, footerElevation = 4, menuItems, navigationType = 'menu' } = _a, props = tslib_1.__rest(_a, ["appName", "appbar", "children", "errorPage", "footer", "footerElevation", "menuItems", "navigationType"]);
|
|
16
|
-
return ((0, jsx_runtime_1.jsxs)(react_flexbox_1.FlexCol, Object.assign({ id: "web-chrome-flex", alignItems: "stretch", overflow: "hidden", height: "100vh", ref: ref }, props, { children: [(0, jsx_runtime_1.jsx)(react_helmet_1.Helmet, Object.assign({ defaultTitle: appName, titleTemplate: `%s | ${appName}` }, { children: (0, jsx_runtime_1.jsx)("meta", { content: "website", property: "og:type" }) })), appbar !== null && appbar !== void 0 ? appbar : (0, jsx_runtime_1.jsx)(react_appbar_1.ApplicationAppBar, { systemToolbar: (0, jsx_runtime_1.jsx)(react_appbar_1.SystemToolbar, { menuItems: navigationType === 'menu' ? menuItems : undefined }) }), (0, jsx_runtime_1.jsxs)(react_flexbox_1.FlexGrowRow, Object.assign({ id: "sidebar-nav-flex", overflow: "hidden", alignItems: "stretch" }, { children: [navigationType !== 'menu' ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [menuItems, (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical" })] })) : null, (0, jsx_runtime_1.jsx)(react_flexbox_1.FlexGrowCol, Object.assign({ id: "main-flex", justifyContent: "flex-start", alignItems: "stretch" }, { children: (0, jsx_runtime_1.jsx)(react_shared_1.ErrorBoundary, Object.assign({ fallbackWithError: (error) => {
|
|
17
|
-
return errorPage !== null && errorPage !== void 0 ? errorPage : (0, jsx_runtime_1.jsx)(ErrorPage_1.WebAppErrorPage, { error: error });
|
|
18
|
-
} }, { children: children })) }))] })), (0, jsx_runtime_1.jsx)(react_flexbox_1.FlexCol, Object.assign({ id: "footer-flex", alignItems: "stretch" }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ elevation: footerElevation, square: true }, { children: footer !== null && footer !== void 0 ? footer : (0, jsx_runtime_1.jsx)(react_footer_1.Footer, { dynamicHeight: true }) })) }))] })));
|
|
19
|
-
});
|
|
20
|
-
exports.WebAppChrome.displayName = 'WebAppChrome';
|
|
21
|
-
//# sourceMappingURL=Chrome.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Chrome.js","sourceRoot":"","sources":["../../../src/components/Chrome.tsx"],"names":[],"mappings":";;;;;AAAA,4CAA8C;AAC9C,yDAAuF;AAEvF,4DAA4E;AAC5E,4DAAkD;AAClD,4DAAyD;AACzD,iCAA6C;AAC7C,+CAAqC;AAErC,2CAA6C;AAYhC,QAAA,YAAY,GAAG,IAAA,kBAAU,EACpC,CAAC,EAAmH,EAAE,GAAG,EAAE,EAAE;QAA5H,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,cAAc,GAAG,MAAM,OAAY,EAAP,KAAK,sBAAjH,0GAAmH,CAAF;IAChH,OAAO,CACL,wBAAC,uBAAO,kBAAC,EAAE,EAAC,iBAAiB,EAAC,UAAU,EAAC,SAAS,EAAC,QAAQ,EAAC,QAAQ,EAAC,MAAM,EAAC,OAAO,EAAC,GAAG,EAAE,GAAG,IAAM,KAAK,eACrG,uBAAC,qBAAM,kBAAC,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,OAAO,EAAE,gBAC7D,iCAAM,OAAO,EAAC,SAAS,EAAC,QAAQ,EAAC,SAAS,GAAG,IACtC,EACR,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,uBAAC,gCAAiB,IAAC,aAAa,EAAE,uBAAC,4BAAa,IAAC,SAAS,EAAE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,GAAI,GAAI,EAChI,wBAAC,2BAAW,kBAAC,EAAE,EAAC,kBAAkB,EAAC,QAAQ,EAAC,QAAQ,EAAC,UAAU,EAAC,SAAS,iBACtE,cAAc,KAAK,MAAM,CAAC,CAAC,CAAC,CAC3B,6DACG,SAAS,EACV,uBAAC,kBAAO,IAAC,WAAW,EAAC,UAAU,GAAG,IACjC,CACJ,CAAC,CAAC,CAAC,IAAI,EACR,uBAAC,2BAAW,kBAAC,EAAE,EAAC,WAAW,EAAC,cAAc,EAAC,YAAY,EAAC,UAAU,EAAC,SAAS,gBAC1E,uBAAC,4BAAa,kBACZ,iBAAiB,EAAE,CAAC,KAAK,EAAE,EAAE;gCAC3B,OAAO,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,uBAAC,2BAAe,IAAC,KAAK,EAAE,KAAK,GAAI,CAAA;4BACvD,CAAC,gBAEA,QAAQ,IACK,IACJ,KACF,EACd,uBAAC,uBAAO,kBAAC,EAAE,EAAC,aAAa,EAAC,UAAU,EAAC,SAAS,gBAC5C,uBAAC,gBAAK,kBAAC,SAAS,EAAE,eAAe,EAAE,MAAM,sBACtC,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,uBAAC,qBAAM,IAAC,aAAa,SAAG,IAC7B,IACA,KACF,CACX,CAAA;AACH,CAAC,CACF,CAAA;AAED,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAA"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ErrorPage = exports.WebAppErrorPage = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const react_button_1 = require("@xylabs/react-button");
|
|
7
|
-
const Page_1 = require("./Page");
|
|
8
|
-
const WebAppErrorPage = (_a) => {
|
|
9
|
-
var { error } = _a, props = tslib_1.__rest(_a, ["error"]);
|
|
10
|
-
return ((0, jsx_runtime_1.jsxs)(Page_1.WebAppPage, Object.assign({ title: "Oops! Something went wrong" }, props, { children: [(0, jsx_runtime_1.jsx)("h1", { children: "Oops! Something went wrong!" }), (0, jsx_runtime_1.jsx)("p", { children: `${error}` }), (0, jsx_runtime_1.jsx)(react_button_1.ButtonEx, Object.assign({ href: "/", variant: "contained" }, { children: "Homepage" }))] })));
|
|
11
|
-
};
|
|
12
|
-
exports.WebAppErrorPage = WebAppErrorPage;
|
|
13
|
-
/** @deprecated use WebAppErrorPage instead */
|
|
14
|
-
exports.ErrorPage = exports.WebAppErrorPage;
|
|
15
|
-
//# sourceMappingURL=ErrorPage.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ErrorPage.js","sourceRoot":"","sources":["../../../src/components/ErrorPage.tsx"],"names":[],"mappings":";;;;;AAAA,uDAA+C;AAE/C,iCAAoD;AAM7C,MAAM,eAAe,GAAmC,CAAC,EAAmB,EAAE,EAAE;QAAvB,EAAE,KAAK,OAAY,EAAP,KAAK,sBAAjB,SAAmB,CAAF;IAAO,OAAA,CACtF,wBAAC,iBAAU,kBAAC,KAAK,EAAC,4BAA4B,IAAK,KAAK,eACtD,yEAAoC,EACpC,wCAAI,GAAG,KAAK,EAAE,GAAK,EACnB,uBAAC,uBAAQ,kBAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAC,WAAW,8BAE3B,KACA,CACd,CAAA;CAAA,CAAA;AARY,QAAA,eAAe,mBAQ3B;AAED,8CAA8C;AACjC,QAAA,SAAS,GAAG,uBAAe,CAAA"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.NotFoundPage = exports.WebAppNotFoundPage = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const react_shared_1 = require("@xyo-network/react-shared");
|
|
7
|
-
const Page_1 = require("../Page");
|
|
8
|
-
const WebAppNotFoundPage = (_a) => {
|
|
9
|
-
var { title } = _a, props = tslib_1.__rest(_a, ["title"]);
|
|
10
|
-
return ((0, jsx_runtime_1.jsx)(Page_1.WebAppPage, Object.assign({ title: title !== null && title !== void 0 ? title : 'Sorry! Page Not Found' }, props, { children: (0, jsx_runtime_1.jsx)(react_shared_1.NotFound, {}) })));
|
|
11
|
-
};
|
|
12
|
-
exports.WebAppNotFoundPage = WebAppNotFoundPage;
|
|
13
|
-
/** @deprecated use WebAppNotFoundPage instead */
|
|
14
|
-
exports.NotFoundPage = exports.WebAppNotFoundPage;
|
|
15
|
-
//# sourceMappingURL=Page.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../../src/components/NotFoundPage/Page.tsx"],"names":[],"mappings":";;;;;AAAA,4DAAoD;AAEpD,kCAAqD;AAE9C,MAAM,kBAAkB,GAA8B,CAAC,EAAmB,EAAE,EAAE;QAAvB,EAAE,KAAK,OAAY,EAAP,KAAK,sBAAjB,SAAmB,CAAF;IAAO,OAAA,CACpF,uBAAC,iBAAU,kBAAC,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,uBAAuB,IAAM,KAAK,cAC5D,uBAAC,uBAAQ,KAAG,IACD,CACd,CAAA;CAAA,CAAA;AAJY,QAAA,kBAAkB,sBAI9B;AAED,kDAAkD;AACrC,QAAA,YAAY,GAAG,0BAAkB,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/NotFoundPage/index.ts"],"names":[],"mappings":";;;AAAA,iDAAsB"}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.FlexPage = exports.WebAppPage = void 0;
|
|
4
|
-
const tslib_1 = require("tslib");
|
|
5
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
-
const material_1 = require("@mui/material");
|
|
7
|
-
const react_async_effect_1 = require("@xylabs/react-async-effect");
|
|
8
|
-
const react_flexbox_1 = require("@xylabs/react-flexbox");
|
|
9
|
-
const react_pixel_1 = require("@xylabs/react-pixel");
|
|
10
|
-
const react_helmet_1 = require("react-helmet");
|
|
11
|
-
const react_router_dom_1 = require("react-router-dom");
|
|
12
|
-
const Body_1 = require("./Body");
|
|
13
|
-
const lib_1 = require("./lib");
|
|
14
|
-
const WebAppPageRoot = (0, material_1.styled)(react_flexbox_1.FlexGrowCol, {
|
|
15
|
-
name: 'WebAppPage',
|
|
16
|
-
shouldForwardProp: (propName) => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',
|
|
17
|
-
slot: 'Root',
|
|
18
|
-
})(({ theme, mobileScrollingBreakpoint = 'sm', variant }) => {
|
|
19
|
-
const props = variant === 'scrollable' ? lib_1.scrollableWrap : lib_1.fixedWrap;
|
|
20
|
-
return Object.assign(Object.assign({}, props), { alignItems: 'stretch', justifyContent: 'start', maxWidth: '100vw', [theme.breakpoints.down(mobileScrollingBreakpoint)]: {
|
|
21
|
-
inset: 0,
|
|
22
|
-
position: 'absolute',
|
|
23
|
-
} });
|
|
24
|
-
});
|
|
25
|
-
const WebAppPage = (_a) => {
|
|
26
|
-
var { disableGutters, disableBreadcrumbGutter, title, container, children, breadcrumbs, mobileScrollingBreakpoint, variant = 'scrollable' } = _a, props = tslib_1.__rest(_a, ["disableGutters", "disableBreadcrumbGutter", "title", "container", "children", "breadcrumbs", "mobileScrollingBreakpoint", "variant"]);
|
|
27
|
-
const userEvents = (0, react_pixel_1.useUserEvents)();
|
|
28
|
-
const { pathname } = (0, react_router_dom_1.useLocation)();
|
|
29
|
-
(0, react_async_effect_1.useAsyncEffect)(
|
|
30
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
31
|
-
() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
|
32
|
-
yield (userEvents === null || userEvents === void 0 ? void 0 : userEvents.viewContent({ name: title !== null && title !== void 0 ? title : 'NodeBasePage', path: location.pathname }));
|
|
33
|
-
}), [pathname, title, userEvents]);
|
|
34
|
-
return ((0, jsx_runtime_1.jsxs)(WebAppPageRoot, Object.assign({ mobileScrollingBreakpoint: mobileScrollingBreakpoint, variant: variant }, props, { children: [(0, jsx_runtime_1.jsx)(react_helmet_1.Helmet, { title: title }), container && container !== 'none' ? ((0, jsx_runtime_1.jsx)(material_1.Container, Object.assign({ disableGutters: disableGutters, style: { alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start' }, maxWidth: container }, { children: (0, jsx_runtime_1.jsx)(Body_1.WebAppBody, Object.assign({ disableBreadcrumbGutter: disableBreadcrumbGutter, breadcrumbs: breadcrumbs, mobileScrollingBreakpoint: mobileScrollingBreakpoint, variant: variant }, props, { children: children })) }))) : ((0, jsx_runtime_1.jsx)(Body_1.WebAppBody, Object.assign({ disableBreadcrumbGutter: disableBreadcrumbGutter, breadcrumbs: breadcrumbs, mobileScrollingBreakpoint: mobileScrollingBreakpoint, paddingX: disableGutters ? 0 : 1, variant: variant }, props, { children: children })))] })));
|
|
35
|
-
};
|
|
36
|
-
exports.WebAppPage = WebAppPage;
|
|
37
|
-
/** @deprecated use WebAppPagePage instead */
|
|
38
|
-
exports.FlexPage = exports.WebAppPage;
|
|
39
|
-
//# sourceMappingURL=Page.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../src/components/Page.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
const tslib_1 = require("tslib");
|
|
4
|
-
tslib_1.__exportStar(require("./Body"), exports);
|
|
5
|
-
tslib_1.__exportStar(require("./Chrome"), exports);
|
|
6
|
-
tslib_1.__exportStar(require("./ErrorPage"), exports);
|
|
7
|
-
tslib_1.__exportStar(require("./NotFoundPage"), exports);
|
|
8
|
-
tslib_1.__exportStar(require("./Page"), exports);
|
|
9
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":";;;AAAA,iDAAsB;AACtB,mDAAwB;AACxB,sDAA2B;AAC3B,yDAA8B;AAC9B,iDAAsB"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.fixedContent = exports.scrollableContent = exports.fixedWrap = exports.scrollableWrap = void 0;
|
|
4
|
-
exports.scrollableWrap = {
|
|
5
|
-
inset: 0,
|
|
6
|
-
position: 'absolute',
|
|
7
|
-
};
|
|
8
|
-
exports.fixedWrap = {
|
|
9
|
-
inset: 'unset',
|
|
10
|
-
position: 'relative',
|
|
11
|
-
};
|
|
12
|
-
// Making a scrollable vs fixed wrapper and content is an inversion of the wrap and content styles
|
|
13
|
-
exports.scrollableContent = Object.assign({}, exports.fixedWrap);
|
|
14
|
-
exports.fixedContent = Object.assign({}, exports.scrollableWrap);
|
|
15
|
-
//# sourceMappingURL=cssValues.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"cssValues.js","sourceRoot":"","sources":["../../../../src/components/lib/cssValues.ts"],"names":[],"mappings":";;;AAEa,QAAA,cAAc,GAAkB;IAC3C,KAAK,EAAE,CAAC;IACR,QAAQ,EAAE,UAAU;CACZ,CAAA;AAEG,QAAA,SAAS,GAAkB;IACtC,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,UAAU;CACZ,CAAA;AAEV,kGAAkG;AACrF,QAAA,iBAAiB,GAAkB,kBAC3C,iBAAS,CACJ,CAAA;AAEG,QAAA,YAAY,GAAkB,kBACtC,sBAAc,CACT,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/lib/index.ts"],"names":[],"mappings":";;;AAAA,sDAA2B"}
|
package/dist/cjs/index.js
DELETED
package/dist/cjs/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;AAAA,uDAA4B"}
|