@roomstay/frontend 2.1.6 → 2.1.7

package/dist/src/components/summary/BEMapWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"BEMapWidget.js","sourceRoot":"/","sources":["src/components/summary/BEMapWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { forwardRef, ReactElement, useEffect, useRef, useState } from 'react';\nimport { Status, Wrapper } from '@googlemaps/react-wrapper';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\n\nexport interface MapProps {\n    mapLatLng?: google.maps.LatLng | google.maps.LatLngLiteral;\n    isFullScreen?: boolean;\n    imageOverride?: string;\n}\n\nfunction BEMapWidget({ mapLatLng, isFullScreen }: MapProps): ReactElement {\n    const ref = useRef();\n    const [map, setMap] = useState<google.maps.Map>();\n    const mapStyle: google.maps.MapTypeStyle[] = [\n        {\n            featureType: 'poi.business',\n            stylers: [{ visibility: 'off' }],\n        },\n    ];\n\n    useEffect(() => {\n        const map = new window.google.maps.Map(ref.current, {\n            center: mapLatLng,\n            zoom: 15,\n            styles: mapStyle,\n        });\n        setMap(map);\n    }, [mapLatLng]);\n\n    useEffect(() => {\n        new google.maps.Marker({\n            position: mapLatLng,\n            map,\n        });\n    }, [map, mapLatLng]);\n\n    return (\n        <div\n            ref={ref}\n            id=\"map\"\n            style={\n                isFullScreen\n                    ? {\n                          height: '100%',\n                      }\n                    : undefined\n            }\n        />\n    );\n}\n\nfunction WrappedBEMapWidget(props: MapProps) {\n    const render = (status: Status) => {\n        switch (status) {\n            case Status.LOADING:\n                return <SmallSpinner />;\n            case Status.FAILURE:\n                return null;\n            case Status.SUCCESS:\n                return <BEMapWidget {...props} />;\n        }\n    };\n\n    return <Wrapper apiKey=\"AIzaSyBFoDziXY56EWFYGsREjZtK9fOdav2adcY\" render={render} />;\n}\n\nexport default forwardRef(function BEMap(props: MapProps, ref) {\n    const { hotel } = useCurrentHotel();\n    const [toggler, setToggler] = useState(false);\n\n    const togglerOn = () => {\n        return setToggler(true);\n    };\n\n    const togglerOff = () => {\n        return setToggler(false);\n    };\n\n    const mapObject = hotel?.googleMapsImage ? <img className=\"static-image\" src={RoomstayThemeEngine.wrapAssetUrl(hotel?.googleMapsImage)} /> : <WrappedBEMapWidget {...props} />;\n\n    return (\n        <>\n            <div className=\"be-map-widget\">\n                <span className=\"room-gallery-slider__icon-lightbox-map\" onClick={togglerOn}>\n                    <Icon icon={IconType.Fullscreen} size=\"24px\" />\n                </span>\n                {mapObject}\n            </div>\n            {\n                <SimpleModal open={toggler} size={SimpleModalSize.Large} alignCenter={true} onClose={togglerOff}>\n                    <div style={{ height: 500, maxHeight: '80vh' }}>\n                        <WrappedBEMapWidget {...props} isFullScreen={true} />\n                    </div>\n                </SimpleModal>\n            }\n        </>\n    );\n});\n"]}
+{"version":3,"file":"BEMapWidget.js","sourceRoot":"/","sources":["src/components/summary/BEMapWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { JSXElementConstructor } from 'react';\nimport { forwardRef, ReactElement, useEffect, useRef, useState } from 'react';\nimport { Status, Wrapper } from '@googlemaps/react-wrapper';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport SimpleModal, { SimpleModalSize } from '@/components/generic/modal/SimpleModal';\nimport RoomstayThemeEngine from '@/providers/RoomstayThemeEngine';\nimport { useCurrentHotel } from '@frontend/hooks';\nimport SmallSpinner from '@/components/generic/loader/SmallSpinner';\n\nexport interface MapProps {\n    mapLatLng?: google.maps.LatLng | google.maps.LatLngLiteral;\n    isFullScreen?: boolean;\n    imageOverride?: string;\n}\n\nfunction BEMapWidget({ mapLatLng, isFullScreen }: MapProps): ReactElement {\n    const ref = useRef<HTMLDivElement | null>(null);\n    const [map, setMap] = useState<google.maps.Map>();\n    const mapStyle: google.maps.MapTypeStyle[] = [\n        {\n            featureType: 'poi.business',\n            stylers: [{ visibility: 'off' }],\n        },\n    ];\n\n    useEffect(() => {\n        if (ref.current) {\n            const map = new window.google.maps.Map(ref.current, {\n                center: mapLatLng,\n                zoom: 15,\n                styles: mapStyle,\n            });\n            setMap(map);\n        }\n    }, [mapLatLng]);\n\n    useEffect(() => {\n        new google.maps.Marker({\n            position: mapLatLng,\n            map,\n        });\n    }, [map, mapLatLng]);\n\n    return (\n        <div\n            ref={ref}\n            id=\"map\"\n            style={\n                isFullScreen\n                    ? {\n                          height: '100%',\n                      }\n                    : undefined\n            }\n        />\n    );\n}\n\nfunction WrappedBEMapWidget(props: MapProps) {\n    const render = (status: Status): ReactElement => {\n        switch (status) {\n            case Status.LOADING:\n                return <SmallSpinner />;\n            case Status.FAILURE:\n                return <></>;\n            case Status.SUCCESS:\n                return <BEMapWidget {...props} />;\n        }\n    };\n\n    return <Wrapper apiKey=\"AIzaSyBFoDziXY56EWFYGsREjZtK9fOdav2adcY\" render={render} />;\n}\n\nexport default forwardRef(function BEMap(props: MapProps, ref) {\n    const { hotel } = useCurrentHotel();\n    const [toggler, setToggler] = useState(false);\n\n    const togglerOn = () => {\n        return setToggler(true);\n    };\n\n    const togglerOff = () => {\n        return setToggler(false);\n    };\n\n    const mapObject = hotel?.googleMapsImage ? <img className=\"static-image\" src={RoomstayThemeEngine.wrapAssetUrl(hotel?.googleMapsImage)} /> : <WrappedBEMapWidget {...props} />;\n\n    return (\n        <>\n            <div className=\"be-map-widget\">\n                <span className=\"room-gallery-slider__icon-lightbox-map\" onClick={togglerOn}>\n                    <Icon icon={IconType.Fullscreen} size=\"24px\" />\n                </span>\n                {mapObject}\n            </div>\n            <SimpleModal open={toggler} size={SimpleModalSize.Large} alignCenter onClose={togglerOff}>\n                <div style={{ height: 500, maxHeight: '80vh' }}>\n                    <WrappedBEMapWidget {...props} isFullScreen />\n                </div>\n            </SimpleModal>\n        </>\n    );\n});\n"]}

package/dist/src/components/summary/BEMobileSummary.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = __importStar(require("react"));
+const react_1 = __importDefault(require("react"));
 const Text_1 = __importStar(require("../generic/Text"));
 const Color_1 = require("../../util/Color");
 const Icon_1 = __importStar(require("../generic/Icon/Icon"));
@@ -36,17 +36,17 @@ const Currency_1 = __importDefault(require("../generic/Currency"));
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
 const ScreenSize_1 = __importDefault(require("../../util/ScreenSize"));
