@churchapps/apphelper 0.14.0 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/website/components/elementTypes/BoxElement.d.ts.map +1 -1
- package/dist/website/components/elementTypes/BoxElement.js +13 -6
- package/dist/website/components/elementTypes/BoxElement.js.map +1 -1
- package/dist/website/components/elementTypes/CardElement.d.ts.map +1 -1
- package/dist/website/components/elementTypes/CardElement.js +3 -1
- package/dist/website/components/elementTypes/CardElement.js.map +1 -1
- package/dist/website/components/elementTypes/ImageElement.d.ts.map +1 -1
- package/dist/website/components/elementTypes/ImageElement.js +3 -1
- package/dist/website/components/elementTypes/ImageElement.js.map +1 -1
- package/dist/website/components/elementTypes/LogoElement.d.ts.map +1 -1
- package/dist/website/components/elementTypes/LogoElement.js +2 -1
- package/dist/website/components/elementTypes/LogoElement.js.map +1 -1
- package/dist/website/components/elementTypes/TextWithPhoto.d.ts.map +1 -1
- package/dist/website/components/elementTypes/TextWithPhoto.js +6 -4
- package/dist/website/components/elementTypes/TextWithPhoto.js.map +1 -1
- package/dist/website/helpers/imageOptimizer.d.ts +13 -0
- package/dist/website/helpers/imageOptimizer.d.ts.map +1 -0
- package/dist/website/helpers/imageOptimizer.js +14 -0
- package/dist/website/helpers/imageOptimizer.js.map +1 -0
- package/dist/website/helpers/index.d.ts +1 -0
- package/dist/website/helpers/index.d.ts.map +1 -1
- package/dist/website/helpers/index.js +1 -0
- package/dist/website/helpers/index.js.map +1 -1
- package/dist/website/styles/pages.css +29 -7
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/BoxElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"BoxElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/BoxElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAA4B,MAAM,eAAe,CAAC;AAK7F,UAAU,KAAK;IAAG,OAAO,EAAE,gBAAgB,CAAC;IAAC,cAAc,EAAE,GAAG,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,EAAE,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE;AAE1L,wBAAgB,UAAU,CAAC,KAAK,EAAE,KAAK,qBA2EtC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { optimizedBackgroundImage } from "../../helpers";
|
|
2
3
|
import { DroppableArea } from "../admin/DroppableArea";
|
|
3
4
|
import { Element } from "../Element";
|
|
4
5
|
import { ApiHelper } from "../../..";
|
|
@@ -31,13 +32,17 @@ export function BoxElement(props) {
|
|
|
31
32
|
});
|
|
32
33
|
return result;
|
|
33
34
|
};
|
|
35
|
+
const isImageBg = props.element.answers?.background?.indexOf("/") > -1;
|
|
34
36
|
const getStyle = () => {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
37
|
+
const result = isImageBg
|
|
38
|
+
? { backgroundImage: optimizedBackgroundImage(props.element.answers?.background) }
|
|
39
|
+
: { background: props.element.answers?.background };
|
|
40
|
+
if (isImageBg) {
|
|
41
|
+
if (props.element.answers?.focalPoint)
|
|
42
|
+
result.backgroundPosition = props.element.answers.focalPoint;
|
|
43
|
+
// overlay defaults off (opacity 0) so existing image boxes don't darken
|
|
44
|
+
result["--overlay-color"] = props.element.answers?.overlayColor || "#000";
|
|
45
|
+
result["--overlay-opacity"] = props.element.answers?.backgroundOpacity || "0";
|
|
41
46
|
}
|
|
42
47
|
if (props.element.answers?.textColor?.startsWith("var("))
|
|
43
48
|
result.color = props.element.answers?.textColor;
|
|
@@ -50,6 +55,8 @@ export function BoxElement(props) {
|
|
|
50
55
|
};
|
|
51
56
|
const getClass = () => {
|
|
52
57
|
let result = "elBox";
|
|
58
|
+
if (isImageBg)
|
|
59
|
+
result += " boxBG";
|
|
53
60
|
let hc = props.element.answers?.headingColor;
|
|
54
61
|
if (hc) {
|
|
55
62
|
hc = hc.replace("var(--", "").replace(")", "");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BoxElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/BoxElement.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"BoxElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/BoxElement.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/CardElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"CardElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/CardElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAsB,MAAM,eAAe,CAAC;AAOvF,UAAU,KAAK;IAAG,OAAO,EAAE,gBAAgB,CAAC;IAAC,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,EAAE,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAAE;AAE9H,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiCvC,CAAC"}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { responsiveImgProps } from "../../helpers";
|
|
2
3
|
import { HtmlPreview } from "./HtmlPreview";
|
|
3
4
|
import { Card, CardContent } from "@mui/material";
|
|
5
|
+
const IMG_SIZES = "(max-width:768px) 100vw, 33vw";
|
|
4
6
|
export const CardElement = (props) => {
|
|
5
7
|
const textContent = props.element.answers?.text || "";
|
|
6
8
|
const textAlign = props.element.answers?.textAlignment;
|
|
@@ -10,7 +12,7 @@ export const CardElement = (props) => {
|
|
|
10
12
|
: _jsx("div", { style: { textAlign: textAlign }, dangerouslySetInnerHTML: { __html: textContent } });
|
|
11
13
|
let photoContent = _jsx(_Fragment, {});
|
|
12
14
|
if (props.element.answers?.photo) {
|
|
13
|
-
const photo = _jsx("img", {
|
|
15
|
+
const photo = _jsx("img", { ...responsiveImgProps(props.element.answers?.photo, IMG_SIZES), alt: props.element.answers?.photoAlt || "", style: { borderRadius: 3 }, loading: "lazy", decoding: "async" });
|
|
14
16
|
if (props.element.answers?.url)
|
|
15
17
|
photoContent = (_jsx("a", { href: props.element.answers?.url, children: photo }));
|
|
16
18
|
else
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/CardElement.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"CardElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/CardElement.tsx"],"names":[],"mappings":";AACA,OAAO,EAAsC,kBAAkB,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAElD,MAAM,SAAS,GAAG,+BAA+B,CAAC;AAKlD,MAAM,CAAC,MAAM,WAAW,GAAoB,CAAC,KAAK,EAAE,EAAE;IACpD,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI,IAAI,EAAE,CAAC;IACtD,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,aAAa,CAAC;IAEvD,oFAAoF;IACpF,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM;QAChC,CAAC,CAAC,KAAC,WAAW,IAAC,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,kBAAkB,QAAC,MAAM,EAAE,KAAK,CAAC,MAAM,GAAI;QAC5H,CAAC,CAAC,cACE,KAAK,EAAE,EAAE,SAAS,EAAE,SAAgB,EAAE,EACtC,uBAAuB,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,GAChD,CAAC;IAEP,IAAI,YAAY,GAAG,mBAAK,CAAC;IACzB,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACjC,MAAM,KAAK,GAAG,iBAAS,kBAAkB,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,EAAE,OAAO,EAAC,MAAM,EAAC,QAAQ,EAAC,OAAO,GAAG,CAAC;QAC/L,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG;YAAE,YAAY,GAAG,CAAC,YAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,YAAG,KAAK,GAAK,CAAC,CAAC;;YAC7F,YAAY,GAAG,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC;IAED,MAAM,MAAM,GAAyB,EAAE,CAAC;IACxC,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;QACjC,MAAM,KAAK,GAAG,aAAI,KAAK,EAAE,EAAE,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,cAAc,IAAI,QAAQ,EAAE,YAAG,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,KAAK,GAAM,CAAC;QAC/H,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG;YAAE,MAAM,CAAC,IAAI,CAAC,YAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,YAAoB,KAAK,IAAnB,YAAY,CAAY,CAAC,CAAC;;YAC1G,MAAM,CAAC,IAAI,CAAC,wBAAkB,KAAK,IAAd,OAAO,CAAc,CAAC,CAAC;IACnD,CAAC;IACD,IAAI,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,IAAI;QAAE,MAAM,CAAC,IAAI,CAAC,wBAAiB,aAAa,IAArB,MAAM,CAAsB,CAAC,CAAC;IAEpF,OAAO,MAAC,IAAI,IAAC,EAAE,EAAE,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,aACtC,YAAY,EACb,KAAC,WAAW,cACT,MAAM,GACK,IACT,CAAC;AACV,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/ImageElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAE/E,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"ImageElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/ImageElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAE/E,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAsB,MAAM,eAAe,CAAC;AAIvF,UAAU,KAAK;IACb,OAAO,EAAE,gBAAgB,CAAC;IAC1B,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,EAAE,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAChF;AAED,eAAO,MAAM,YAAY,GAAI,aAAa,KAAK,sBAmG9C,CAAC"}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useCallback, useEffect, useState } from "react";
|
|
3
3
|
import ReactDOM from "react-dom";
|
|
4
|
+
import { responsiveImgProps } from "../../helpers";
|
|
5
|
+
const IMG_SIZES = "(max-width:768px) 100vw, 66vw";
|
|
4
6
|
export const ImageElement = ({ element }) => {
|
|
5
7
|
const [lightboxOpen, setLightboxOpen] = useState(false);
|
|
6
8
|
const imageAlign = element.answers?.imageAlign;
|
|
@@ -51,7 +53,7 @@ export const ImageElement = ({ element }) => {
|
|
|
51
53
|
}
|
|
52
54
|
let photoDisplayContent = _jsx(_Fragment, {});
|
|
53
55
|
if (imageUrl) {
|
|
54
|
-
const imgTag = (_jsx("img", {
|
|
56
|
+
const imgTag = (_jsx("img", { ...responsiveImgProps(imageUrl, IMG_SIZES), alt: element.answers?.photoAlt || "", className: imageClassName, id: "el-" + element.id, style: imgTagStyles, loading: "lazy", decoding: "async", onClick: enableLightbox ? () => setLightboxOpen(true) : undefined }));
|
|
55
57
|
if (linkUrl) {
|
|
56
58
|
photoDisplayContent = (_jsx("a", { target: element.answers?.external === "true" ? "_blank" : "_self", rel: "noreferrer noopener", href: linkUrl, style: linkTagStyles, children: imgTag }));
|
|
57
59
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/ImageElement.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAiB,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/E,OAAO,QAAQ,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"ImageElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/ImageElement.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogoElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/LogoElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"LogoElement.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/LogoElement.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAsB,MAAM,eAAe,CAAC;AAGrE,UAAU,KAAK;IAAG,OAAO,EAAE,gBAAgB,CAAC;IAAC,cAAc,EAAE,GAAG,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;CAAE;AAEtF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsBvC,CAAC"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { responsiveImgProps } from "../../helpers";
|
|
2
3
|
import { AppearanceHelper } from "../../..";
|
|
3
4
|
export const LogoElement = (props) => {
|
|
4
5
|
const logoUrl = (props.textColor === "light")
|
|
5
6
|
? AppearanceHelper.getLogoDark(props.churchSettings.appearance ?? props.churchSettings, "/images/logo.png")
|
|
6
7
|
: AppearanceHelper.getLogoLight(props.churchSettings.appearance ?? props.churchSettings, "/images/logo.png");
|
|
7
|
-
const photo = (_jsx("img", {
|
|
8
|
+
const photo = (_jsx("img", { ...responsiveImgProps(logoUrl), alt: props.element.answers?.photoAlt || "", className: "img-fluid", id: "el-" + props.element.id, style: { maxWidth: "100%", height: "auto", display: "block" }, loading: "lazy", decoding: "async" }));
|
|
8
9
|
const photoContent = (props.element.answers?.url) ? _jsx("a", { href: props.element.answers?.url, children: photo }) : photo;
|
|
9
10
|
return photoContent;
|
|
10
11
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogoElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/LogoElement.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"LogoElement.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/LogoElement.tsx"],"names":[],"mappings":";AACA,OAAO,EAAoB,kBAAkB,EAAE,MAAM,eAAe,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAI5C,MAAM,CAAC,MAAM,WAAW,GAAoB,CAAC,KAAK,EAAE,EAAE;IAIpD,MAAM,OAAO,GAAG,CAAC,KAAK,CAAC,SAAS,KAAK,OAAO,CAAC;QAC3C,CAAC,CAAC,gBAAgB,CAAC,WAAW,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,IAAI,KAAK,CAAC,cAAc,EAAE,kBAAkB,CAAC;QAC3G,CAAC,CAAC,gBAAgB,CAAC,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,IAAI,KAAK,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC;IAE/G,MAAM,KAAK,GAAG,CACZ,iBACM,kBAAkB,CAAC,OAAO,CAAC,EAC/B,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,IAAI,EAAE,EAC1C,SAAS,EAAC,WAAW,EACrB,EAAE,EAAE,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,EAAE,EAC5B,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,EAC7D,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,OAAO,GAChB,CACH,CAAC;IACF,MAAM,YAAY,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,YAAG,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,YAAG,KAAK,GAAK,CAAC,CAAC,CAAC,KAAK,CAAC;IAE7G,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextWithPhoto.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/TextWithPhoto.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"TextWithPhoto.d.ts","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/TextWithPhoto.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAsB,MAAM,eAAe,CAAC;AAMvF,UAAU,KAAK;IAAG,OAAO,EAAE,gBAAgB,CAAC;IAAC,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,EAAE,OAAO,EAAE,gBAAgB,KAAK,IAAI,CAAC;CAAE;AAE9H,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuDzC,CAAC"}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { responsiveImgProps } from "../../helpers";
|
|
2
3
|
import { Grid } from "@mui/material";
|
|
3
4
|
import { HtmlPreview } from "./HtmlPreview";
|
|
5
|
+
const IMG_SIZES = "(max-width:768px) 100vw, 33vw";
|
|
4
6
|
export const TextWithPhoto = props => {
|
|
5
7
|
const textContent = props.element.answers?.text || "";
|
|
6
8
|
const textAlign = props.element.answers?.textAlignment;
|
|
@@ -11,16 +13,16 @@ export const TextWithPhoto = props => {
|
|
|
11
13
|
let result = textComponent;
|
|
12
14
|
switch (props.element.answers?.photoPosition || "left") {
|
|
13
15
|
case "left":
|
|
14
|
-
result = (_jsxs(Grid, { container: true, columnSpacing: 3, children: [_jsx(Grid, { size: { md: 4, xs: 12 }, children: _jsx("img", {
|
|
16
|
+
result = (_jsxs(Grid, { container: true, columnSpacing: 3, children: [_jsx(Grid, { size: { md: 4, xs: 12 }, children: _jsx("img", { ...responsiveImgProps(props.element.answers?.photo, IMG_SIZES), alt: props.element.answers?.photoAlt || "", style: { borderRadius: 10, marginTop: 40 }, loading: "lazy", decoding: "async" }) }), _jsx(Grid, { size: { md: 8, xs: 12 }, children: textComponent })] }));
|
|
15
17
|
break;
|
|
16
18
|
case "right":
|
|
17
|
-
result = (_jsxs(Grid, { container: true, columnSpacing: 3, children: [_jsx(Grid, { size: { md: 8, xs: 12 }, children: textComponent }), _jsx(Grid, { size: { md: 4, xs: 12 }, children: _jsx("img", {
|
|
19
|
+
result = (_jsxs(Grid, { container: true, columnSpacing: 3, children: [_jsx(Grid, { size: { md: 8, xs: 12 }, children: textComponent }), _jsx(Grid, { size: { md: 4, xs: 12 }, children: _jsx("img", { ...responsiveImgProps(props.element.answers?.photo, IMG_SIZES), alt: props.element.answers?.photoAlt || "", style: { borderRadius: 10, marginTop: 40 }, loading: "lazy", decoding: "async" }) })] }));
|
|
18
20
|
break;
|
|
19
21
|
case "bottom":
|
|
20
|
-
result = (_jsxs(_Fragment, { children: [textComponent, _jsx("img", {
|
|
22
|
+
result = (_jsxs(_Fragment, { children: [textComponent, _jsx("img", { ...responsiveImgProps(props.element.answers?.photo, IMG_SIZES), alt: props.element.answers?.photoAlt || "", style: { borderRadius: 10, marginTop: 40 }, loading: "lazy", decoding: "async" })] }));
|
|
21
23
|
break;
|
|
22
24
|
case "top":
|
|
23
|
-
result = (_jsxs(_Fragment, { children: [_jsx("img", {
|
|
25
|
+
result = (_jsxs(_Fragment, { children: [_jsx("img", { ...responsiveImgProps(props.element.answers?.photo, IMG_SIZES), alt: props.element.answers?.photoAlt || "", style: { borderRadius: 10, marginTop: 40 }, loading: "lazy", decoding: "async" }), textComponent] }));
|
|
24
26
|
break;
|
|
25
27
|
}
|
|
26
28
|
return _jsx("div", { id: "el-" + props.element.id, className: "elTextWithPhoto", children: result });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextWithPhoto.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/TextWithPhoto.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"TextWithPhoto.js","sourceRoot":"","sources":["../../../../src/website/components/elementTypes/TextWithPhoto.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export interface ResponsiveImgProps {
|
|
2
|
+
src: string;
|
|
3
|
+
srcSet?: string;
|
|
4
|
+
sizes?: string;
|
|
5
|
+
}
|
|
6
|
+
export interface ImageOptimizer {
|
|
7
|
+
img: (url: string, sizes?: string) => ResponsiveImgProps;
|
|
8
|
+
background: (url: string) => string;
|
|
9
|
+
}
|
|
10
|
+
export declare const setImageOptimizer: (optimizer: ImageOptimizer | null) => void;
|
|
11
|
+
export declare const responsiveImgProps: (url: string, sizes?: string) => ResponsiveImgProps;
|
|
12
|
+
export declare const optimizedBackgroundImage: (url: string) => string;
|
|
13
|
+
//# sourceMappingURL=imageOptimizer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"imageOptimizer.d.ts","sourceRoot":"","sources":["../../../src/website/helpers/imageOptimizer.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,kBAAkB;IACjC,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,cAAc;IAE7B,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,kBAAkB,CAAC;IAEzD,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;CACrC;AASD,eAAO,MAAM,iBAAiB,GAAI,WAAW,cAAc,GAAG,IAAI,SAEjE,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,KAAK,MAAM,EAAE,QAAQ,MAAM,KAAG,kBACnB,CAAC;AAE/C,eAAO,MAAM,wBAAwB,GAAI,KAAK,MAAM,KAAG,MACN,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
// Pluggable image-optimization seam. Host apps (B1App / Next.js) register an optimizer that
|
|
2
|
+
// produces responsive <img> props and optimized CSS backgrounds via the Next image pipeline.
|
|
3
|
+
// The default is identity, so the Vite editor and any non-Next host render plain images unchanged.
|
|
4
|
+
const identity = {
|
|
5
|
+
img: (url) => ({ src: url }),
|
|
6
|
+
background: (url) => `url('${url}')`
|
|
7
|
+
};
|
|
8
|
+
let current = identity;
|
|
9
|
+
export const setImageOptimizer = (optimizer) => {
|
|
10
|
+
current = optimizer || identity;
|
|
11
|
+
};
|
|
12
|
+
export const responsiveImgProps = (url, sizes) => url ? current.img(url, sizes) : { src: url };
|
|
13
|
+
export const optimizedBackgroundImage = (url) => url ? current.background(url) : `url('${url}')`;
|
|
14
|
+
//# sourceMappingURL=imageOptimizer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"imageOptimizer.js","sourceRoot":"","sources":["../../../src/website/helpers/imageOptimizer.ts"],"names":[],"mappings":"AAAA,4FAA4F;AAC5F,6FAA6F;AAC7F,mGAAmG;AAenG,MAAM,QAAQ,GAAmB;IAC/B,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;IAC5B,UAAU,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,QAAQ,GAAG,IAAI;CACrC,CAAC;AAEF,IAAI,OAAO,GAAmB,QAAQ,CAAC;AAEvC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,SAAgC,EAAE,EAAE;IACpE,OAAO,GAAG,SAAS,IAAI,QAAQ,CAAC;AAClC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,GAAW,EAAE,KAAc,EAAsB,EAAE,CACpF,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAE/C,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,GAAW,EAAU,EAAE,CAC9D,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/website/helpers/index.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,QAAQ;IACvB,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,MAAM,CAAC,EAAE,GAAG,CAAC;CACd;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC9B,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,UAAU,CAAC,EAAE;QACX,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC9B,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/website/helpers/index.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,QAAQ;IACvB,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,MAAM,CAAC,EAAE,GAAG,CAAC;CACd;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC9B,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,UAAU,CAAC,EAAE;QACX,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC9B,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACpB;AAED,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/website/helpers/index.ts"],"names":[],"mappings":"AAiCA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/website/helpers/index.ts"],"names":[],"mappings":"AAiCA,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,0BAA0B,CAAC;AACzC,cAAc,mBAAmB,CAAC"}
|
|
@@ -156,6 +156,28 @@ body {
|
|
|
156
156
|
box-sizing: inherit;
|
|
157
157
|
}
|
|
158
158
|
|
|
159
|
+
/* Box background overlay/tint — opt-in via inline --overlay-opacity (defaults off) */
|
|
160
|
+
.page .boxBG {
|
|
161
|
+
background-size: cover;
|
|
162
|
+
background-position: 50% 50%;
|
|
163
|
+
position: relative;
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
.page .boxBG:before {
|
|
167
|
+
content: '';
|
|
168
|
+
position: absolute;
|
|
169
|
+
inset: 0;
|
|
170
|
+
background: var(--overlay-color, #000);
|
|
171
|
+
opacity: var(--overlay-opacity, 0);
|
|
172
|
+
pointer-events: none;
|
|
173
|
+
box-sizing: inherit;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.page .boxBG > * {
|
|
177
|
+
position: relative;
|
|
178
|
+
z-index: 1;
|
|
179
|
+
}
|
|
180
|
+
|
|
159
181
|
/*
|
|
160
182
|
.section {
|
|
161
183
|
color: #333;
|
|
@@ -795,11 +817,11 @@ code {
|
|
|
795
817
|
opacity: 1 !important;
|
|
796
818
|
}
|
|
797
819
|
|
|
798
|
-
|
|
799
|
-
/* Per-device visibility (hide flags stored in stylesJSON desktop/mobile display:none) */
|
|
800
|
-
@media (min-width: 768px) {
|
|
801
|
-
.hiddenOnDesktop { display: none !important; }
|
|
802
|
-
}
|
|
803
|
-
@media (max-width: 767px) {
|
|
804
|
-
.hiddenOnMobile { display: none !important; }
|
|
820
|
+
|
|
821
|
+
/* Per-device visibility (hide flags stored in stylesJSON desktop/mobile display:none) */
|
|
822
|
+
@media (min-width: 768px) {
|
|
823
|
+
.hiddenOnDesktop { display: none !important; }
|
|
824
|
+
}
|
|
825
|
+
@media (max-width: 767px) {
|
|
826
|
+
.hiddenOnMobile { display: none !important; }
|
|
805
827
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@churchapps/apphelper",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.15.0",
|
|
4
4
|
"description": "Library of helper functions, components, and feature modules (donations/forms/login/markdown/website) for React and NextJS ChurchApps",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -138,7 +138,7 @@
|
|
|
138
138
|
"slug": "^11.0.0"
|
|
139
139
|
},
|
|
140
140
|
"devDependencies": {
|
|
141
|
-
"@churchapps/helpers": "^1.
|
|
141
|
+
"@churchapps/helpers": "^1.8.1",
|
|
142
142
|
"@eslint/js": "^10.0.1",
|
|
143
143
|
"@stripe/react-stripe-js": "^3.10.0",
|
|
144
144
|
"@stripe/stripe-js": "^7.9.0",
|