"use strict";
exports.id = 9737;
exports.ids = [9737];
exports.modules = {

/***/ 59737:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (/* binding */ Info)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(920997);
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(545725);
/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(antd__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(807772);
/* harmony import */ var _cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(534100);
/* harmony import */ var _image__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(77595);
/* harmony import */ var lib_config__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(78082);






const showcase = {
    width: "100%",
    boxShadow: "2px 2px 4px rgb(0 0 0 / 25%), 0 2px 4px rgb(0 0 0 / 22%)",
    borderRadius: "3px"
};
function Info(props) {
    const { anchor , icon , title , image , alt , video , caption , children , wide , swapCols , textStyleExtra ,  } = props;
    const head = /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("h1", {
        id: anchor,
        style: {
            textAlign: "center",
            marginBottom: "20px",
            color: "#333"
        },
        children: [
            icon && /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("span", {
                style: {
                    fontSize: "24pt",
                    marginRight: "5px"
                },
                children: [
                    /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_cocalc_frontend_components_icon__WEBPACK_IMPORTED_MODULE_2__.Icon, {
                        name: icon
                    }),
                    " "
                ]
            }),
            title
        ]
    });
    let graphic = null;
    if (image != null) {
        graphic = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_image__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .Z, {
            style: showcase,
            src: image,
            alt: alt ?? caption
        });
    } else if (video != null) {
        const videoSrcs = typeof video == "string" ? [
            video
        ] : video;
        verifyHasMp4(videoSrcs);
        graphic = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
            style: {
                position: "relative",
                width: "100%"
            },
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("video", {
                style: showcase,
                loop: true,
                controls: true,
                children: sources(videoSrcs)
            })
        });
    }
    if (graphic != null && caption != null) {
        graphic = /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
            children: [
                graphic,
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("br", {}),
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("br", {}),
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                    style: {
                        textAlign: "center",
                        color: "#666",
                        fontSize: "13pt"
                    },
                    children: caption
                })
            ]
        });
    }
    if (!graphic) {
        const noGraphicTextStyle = {
            background: "#fafafa",
            padding: "20px",
            marginBottom: "15px"
        };
        if (textStyleExtra != null) {
            // if textColStyleExtra is given, then merge it into noGraphicTextStyle.
            Object.assign(noGraphicTextStyle, textStyleExtra);
        }
        return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
            style: {
                width: "100%"
            },
            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                style: {
                    maxWidth: lib_config__WEBPACK_IMPORTED_MODULE_5__/* .MAX_WIDTH */ .d,
                    margin: "0 auto"
                },
                children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                    style: noGraphicTextStyle,
                    children: [
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                            style: {
                                textAlign: "center"
                            },
                            children: head
                        }),
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                            style: {
                                margin: "auto",
                                maxWidth: wide ? "600px" : undefined
                            },
                            children: children
                        })
                    ]
                })
            })
        });
    }
    const textColStyle = {
        border: "1px solid white",
        borderRadius: "5px",
        padding: "0 20px 0 20px",
        marginBottom: "15px",
        display: "flex",
        justifyContent: "start",
        alignContent: "start",
        flexDirection: "column",
        fontSize: "12pt"
    };
    if (textStyleExtra != null) {
        // if textColStyleExtra is given, then merge it into textColStyle.
        Object.assign(textColStyle, textStyleExtra);
    }
    const textCol = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(antd__WEBPACK_IMPORTED_MODULE_1__.Col, {
        lg: wide ? 7 : 9,
        style: textColStyle,
        children: children
    }, "text");
    const graphicCol = /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(antd__WEBPACK_IMPORTED_MODULE_1__.Col, {
        lg: wide ? 17 : 15,
        style: {
            padding: "0 30px",
            width: "100%"
        },
        children: graphic
    }, "graphics");
    const cols = swapCols ? [
        textCol,
        graphicCol
    ] : [
        graphicCol,
        textCol
    ];
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
        style: {
            padding: "60px 5%",
            background: "white",
            fontSize: "11pt"
        },
        children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
            children: [
                head,
                /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(antd__WEBPACK_IMPORTED_MODULE_1__.Row, {
                    children: cols
                })
            ]
        })
    });
};
function sources(video) {
    const v = [];
    for (const x of video){
        v.push(/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("source", {
            src: (0,_util__WEBPACK_IMPORTED_MODULE_3__/* .MediaURL */ .c)(x)
        }, x));
    }
    return v;
}
function verifyHasMp4(video) {
    for (const x of video){
        if (x.endsWith(".mp4")) {
            return;
        }
    }
    console.warn("include mp4 format for the video, so that it is viewable on iOS!!", video);
}
Info.Heading = ({ children , description , style  })=>{
    return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
        style: {
            ...{
                textAlign: "center",
                margin: "40px"
            },
            ...style
        },
        children: [
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("h1", {
                style: {
                    fontSize: "400%",
                    color: "#444"
                },
                children: children
            }),
            /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
                style: {
                    fontSize: "13pt",
                    color: "#666"
                },
                children: description
            })
        ]
    });
};


/***/ }),

/***/ 78082:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "d": () => (/* binding */ MAX_WIDTH),
/* harmony export */   "r": () => (/* binding */ SHARE_MAX_WIDTH)
/* harmony export */ });
/*
Constants and other configuration that impact the overall
look of all of the pages.
*/ const MAX_WIDTH = "900px";
const SHARE_MAX_WIDTH = "1100px";


/***/ })

};
;