-const react_1 = require("react");
+const react_2 = require("react");
 const BEMobileSummaryModal_1 = __importDefault(require("./BEMobileSummaryModal"));
 const StepDatePricePerRoom_1 = __importDefault(require("../steps/date/StepDatePricePerRoom"));
 const StepDate_1 = __importDefault(require("../../pages/steps/StepDate/StepDate"));
 const contexts_1 = require("../../contexts/index.js");
 function BEMobileSummary() {
-    const { screenSize } = (0, react_1.useContext)(contexts_1.BookingEngineContext);
-    const { currentStep } = (0, react_1.useContext)(contexts_1.FullPageEngineContext);
-    const basketContext = React.useContext(contexts_1.BasketContext);
+    const { screenSize } = (0, react_2.useContext)(contexts_1.BookingEngineContext);
+    const { currentStep } = (0, react_2.useContext)(contexts_1.FullPageEngineContext);
+    const basketContext = react_1.default.useContext(contexts_1.BasketContext);
     const { t } = (0, react_i18next_1.useTranslation)();
-    const [modalOpen, setModalOpen] = (0, react_1.useState)(false);
+    const [modalOpen, setModalOpen] = (0, react_2.useState)(false);
     if (screenSize <= ScreenSize_1.default.Medium) {
         const openModal = () => {
             setModalOpen(true);
@@ -54,28 +54,28 @@ function BEMobileSummary() {
         const closeModal = () => {
             setModalOpen(false);
         };
-        return (React.createElement(React.Fragment, null,
-            React.createElement("div", { className: "be-mobile-summary row u-border-bottom u-pad-top-bottom u-marg-bottom", onClick: openModal },
-                React.createElement("div", { className: "col-8" },
-                    React.createElement("div", { className: "u-flex u-flex-flex-start" },
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                            React.createElement("span", Object.assign({}, (basketContext.startDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Arrival))),
-                        React.createElement("span", { className: "u-marg-left-right--light" },
-                            React.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, size: '18px', color: Color_1.Color.DarkGrey })),
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                            React.createElement("span", Object.assign({}, (basketContext.endDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Departure)))),
-                    React.createElement(Text_1.default, { type: Text_1.TextType.Small },
+        return (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("div", { className: "be-mobile-summary row u-border-bottom u-pad-top-bottom u-marg-bottom", onClick: openModal },
+                react_1.default.createElement("div", { className: "col-8" },
+                    react_1.default.createElement("div", { className: "u-flex u-flex-flex-start" },
+                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                            react_1.default.createElement("span", Object.assign({}, (basketContext.startDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Arrival))),
+                        react_1.default.createElement("span", { className: "u-marg-left-right--light" },
+                            react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, size: "18px", color: Color_1.Color.DarkGrey })),
+                        react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                            react_1.default.createElement("span", Object.assign({}, (basketContext.endDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Departure)))),
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                         basketContext.getNumberOfAdults(true),
                         ",\u00A0",
                         basketContext.getNumberOfChildren(true),
                         ",\u00A0",
                         basketContext.getNumberOfRooms(true))),
-                React.createElement("div", { className: "col-4 u-flex u-flex-flex-end u-flex-align-center" },
-                    React.createElement(Headline_1.default, { bold: true, size: 'normal', align: TextAlignment_1.TextAlign.Right }, currentStep === StepDate_1.default ? React.createElement(StepDatePricePerRoom_1.default, { isMobile: true }) : React.createElement(Currency_1.default, null, basketContext.getTotalPrice())),
-                    React.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, size: '18px', color: Color_1.Color.DarkGrey }))),
-            React.createElement(BEMobileSummaryModal_1.default, { isOpen: modalOpen, onClose: closeModal })));
+                react_1.default.createElement("div", { className: "col-4 u-flex u-flex-flex-end u-flex-align-center" },
+                    react_1.default.createElement(Headline_1.default, { bold: true, size: "normal", align: TextAlignment_1.TextAlign.Right }, currentStep === StepDate_1.default ? react_1.default.createElement(StepDatePricePerRoom_1.default, { isMobile: true }) : react_1.default.createElement(Currency_1.default, null, basketContext.getTotalPrice())),
+                    react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Dropdown, size: "18px", color: Color_1.Color.DarkGrey }))),
+            react_1.default.createElement(BEMobileSummaryModal_1.default, { isOpen: modalOpen, onClose: closeModal })));
     }
-    return React.createElement(React.Fragment, null);
+    return react_1.default.createElement(react_1.default.Fragment, null);
 }
 exports.default = BEMobileSummary;
 //# sourceMappingURL=BEMobileSummary.js.map

package/dist/src/components/summary/BEMobileSummary.js.map

