@churchapps/apphelper 0.2.89 → 0.2.90
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/header/PrimaryMenu.d.ts +1 -0
- package/dist/components/header/PrimaryMenu.d.ts.map +1 -1
- package/dist/components/header/PrimaryMenu.js +1 -1
- package/dist/components/header/PrimaryMenu.js.map +1 -1
- package/dist/components/header/SecondaryMenu.d.ts +1 -0
- package/dist/components/header/SecondaryMenu.d.ts.map +1 -1
- package/dist/components/header/SecondaryMenu.js +9 -4
- package/dist/components/header/SecondaryMenu.js.map +1 -1
- package/dist/components/header/SecondaryMenuAlt.d.ts +1 -0
- package/dist/components/header/SecondaryMenuAlt.d.ts.map +1 -1
- package/dist/components/header/SecondaryMenuAlt.js +1 -1
- package/dist/components/header/SecondaryMenuAlt.js.map +1 -1
- package/dist/components/header/SiteHeader.d.ts +1 -0
- package/dist/components/header/SiteHeader.d.ts.map +1 -1
- package/dist/components/header/SiteHeader.js +1 -1
- package/dist/components/header/SiteHeader.js.map +1 -1
- package/dist/public/css/styles.css +103 -0
- package/package.json +1 -1
- package/public/css/styles.css +103 -0
- package/src/components/header/PrimaryMenu.tsx +2 -1
- package/src/components/header/SecondaryMenu.tsx +8 -4
- package/src/components/header/SecondaryMenuAlt.tsx +3 -2
- package/src/components/header/SiteHeader.tsx +4 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrimaryMenu.d.ts","sourceRoot":"","sources":["../../../src/components/header/PrimaryMenu.tsx"],"names":[],"mappings":"AAIA,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAC,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;
|
|
1
|
+
{"version":3,"file":"PrimaryMenu.d.ts","sourceRoot":"","sources":["../../../src/components/header/PrimaryMenu.tsx"],"names":[],"mappings":"AAIA,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAC,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACzD,MAAM,CAAC,EAAE,GAAG,CAAC;CACb;AAED,eAAO,MAAM,WAAW,UAAU,KAAK,4CA8CtC,CAAA"}
|
|
@@ -30,7 +30,7 @@ const PrimaryMenu = (props) => {
|
|
|
30
30
|
const getNavItems = () => {
|
|
31
31
|
let result = [];
|
|
32
32
|
props.menuItems.forEach(item => {
|
|
33
|
-
result.push((0, jsx_runtime_1.jsx)(NavItem_1.NavItem, { url: item.url, label: item.label.toUpperCase(), icon: item.icon }, item.url));
|
|
33
|
+
result.push((0, jsx_runtime_1.jsx)(NavItem_1.NavItem, { url: item.url, label: item.label.toUpperCase(), icon: item.icon, router: props.router }, item.url));
|
|
34
34
|
});
|
|
35
35
|
return result;
|
|
36
36
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PrimaryMenu.js","sourceRoot":"","sources":["../../../src/components/header/PrimaryMenu.tsx"],"names":[],"mappings":";;;;;;;AAAA,kDAA0B;AAC1B,4CAAwD;AACxD,gDAA6C;
|
|
1
|
+
{"version":3,"file":"PrimaryMenu.js","sourceRoot":"","sources":["../../../src/components/header/PrimaryMenu.tsx"],"names":[],"mappings":";;;;;;;AAAA,kDAA0B;AAC1B,4CAAwD;AACxD,gDAA6C;AAQtC,MAAM,WAAW,GAAG,CAAC,KAAW,EAAE,EAAE;IACzC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAqB,IAAI,CAAC,CAAC;IACzE,MAAM,IAAI,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAC;IAE/B,MAAM,WAAW,GAAG,GAAG,EAAE,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IAEjD,MAAM,WAAW,GAAG,CAAC,CAAgC,EAAE,EAAE;QACvD,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG;QACjB,SAAS,EAAE,CAAC;QACZ,EAAE,EAAE;YACF,eAAe,EAAE,WAAW;YAC5B,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,SAAS;YACnB,MAAM,EAAE,2CAA2C;YAEnD,mBAAmB,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE;YAC/D,QAAQ,EAAE,GAAG;SACd;KACF,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,MAAM,GAAkB,EAAE,CAAC;QAC/B,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC7B,MAAM,CAAC,IAAI,CAAC,uBAAC,iBAAO,IAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAiB,MAAM,EAAE,KAAK,CAAC,MAAM,IAA9B,IAAI,CAAC,GAAG,CAA0B,CAAC,CAAC;QACjI,CAAC,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC,CAAA;IAED,OAAO,CAAC,6DACN,wBAAC,iBAAM,IAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAC,SAAS,mBAAgB,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,mBAAgB,MAAM,mBAAgB,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE,uBAAC,eAAI,8BAAmB,EAAE,EAAE,EAAC,kBAAkB,aACrN,gCAAK,GAAG,EAAC,uBAAuB,EAAC,GAAG,EAAC,cAAc,GAAG,EACtD,+BAAI,KAAK,EAAE,EAAC,UAAU,EAAC,CAAC,EAAC,YAAG,KAAK,CAAC,KAAK,GAAM,IACtC,EAET,uBAAC,eAAI,IAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAC,cAAc,EAAC,IAAI,EAAE,QAAQ,KAAG,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,eAAe,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,gBAAgB,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAAE,YAC5R,uBAAC,cAAG,IAAC,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,EAAE,EAAC,aAAa,YACnE,WAAW,EAAE,GACV,GACD,IACN,CAEF,CAAA;AACH,CAAC,CAAA;AA9CY,QAAA,WAAW,eA8CvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SecondaryMenu.d.ts","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenu.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SecondaryMenu.d.ts","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenu.tsx"],"names":[],"mappings":"AAGA,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IAC5C,MAAM,CAAC,EAAE,GAAG,CAAC;CACb;AAED,eAAO,MAAM,aAAa,UAAS,KAAK,4CAoBvC,CAAA"}
|
|
@@ -4,16 +4,21 @@ exports.SecondaryMenu = void 0;
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const material_1 = require("@mui/material");
|
|
6
6
|
const react_router_dom_1 = require("react-router-dom");
|
|
7
|
-
const react_router_dom_2 = require("react-router-dom");
|
|
8
7
|
const SecondaryMenu = (props) => {
|
|
9
|
-
const navigate = (0,
|
|
8
|
+
const navigate = (0, react_router_dom_1.useNavigate)();
|
|
9
|
+
const handleClick = (path) => {
|
|
10
|
+
if (props.router)
|
|
11
|
+
props.router.push(path);
|
|
12
|
+
else
|
|
13
|
+
navigate(path);
|
|
14
|
+
};
|
|
10
15
|
const getItems = () => {
|
|
11
16
|
const result = [];
|
|
12
17
|
props.menuItems.forEach(item => {
|
|
13
18
|
if (item.label === props.label)
|
|
14
|
-
result.push((0, jsx_runtime_1.jsx)(material_1.Chip, { onClick: () =>
|
|
19
|
+
result.push((0, jsx_runtime_1.jsx)(material_1.Chip, { onClick: () => handleClick(item.url), label: item.label, component: "a", variant: "filled", clickable: true, style: { backgroundColor: "var(--c1d2)", color: "#FFF", fontSize: 16 } }));
|
|
15
20
|
else
|
|
16
|
-
result.push((0, jsx_runtime_1.jsx)(
|
|
21
|
+
result.push((0, jsx_runtime_1.jsx)("a", { href: "about:blank", onClick: (e) => { e.preventDefault(); handleClick(item.url); }, style: { color: "#FFF", textDecoration: "none", marginLeft: 10, marginRight: 10 }, children: item.label }));
|
|
17
22
|
});
|
|
18
23
|
return result;
|
|
19
24
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SecondaryMenu.js","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenu.tsx"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"SecondaryMenu.js","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenu.tsx"],"names":[],"mappings":";;;;AAAA,4CAAqC;AACrC,uDAA+C;AAQxC,MAAM,aAAa,GAAE,CAAC,KAAW,EAAE,EAAE;IAC1C,MAAM,QAAQ,GAAG,IAAA,8BAAW,GAAE,CAAC;IAE/B,MAAM,WAAW,GAAG,CAAC,IAAW,EAAE,EAAE;QAClC,IAAI,KAAK,CAAC,MAAM;YAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;;YACrC,QAAQ,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC,CAAA;IAED,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,MAAM,MAAM,GAAS,EAAE,CAAC;QACxB,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC7B,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK;gBAAE,MAAM,CAAC,IAAI,CAAC,uBAAC,eAAI,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,SAAS,EAAC,GAAG,EAAC,OAAO,EAAC,QAAQ,EAAC,SAAS,QAAC,KAAK,EAAE,EAAC,eAAe,EAAC,aAAa,EAAE,KAAK,EAAC,MAAM,EAAE,QAAQ,EAAC,EAAE,EAAC,GAAI,CAAC,CAAC;;gBACtN,MAAM,CAAC,IAAI,CAAC,8BAAG,IAAI,EAAC,aAAa,EAAC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,cAAc,EAAE,CAAC,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAC,MAAM,EAAE,cAAc,EAAE,MAAM,EAAE,UAAU,EAAC,EAAE,EAAE,WAAW,EAAC,EAAE,EAAC,YAAG,IAAI,CAAC,KAAK,GAAK,CAAC,CAAC;QACzM,CAAC,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC,CAAA;IAED,OAAO,CAAC,gCAAK,EAAE,EAAC,eAAe,YAC5B,QAAQ,EAAE,GACP,CAAC,CAAA;AACT,CAAC,CAAA;AApBY,QAAA,aAAa,iBAoBzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SecondaryMenuAlt.d.ts","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenuAlt.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SecondaryMenuAlt.d.ts","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenuAlt.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAK;IACb,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IAC5C,MAAM,CAAC,EAAE,GAAG,CAAC;CACb;AAED,eAAO,MAAM,gBAAgB,UAAU,KAAK,4CA6B3C,CAAA"}
|
|
@@ -19,7 +19,7 @@ const SecondaryMenuAlt = (props) => {
|
|
|
19
19
|
const getItems = () => {
|
|
20
20
|
const result = [];
|
|
21
21
|
props.menuItems.forEach(item => {
|
|
22
|
-
result.push((0, jsx_runtime_1.jsx)(NavItem_1.NavItem, { url: item.url, label: item.label, icon: "people" }, item.url));
|
|
22
|
+
result.push((0, jsx_runtime_1.jsx)(NavItem_1.NavItem, { url: item.url, label: item.label, router: props.router, icon: "people" }, item.url));
|
|
23
23
|
});
|
|
24
24
|
return result;
|
|
25
25
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SecondaryMenuAlt.js","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenuAlt.tsx"],"names":[],"mappings":";;;;;;;AAAA,kDAA0B;AAC1B,4CAAyD;AACzD,gDAA6C;
|
|
1
|
+
{"version":3,"file":"SecondaryMenuAlt.js","sourceRoot":"","sources":["../../../src/components/header/SecondaryMenuAlt.tsx"],"names":[],"mappings":";;;;;;;AAAA,kDAA0B;AAC1B,4CAAyD;AACzD,gDAA6C;AAStC,MAAM,gBAAgB,GAAG,CAAC,KAAW,EAAE,EAAE;IAC9C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAqB,IAAI,CAAC,CAAC;IACzE,MAAM,WAAW,GAAG,GAAG,EAAE,GAAG,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACjD,MAAM,IAAI,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAC;IAE/B,MAAM,WAAW,GAAG,CAAC,CAAgC,EAAE,EAAE;QACvD,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,MAAM,MAAM,GAAS,EAAE,CAAC;QACxB,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC7B,MAAM,CAAC,IAAI,CAAC,uBAAC,iBAAO,IAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAiB,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,IAAI,EAAC,QAAQ,IAA7C,IAAI,CAAC,GAAG,CAAwC,CAAC,CAAC;QAChH,CAAC,CAAC,CAAC;QACH,OAAO,MAAM,CAAC;IAChB,CAAC,CAAA;IAED,OAAO,CACL,iCAAK,EAAE,EAAC,kBAAkB,aACxB,uBAAC,iBAAM,IAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAC,SAAS,mBAAgB,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,mBAAgB,MAAM,mBAAgB,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,OAAO,EAAE,uBAAC,eAAI,8BAAmB,EAAE,EAAE,EAAC,qBAAqB,YACxN,+BAAI,KAAK,EAAE,EAAC,UAAU,EAAC,CAAC,EAAC,YAAG,KAAK,CAAC,KAAK,GAAM,GACtC,EACT,uBAAC,eAAI,IAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAC,cAAc,EAAC,IAAI,EAAE,QAAQ,KAAG,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,YAAY,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,gBAAgB,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAAE,YAC1P,uBAAC,cAAG,IAAC,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,YACjD,QAAQ,EAAE,GACP,GACD,IACH,CAAC,CAAA;AACX,CAAC,CAAA;AA7BY,QAAA,gBAAgB,oBA6B5B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SiteHeader.d.ts","sourceRoot":"","sources":["../../../src/components/header/SiteHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE3D,KAAK,KAAK,GAAG;IACX,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAC,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC/D,kBAAkB,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACrD,OAAO,EAAE,oBAAoB,CAAC;IAC9B,OAAO,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"SiteHeader.d.ts","sourceRoot":"","sources":["../../../src/components/header/SiteHeader.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE3D,KAAK,KAAK,GAAG;IACX,gBAAgB,EAAE,MAAM,CAAC;IACzB,gBAAgB,EAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,IAAI,EAAC,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAC/D,kBAAkB,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAC;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACrD,OAAO,EAAE,oBAAoB,CAAC;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,GAAG,CAAC;CACb,CAAA;AAED,eAAO,MAAM,UAAU,UAAU,KAAK,4CA8BrC,CAAA"}
|
|
@@ -20,7 +20,7 @@ const SiteHeader = (props) => {
|
|
|
20
20
|
"& .MuiIcon-root": { color: "#FFFFFF" }
|
|
21
21
|
}));
|
|
22
22
|
/*<Typography variant="h6" noWrap>{UserHelper.currentUserChurch?.church?.name || ""}</Typography>*/
|
|
23
|
-
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { style: { backgroundColor: "var(--c1)", color: "#FFF" }, children: (0, jsx_runtime_1.jsx)(CustomAppBar, { position: "absolute", children: (0, jsx_runtime_1.jsxs)(material_1.Toolbar, { sx: { pr: "24px", backgroundColor: "var(--c1)" }, children: [(0, jsx_runtime_1.jsx)(PrimaryMenu_1.PrimaryMenu, { label: props.primaryMenuLabel, menuItems: props.primaryMenuItems }), (0, jsx_runtime_1.jsx)(SecondaryMenu_1.SecondaryMenu, { label: props.secondaryMenuLabel, menuItems: props.secondaryMenuItems }), (0, jsx_runtime_1.jsx)("div", { style: { flex: 1 }, children: (0, jsx_runtime_1.jsx)(SecondaryMenuAlt_1.SecondaryMenuAlt, { label: props.secondaryMenuLabel, menuItems: props.secondaryMenuItems }) }), UserHelper_1.UserHelper.user && (0, jsx_runtime_1.jsx)(UserMenu_1.UserMenu, { profilePicture: PersonHelper_1.PersonHelper.getPhotoUrl((_a = props.context) === null || _a === void 0 ? void 0 : _a.person), userName: `${(_b = UserHelper_1.UserHelper.user) === null || _b === void 0 ? void 0 : _b.firstName} ${(_c = UserHelper_1.UserHelper.user) === null || _c === void 0 ? void 0 : _c.lastName}`, userChurches: UserHelper_1.UserHelper.userChurches, currentUserChurch: UserHelper_1.UserHelper.currentUserChurch, context: props.context, appName: props.appName, loadCounts: () => { }, notificationCounts: { notificationCount: 0, pmCount: 0 } }), !UserHelper_1.UserHelper.user && (0, jsx_runtime_1.jsx)(material_1.Link, { href: "/login", color: "inherit", style: { textDecoration: "none" }, children: "Login" })] }) }) }) }));
|
|
23
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { style: { backgroundColor: "var(--c1)", color: "#FFF" }, children: (0, jsx_runtime_1.jsx)(CustomAppBar, { position: "absolute", children: (0, jsx_runtime_1.jsxs)(material_1.Toolbar, { sx: { pr: "24px", backgroundColor: "var(--c1)" }, children: [(0, jsx_runtime_1.jsx)(PrimaryMenu_1.PrimaryMenu, { label: props.primaryMenuLabel, menuItems: props.primaryMenuItems, router: props.router }), (0, jsx_runtime_1.jsx)(SecondaryMenu_1.SecondaryMenu, { label: props.secondaryMenuLabel, menuItems: props.secondaryMenuItems, router: props.router }), (0, jsx_runtime_1.jsx)("div", { style: { flex: 1 }, children: (0, jsx_runtime_1.jsx)(SecondaryMenuAlt_1.SecondaryMenuAlt, { label: props.secondaryMenuLabel, menuItems: props.secondaryMenuItems, router: props.router }) }), UserHelper_1.UserHelper.user && (0, jsx_runtime_1.jsx)(UserMenu_1.UserMenu, { profilePicture: PersonHelper_1.PersonHelper.getPhotoUrl((_a = props.context) === null || _a === void 0 ? void 0 : _a.person), userName: `${(_b = UserHelper_1.UserHelper.user) === null || _b === void 0 ? void 0 : _b.firstName} ${(_c = UserHelper_1.UserHelper.user) === null || _c === void 0 ? void 0 : _c.lastName}`, userChurches: UserHelper_1.UserHelper.userChurches, currentUserChurch: UserHelper_1.UserHelper.currentUserChurch, context: props.context, appName: props.appName, loadCounts: () => { }, notificationCounts: { notificationCount: 0, pmCount: 0 } }), !UserHelper_1.UserHelper.user && (0, jsx_runtime_1.jsx)(material_1.Link, { href: "/login", color: "inherit", style: { textDecoration: "none" }, children: "Login" })] }) }) }) }));
|
|
24
24
|
};
|
|
25
25
|
exports.SiteHeader = SiteHeader;
|
|
26
26
|
//# sourceMappingURL=SiteHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SiteHeader.js","sourceRoot":"","sources":["../../../src/components/header/SiteHeader.tsx"],"names":[],"mappings":";;;;AACA,4CAA8D;AAC9D,yDAAqD;AACrD,kDAA+C;AAC/C,6DAA0D;AAC1D,+CAA4C;AAC5C,mDAAgD;AAChD,yDAAsD;
|
|
1
|
+
{"version":3,"file":"SiteHeader.js","sourceRoot":"","sources":["../../../src/components/header/SiteHeader.tsx"],"names":[],"mappings":";;;;AACA,4CAA8D;AAC9D,yDAAqD;AACrD,kDAA+C;AAC/C,6DAA0D;AAC1D,+CAA4C;AAC5C,mDAAgD;AAChD,yDAAsD;AAa/C,MAAM,UAAU,GAAG,CAAC,KAAW,EAAE,EAAE;;IAExC,MAAM,YAAY,GAAG,IAAA,iBAAM,EAAC,iBAAM,CAAC,CACjC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;QACd,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC;QAC/B,UAAU,EAAE,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,EAAE,QAAQ,CAAC,EAAE;YACxD,MAAM,EAAE,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,KAAK;YACtC,QAAQ,EAAE,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa;SACnD,CAAC;QACF,iBAAiB,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;KACxC,CAAC,CACH,CAAC;IACF,mGAAmG;IACnG,OAAO,CAAC,2DACN,gCAAK,KAAK,EAAE,EAAC,eAAe,EAAC,WAAW,EAAE,KAAK,EAAE,MAAM,EAAC,YACtD,uBAAC,YAAY,IAAC,QAAQ,EAAC,UAAU,YAC/B,wBAAC,kBAAO,IAAC,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,eAAe,EAAE,WAAW,EAAE,aACvD,uBAAC,yBAAW,IAAC,KAAK,EAAE,KAAK,CAAC,gBAAgB,EAAE,SAAS,EAAE,KAAK,CAAC,gBAAgB,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,GAAI,EACvG,uBAAC,6BAAa,IAAC,KAAK,EAAE,KAAK,CAAC,kBAAkB,EAAE,SAAS,EAAE,KAAK,CAAC,kBAAkB,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,GAAI,EAC7G,gCAAK,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACrB,uBAAC,mCAAgB,IAAC,KAAK,EAAE,KAAK,CAAC,kBAAkB,EAAE,SAAS,EAAE,KAAK,CAAC,kBAAkB,EAAE,MAAM,EAAE,KAAK,CAAC,MAAM,GAAI,GAC5G,EACL,uBAAU,CAAC,IAAI,IAAI,uBAAC,mBAAQ,IAAC,cAAc,EAAE,2BAAY,CAAC,WAAW,CAAC,MAAA,KAAK,CAAC,OAAO,0CAAE,MAAM,CAAC,EAAE,QAAQ,EAAE,GAAG,MAAA,uBAAU,CAAC,IAAI,0CAAE,SAAS,IAAI,MAAA,uBAAU,CAAC,IAAI,0CAAE,QAAQ,EAAE,EAAE,YAAY,EAAE,uBAAU,CAAC,YAAY,EAAE,iBAAiB,EAAE,uBAAU,CAAC,iBAAiB,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,kBAAkB,EAAE,EAAC,iBAAiB,EAAC,CAAC,EAAE,OAAO,EAAC,CAAC,EAAC,GAAI,EAC5X,CAAC,uBAAU,CAAC,IAAI,IAAI,uBAAC,eAAI,IAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,SAAS,EAAC,KAAK,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE,sBAAc,IAChG,GACG,GAEX,GACL,CACF,CAAC;AACJ,CAAC,CAAA;AA9BY,QAAA,UAAU,cA8BtB"}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--c1: #1565C0;
|
|
3
|
+
--c1l1: #3578CC;
|
|
4
|
+
--c1l2: #568BDA;
|
|
5
|
+
--c1l3: #77A0E5;
|
|
6
|
+
--c1l4: #99B5F0;
|
|
7
|
+
--c1l5: #BBCBF8;
|
|
8
|
+
--c1l6: #DDE1FC;
|
|
9
|
+
--c1l7: #F0F4FF;
|
|
10
|
+
--c1d1: #1358AD;
|
|
11
|
+
--c1d2: #114A99;
|
|
12
|
+
--c1d3: #0E3D86;
|
|
13
|
+
--c1d4: #0C3172;
|
|
14
|
+
--c1d5: #09245F;
|
|
15
|
+
--c1d6: #07184B;
|
|
16
|
+
--c1d7: #050C37;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
.sideNav ul {
|
|
21
|
+
padding-left: 0px;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.sideNav li {
|
|
25
|
+
list-style-type: none;
|
|
26
|
+
border-bottom: 1px solid #ccc;
|
|
27
|
+
padding:8px 10px;
|
|
28
|
+
}
|
|
29
|
+
.sideNav li a {
|
|
30
|
+
color:#333;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.sideNav li.active {
|
|
34
|
+
list-style-type: none;
|
|
35
|
+
border-bottom: 1px solid var(--c1l2);
|
|
36
|
+
padding:8px 10px;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.sideNav li.active a, .sideNav li a:hover {
|
|
40
|
+
color:var(--c1l2);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.sideNav .subhead {
|
|
44
|
+
margin-top:30px;
|
|
45
|
+
background-color:var(--c1l6);
|
|
46
|
+
padding-left:12px;
|
|
47
|
+
padding-top:5px;
|
|
48
|
+
padding-bottom: 5px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.sideNav li span {
|
|
52
|
+
padding-top:5px;
|
|
53
|
+
overflow:visible;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
#appBarSpacer {
|
|
57
|
+
height: 64px;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
#primaryNavButton {
|
|
61
|
+
margin-right:50px;
|
|
62
|
+
text-transform: "none";
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
#primaryNavButton img {
|
|
66
|
+
height:35px;
|
|
67
|
+
margin-right:15px;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
#banner {
|
|
71
|
+
background-color:var(--c1l2);
|
|
72
|
+
color: #FFF;
|
|
73
|
+
padding: 12px 24px;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
#banner h1 {
|
|
77
|
+
border-bottom: none;
|
|
78
|
+
line-height: 30px;
|
|
79
|
+
margin-top:10px;
|
|
80
|
+
margin-bottom: 0px;
|
|
81
|
+
font-size:30px;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
#mainContent {
|
|
85
|
+
padding:24px;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
#primaryMenu span, #primaryMenu a {
|
|
89
|
+
color:#FFF;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
@media (max-width: 740px) {
|
|
94
|
+
#primaryNavButton h2 { display:none; }
|
|
95
|
+
#primaryNavButton>img {margin-right:0px;}
|
|
96
|
+
#primaryNavButton>span {margin-left:0px;}
|
|
97
|
+
#appBarSpacer { height:60px;}
|
|
98
|
+
#secondaryMenu { display:none; }
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
@media (min-width: 741px) {
|
|
102
|
+
#secondaryMenuAlt { display:none; width:100%; text-align: center;}
|
|
103
|
+
}
|
package/package.json
CHANGED
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--c1: #1565C0;
|
|
3
|
+
--c1l1: #3578CC;
|
|
4
|
+
--c1l2: #568BDA;
|
|
5
|
+
--c1l3: #77A0E5;
|
|
6
|
+
--c1l4: #99B5F0;
|
|
7
|
+
--c1l5: #BBCBF8;
|
|
8
|
+
--c1l6: #DDE1FC;
|
|
9
|
+
--c1l7: #F0F4FF;
|
|
10
|
+
--c1d1: #1358AD;
|
|
11
|
+
--c1d2: #114A99;
|
|
12
|
+
--c1d3: #0E3D86;
|
|
13
|
+
--c1d4: #0C3172;
|
|
14
|
+
--c1d5: #09245F;
|
|
15
|
+
--c1d6: #07184B;
|
|
16
|
+
--c1d7: #050C37;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
.sideNav ul {
|
|
21
|
+
padding-left: 0px;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.sideNav li {
|
|
25
|
+
list-style-type: none;
|
|
26
|
+
border-bottom: 1px solid #ccc;
|
|
27
|
+
padding:8px 10px;
|
|
28
|
+
}
|
|
29
|
+
.sideNav li a {
|
|
30
|
+
color:#333;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.sideNav li.active {
|
|
34
|
+
list-style-type: none;
|
|
35
|
+
border-bottom: 1px solid var(--c1l2);
|
|
36
|
+
padding:8px 10px;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.sideNav li.active a, .sideNav li a:hover {
|
|
40
|
+
color:var(--c1l2);
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.sideNav .subhead {
|
|
44
|
+
margin-top:30px;
|
|
45
|
+
background-color:var(--c1l6);
|
|
46
|
+
padding-left:12px;
|
|
47
|
+
padding-top:5px;
|
|
48
|
+
padding-bottom: 5px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.sideNav li span {
|
|
52
|
+
padding-top:5px;
|
|
53
|
+
overflow:visible;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
#appBarSpacer {
|
|
57
|
+
height: 64px;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
#primaryNavButton {
|
|
61
|
+
margin-right:50px;
|
|
62
|
+
text-transform: "none";
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
#primaryNavButton img {
|
|
66
|
+
height:35px;
|
|
67
|
+
margin-right:15px;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
#banner {
|
|
71
|
+
background-color:var(--c1l2);
|
|
72
|
+
color: #FFF;
|
|
73
|
+
padding: 12px 24px;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
#banner h1 {
|
|
77
|
+
border-bottom: none;
|
|
78
|
+
line-height: 30px;
|
|
79
|
+
margin-top:10px;
|
|
80
|
+
margin-bottom: 0px;
|
|
81
|
+
font-size:30px;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
#mainContent {
|
|
85
|
+
padding:24px;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
#primaryMenu span, #primaryMenu a {
|
|
89
|
+
color:#FFF;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
@media (max-width: 740px) {
|
|
94
|
+
#primaryNavButton h2 { display:none; }
|
|
95
|
+
#primaryNavButton>img {margin-right:0px;}
|
|
96
|
+
#primaryNavButton>span {margin-left:0px;}
|
|
97
|
+
#appBarSpacer { height:60px;}
|
|
98
|
+
#secondaryMenu { display:none; }
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
@media (min-width: 741px) {
|
|
102
|
+
#secondaryMenuAlt { display:none; width:100%; text-align: center;}
|
|
103
|
+
}
|
|
@@ -5,6 +5,7 @@ import { NavItem } from "../wrapper/NavItem";
|
|
|
5
5
|
interface Props {
|
|
6
6
|
label: string,
|
|
7
7
|
menuItems: { url: string, icon:string, label: string }[]
|
|
8
|
+
router?: any;
|
|
8
9
|
}
|
|
9
10
|
|
|
10
11
|
export const PrimaryMenu = (props:Props) => {
|
|
@@ -34,7 +35,7 @@ export const PrimaryMenu = (props:Props) => {
|
|
|
34
35
|
const getNavItems = () => {
|
|
35
36
|
let result: JSX.Element[] = [];
|
|
36
37
|
props.menuItems.forEach(item => {
|
|
37
|
-
result.push(<NavItem url={item.url} label={item.label.toUpperCase()} icon={item.icon} key={item.url} />);
|
|
38
|
+
result.push(<NavItem url={item.url} label={item.label.toUpperCase()} icon={item.icon} key={item.url} router={props.router} />);
|
|
38
39
|
});
|
|
39
40
|
return result;
|
|
40
41
|
}
|
|
@@ -1,21 +1,25 @@
|
|
|
1
|
-
import React from "react";
|
|
2
1
|
import { Chip } from "@mui/material";
|
|
3
|
-
import { Link } from "react-router-dom";
|
|
4
2
|
import { useNavigate } from "react-router-dom";
|
|
5
3
|
|
|
6
4
|
interface Props {
|
|
7
5
|
label: string,
|
|
8
6
|
menuItems: { url: string, label: string }[]
|
|
7
|
+
router?: any;
|
|
9
8
|
}
|
|
10
9
|
|
|
11
10
|
export const SecondaryMenu= (props:Props) => {
|
|
12
11
|
const navigate = useNavigate();
|
|
13
12
|
|
|
13
|
+
const handleClick = (path:string) => {
|
|
14
|
+
if (props.router) props.router.push(path);
|
|
15
|
+
else navigate(path);
|
|
16
|
+
}
|
|
17
|
+
|
|
14
18
|
const getItems = () => {
|
|
15
19
|
const result:any[] = [];
|
|
16
20
|
props.menuItems.forEach(item => {
|
|
17
|
-
if (item.label === props.label) result.push(<Chip onClick={() =>
|
|
18
|
-
else result.push(<
|
|
21
|
+
if (item.label === props.label) result.push(<Chip onClick={() => handleClick(item.url)} label={item.label} component="a" variant="filled" clickable style={{backgroundColor:"var(--c1d2)", color:"#FFF", fontSize:16}} />);
|
|
22
|
+
else result.push(<a href="about:blank" onClick={(e) => { e.preventDefault(); handleClick(item.url) }} style={{ color:"#FFF", textDecoration: "none", marginLeft:10, marginRight:10}}>{item.label}</a>);
|
|
19
23
|
});
|
|
20
24
|
return result;
|
|
21
25
|
}
|
|
@@ -1,15 +1,16 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { Box, Button, Icon, Menu } from "@mui/material";
|
|
3
3
|
import { NavItem } from "../wrapper/NavItem";
|
|
4
|
+
import { useNavigate } from "react-router-dom";
|
|
4
5
|
|
|
5
6
|
interface Props {
|
|
6
7
|
label: string,
|
|
7
8
|
menuItems: { url: string, label: string }[]
|
|
9
|
+
router?: any;
|
|
8
10
|
}
|
|
9
11
|
|
|
10
12
|
export const SecondaryMenuAlt = (props:Props) => {
|
|
11
13
|
const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
|
|
12
|
-
|
|
13
14
|
const handleClose = () => { setAnchorEl(null); };
|
|
14
15
|
const open = Boolean(anchorEl);
|
|
15
16
|
|
|
@@ -21,7 +22,7 @@ export const SecondaryMenuAlt = (props:Props) => {
|
|
|
21
22
|
const getItems = () => {
|
|
22
23
|
const result:any[] = [];
|
|
23
24
|
props.menuItems.forEach(item => {
|
|
24
|
-
result.push(<NavItem url={item.url} label={item.label} key={item.url} icon="people" />);
|
|
25
|
+
result.push(<NavItem url={item.url} label={item.label} key={item.url} router={props.router} icon="people" />);
|
|
25
26
|
});
|
|
26
27
|
return result;
|
|
27
28
|
}
|
|
@@ -15,6 +15,7 @@ type Props = {
|
|
|
15
15
|
secondaryMenuItems:{ url: string, label: string }[];
|
|
16
16
|
context: UserContextInterface;
|
|
17
17
|
appName: string;
|
|
18
|
+
router?: any;
|
|
18
19
|
}
|
|
19
20
|
|
|
20
21
|
export const SiteHeader = (props:Props) => {
|
|
@@ -34,10 +35,10 @@ export const SiteHeader = (props:Props) => {
|
|
|
34
35
|
<div style={{backgroundColor:"var(--c1)", color: "#FFF"}}>
|
|
35
36
|
<CustomAppBar position="absolute">
|
|
36
37
|
<Toolbar sx={{ pr: "24px", backgroundColor: "var(--c1)" }}>
|
|
37
|
-
<PrimaryMenu label={props.primaryMenuLabel} menuItems={props.primaryMenuItems}
|
|
38
|
-
<SecondaryMenu label={props.secondaryMenuLabel} menuItems={props.secondaryMenuItems} />
|
|
38
|
+
<PrimaryMenu label={props.primaryMenuLabel} menuItems={props.primaryMenuItems} router={props.router} />
|
|
39
|
+
<SecondaryMenu label={props.secondaryMenuLabel} menuItems={props.secondaryMenuItems} router={props.router} />
|
|
39
40
|
<div style={{ flex: 1 }}>
|
|
40
|
-
<SecondaryMenuAlt label={props.secondaryMenuLabel} menuItems={props.secondaryMenuItems}
|
|
41
|
+
<SecondaryMenuAlt label={props.secondaryMenuLabel} menuItems={props.secondaryMenuItems} router={props.router} />
|
|
41
42
|
</div>
|
|
42
43
|
{UserHelper.user && <UserMenu profilePicture={PersonHelper.getPhotoUrl(props.context?.person)} userName={`${UserHelper.user?.firstName} ${UserHelper.user?.lastName}`} userChurches={UserHelper.userChurches} currentUserChurch={UserHelper.currentUserChurch} context={props.context} appName={props.appName} loadCounts={() => {}} notificationCounts={{notificationCount:0, pmCount:0}} />}
|
|
43
44
|
{!UserHelper.user && <Link href="/login" color="inherit" style={{ textDecoration: "none" }}>Login</Link>}
|