@xyo-network/react-webapp 6.2.0 → 7.0.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/browser/components/Chrome.stories.d.ts +3 -3
- package/dist/browser/components/Chrome.stories.d.ts.map +1 -1
- package/dist/browser/components/NotFoundPage/Page.stories.d.ts +1 -1
- package/dist/browser/components/NotFoundPage/Page.stories.d.ts.map +1 -1
- package/dist/browser/index.mjs +129 -112
- package/dist/browser/index.mjs.map +1 -1
- package/package.json +35 -28
- package/typedoc.json +0 -5
- package/xy.config.ts +0 -10
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import type { Meta } from '@storybook/react-vite';
|
|
2
2
|
import { XyoWebAppChrome } from './Chrome.tsx';
|
|
3
3
|
declare const StorybookEntry: Meta<typeof XyoWebAppChrome>;
|
|
4
|
-
declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./Chrome.tsx").XyoWebAppChromeProps>;
|
|
5
|
-
declare const DefaultSideBar: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./Chrome.tsx").XyoWebAppChromeProps>;
|
|
6
|
-
declare const WithFixedSizePage: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./Chrome.tsx").XyoWebAppChromeProps>;
|
|
4
|
+
declare const Default: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./Chrome.tsx").XyoWebAppChromeProps>;
|
|
5
|
+
declare const DefaultSideBar: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./Chrome.tsx").XyoWebAppChromeProps>;
|
|
6
|
+
declare const WithFixedSizePage: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("./Chrome.tsx").XyoWebAppChromeProps>;
|
|
7
7
|
export { Default, DefaultSideBar, WithFixedSizePage, };
|
|
8
8
|
export default StorybookEntry;
|
|
9
9
|
//# sourceMappingURL=Chrome.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chrome.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAO1D,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAI9C,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,eAAe,CAAC,CAAA;AAwCjC,QAAA,MAAM,OAAO
|
|
1
|
+
{"version":3,"file":"Chrome.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Chrome.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAO1D,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAI9C,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,eAAe,CAAC,CAAA;AAwCjC,QAAA,MAAM,OAAO,iLAAoB,CAAA;AAGjC,QAAA,MAAM,cAAc,iLAAoB,CAAA;AAGxC,QAAA,MAAM,iBAAiB,iLAAoB,CAAA;AAG3C,OAAO,EACL,OAAO,EAAE,cAAc,EAAE,iBAAiB,GAC3C,CAAA;AAED,eAAe,cAAc,CAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { Meta } from '@storybook/react-vite';
|
|
2
2
|
import { NotFound } from '@xyo-network/react-shared';
|
|
3
3
|
declare const StorybookEntry: Meta<typeof NotFound>;
|
|
4
|
-
declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps>;
|
|
4
|
+
declare const Default: import(".store/storybook-virtual-997ab3c959/package/internal/csf").AnnotatedStoryFn<import("@storybook/react-vite").ReactRenderer, import("@xylabs/react-flexbox").BusyBoxProps>;
|
|
5
5
|
export { Default };
|
|
6
6
|
export default StorybookEntry;
|
|
7
7
|
//# sourceMappingURL=Page.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Page.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/NotFoundPage/Page.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAA;AAGpD,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,QAAQ,CAAC,CAAA;AAM1B,QAAA,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Page.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/NotFoundPage/Page.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAW,MAAM,uBAAuB,CAAA;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAA;AAGpD,QAAA,MAAM,cAAc,EAKf,IAAI,CAAC,OAAO,QAAQ,CAAC,CAAA;AAM1B,QAAA,MAAM,OAAO,kLAAoB,CAAA;AAGjC,OAAO,EAAE,OAAO,EAAE,CAAA;AAElB,eAAe,cAAc,CAAA"}
|
package/dist/browser/index.mjs
CHANGED
|
@@ -1,10 +1,6 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
|
-
|
|
4
1
|
// src/components/Body.tsx
|
|
5
2
|
import { styled } from "@mui/material";
|
|
6
3
|
import { FlexGrowCol, FlexRow } from "@xylabs/react-flexbox";
|
|
7
|
-
import React from "react";
|
|
8
4
|
|
|
9
5
|
// src/components/lib/cssValues.ts
|
|
10
6
|
var scrollableWrap = {
|
|
@@ -15,29 +11,24 @@ var fixedWrap = {
|
|
|
15
11
|
inset: "unset",
|
|
16
12
|
position: "relative"
|
|
17
13
|
};
|
|
18
|
-
var scrollableContent = {
|
|
19
|
-
|
|
20
|
-
};
|
|
21
|
-
var fixedContent = {
|
|
22
|
-
...scrollableWrap
|
|
23
|
-
};
|
|
14
|
+
var scrollableContent = { ...fixedWrap };
|
|
15
|
+
var fixedContent = { ...scrollableWrap };
|
|
24
16
|
|
|
25
17
|
// src/components/Body.tsx
|
|
18
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
26
19
|
var WebAppBodyName = "WebAppBody";
|
|
27
|
-
var propsNotForwarded = /* @__PURE__ */ new Set([
|
|
28
|
-
|
|
29
|
-
"variant",
|
|
30
|
-
"spacing",
|
|
31
|
-
"disableBreadcrumbGutter"
|
|
32
|
-
]);
|
|
33
|
-
var defaultStyledOptions = {
|
|
34
|
-
shouldForwardProp: /* @__PURE__ */ __name((prop) => !propsNotForwarded.has(prop), "shouldForwardProp")
|
|
35
|
-
};
|
|
20
|
+
var propsNotForwarded = /* @__PURE__ */ new Set(["mobileScrollingBreakpoint", "variant", "spacing", "disableBreadcrumbGutter"]);
|
|
21
|
+
var defaultStyledOptions = { shouldForwardProp: (prop) => !propsNotForwarded.has(prop) };
|
|
36
22
|
var WebAppBodyRoot = styled(FlexGrowCol, {
|
|
37
23
|
...defaultStyledOptions,
|
|
38
24
|
name: WebAppBodyName,
|
|
39
25
|
slot: "Root"
|
|
40
|
-
})(({
|
|
26
|
+
})(({
|
|
27
|
+
spacing,
|
|
28
|
+
theme,
|
|
29
|
+
mobileScrollingBreakpoint = "sm",
|
|
30
|
+
variant
|
|
31
|
+
}) => {
|
|
41
32
|
const scrollable = variant === "scrollable";
|
|
42
33
|
return theme.unstable_sx({
|
|
43
34
|
alignItems: "stretch",
|
|
@@ -46,30 +37,34 @@ var WebAppBodyRoot = styled(FlexGrowCol, {
|
|
|
46
37
|
overflowX: "visible",
|
|
47
38
|
overflowY: scrollable ? "scroll" : "hidden",
|
|
48
39
|
paddingY: spacing,
|
|
49
|
-
[theme.breakpoints.down(mobileScrollingBreakpoint)]: {
|
|
50
|
-
overflowY: "scroll"
|
|
51
|
-
}
|
|
40
|
+
[theme.breakpoints.down(mobileScrollingBreakpoint)]: { overflowY: "scroll" }
|
|
52
41
|
});
|
|
53
42
|
});
|
|
54
43
|
var WebAppBodyBreadcrumb = styled(FlexRow, {
|
|
55
44
|
...defaultStyledOptions,
|
|
56
45
|
name: WebAppBodyName,
|
|
57
46
|
slot: "Breadcrumb"
|
|
58
|
-
})(({
|
|
47
|
+
})(({
|
|
48
|
+
theme,
|
|
49
|
+
disableBreadcrumbGutter,
|
|
50
|
+
spacing
|
|
51
|
+
}) => theme.unstable_sx({
|
|
59
52
|
justifyContent: "start",
|
|
60
53
|
marginX: disableBreadcrumbGutter ? 0 : spacing
|
|
61
54
|
}));
|
|
62
55
|
var WebAppBodyScrollableWrapper = styled(FlexGrowCol, {
|
|
63
56
|
name: WebAppBodyName,
|
|
64
57
|
slot: "ScrollableWrapper"
|
|
65
|
-
})(() => ({
|
|
66
|
-
alignItems: "stretch"
|
|
67
|
-
}));
|
|
58
|
+
})(() => ({ alignItems: "stretch" }));
|
|
68
59
|
var WebAppBodyScrollable = styled(FlexGrowCol, {
|
|
69
60
|
...defaultStyledOptions,
|
|
70
61
|
name: WebAppBodyName,
|
|
71
62
|
slot: "Scrollable"
|
|
72
|
-
})(({
|
|
63
|
+
})(({
|
|
64
|
+
theme,
|
|
65
|
+
mobileScrollingBreakpoint = "sm",
|
|
66
|
+
variant
|
|
67
|
+
}) => {
|
|
73
68
|
const props = variant === "scrollable" ? scrollableContent : fixedContent;
|
|
74
69
|
return {
|
|
75
70
|
...props,
|
|
@@ -81,57 +76,68 @@ var WebAppBodyScrollable = styled(FlexGrowCol, {
|
|
|
81
76
|
}
|
|
82
77
|
};
|
|
83
78
|
});
|
|
84
|
-
var WebAppBody =
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
variant
|
|
96
|
-
}
|
|
97
|
-
}
|
|
79
|
+
var WebAppBody = ({
|
|
80
|
+
children,
|
|
81
|
+
breadcrumbs,
|
|
82
|
+
disableBreadcrumbGutter,
|
|
83
|
+
mobileScrollingBreakpoint,
|
|
84
|
+
spacing = 1,
|
|
85
|
+
variant,
|
|
86
|
+
...props
|
|
87
|
+
}) => {
|
|
88
|
+
return /* @__PURE__ */ jsxs(WebAppBodyRoot, { mobileScrollingBreakpoint, spacing, variant, ...props, children: [
|
|
89
|
+
breadcrumbs ? /* @__PURE__ */ jsx(WebAppBodyBreadcrumb, { disableBreadcrumbGutter, spacing, children: breadcrumbs }) : null,
|
|
90
|
+
/* @__PURE__ */ jsx(WebAppBodyScrollableWrapper, { children: /* @__PURE__ */ jsx(WebAppBodyScrollable, { mobileScrollingBreakpoint, variant, children }) })
|
|
91
|
+
] });
|
|
92
|
+
};
|
|
98
93
|
|
|
99
94
|
// src/components/Chrome.tsx
|
|
100
95
|
import { WebAppChrome } from "@xylabs/react-webapp";
|
|
101
96
|
import { XyoApplicationAppBar } from "@xyo-network/react-appbar";
|
|
102
97
|
import { Footer } from "@xyo-network/react-footer";
|
|
103
|
-
import
|
|
104
|
-
var XyoWebAppChrome =
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
98
|
+
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
99
|
+
var XyoWebAppChrome = ({
|
|
100
|
+
ref,
|
|
101
|
+
appbar,
|
|
102
|
+
footer,
|
|
103
|
+
footerElevation = 4,
|
|
104
|
+
navigationType = "menu",
|
|
105
|
+
...props
|
|
106
|
+
}) => {
|
|
107
|
+
return /* @__PURE__ */ jsx2(
|
|
108
|
+
WebAppChrome,
|
|
109
|
+
{
|
|
110
|
+
ref,
|
|
111
|
+
appbar: appbar ?? /* @__PURE__ */ jsx2(XyoApplicationAppBar, {}),
|
|
112
|
+
footerElevation,
|
|
113
|
+
navigationType,
|
|
114
|
+
footer: footer ?? /* @__PURE__ */ jsx2(Footer, { dynamicHeight: true }),
|
|
115
|
+
...props
|
|
116
|
+
}
|
|
117
|
+
);
|
|
118
|
+
};
|
|
116
119
|
XyoWebAppChrome.displayName = "XyoWebAppChrome";
|
|
117
120
|
|
|
118
121
|
// src/components/ErrorPage.tsx
|
|
119
122
|
import { ButtonEx } from "@xylabs/react-button";
|
|
120
|
-
import React4 from "react";
|
|
121
123
|
|
|
122
124
|
// src/components/Page.tsx
|
|
123
125
|
import { Container, styled as styled2 } from "@mui/material";
|
|
124
126
|
import { useAsyncEffect } from "@xylabs/react-async-effect";
|
|
125
127
|
import { FlexGrowCol as FlexGrowCol2 } from "@xylabs/react-flexbox";
|
|
126
128
|
import { useUserEvents } from "@xylabs/react-pixel";
|
|
127
|
-
import React3 from "react";
|
|
128
129
|
import { Helmet } from "react-helmet";
|
|
129
130
|
import { useLocation } from "react-router-dom";
|
|
131
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
130
132
|
var WebAppPageRoot = styled2(FlexGrowCol2, {
|
|
131
133
|
name: "WebAppPage",
|
|
132
|
-
shouldForwardProp:
|
|
134
|
+
shouldForwardProp: (propName) => propName !== "mobileScrollingBreakpoint" && propName !== "variant",
|
|
133
135
|
slot: "Root"
|
|
134
|
-
})(({
|
|
136
|
+
})(({
|
|
137
|
+
theme,
|
|
138
|
+
mobileScrollingBreakpoint = "sm",
|
|
139
|
+
variant
|
|
140
|
+
}) => {
|
|
135
141
|
const props = variant === "scrollable" ? scrollableWrap : fixedWrap;
|
|
136
142
|
return {
|
|
137
143
|
...props,
|
|
@@ -144,69 +150,80 @@ var WebAppPageRoot = styled2(FlexGrowCol2, {
|
|
|
144
150
|
}
|
|
145
151
|
};
|
|
146
152
|
});
|
|
147
|
-
var WebAppPage =
|
|
153
|
+
var WebAppPage = ({
|
|
154
|
+
disableGutters,
|
|
155
|
+
disableBreadcrumbGutter,
|
|
156
|
+
title,
|
|
157
|
+
container,
|
|
158
|
+
children,
|
|
159
|
+
breadcrumbs,
|
|
160
|
+
mobileScrollingBreakpoint,
|
|
161
|
+
variant = "scrollable",
|
|
162
|
+
...props
|
|
163
|
+
}) => {
|
|
148
164
|
const userEvents = useUserEvents();
|
|
149
165
|
const { pathname } = useLocation();
|
|
150
|
-
useAsyncEffect(
|
|
151
|
-
|
|
152
|
-
name: title ?? "NodeBasePage",
|
|
153
|
-
path: location.pathname
|
|
154
|
-
});
|
|
155
|
-
}, [
|
|
156
|
-
pathname,
|
|
157
|
-
title,
|
|
158
|
-
userEvents
|
|
159
|
-
]);
|
|
160
|
-
return /* @__PURE__ */ React3.createElement(WebAppPageRoot, {
|
|
161
|
-
mobileScrollingBreakpoint,
|
|
162
|
-
variant,
|
|
163
|
-
...props
|
|
164
|
-
}, /* @__PURE__ */ React3.createElement(Helmet, {
|
|
165
|
-
title
|
|
166
|
-
}), container && container !== "none" ? /* @__PURE__ */ React3.createElement(Container, {
|
|
167
|
-
disableGutters,
|
|
168
|
-
style: {
|
|
169
|
-
alignItems: "stretch",
|
|
170
|
-
display: "flex",
|
|
171
|
-
flexDirection: "column",
|
|
172
|
-
flexGrow: 1,
|
|
173
|
-
justifyContent: "flex-start"
|
|
166
|
+
useAsyncEffect(
|
|
167
|
+
async () => {
|
|
168
|
+
await userEvents?.viewContent({ name: title ?? "NodeBasePage", path: location.pathname });
|
|
174
169
|
},
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
170
|
+
[pathname, title, userEvents]
|
|
171
|
+
);
|
|
172
|
+
return /* @__PURE__ */ jsxs2(WebAppPageRoot, { mobileScrollingBreakpoint, variant, ...props, children: [
|
|
173
|
+
/* @__PURE__ */ jsx3(Helmet, { title }),
|
|
174
|
+
container && container !== "none" ? /* @__PURE__ */ jsx3(
|
|
175
|
+
Container,
|
|
176
|
+
{
|
|
177
|
+
disableGutters,
|
|
178
|
+
style: {
|
|
179
|
+
alignItems: "stretch",
|
|
180
|
+
display: "flex",
|
|
181
|
+
flexDirection: "column",
|
|
182
|
+
flexGrow: 1,
|
|
183
|
+
justifyContent: "flex-start"
|
|
184
|
+
},
|
|
185
|
+
maxWidth: container,
|
|
186
|
+
children: /* @__PURE__ */ jsx3(
|
|
187
|
+
WebAppBody,
|
|
188
|
+
{
|
|
189
|
+
disableBreadcrumbGutter,
|
|
190
|
+
breadcrumbs,
|
|
191
|
+
mobileScrollingBreakpoint,
|
|
192
|
+
variant,
|
|
193
|
+
...props,
|
|
194
|
+
children
|
|
195
|
+
}
|
|
196
|
+
)
|
|
197
|
+
}
|
|
198
|
+
) : /* @__PURE__ */ jsx3(
|
|
199
|
+
WebAppBody,
|
|
200
|
+
{
|
|
201
|
+
disableBreadcrumbGutter,
|
|
202
|
+
breadcrumbs,
|
|
203
|
+
mobileScrollingBreakpoint,
|
|
204
|
+
paddingX: disableGutters ? 0 : 1,
|
|
205
|
+
variant,
|
|
206
|
+
...props,
|
|
207
|
+
children
|
|
208
|
+
}
|
|
209
|
+
)
|
|
210
|
+
] });
|
|
211
|
+
};
|
|
191
212
|
var FlexPage = WebAppPage;
|
|
192
213
|
|
|
193
214
|
// src/components/ErrorPage.tsx
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
href: "/",
|
|
199
|
-
|
|
200
|
-
}, "Homepage")), "WebAppErrorPage");
|
|
215
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
216
|
+
var WebAppErrorPage = ({ error, ...props }) => /* @__PURE__ */ jsxs3(WebAppPage, { title: "Oops! Something went wrong", ...props, children: [
|
|
217
|
+
/* @__PURE__ */ jsx4("h1", { children: "Oops! Something went wrong!" }),
|
|
218
|
+
/* @__PURE__ */ jsx4("p", { children: `${error}` }),
|
|
219
|
+
/* @__PURE__ */ jsx4(ButtonEx, { href: "/", variant: "contained", children: "Homepage" })
|
|
220
|
+
] });
|
|
201
221
|
var ErrorPage = WebAppErrorPage;
|
|
202
222
|
|
|
203
223
|
// src/components/NotFoundPage/Page.tsx
|
|
204
224
|
import { NotFound } from "@xyo-network/react-shared";
|
|
205
|
-
import
|
|
206
|
-
var WebAppNotFoundPage = /* @__PURE__ */
|
|
207
|
-
title: title ?? "Sorry! Page Not Found",
|
|
208
|
-
...props
|
|
209
|
-
}, /* @__PURE__ */ React5.createElement(NotFound, null)), "WebAppNotFoundPage");
|
|
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, {}) });
|
|
210
227
|
var NotFoundPage = WebAppNotFoundPage;
|
|
211
228
|
export {
|
|
212
229
|
ErrorPage,
|
|
@@ -1 +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 type { Breakpoint } from '@mui/material'\nimport { styled } from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport type { ReactNode } from 'react'\nimport React from 'react'\n\nimport { fixedContent, scrollableContent } from './lib/index.ts'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = new Set(['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter'])\nconst defaultStyledOptions = { shouldForwardProp: (prop: string) => !propsNotForwarded.has(prop) }\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Root',\n})<WebAppBodyProps>(({\n spacing, theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\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)]: { overflowY: 'scroll' },\n })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Breadcrumb',\n})<WebAppBodyProps>(({\n theme, disableBreadcrumbGutter, spacing,\n}) =>\n theme.unstable_sx({\n justifyContent: 'start',\n marginX: disableBreadcrumbGutter ? 0 : spacing,\n }))\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n name: WebAppBodyName,\n slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({ alignItems: 'stretch' }))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Scrollable',\n})<WebAppBodyProps>(({\n theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\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 ? (\n <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n {breadcrumbs}\n </WebAppBodyBreadcrumb>\n )\n : null}\n <WebAppBodyScrollableWrapper>\n <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n {children}\n </WebAppBodyScrollable>\n </WebAppBodyScrollableWrapper>\n </WebAppBodyRoot>\n )\n}\n","import type { 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 = { ...fixedWrap } as const\n\nexport const fixedContent: CSSProperties = { ...scrollableWrap } as const\n","import { WebAppChrome, type WebAppChromeProps } from '@xylabs/react-webapp'\nimport { XyoApplicationAppBar } from '@xyo-network/react-appbar'\nimport { Footer } from '@xyo-network/react-footer'\nimport React from 'react'\n\nexport interface XyoWebAppChromeProps extends WebAppChromeProps {}\n\nexport const XyoWebAppChrome = ({\n ref, appbar, footer, footerElevation = 4, navigationType = 'menu', ...props\n}: XyoWebAppChromeProps) => {\n return (\n <WebAppChrome\n ref={ref}\n appbar={appbar ?? <XyoApplicationAppBar />}\n footerElevation={footerElevation}\n navigationType={navigationType}\n footer={footer ?? <Footer dynamicHeight />}\n {...props}\n />\n )\n}\n\nXyoWebAppChrome.displayName = 'XyoWebAppChrome'\n","import { ButtonEx } from '@xylabs/react-button'\nimport React from 'react'\n\nimport type { WebAppPageProps } from './Page.tsx'\nimport { WebAppPage } from './Page.tsx'\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 type { ContainerProps } from '@mui/material'\nimport { Container, styled } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useUserEvents } from '@xylabs/react-pixel'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\nimport { useLocation } from 'react-router-dom'\n\nimport type { WebAppBodyProps } from './Body.tsx'\nimport { WebAppBody } from './Body.tsx'\nimport { fixedWrap, scrollableWrap } from './lib/index.ts'\n\nconst WebAppPageRoot = styled(FlexGrowCol, {\n name: 'WebAppPage',\n shouldForwardProp: propName => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',\n slot: 'Root',\n})<WebAppPageProps>(({\n theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\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<PropsWithChildren<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 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 ? (\n <Container\n disableGutters={disableGutters}\n style={{\n alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start',\n }}\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 : (\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'\nimport React from 'react'\n\nimport type { WebAppPageProps } from '../Page.tsx'\nimport { WebAppPage } from '../Page.tsx'\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":["styled","FlexGrowCol","FlexRow","React","scrollableWrap","inset","position","fixedWrap","scrollableContent","fixedContent","WebAppBodyName","propsNotForwarded","Set","defaultStyledOptions","shouldForwardProp","prop","has","WebAppBodyRoot","styled","FlexGrowCol","name","slot","spacing","theme","mobileScrollingBreakpoint","variant","scrollable","unstable_sx","alignItems","gap","justifyContent","overflowX","overflowY","paddingY","breakpoints","down","WebAppBodyBreadcrumb","FlexRow","disableBreadcrumbGutter","marginX","WebAppBodyScrollableWrapper","WebAppBodyScrollable","props","scrollableContent","fixedContent","inset","position","WebAppBody","children","breadcrumbs","WebAppChrome","XyoApplicationAppBar","Footer","React","XyoWebAppChrome","ref","appbar","footer","footerElevation","navigationType","props","React","WebAppChrome","XyoApplicationAppBar","Footer","dynamicHeight","displayName","ButtonEx","React","Container","styled","useAsyncEffect","FlexGrowCol","useUserEvents","React","Helmet","useLocation","WebAppPageRoot","styled","FlexGrowCol","name","shouldForwardProp","propName","slot","theme","mobileScrollingBreakpoint","variant","props","scrollableWrap","fixedWrap","alignItems","justifyContent","maxWidth","breakpoints","down","inset","position","WebAppPage","disableGutters","disableBreadcrumbGutter","title","container","children","breadcrumbs","userEvents","useUserEvents","pathname","useLocation","useAsyncEffect","viewContent","path","location","React","Helmet","Container","style","display","flexDirection","flexGrow","WebAppBody","paddingX","FlexPage","WebAppErrorPage","error","props","React","WebAppPage","title","h1","p","ButtonEx","href","variant","ErrorPage","NotFound","React","WebAppNotFoundPage","title","props","React","WebAppPage","NotFound","NotFoundPage"]}
|
|
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 type { Breakpoint } from '@mui/material'\nimport { styled } from '@mui/material'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol, FlexRow } from '@xylabs/react-flexbox'\nimport type { ReactNode } from 'react'\nimport React from 'react'\n\nimport { fixedContent, scrollableContent } from './lib/index.ts'\n\nconst WebAppBodyName = 'WebAppBody'\nconst propsNotForwarded = new Set(['mobileScrollingBreakpoint', 'variant', 'spacing', 'disableBreadcrumbGutter'])\nconst defaultStyledOptions = { shouldForwardProp: (prop: string) => !propsNotForwarded.has(prop) }\n\nconst WebAppBodyRoot = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Root',\n})<WebAppBodyProps>(({\n spacing, theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\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)]: { overflowY: 'scroll' },\n })\n})\n\nconst WebAppBodyBreadcrumb = styled(FlexRow, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Breadcrumb',\n})<WebAppBodyProps>(({\n theme, disableBreadcrumbGutter, spacing,\n}) =>\n theme.unstable_sx({\n justifyContent: 'start',\n marginX: disableBreadcrumbGutter ? 0 : spacing,\n }))\n\nconst WebAppBodyScrollableWrapper = styled(FlexGrowCol, {\n name: WebAppBodyName,\n slot: 'ScrollableWrapper',\n})<WebAppBodyProps>(() => ({ alignItems: 'stretch' }))\n\nconst WebAppBodyScrollable = styled(FlexGrowCol, {\n ...defaultStyledOptions,\n name: WebAppBodyName,\n slot: 'Scrollable',\n})<WebAppBodyProps>(({\n theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\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 ? (\n <WebAppBodyBreadcrumb disableBreadcrumbGutter={disableBreadcrumbGutter} spacing={spacing}>\n {breadcrumbs}\n </WebAppBodyBreadcrumb>\n )\n : null}\n <WebAppBodyScrollableWrapper>\n <WebAppBodyScrollable mobileScrollingBreakpoint={mobileScrollingBreakpoint} variant={variant}>\n {children}\n </WebAppBodyScrollable>\n </WebAppBodyScrollableWrapper>\n </WebAppBodyRoot>\n )\n}\n","import type { 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 = { ...fixedWrap } as const\n\nexport const fixedContent: CSSProperties = { ...scrollableWrap } as const\n","import { WebAppChrome, type WebAppChromeProps } from '@xylabs/react-webapp'\nimport { XyoApplicationAppBar } from '@xyo-network/react-appbar'\nimport { Footer } from '@xyo-network/react-footer'\nimport React from 'react'\n\nexport interface XyoWebAppChromeProps extends WebAppChromeProps {}\n\nexport const XyoWebAppChrome = ({\n ref, appbar, footer, footerElevation = 4, navigationType = 'menu', ...props\n}: XyoWebAppChromeProps) => {\n return (\n <WebAppChrome\n ref={ref}\n appbar={appbar ?? <XyoApplicationAppBar />}\n footerElevation={footerElevation}\n navigationType={navigationType}\n footer={footer ?? <Footer dynamicHeight />}\n {...props}\n />\n )\n}\n\nXyoWebAppChrome.displayName = 'XyoWebAppChrome'\n","import { ButtonEx } from '@xylabs/react-button'\nimport React from 'react'\n\nimport type { WebAppPageProps } from './Page.tsx'\nimport { WebAppPage } from './Page.tsx'\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 type { ContainerProps } from '@mui/material'\nimport { Container, styled } from '@mui/material'\nimport { useAsyncEffect } from '@xylabs/react-async-effect'\nimport type { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { FlexGrowCol } from '@xylabs/react-flexbox'\nimport { useUserEvents } from '@xylabs/react-pixel'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\nimport { Helmet } from 'react-helmet'\nimport { useLocation } from 'react-router-dom'\n\nimport type { WebAppBodyProps } from './Body.tsx'\nimport { WebAppBody } from './Body.tsx'\nimport { fixedWrap, scrollableWrap } from './lib/index.ts'\n\nconst WebAppPageRoot = styled(FlexGrowCol, {\n name: 'WebAppPage',\n shouldForwardProp: propName => propName !== 'mobileScrollingBreakpoint' && propName !== 'variant',\n slot: 'Root',\n})<WebAppPageProps>(({\n theme, mobileScrollingBreakpoint = 'sm', variant,\n}) => {\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<PropsWithChildren<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 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 ? (\n <Container\n disableGutters={disableGutters}\n style={{\n alignItems: 'stretch', display: 'flex', flexDirection: 'column', flexGrow: 1, justifyContent: 'flex-start',\n }}\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 : (\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'\nimport React from 'react'\n\nimport type { WebAppPageProps } from '../Page.tsx'\nimport { WebAppPage } from '../Page.tsx'\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":";AACA,SAAS,cAAc;AAEvB,SAAS,aAAa,eAAe;;;ACD9B,IAAM,iBAAgC;AAAA,EAC3C,OAAO;AAAA,EACP,UAAU;AACZ;AAEO,IAAM,YAA2B;AAAA,EACtC,OAAO;AAAA,EACP,UAAU;AACZ;AAGO,IAAM,oBAAmC,EAAE,GAAG,UAAU;AAExD,IAAM,eAA8B,EAAE,GAAG,eAAe;;;ADuE3D,SAGQ,KAHR;AA7EJ,IAAM,iBAAiB;AACvB,IAAM,oBAAoB,oBAAI,IAAI,CAAC,6BAA6B,WAAW,WAAW,yBAAyB,CAAC;AAChH,IAAM,uBAAuB,EAAE,mBAAmB,CAAC,SAAiB,CAAC,kBAAkB,IAAI,IAAI,EAAE;AAEjG,IAAM,iBAAiB,OAAO,aAAa;AAAA,EACzC,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAS;AAAA,EAAO,4BAA4B;AAAA,EAAM;AACpD,MAAM;AACJ,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,EAAE,WAAW,SAAS;AAAA,EAC7E,CAAC;AACH,CAAC;AAED,IAAM,uBAAuB,OAAO,SAAS;AAAA,EAC3C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAO;AAAA,EAAyB;AAClC,MACE,MAAM,YAAY;AAAA,EAChB,gBAAgB;AAAA,EAChB,SAAS,0BAA0B,IAAI;AACzC,CAAC,CAAC;AAEJ,IAAM,8BAA8B,OAAO,aAAa;AAAA,EACtD,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,OAAO,EAAE,YAAY,UAAU,EAAE;AAErD,IAAM,uBAAuB,OAAO,aAAa;AAAA,EAC/C,GAAG;AAAA,EACH,MAAM;AAAA,EACN,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAO,4BAA4B;AAAA,EAAM;AAC3C,MAAM;AACJ,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,kBAEK,oBAAC,wBAAqB,yBAAkD,SACrE,uBACH,IAEF;AAAA,IACJ,oBAAC,+BACC,8BAAC,wBAAqB,2BAAsD,SACzE,UACH,GACF;AAAA,KACF;AAEJ;;;AErGA,SAAS,oBAA4C;AACrD,SAAS,4BAA4B;AACrC,SAAS,cAAc;AAWC,gBAAAA,YAAA;AANjB,IAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EAAK;AAAA,EAAQ;AAAA,EAAQ,kBAAkB;AAAA,EAAG,iBAAiB;AAAA,EAAQ,GAAG;AACxE,MAA4B;AAC1B,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,QAAQ,UAAU,gBAAAA,KAAC,wBAAqB;AAAA,MACxC;AAAA,MACA;AAAA,MACA,QAAQ,UAAU,gBAAAA,KAAC,UAAO,eAAa,MAAC;AAAA,MACvC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,gBAAgB,cAAc;;;ACtB9B,SAAS,gBAAgB;;;ACCzB,SAAS,WAAW,UAAAC,eAAc;AAClC,SAAS,sBAAsB;AAE/B,SAAS,eAAAC,oBAAmB;AAC5B,SAAS,qBAAqB;AAG9B,SAAS,cAAc;AACvB,SAAS,mBAAmB;AAqDxB,SACE,OAAAC,MADF,QAAAC,aAAA;AA/CJ,IAAM,iBAAiBC,QAAOC,cAAa;AAAA,EACzC,MAAM;AAAA,EACN,mBAAmB,cAAY,aAAa,+BAA+B,aAAa;AAAA,EACxF,MAAM;AACR,CAAC,EAAmB,CAAC;AAAA,EACnB;AAAA,EAAO,4BAA4B;AAAA,EAAM;AAC3C,MAAM;AACJ,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,aAA2D,CAAC;AAAA,EACvE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,GAAG;AACL,MAAM;AACJ,QAAM,aAAa,cAAc;AACjC,QAAM,EAAE,SAAS,IAAI,YAAY;AAEjC;AAAA,IACE,YAAY;AACV,YAAM,YAAY,YAAY,EAAE,MAAM,SAAS,gBAAgB,MAAM,SAAS,SAAS,CAAC;AAAA,IAC1F;AAAA,IACA,CAAC,UAAU,OAAO,UAAU;AAAA,EAC9B;AAEA,SACE,gBAAAF,MAAC,kBAAe,2BAAsD,SAAmB,GAAG,OAC1F;AAAA,oBAAAD,KAAC,UAAO,OAAc;AAAA,IACrB,aAAa,cAAc,SAEtB,gBAAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,UACL,YAAY;AAAA,UAAW,SAAS;AAAA,UAAQ,eAAe;AAAA,UAAU,UAAU;AAAA,UAAG,gBAAgB;AAAA,QAChG;AAAA,QACA,UAAU;AAAA,QAEV,0BAAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACC,GAAG;AAAA,YAEH;AAAA;AAAA,QACH;AAAA;AAAA,IACF,IAGA,gBAAAA;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,KAER;AAEJ;AAGO,IAAM,WAAW;;;AD1FtB,SACE,OAAAI,MADF,QAAAC,aAAA;AADK,IAAM,kBAAkD,CAAC,EAAE,OAAO,GAAG,MAAM,MAChF,gBAAAA,MAAC,cAAW,OAAM,8BAA8B,GAAG,OACjD;AAAA,kBAAAD,KAAC,QAAG,yCAA2B;AAAA,EAC/B,gBAAAA,KAAC,OAAG,aAAG,KAAK,IAAG;AAAA,EACf,gBAAAA,KAAC,YAAS,MAAK,KAAI,SAAQ,aAAY,sBAEvC;AAAA,GACF;AAIK,IAAM,YAAY;;;AErBzB,SAAS,gBAAgB;AAQrB,gBAAAE,YAAA;AAFG,IAAM,qBAAgD,CAAC,EAAE,OAAO,GAAG,MAAM,MAC9E,gBAAAA,KAAC,cAAW,OAAO,SAAS,yBAA0B,GAAG,OACvD,0BAAAA,KAAC,YAAS,GACZ;AAIK,IAAM,eAAe;","names":["jsx","styled","FlexGrowCol","jsx","jsxs","styled","FlexGrowCol","jsx","jsxs","jsx"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xyo-network/react-webapp",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "7.0.1",
|
|
4
4
|
"description": "Common React library for all XYO projects that use React",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"xyo",
|
|
@@ -38,39 +38,46 @@
|
|
|
38
38
|
},
|
|
39
39
|
"module": "dist/browser/index.mjs",
|
|
40
40
|
"types": "dist/browser/index.d.ts",
|
|
41
|
+
"files": [
|
|
42
|
+
"dist",
|
|
43
|
+
"src"
|
|
44
|
+
],
|
|
41
45
|
"dependencies": {
|
|
42
|
-
"@mui/material": "
|
|
43
|
-
"@xylabs/react-async-effect": "
|
|
44
|
-
"@xylabs/react-button": "
|
|
45
|
-
"@xylabs/react-flexbox": "
|
|
46
|
-
"@xylabs/react-pixel": "
|
|
47
|
-
"@xylabs/react-webapp": "
|
|
48
|
-
"@xyo-network/react-appbar": "^
|
|
49
|
-
"@xyo-network/react-footer": "^
|
|
50
|
-
"@xyo-network/react-shared": "^
|
|
51
|
-
"react": "
|
|
52
|
-
"react-helmet": "
|
|
53
|
-
"react-router-dom": "
|
|
46
|
+
"@mui/material": "~7.3.1",
|
|
47
|
+
"@xylabs/react-async-effect": "~7.0.1",
|
|
48
|
+
"@xylabs/react-button": "~7.0.1",
|
|
49
|
+
"@xylabs/react-flexbox": "~7.0.1",
|
|
50
|
+
"@xylabs/react-pixel": "~7.0.1",
|
|
51
|
+
"@xylabs/react-webapp": "~7.0.1",
|
|
52
|
+
"@xyo-network/react-appbar": "^7.0.1",
|
|
53
|
+
"@xyo-network/react-footer": "^7.0.1",
|
|
54
|
+
"@xyo-network/react-shared": "^7.0.1",
|
|
55
|
+
"react": "~19.1.1",
|
|
56
|
+
"react-helmet": "~6.1.0",
|
|
57
|
+
"react-router-dom": "~7.8.0"
|
|
54
58
|
},
|
|
55
59
|
"devDependencies": {
|
|
56
|
-
"@mui/icons-material": "
|
|
57
|
-
"@storybook/react-vite": "
|
|
58
|
-
"@types/react": "
|
|
59
|
-
"@types/react-helmet": "
|
|
60
|
-
"@xylabs/react-appbar": "
|
|
61
|
-
"@xylabs/react-button": "
|
|
62
|
-
"@xylabs/react-flexbox": "
|
|
63
|
-
"@xylabs/react-link": "
|
|
64
|
-
"@xylabs/react-pixel": "
|
|
65
|
-
"@xylabs/ts-scripts-yarn3": "
|
|
66
|
-
"@xylabs/tsconfig
|
|
67
|
-
"
|
|
68
|
-
"
|
|
69
|
-
"
|
|
60
|
+
"@mui/icons-material": "~7.3.1",
|
|
61
|
+
"@storybook/react-vite": "~9.1.2",
|
|
62
|
+
"@types/react": "~19.1.10",
|
|
63
|
+
"@types/react-helmet": "~6.1.11",
|
|
64
|
+
"@xylabs/react-appbar": "~7.0.1",
|
|
65
|
+
"@xylabs/react-button": "~7.0.1",
|
|
66
|
+
"@xylabs/react-flexbox": "~7.0.1",
|
|
67
|
+
"@xylabs/react-link": "~7.0.1",
|
|
68
|
+
"@xylabs/react-pixel": "~7.0.1",
|
|
69
|
+
"@xylabs/ts-scripts-yarn3": "~7.1.1",
|
|
70
|
+
"@xylabs/tsconfig": "~7.1.1",
|
|
71
|
+
"@xylabs/tsconfig-dom": "~7.1.1",
|
|
72
|
+
"@xylabs/tsconfig-react": "~7.1.1",
|
|
73
|
+
"react-dom": "~19.1.1",
|
|
74
|
+
"storybook": "~9.1.2",
|
|
75
|
+
"typescript": "~5.9.2",
|
|
76
|
+
"vite": "~7.1.2"
|
|
70
77
|
},
|
|
71
78
|
"peerDependencies": {
|
|
72
79
|
"@mui/icons-material": ">=6 <8",
|
|
73
|
-
"react-dom": "
|
|
80
|
+
"react-dom": "~19"
|
|
74
81
|
},
|
|
75
82
|
"publishConfig": {
|
|
76
83
|
"access": "public"
|
package/typedoc.json
DELETED