@@ -1 +1 @@
-{"version":3,"file":"BEMobileSummary.js","sourceRoot":"/","sources":["src/components/summary/BEMobileSummary.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Headline from '@/components/generic/Headline';\nimport { TextAlign } from '@/util/TextAlignment';\nimport Currency from '@/components/generic/Currency';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport ScreenSize from '@/util/ScreenSize';\nimport { useContext, useState } from 'react';\nimport BEMobileSummaryModal from '@/components/summary/BEMobileSummaryModal';\nimport StepDatePricePerRoom from '@/components/steps/date/StepDatePricePerRoom';\nimport StepDate from '@/pages/steps/StepDate/StepDate';\nimport { BasketContext, BookingEngineContext, FullPageEngineContext } from '@frontend/contexts';\n\nexport default function BEMobileSummary() {\n    const { screenSize } = useContext(BookingEngineContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n    const basketContext = React.useContext(BasketContext);\n    const { t } = useTranslation();\n    const [modalOpen, setModalOpen] = useState(false);\n\n    if (screenSize <= ScreenSize.Medium) {\n        const openModal = () => {\n            setModalOpen(true);\n        };\n        const closeModal = () => {\n            setModalOpen(false);\n        };\n        return (\n            <>\n                <div className=\"be-mobile-summary row u-border-bottom u-pad-top-bottom u-marg-bottom\" onClick={openModal}>\n                    <div className=\"col-8\">\n                        <div className=\"u-flex u-flex-flex-start\">\n                            <Text type={TextType.Small}>\n                                <span {...(basketContext.startDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                    {basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation.Step.Date.Arrival)}\n                                </span>\n                            </Text>\n                            <span className=\"u-marg-left-right--light\">\n                                <Icon icon={IconType.ArrowRight2} size={'18px'} color={Color.DarkGrey} />\n                            </span>\n                            <Text type={TextType.Small}>\n                                <span {...(basketContext.endDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                    {basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation.Step.Date.Departure)}\n                                </span>\n                            </Text>\n                        </div>\n                        <Text type={TextType.Small}>\n                            {basketContext.getNumberOfAdults(true)},&nbsp;\n                            {basketContext.getNumberOfChildren(true)},&nbsp;\n                            {basketContext.getNumberOfRooms(true)}\n                        </Text>\n                    </div>\n                    <div className=\"col-4 u-flex u-flex-flex-end u-flex-align-center\">\n                        <Headline bold={true} size={'normal'} align={TextAlign.Right}>\n                            {currentStep === StepDate ? <StepDatePricePerRoom isMobile={true} /> : <Currency>{basketContext.getTotalPrice()}</Currency>}\n                        </Headline>\n                        <Icon icon={IconType.Dropdown} size={'18px'} color={Color.DarkGrey} />\n                    </div>\n                </div>\n                <BEMobileSummaryModal isOpen={modalOpen} onClose={closeModal} />\n            </>\n        );\n    }\n\n    return <></>;\n}\n"]}
+{"version":3,"file":"BEMobileSummary.js","sourceRoot":"/","sources":["src/components/summary/BEMobileSummary.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { Color } from '@/util/Color';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport Headline from '@/components/generic/Headline';\nimport { TextAlign } from '@/util/TextAlignment';\nimport Currency from '@/components/generic/Currency';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport ScreenSize from '@/util/ScreenSize';\nimport { useContext, useState } from 'react';\nimport BEMobileSummaryModal from '@/components/summary/BEMobileSummaryModal';\nimport StepDatePricePerRoom from '@/components/steps/date/StepDatePricePerRoom';\nimport StepDate from '@/pages/steps/StepDate/StepDate';\nimport { BasketContext, BookingEngineContext, FullPageEngineContext } from '@frontend/contexts';\n\nexport default function BEMobileSummary() {\n    const { screenSize } = useContext(BookingEngineContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n    const basketContext = React.useContext(BasketContext);\n    const { t } = useTranslation();\n    const [modalOpen, setModalOpen] = useState(false);\n\n    if (screenSize <= ScreenSize.Medium) {\n        const openModal = () => {\n            setModalOpen(true);\n        };\n        const closeModal = () => {\n            setModalOpen(false);\n        };\n        return (\n            <>\n                <div className=\"be-mobile-summary row u-border-bottom u-pad-top-bottom u-marg-bottom\" onClick={openModal}>\n                    <div className=\"col-8\">\n                        <div className=\"u-flex u-flex-flex-start\">\n                            <Text type={TextType.Small}>\n                                <span {...(basketContext.startDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                    {basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation.Step.Date.Arrival)}\n                                </span>\n                            </Text>\n                            <span className=\"u-marg-left-right--light\">\n                                <Icon icon={IconType.ArrowRight2} size=\"18px\" color={Color.DarkGrey} />\n                            </span>\n                            <Text type={TextType.Small}>\n                                <span {...(basketContext.endDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                    {basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation.Step.Date.Departure)}\n                                </span>\n                            </Text>\n                        </div>\n                        <Text type={TextType.Small}>\n                            {basketContext.getNumberOfAdults(true)},&nbsp;\n                            {basketContext.getNumberOfChildren(true)},&nbsp;\n                            {basketContext.getNumberOfRooms(true)}\n                        </Text>\n                    </div>\n                    <div className=\"col-4 u-flex u-flex-flex-end u-flex-align-center\">\n                        <Headline bold size=\"normal\" align={TextAlign.Right}>\n                            {currentStep === StepDate ? <StepDatePricePerRoom isMobile /> : <Currency>{basketContext.getTotalPrice()}</Currency>}\n                        </Headline>\n                        <Icon icon={IconType.Dropdown} size=\"18px\" color={Color.DarkGrey} />\n                    </div>\n                </div>\n                <BEMobileSummaryModal isOpen={modalOpen} onClose={closeModal} />\n            </>\n        );\n    }\n\n    return <></>;\n}\n"]}

package/dist/src/components/summary/BEMobileSummaryModal.js

@@ -30,7 +30,7 @@ const SimpleModal_1 = __importDefault(require("../generic/modal/SimpleModal"));
 const react_i18next_1 = require("react-i18next");
 const react_1 = require("react");
 const Translation_1 = require("translations/Translation");
-const React = __importStar(require("react"));
+const react_2 = __importDefault(require("react"));
 const LineBreak_1 = __importDefault(require("../generic/LineBreak"));
 const Icon_1 = __importStar(require("../generic/Icon/Icon"));
 const Color_1 = require("../../util/Color");
@@ -62,10 +62,10 @@ function BEMobileSummaryModal(props) {
     (0, react_1.useEffect)(() => {
         // We do this hacky thing since Mobile summary & Desktop summary are almost identical, just blocks are presented differently
         const newLayout = Object.assign({}, BESummary_1.BESummaryLayoutOrder);
-        newLayout.TransportDistanceBlock.component = (React.createElement("div", { className: "u-flex justify-content-center u-marg-top u-marg-bottom" },
-            React.createElement("div", { className: "col-10 u-flex flex-row" },
-                React.createElement(TransportDistanceFromHotelBlock_1.default, { vertical: true, hotel: hotel }))));
-        newLayout.PerksBlock.component = React.createElement(BESummaryPerkBlock_1.BESummaryPerkBlock, { size: "mobile" });
+        newLayout.TransportDistanceBlock.component = (react_2.default.createElement("div", { className: "u-flex justify-content-center u-marg-top u-marg-bottom" },
+            react_2.default.createElement("div", { className: "col-10 u-flex flex-row" },
+                react_2.default.createElement(TransportDistanceFromHotelBlock_1.default, { vertical: true, hotel: hotel }))));
+        newLayout.PerksBlock.component = react_2.default.createElement(BESummaryPerkBlock_1.BESummaryPerkBlock, { size: "mobile" });
         setMobileLayout(newLayout);
     }, []);
     const { sortedComponents } = (0, hooks_1.useElementSort)(mobileLayout);
@@ -75,7 +75,7 @@ function BEMobileSummaryModal(props) {
     const getAddressString = (val) => {
         const line = val.filter((it) => !!it && it !== '0').join(', ');
         if (line) {
-            return React.createElement(Text_1.default, { type: Text_1.TextType.Small }, line);
+            return react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, line);
         }
         return null;
     };
@@ -83,85 +83,87 @@ function BEMobileSummaryModal(props) {
         return props.onClose ? props.onClose() : null;
     };
     const editOnClick = () => {
-        props.onClose();
+        var _a;
+        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
     };
     const onEditPropertyClickedHandler = () => {
-        props.onClose();
+        var _a;
+        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
     };
-    return (React.createElement(SimpleModal_1.default, { open: props.isOpen, title: t(Translation_1.Translation.Misc.Summary), onClose: onCloseModalHandler, mobileFooter: React.createElement("div", { className: "row align-items-center" },
-            React.createElement("div", { className: "col-4" },
-                React.createElement(Text_1.default, { type: Text_1.TextType.Body }, t(Translation_1.Translation.Misc.Total)),
-                React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Accent },
-                    React.createElement("strong", null, StringHelper_1.default.pluralWithDictAndCount(totalDays, Translation_1.Translation.Misc.Night, t)))),
-            React.createElement("div", { className: "col-8 u-flex u-flex-direction-column align-items-end" },
-                React.createElement(Headline_1.default, { bold: true, size: 'normal', align: TextAlignment_1.TextAlign.Right },
-                    React.createElement(Currency_1.default, null, basketContext.getTotalPrice())),
-                React.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right },
-                    React.createElement("span", { className: "u-nowrap" }, t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes))))) },
-        React.createElement(React.Fragment, null,
-            React.createElement("div", { className: "container" },
-                React.createElement("div", { className: "row u-border-bottom u-pad-top-bottom" },
-                    React.createElement("div", { className: "col-6" },
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
-                            React.createElement("strong", null, t(Translation_1.Translation.Misc.CheckIn))),
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small },
+    return (react_2.default.createElement(SimpleModal_1.default, { open: props.isOpen, title: t(Translation_1.Translation.Misc.Summary), onClose: onCloseModalHandler, mobileFooter: react_2.default.createElement("div", { className: "row align-items-center" },
+            react_2.default.createElement("div", { className: "col-4" },
+                react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Body }, t(Translation_1.Translation.Misc.Total)),
+                react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Accent },
+                    react_2.default.createElement("strong", null, StringHelper_1.default.pluralWithDictAndCount(totalDays, Translation_1.Translation.Misc.Night, t)))),
+            react_2.default.createElement("div", { className: "col-8 u-flex u-flex-direction-column align-items-end" },
+                react_2.default.createElement(Headline_1.default, { bold: true, size: "normal", align: TextAlignment_1.TextAlign.Right },
+                    react_2.default.createElement(Currency_1.default, null, basketContext.getTotalPrice())),
+                react_2.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right },
+                    react_2.default.createElement("span", { className: "u-nowrap" }, t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes))))) },
+        react_2.default.createElement(react_2.default.Fragment, null,
+            react_2.default.createElement("div", { className: "container" },
+                react_2.default.createElement("div", { className: "row u-border-bottom u-pad-top-bottom" },
+                    react_2.default.createElement("div", { className: "col-6" },
+                        react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
+                            react_2.default.createElement("strong", null, t(Translation_1.Translation.Misc.CheckIn))),
+                        react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                             t(Translation_1.Translation.Misc.After),
                             " ", hotel === null || hotel === void 0 ? void 0 :
                             hotel.checkInTime)),
-                    React.createElement("div", { className: "col-6" },
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
-                            React.createElement("strong", null, t(Translation_1.Translation.Misc.CheckOut))),
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                    react_2.default.createElement("div", { className: "col-6" },
+                        react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.Grey },
+                            react_2.default.createElement("strong", null, t(Translation_1.Translation.Misc.CheckOut))),
+                        react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                             t(Translation_1.Translation.Misc.Before),
                             " ", hotel === null || hotel === void 0 ? void 0 :
                             hotel.checkOutTime))),
-                React.createElement("div", { className: "row u-border-bottom u-pad-top-bottom" },
-                    React.createElement("div", { className: "col-8" },
-                        React.createElement("div", { className: "u-flex u-flex-flex-start" },
-                            React.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                                React.createElement("span", Object.assign({}, (basketContext.startDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Arrival))),
-                            React.createElement("span", { className: "u-marg-left-right--light" },
-                                React.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, size: '18px', color: Color_1.Color.DarkGrey })),
-                            React.createElement(Text_1.default, { type: Text_1.TextType.Small },
-                                React.createElement("span", Object.assign({}, (basketContext.endDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Departure)))),
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                react_2.default.createElement("div", { className: "row u-border-bottom u-pad-top-bottom" },
+                    react_2.default.createElement("div", { className: "col-8" },
+                        react_2.default.createElement("div", { className: "u-flex u-flex-flex-start" },
+                            react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                                react_2.default.createElement("span", Object.assign({}, (basketContext.startDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Arrival))),
+                            react_2.default.createElement("span", { className: "u-marg-left-right--light" },
+                                react_2.default.createElement(Icon_1.default, { icon: Icon_1.IconType.ArrowRight2, size: "18px", color: Color_1.Color.DarkGrey })),
+                            react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
+                                react_2.default.createElement("span", Object.assign({}, (basketContext.endDate ? { style: { color: Color_1.Color.Accent, fontWeight: 'bold' } } : {})), basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation_1.Translation.Step.Date.Departure)))),
+                        react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Small },
                             basketContext.getNumberOfAdults(true),
                             ",\u00A0",
                             basketContext.getNumberOfChildren(true),
                             ",\u00A0",
                             basketContext.getNumberOfRooms(true))),
-                    React.createElement("div", { className: "col-4 u-align-right" },
-                        React.createElement(react_router_dom_1.Link, { to: StepRoom_1.default.getStepUrl() },
-                            React.createElement(BEButton_1.default, { onClick: editOnClick, size: 'tiny' }, "EDIT")))),
-                selectedBasketRows && selectedBasketRows.length ? (React.createElement(React.Fragment, null,
+                    react_2.default.createElement("div", { className: "col-4 u-align-right" },
+                        react_2.default.createElement(react_router_dom_1.Link, { to: StepRoom_1.default.getStepUrl() },
+                            react_2.default.createElement(BEButton_1.default, { onClick: editOnClick, size: "tiny" }, "EDIT")))),
+                selectedBasketRows && selectedBasketRows.length ? (react_2.default.createElement(react_2.default.Fragment, null,
                     selectedBasketRows.map((row, index) => {
                         if (!row.isValid())
                             return;
-                        return (React.createElement(BESummaryRoomRow_1.default, { row: row, index: index, key: row.getID(), showImages: props.showImages, onEditPropertyClicked: onEditPropertyClickedHandler }));
+                        return (react_2.default.createElement(BESummaryRoomRow_1.default, { row: row, index: index, key: row.getID(), showImages: !!props.showImages, onEditPropertyClicked: onEditPropertyClickedHandler }));
                     }),
-                    addons.length > 0 && (React.createElement(React.Fragment, null,
-                        React.createElement(LineBreak_1.default, { noMargins: true, darker: true }),
-                        React.createElement("div", { className: "u-marg-top" },
-                            React.createElement(Text_1.default, { type: Text_1.TextType.Label, color: Color_1.Color.DarkGrey },
-                                React.createElement("strong", null, "Add-on Items"))),
+                    addons.length > 0 && (react_2.default.createElement(react_2.default.Fragment, null,
+                        react_2.default.createElement(LineBreak_1.default, { noMargins: true, darker: true }),
+                        react_2.default.createElement("div", { className: "u-marg-top" },
+                            react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Label, color: Color_1.Color.DarkGrey },
+                                react_2.default.createElement("strong", null, "Add-on Items"))),
                         addons.map((row, index) => {
                             const onRemoveClickHandler = () => {
                                 return basketContext.removeBasketAddonRow(row);
                             };
-                            return React.createElement(BESummaryAddonRow_1.default, { row: row, key: row.getID(), onRemoveClick: onRemoveClickHandler });
-                        }))))) : (React.createElement("div", { className: "u-marg-bottom--heavy u-marg-top--heavy" },
-                    React.createElement("div", { className: "u-marg-bottom--heavy" },
-                        React.createElement(Text_1.default, { type: Text_1.TextType.Body }, t(Translation_1.Translation.Step.General.YourCartIsEmpty))),
-                    React.createElement("div", { style: { height: '150px', position: 'relative' } },
-                        React.createElement(HotelLocationMap_1.default, null)),
-                    React.createElement("div", { className: "u-marg-top" },
-                        React.createElement("div", { className: "u-marg-bottom" },
-                            React.createElement(Text_1.default, { bold: true }, hotel.name)),
+                            return react_2.default.createElement(BESummaryAddonRow_1.default, { row: row, key: row.getID(), onRemoveClick: onRemoveClickHandler });
+                        }))))) : (react_2.default.createElement("div", { className: "u-marg-bottom--heavy u-marg-top--heavy" },
+                    react_2.default.createElement("div", { className: "u-marg-bottom--heavy" },
+                        react_2.default.createElement(Text_1.default, { type: Text_1.TextType.Body }, t(Translation_1.Translation.Step.General.YourCartIsEmpty))),
+                    react_2.default.createElement("div", { style: { height: '150px', position: 'relative' } },
+                        react_2.default.createElement(HotelLocationMap_1.default, null)),
+                    react_2.default.createElement("div", { className: "u-marg-top" },
+                        react_2.default.createElement("div", { className: "u-marg-bottom" },
+                            react_2.default.createElement(Text_1.default, { bold: true }, hotel === null || hotel === void 0 ? void 0 : hotel.name)),
                         getAddressString(addressLine1),
                         getAddressString(addressLine2)))),
                 sortedComponents,
-                React.createElement("div", { className: "u-marg-top--heavy u-marg-bottom--heavy" },
-                    React.createElement(BESummaryPrivacyPolicy_1.default, null))))));
+                react_2.default.createElement("div", { className: "u-marg-top--heavy u-marg-bottom--heavy" },
+                    react_2.default.createElement(BESummaryPrivacyPolicy_1.default, null))))));
 }
 exports.default = BEMobileSummaryModal;
 //# sourceMappingURL=BEMobileSummaryModal.js.map

package/dist/src/components/summary/BEMobileSummaryModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"BEMobileSummaryModal.js","sourceRoot":"/","sources":["src/components/summary/BEMobileSummaryModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import SimpleModal from '@/components/generic/modal/SimpleModal';\nimport { useTranslation } from 'react-i18next';\nimport { useContext, useEffect, useState } from 'react';\nimport { Translation } from 'translations/Translation';\nimport * as React from 'react';\n\nimport LineBreak from '@/components/generic/LineBreak';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Headline from '@/components/generic/Headline';\nimport { TextAlign } from '@/util/TextAlignment';\nimport Currency from '@/components/generic/Currency';\nimport BasketAddonRow from '@/models/BasketAddonRow';\nimport BasketRow from '@/models/BasketRow';\nimport HotelLocationMap from '@/components/generic/map/HotelLocationMap';\nimport BESummaryRoomRow from '@/components/summary/BESummaryRoomRow';\nimport BESummaryAddonRow from '@/components/summary/BESummaryAddonRow';\nimport { BESummaryPerkBlock } from '@/components/summary/BESummaryPerkBlock';\nimport TransportDistanceFromHotelBlock from '@/components/summary/TransportDistanceFromHotelBlock';\nimport BESummaryPrivacyPolicy from '@/components/summary/BESummaryPrivacyPolicy';\nimport { BasketContext } from '@frontend/contexts';\nimport StringHelper from '@/util/StringHelper';\nimport BEButton from '@/components/generic/BEButton';\nimport { Link } from 'react-router-dom';\nimport StepRoom from '@/pages/steps/StepRoom/StepRoom';\nimport { BESummaryLayoutOrder } from '@/components/summary/BESummary';\nimport { OrderableReactList, useElementSort, useCurrentHotel } from '@frontend/hooks';\n\nexport interface BEMobileSummaryModalProps {\n    isOpen?: boolean;\n    onClose?: () => void;\n    showImages?: boolean;\n}\n\nexport default function BEMobileSummaryModal(props: BEMobileSummaryModalProps) {\n    const basketContext = useContext(BasketContext);\n    const { hotel } = useCurrentHotel();\n\n    const selectedBasketRows = basketContext.getAllValidRows();\n\n    const addons = basketContext.basketAddonRows;\n\n    const { t } = useTranslation();\n\n    const [mobileLayout, setMobileLayout] = useState<OrderableReactList>({});\n\n    useEffect(() => {\n        // We do this hacky thing since Mobile summary & Desktop summary are almost identical, just blocks are presented differently\n        const newLayout: typeof BESummaryLayoutOrder = { ...BESummaryLayoutOrder };\n        newLayout.TransportDistanceBlock.component = (\n            <div className=\"u-flex justify-content-center u-marg-top u-marg-bottom\">\n                <div className=\"col-10 u-flex flex-row\">\n                    <TransportDistanceFromHotelBlock vertical={true} hotel={hotel} />\n                </div>\n            </div>\n        );\n        newLayout.PerksBlock.component = <BESummaryPerkBlock size=\"mobile\" />;\n\n        setMobileLayout(newLayout);\n    }, []);\n\n    const { sortedComponents } = useElementSort(mobileLayout);\n\n    const totalDays = basketContext.endDate ? basketContext.endDate.diff(basketContext.startDate, 'day') : 0;\n\n    const addressLine1 = [hotel?.address?.line1, hotel?.address?.city];\n    const addressLine2 = [hotel?.address?.postalCode, hotel?.address?.state];\n\n    const getAddressString = (val: string[]) => {\n        const line = val.filter((it) => !!it && it !== '0').join(', ');\n\n        if (line) {\n            return <Text type={TextType.Small}>{line}</Text>;\n        }\n\n        return null;\n    };\n\n    const onCloseModalHandler = () => {\n        return props.onClose ? props.onClose() : null;\n    };\n\n    const editOnClick = () => {\n        props.onClose();\n    };\n\n    const onEditPropertyClickedHandler = () => {\n        props.onClose();\n    };\n\n    return (\n        <SimpleModal\n            open={props.isOpen}\n            title={t(Translation.Misc.Summary)}\n            onClose={onCloseModalHandler}\n            mobileFooter={\n                <div className=\"row align-items-center\">\n                    <div className=\"col-4\">\n                        <Text type={TextType.Body}>{t(Translation.Misc.Total)}</Text>\n                        <Text type={TextType.Small} color={Color.Accent}>\n                            <strong>{StringHelper.pluralWithDictAndCount(totalDays, Translation.Misc.Night, t)}</strong>\n                        </Text>\n                    </div>\n                    <div className=\"col-8 u-flex u-flex-direction-column align-items-end\">\n                        <Headline bold={true} size={'normal'} align={TextAlign.Right}>\n                            <Currency>{basketContext.getTotalPrice()}</Currency>\n                        </Headline>\n                        <Text color={Color.DarkGrey} type={TextType.Small} align={TextAlign.Right}>\n                            <span className=\"u-nowrap\">{t(Translation.Step.Room.RoomInfo.IncludesTaxes)}</span>\n                        </Text>\n                    </div>\n                </div>\n            }\n        >\n            <>\n                <div className=\"container\">\n                    <div className=\"row u-border-bottom u-pad-top-bottom\">\n                        <div className=\"col-6\">\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckIn)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                {t(Translation.Misc.After)} {hotel?.checkInTime}\n                            </Text>\n                        </div>\n                        <div className=\"col-6\">\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckOut)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                {t(Translation.Misc.Before)} {hotel?.checkOutTime}\n                            </Text>\n                        </div>\n                    </div>\n\n                    <div className=\"row u-border-bottom u-pad-top-bottom\">\n                        <div className=\"col-8\">\n                            <div className=\"u-flex u-flex-flex-start\">\n                                <Text type={TextType.Small}>\n                                    <span {...(basketContext.startDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                        {basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation.Step.Date.Arrival)}\n                                    </span>\n                                </Text>\n                                <span className=\"u-marg-left-right--light\">\n                                    <Icon icon={IconType.ArrowRight2} size={'18px'} color={Color.DarkGrey} />\n                                </span>\n                                <Text type={TextType.Small}>\n                                    <span {...(basketContext.endDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                        {basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation.Step.Date.Departure)}\n                                    </span>\n                                </Text>\n                            </div>\n                            <Text type={TextType.Small}>\n                                {basketContext.getNumberOfAdults(true)},&nbsp;\n                                {basketContext.getNumberOfChildren(true)},&nbsp;\n                                {basketContext.getNumberOfRooms(true)}\n                            </Text>\n                        </div>\n                        <div className=\"col-4 u-align-right\">\n                            <Link to={StepRoom.getStepUrl()}>\n                                <BEButton onClick={editOnClick} size={'tiny'}>\n                                    EDIT\n                                </BEButton>\n                            </Link>\n                        </div>\n                    </div>\n\n                    {selectedBasketRows && selectedBasketRows.length ? (\n                        <>\n                            {selectedBasketRows.map((row: BasketRow, index: number) => {\n                                if (!row.isValid()) return;\n\n                                return (\n                                    <BESummaryRoomRow\n                                        row={row}\n                                        index={index}\n                                        key={row.getID()}\n                                        showImages={props.showImages}\n                                        onEditPropertyClicked={onEditPropertyClickedHandler}\n                                    />\n                                );\n                            })}\n\n                            {addons.length > 0 && (\n                                <>\n                                    <LineBreak noMargins={true} darker={true} />\n\n                                    <div className=\"u-marg-top\">\n                                        <Text type={TextType.Label} color={Color.DarkGrey}>\n                                            <strong>Add-on Items</strong>\n                                        </Text>\n                                    </div>\n\n                                    {addons.map((row: BasketAddonRow, index: number) => {\n                                        const onRemoveClickHandler = () => {\n                                            return basketContext.removeBasketAddonRow(row);\n                                        };\n\n                                        return <BESummaryAddonRow row={row} key={row.getID()} onRemoveClick={onRemoveClickHandler} />;\n                                    })}\n                                </>\n                            )}\n                        </>\n                    ) : (\n                        <div className=\"u-marg-bottom--heavy u-marg-top--heavy\">\n                            <div className=\"u-marg-bottom--heavy\">\n                                <Text type={TextType.Body}>{t(Translation.Step.General.YourCartIsEmpty)}</Text>\n                            </div>\n                            <div style={{ height: '150px', position: 'relative' }}>\n                                <HotelLocationMap />\n                            </div>\n                            <div className=\"u-marg-top\">\n                                <div className=\"u-marg-bottom\">\n                                    <Text bold={true}>{hotel.name}</Text>\n                                </div>\n                                {getAddressString(addressLine1)}\n                                {getAddressString(addressLine2)}\n                            </div>\n                        </div>\n                    )}\n\n                    {sortedComponents}\n\n                    <div className=\"u-marg-top--heavy u-marg-bottom--heavy\">\n                        <BESummaryPrivacyPolicy />\n                    </div>\n                </div>\n            </>\n        </SimpleModal>\n    );\n}\n"]}
+{"version":3,"file":"BEMobileSummaryModal.js","sourceRoot":"/","sources":["src/components/summary/BEMobileSummaryModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import SimpleModal from '@/components/generic/modal/SimpleModal';\nimport { useTranslation } from 'react-i18next';\nimport { useContext, useEffect, useState } from 'react';\nimport { Translation } from 'translations/Translation';\nimport React from 'react';\n\nimport LineBreak from '@/components/generic/LineBreak';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport { Color } from '@/util/Color';\nimport Text, { TextType } from '@/components/generic/Text';\nimport Headline from '@/components/generic/Headline';\nimport { TextAlign } from '@/util/TextAlignment';\nimport Currency from '@/components/generic/Currency';\nimport BasketAddonRow from '@/models/BasketAddonRow';\nimport BasketRow from '@/models/BasketRow';\nimport HotelLocationMap from '@/components/generic/map/HotelLocationMap';\nimport BESummaryRoomRow from '@/components/summary/BESummaryRoomRow';\nimport BESummaryAddonRow from '@/components/summary/BESummaryAddonRow';\nimport { BESummaryPerkBlock } from '@/components/summary/BESummaryPerkBlock';\nimport TransportDistanceFromHotelBlock from '@/components/summary/TransportDistanceFromHotelBlock';\nimport BESummaryPrivacyPolicy from '@/components/summary/BESummaryPrivacyPolicy';\nimport { BasketContext } from '@frontend/contexts';\nimport StringHelper from '@/util/StringHelper';\nimport BEButton from '@/components/generic/BEButton';\nimport { Link } from 'react-router-dom';\nimport StepRoom from '@/pages/steps/StepRoom/StepRoom';\nimport { BESummaryLayoutOrder } from '@/components/summary/BESummary';\nimport { OrderableReactList, useElementSort, useCurrentHotel } from '@frontend/hooks';\n\nexport interface BEMobileSummaryModalProps {\n    isOpen?: boolean;\n    onClose?: () => void;\n    showImages?: boolean;\n}\n\nexport default function BEMobileSummaryModal(props: BEMobileSummaryModalProps) {\n    const basketContext = useContext(BasketContext);\n    const { hotel } = useCurrentHotel();\n\n    const selectedBasketRows = basketContext.getAllValidRows();\n\n    const addons = basketContext.basketAddonRows;\n\n    const { t } = useTranslation();\n\n    const [mobileLayout, setMobileLayout] = useState<OrderableReactList>({});\n\n    useEffect(() => {\n        // We do this hacky thing since Mobile summary & Desktop summary are almost identical, just blocks are presented differently\n        const newLayout: typeof BESummaryLayoutOrder = { ...BESummaryLayoutOrder };\n        newLayout.TransportDistanceBlock.component = (\n            <div className=\"u-flex justify-content-center u-marg-top u-marg-bottom\">\n                <div className=\"col-10 u-flex flex-row\">\n                    <TransportDistanceFromHotelBlock vertical hotel={hotel} />\n                </div>\n            </div>\n        );\n        newLayout.PerksBlock.component = <BESummaryPerkBlock size=\"mobile\" />;\n\n        setMobileLayout(newLayout);\n    }, []);\n\n    const { sortedComponents } = useElementSort(mobileLayout);\n\n    const totalDays = basketContext.endDate ? basketContext.endDate.diff(basketContext.startDate, 'day') : 0;\n\n    const addressLine1 = [hotel?.address?.line1, hotel?.address?.city];\n    const addressLine2 = [hotel?.address?.postalCode, hotel?.address?.state];\n\n    const getAddressString = (val: string[]) => {\n        const line = val.filter((it) => !!it && it !== '0').join(', ');\n\n        if (line) {\n            return <Text type={TextType.Small}>{line}</Text>;\n        }\n\n        return null;\n    };\n\n    const onCloseModalHandler = () => {\n        return props.onClose ? props.onClose() : null;\n    };\n\n    const editOnClick = () => {\n        props.onClose?.();\n    };\n\n    const onEditPropertyClickedHandler = () => {\n        props.onClose?.();\n    };\n\n    return (\n        <SimpleModal\n            open={props.isOpen}\n            title={t(Translation.Misc.Summary)}\n            onClose={onCloseModalHandler}\n            mobileFooter={\n                <div className=\"row align-items-center\">\n                    <div className=\"col-4\">\n                        <Text type={TextType.Body}>{t(Translation.Misc.Total)}</Text>\n                        <Text type={TextType.Small} color={Color.Accent}>\n                            <strong>{StringHelper.pluralWithDictAndCount(totalDays, Translation.Misc.Night, t)}</strong>\n                        </Text>\n                    </div>\n                    <div className=\"col-8 u-flex u-flex-direction-column align-items-end\">\n                        <Headline bold size=\"normal\" align={TextAlign.Right}>\n                            <Currency>{basketContext.getTotalPrice()}</Currency>\n                        </Headline>\n                        <Text color={Color.DarkGrey} type={TextType.Small} align={TextAlign.Right}>\n                            <span className=\"u-nowrap\">{t(Translation.Step.Room.RoomInfo.IncludesTaxes)}</span>\n                        </Text>\n                    </div>\n                </div>\n            }\n        >\n            <>\n                <div className=\"container\">\n                    <div className=\"row u-border-bottom u-pad-top-bottom\">\n                        <div className=\"col-6\">\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckIn)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                {t(Translation.Misc.After)} {hotel?.checkInTime}\n                            </Text>\n                        </div>\n                        <div className=\"col-6\">\n                            <Text type={TextType.Small} color={Color.Grey}>\n                                <strong>{t(Translation.Misc.CheckOut)}</strong>\n                            </Text>\n                            <Text type={TextType.Small}>\n                                {t(Translation.Misc.Before)} {hotel?.checkOutTime}\n                            </Text>\n                        </div>\n                    </div>\n\n                    <div className=\"row u-border-bottom u-pad-top-bottom\">\n                        <div className=\"col-8\">\n                            <div className=\"u-flex u-flex-flex-start\">\n                                <Text type={TextType.Small}>\n                                    <span {...(basketContext.startDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                        {basketContext.startDate ? basketContext.startDate.format('ddd, MMM D') : t(Translation.Step.Date.Arrival)}\n                                    </span>\n                                </Text>\n                                <span className=\"u-marg-left-right--light\">\n                                    <Icon icon={IconType.ArrowRight2} size=\"18px\" color={Color.DarkGrey} />\n                                </span>\n                                <Text type={TextType.Small}>\n                                    <span {...(basketContext.endDate ? { style: { color: Color.Accent, fontWeight: 'bold' } } : {})}>\n                                        {basketContext.endDate ? basketContext.endDate.format('ddd, MMM D') : t(Translation.Step.Date.Departure)}\n                                    </span>\n                                </Text>\n                            </div>\n                            <Text type={TextType.Small}>\n                                {basketContext.getNumberOfAdults(true)},&nbsp;\n                                {basketContext.getNumberOfChildren(true)},&nbsp;\n                                {basketContext.getNumberOfRooms(true)}\n                            </Text>\n                        </div>\n                        <div className=\"col-4 u-align-right\">\n                            <Link to={StepRoom.getStepUrl()}>\n                                <BEButton onClick={editOnClick} size=\"tiny\">\n                                    EDIT\n                                </BEButton>\n                            </Link>\n                        </div>\n                    </div>\n\n                    {selectedBasketRows && selectedBasketRows.length ? (\n                        <>\n                            {selectedBasketRows.map((row: BasketRow, index: number) => {\n                                if (!row.isValid()) return;\n\n                                return (\n                                    <BESummaryRoomRow\n                                        row={row}\n                                        index={index}\n                                        key={row.getID()}\n                                        showImages={!!props.showImages}\n                                        onEditPropertyClicked={onEditPropertyClickedHandler}\n                                    />\n                                );\n                            })}\n\n                            {addons.length > 0 && (\n                                <>\n                                    <LineBreak noMargins darker />\n\n                                    <div className=\"u-marg-top\">\n                                        <Text type={TextType.Label} color={Color.DarkGrey}>\n                                            <strong>Add-on Items</strong>\n                                        </Text>\n                                    </div>\n\n                                    {addons.map((row: BasketAddonRow, index: number) => {\n                                        const onRemoveClickHandler = () => {\n                                            return basketContext.removeBasketAddonRow(row);\n                                        };\n\n                                        return <BESummaryAddonRow row={row} key={row.getID()} onRemoveClick={onRemoveClickHandler} />;\n                                    })}\n                                </>\n                            )}\n                        </>\n                    ) : (\n                        <div className=\"u-marg-bottom--heavy u-marg-top--heavy\">\n                            <div className=\"u-marg-bottom--heavy\">\n                                <Text type={TextType.Body}>{t(Translation.Step.General.YourCartIsEmpty)}</Text>\n                            </div>\n                            <div style={{ height: '150px', position: 'relative' }}>\n                                <HotelLocationMap />\n                            </div>\n                            <div className=\"u-marg-top\">\n                                <div className=\"u-marg-bottom\">\n                                    <Text bold>{hotel?.name}</Text>\n                                </div>\n                                {getAddressString(addressLine1 as string[])}\n                                {getAddressString(addressLine2 as string[])}\n                            </div>\n                        </div>\n                    )}\n\n                    {sortedComponents}\n\n                    <div className=\"u-marg-top--heavy u-marg-bottom--heavy\">\n                        <BESummaryPrivacyPolicy />\n                    </div>\n                </div>\n            </>\n        </SimpleModal>\n    );\n}\n"]}

package/dist/src/components/summary/BESummary.js

@@ -27,8 +27,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BESummary = exports.BESummaryLayoutOrder = void 0;
-const React = __importStar(require("react"));
-const react_1 = require("react");
+const react_1 = __importDefault(require("react"));
+const react_2 = require("react");
 const Headline_1 = __importDefault(require("../generic/Headline"));
 const Text_1 = __importStar(require("../generic/Text"));
 const Color_1 = require("../../util/Color");
@@ -48,28 +48,29 @@ const contexts_1 = require("../../contexts/index.js");
 const hooks_1 = require("../../hooks/index.js");
 const classnames_1 = __importDefault(require("classnames"));
 const TransportDistanceFromHotelBlockContainer = () => {
-    const { transportDistances } = (0, react_1.useContext)(contexts_1.HotelOverridesContext);
-    return (React.createElement("div", { className: (0, classnames_1.default)('u-flex u-flex-column u-marg-top', {
-            'u-flex-justify-around': Object.entries(transportDistances !== null && transportDistances !== void 0 ? transportDistances : {}).filter(([key, value]) => !!value).length <= 2,
+    var _a;
+    const overridesContext = (0, react_2.useContext)(contexts_1.HotelOverridesContext);
+    return (react_1.default.createElement("div", { className: (0, classnames_1.default)('u-flex u-flex-column u-marg-top', {
+            'u-flex-justify-around': Object.entries((_a = overridesContext === null || overridesContext === void 0 ? void 0 : overridesContext.transportDistances) !== null && _a !== void 0 ? _a : {}).filter(([key, value]) => !!value).length <= 2,
         }) },
-        React.createElement(TransportDistanceFromHotelBlock_1.default, { vertical: true })));
+        react_1.default.createElement(TransportDistanceFromHotelBlock_1.default, { vertical: true })));
 };
 exports.BESummaryLayoutOrder = {
     TransportDistanceBlock: {
-        component: React.createElement(TransportDistanceFromHotelBlockContainer, null),
+        component: react_1.default.createElement(TransportDistanceFromHotelBlockContainer, null),
         priority: 5,
     },
     PerksBlock: {
-        component: (React.createElement("div", { className: "u-marg-bottom--light u-marg-top--heavy" },
-            React.createElement(BESummaryPerkBlock_1.BESummaryPerkBlock, { size: "desktop" }))),
+        component: (react_1.default.createElement("div", { className: "u-marg-bottom--light u-marg-top--heavy" },
+            react_1.default.createElement(BESummaryPerkBlock_1.BESummaryPerkBlock, { size: "desktop" }))),
         priority: 10,
     },
 };
 function BESummary(props) {
     var _a, _b, _c, _d;
-    const basketContext = (0, react_1.useContext)(contexts_1.BasketContext);
-    const ccx = (0, react_1.useContext)(contexts_1.CompanyContext);
-    const { phoneNumberInSummary } = (0, react_1.useContext)(contexts_1.HotelOverridesContext);
+    const basketContext = (0, react_2.useContext)(contexts_1.BasketContext);
+    const ccx = (0, react_2.useContext)(contexts_1.CompanyContext);
+    const overridesContext = (0, react_2.useContext)(contexts_1.HotelOverridesContext);
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const selectedBasketRows = basketContext.getAllValidRows();
     const addons = basketContext.basketAddonRows;
@@ -80,50 +81,50 @@ function BESummary(props) {
     const getAddressString = (val) => {
         const line = val.filter((it) => !!it && it !== '0').join(', ');
         if (line) {
-            return React.createElement(Text_1.default, { type: Text_1.TextType.Small }, line);
+            return react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, line);
         }
         return null;
     };
     const showBasketItems = selectedBasketRows && selectedBasketRows.length;
-    return (React.createElement("div", { className: "booking-engine-summary" },
-        React.createElement("div", { className: "u-marg-bottom" },
-            React.createElement(Headline_1.default, { bold: true }, t(Translation_1.Translation.Misc.Summary))),
-        showBasketItems ? (React.createElement(React.Fragment, null,
+    return (react_1.default.createElement("div", { className: "booking-engine-summary" },
+        react_1.default.createElement("div", { className: "u-marg-bottom" },
+            react_1.default.createElement(Headline_1.default, { bold: true }, t(Translation_1.Translation.Misc.Summary))),
+        showBasketItems ? (react_1.default.createElement(react_1.default.Fragment, null,
             selectedBasketRows.map((row, index) => {
                 if (!row.isValid())
                     return;
-                return React.createElement(BESummaryRoomRow_1.default, { key: row.getID(), row: row, index: index, showImages: props.showImages });
+                return react_1.default.createElement(BESummaryRoomRow_1.default, { key: row.getID(), row: row, index: index, showImages: !!props.showImages });
             }),
-            addons.length > 0 && (React.createElement(React.Fragment, null,
-                React.createElement(LineBreak_1.default, { noMargins: true, darker: true }),
-                React.createElement("div", { className: "u-marg-top" },
-                    React.createElement(Text_1.default, { type: Text_1.TextType.Label, color: Color_1.Color.DarkGrey },
-                        React.createElement("strong", null, "Add-on Items"))),
+            addons.length > 0 && (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(LineBreak_1.default, { noMargins: true, darker: true }),
+                react_1.default.createElement("div", { className: "u-marg-top" },
+                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Label, color: Color_1.Color.DarkGrey },
+                        react_1.default.createElement("strong", null, "Add-on Items"))),
                 addons.map((row) => {
                     const onRemoveClickHandler = () => {
                         return basketContext.removeBasketAddonRow(row);
                     };
-                    return React.createElement(BESummaryAddonRow_1.default, { row: row, key: row.getID(), onRemoveClick: onRemoveClickHandler });
-                }))))) : (React.createElement("div", { className: "u-marg-bottom" },
-            React.createElement("div", { className: "u-marg-bottom" },
-                React.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.General.YourCartIsEmpty))),
-            React.createElement("div", { style: { height: '150px', position: 'relative' } },
-                React.createElement(HotelLocationMap_1.default, null)),
-            React.createElement("div", { className: "u-marg-top" },
-                React.createElement("div", { className: "u-marg-bottom" },
-                    React.createElement(Text_1.default, { bold: true }, hotel === null || hotel === void 0 ? void 0 : hotel.name)),
+                    return react_1.default.createElement(BESummaryAddonRow_1.default, { row: row, key: row.getID(), onRemoveClick: onRemoveClickHandler });
+                }))))) : (react_1.default.createElement("div", { className: "u-marg-bottom" },
+            react_1.default.createElement("div", { className: "u-marg-bottom" },
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.General.YourCartIsEmpty))),
+            react_1.default.createElement("div", { style: { height: '150px', position: 'relative' } },
+                react_1.default.createElement(HotelLocationMap_1.default, null)),
+            react_1.default.createElement("div", { className: "u-marg-top" },
+                react_1.default.createElement("div", { className: "u-marg-bottom" },
+                    react_1.default.createElement(Text_1.default, { bold: true }, hotel === null || hotel === void 0 ? void 0 : hotel.name)),
                 getAddressString(addressLine1),
                 getAddressString(addressLine2),
-                phoneNumberInSummary && (hotel === null || hotel === void 0 ? void 0 : hotel.phone) && React.createElement(Text_1.default, { type: Text_1.TextType.Small }, hotel === null || hotel === void 0 ? void 0 : hotel.phone)))),
+                (overridesContext === null || overridesContext === void 0 ? void 0 : overridesContext.phoneNumberInSummary) && (hotel === null || hotel === void 0 ? void 0 : hotel.phone) && react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, hotel === null || hotel === void 0 ? void 0 : hotel.phone)))),
         sortedComponents,
-        ccx.currentCurrency !== (hotel === null || hotel === void 0 ? void 0 : hotel.defaultCurrency) && (React.createElement(Alert_1.default, { iconAlignCenter: true, icon: Icon_1.IconType.Money, type: Alert_1.AlertType.LightGray },
-            React.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.General.AlternateCurrencyInformation)))),
-        React.createElement(LineBreak_1.default, { darker: true }),
-        React.createElement("div", { className: "u-marg-top--light" },
-            React.createElement(Text_1.default, { type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right }, t(Translation_1.Translation.Misc.Total)),
-            React.createElement(Headline_1.default, { bold: true, size: 'large', align: TextAlignment_1.TextAlign.Right },
-                React.createElement(Currency_1.default, null, basketContext.getTotalPrice())),
-            React.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right }, t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes)))));
+        ccx.currentCurrency !== (hotel === null || hotel === void 0 ? void 0 : hotel.defaultCurrency) && (react_1.default.createElement(Alert_1.default, { iconAlignCenter: true, icon: Icon_1.IconType.Money, type: Alert_1.AlertType.LightGray },
+            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small }, t(Translation_1.Translation.Step.General.AlternateCurrencyInformation)))),
+        react_1.default.createElement(LineBreak_1.default, { darker: true }),
+        react_1.default.createElement("div", { className: "u-marg-top--light" },
+            react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right }, t(Translation_1.Translation.Misc.Total)),
+            react_1.default.createElement(Headline_1.default, { bold: true, size: "large", align: TextAlignment_1.TextAlign.Right },
+                react_1.default.createElement(Currency_1.default, null, basketContext.getTotalPrice())),
+            react_1.default.createElement(Text_1.default, { color: Color_1.Color.DarkGrey, type: Text_1.TextType.Small, align: TextAlignment_1.TextAlign.Right }, t(Translation_1.Translation.Step.Room.RoomInfo.IncludesTaxes)))));
 }
 exports.BESummary = BESummary;
 //# sourceMappingURL=BESummary.js.map