npm - @roomstay/frontend - Versions diffs - 2.6.40 → 2.6.41 - Mend

@roomstay/frontend 2.6.40 → 2.6.41

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.

Files changed (9) hide show

package/dist/src/components/steps/date/PeoplePickerRow.js CHANGED Viewed

@@ -39,16 +39,11 @@ const Text_1 = __importStar(require("../../generic/Text"));
 const useSearchScopeHook_1 = require("../../../hooks/useSearchScopeHook");
 const Color_1 = require("../../../util/Color");
 function PeoplePickerRow(pickerProps) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const { t } = (0, react_i18next_1.useTranslation)();
     const { adults, children, infants, roomCode } = pickerProps.details;
     const { hotel } = (0, hooks_1.useCurrentHotel)();
     const [animatedIn, setAnimation] = (0, react_1.useState)(false);
-    const transition = (0, web_1.useTransition)(animatedIn, {
-        from: { opacity: 0 },
-        enter: { opacity: 1 },
-        leave: { opacity: 0 },
-    });
     const firstUpdate = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
         setAnimation(true);
@@ -81,62 +76,54 @@ function PeoplePickerRow(pickerProps) {
     const maxChildren = getMaxSelectableChildren({ adults });
     const maxInfants = getMaxSelectableInfants();
     const roomName = ((_b = (_a = hotel === null || hotel === void 0 ? void 0 : hotel.rooms) === null || _a === void 0 ? void 0 : _a[roomCode]) === null || _b === void 0 ? void 0 : _b.name) || '';
-    const totalHeight = (0, react_1.useMemo)(() => {
-        var _a;
-        // Default: Line break + Adult row
-        const itemHeight = 48;
-        let height = 64 + 32;
-        // Room number
-        if (pickerProps.number) {
-            height += 34;
-        }
-        // Children row
-        if (showChildren) {
-            height += itemHeight;
-        }
-        // Infant row
-        if ((_a = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _a === void 0 ? void 0 : _a.supportInfants) {
-            height += itemHeight;
-        }
-        // Specific room
-        if (roomName) {
-            height += itemHeight;
+    const containerRef = (0, react_1.useRef)(null);
+    const [containerHeight, setContainerHeight] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
+        const resizeObserver = new ResizeObserver((entries) => {
+            for (const entry of entries) {
+                setContainerHeight(entry.contentRect.height);
+            }
+        });
+        if (containerRef.current) {
+            resizeObserver.observe(containerRef.current);
         }
-        return height;
-    }, [showChildren, pickerProps.number, (_c = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _c === void 0 ? void 0 : _c.supportInfants, roomName, roomCode]);
-    const [heightProps] = (0, web_1.useSpring)(() => ({
-        height: animatedIn ? totalHeight : 0,
-    }), [totalHeight, animatedIn]);
-    return (react_1.default.createElement(react_1.default.Fragment, null, transition((props, item) => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-        return item && (react_1.default.createElement(web_1.animated.div, { ref: firstUpdate, style: Object.assign(Object.assign({}, props), heightProps) },
-            react_1.default.createElement("div", { className: "people-picker--item" },
-                pickerProps.number > 0 && (react_1.default.createElement("div", { className: "people-picker--item-row" },
-                    react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey },
-                        react_1.default.createElement("strong", null,
-                            t(Translation_1.Translation.Misc.Room),
-                            "\u00A0",
-                            pickerProps.number + 1)),
-                    react_1.default.createElement("div", { className: "people-picker--item-remove", onClick: onClose },
-                        react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Close, color: Color_1.Color.Grey })))),
-                roomName && (react_1.default.createElement("div", { className: "people-picker--item-row" },
-                    react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Room)),
-                    react_1.default.createElement(Text_1.default, { className: "room-name" }, roomName))),
+        return () => {
+            if (containerRef.current) {
+                resizeObserver.unobserve(containerRef.current);
+            }
+        };
+    }, [containerRef.current]);
+    const heightProps = (0, web_1.useSpring)({
+        height: containerHeight + 33,
+        opacity: animatedIn ? 1 : 0,
+    });
+    return (react_1.default.createElement(web_1.animated.div, { ref: firstUpdate, style: heightProps },
+        react_1.default.createElement("div", { className: "people-picker--item", ref: containerRef },
+            pickerProps.number > 0 && (react_1.default.createElement("div", { className: "people-picker--item-row" },
+                react_1.default.createElement(Text_1.default, { type: Text_1.TextType.Small, color: Color_1.Color.DarkGrey },
+                    react_1.default.createElement("strong", null,
+                        t(Translation_1.Translation.Misc.Room),
+                        "\u00A0",
+                        pickerProps.number + 1)),
+                react_1.default.createElement("div", { className: "people-picker--item-remove", onClick: onClose },
+                    react_1.default.createElement(Icon_1.default, { icon: Icon_1.IconType.Close, color: Color_1.Color.Grey })))),
+            roomName && (react_1.default.createElement("div", { className: "people-picker--item-row" },
+                react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Room)),
+                react_1.default.createElement(Text_1.default, { className: "room-name" }, roomName))),
+            react_1.default.createElement("div", { className: "people-picker--item-row" },
+                react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Adult_plural)),
+                react_1.default.createElement(NumberIncrement_1.default, { number: adults, min: 1, max: maxAdults, onChange: adultsChangeHandler })),
+            showChildren ? (react_1.default.createElement("div", null,
+                react_1.default.createElement("div", { className: "people-picker--item-row" },
+                    react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Child_plural)),
+                    react_1.default.createElement(NumberIncrement_1.default, { number: children, min: 0, max: maxChildren, onChange: childrenChangeHandler })),
+                react_1.default.createElement(AgedBetweenLabel_1.AgedBetweenLabel, { min: (_d = (_c = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _c === void 0 ? void 0 : _c.childRange) === null || _d === void 0 ? void 0 : _d.min, max: (_f = (_e = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _e === void 0 ? void 0 : _e.childRange) === null || _f === void 0 ? void 0 : _f.max }))) : null,
+            ((_g = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _g === void 0 ? void 0 : _g.supportInfants) ? (react_1.default.createElement("div", null,
                 react_1.default.createElement("div", { className: "people-picker--item-row" },
-                    react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Adult_plural)),
-                    react_1.default.createElement(NumberIncrement_1.default, { number: adults, min: 1, max: maxAdults, onChange: adultsChangeHandler })),
-                showChildren ? (react_1.default.createElement("div", null,
-                    react_1.default.createElement("div", { className: "people-picker--item-row" },
-                        react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Child_plural)),
-                        react_1.default.createElement(NumberIncrement_1.default, { number: children, min: 0, max: maxChildren, onChange: childrenChangeHandler })),
-                    react_1.default.createElement(AgedBetweenLabel_1.AgedBetweenLabel, { min: (_b = (_a = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _a === void 0 ? void 0 : _a.childRange) === null || _b === void 0 ? void 0 : _b.min, max: (_d = (_c = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _c === void 0 ? void 0 : _c.childRange) === null || _d === void 0 ? void 0 : _d.max }))) : null,
-                ((_e = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _e === void 0 ? void 0 : _e.supportInfants) ? (react_1.default.createElement("div", null,
-                    react_1.default.createElement("div", { className: "people-picker--item-row" },
-                        react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Infant_plural)),
-                        react_1.default.createElement(NumberIncrement_1.default, { number: infants, min: 0, max: maxInfants, onChange: infantChangeHandler })),
-                    react_1.default.createElement(AgedBetweenLabel_1.AgedBetweenLabel, { min: (_g = (_f = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _f === void 0 ? void 0 : _f.infantRange) === null || _g === void 0 ? void 0 : _g.min, max: (_j = (_h = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _h === void 0 ? void 0 : _h.infantRange) === null || _j === void 0 ? void 0 : _j.max }))) : null),
-            react_1.default.createElement(LineBreak_1.default, null)));
-    })));
+                    react_1.default.createElement(Text_1.default, null, t(Translation_1.Translation.Step.Date.Infant_plural)),
+                    react_1.default.createElement(NumberIncrement_1.default, { number: infants, min: 0, max: maxInfants, onChange: infantChangeHandler })),
+                react_1.default.createElement(AgedBetweenLabel_1.AgedBetweenLabel, { min: (_j = (_h = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _h === void 0 ? void 0 : _h.infantRange) === null || _j === void 0 ? void 0 : _j.min, max: (_l = (_k = hotel === null || hotel === void 0 ? void 0 : hotel.childConfiguration) === null || _k === void 0 ? void 0 : _k.infantRange) === null || _l === void 0 ? void 0 : _l.max }))) : null),
+        react_1.default.createElement(LineBreak_1.default, { smallMargins: true })));
 }
 exports.default = PeoplePickerRow;
 //# sourceMappingURL=PeoplePickerRow.js.map

package/dist/src/components/steps/date/PeoplePickerRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PeoplePickerRow.js","sourceRoot":"/","sources":["src/components/steps/date/PeoplePickerRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport { animated, useSpring, useTransition } from '@react-spring/web';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport { AgedBetweenLabel } from '@/components/generic/AgedBetweenLabel/AgedBetweenLabel';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport NumberIncrement from '@/components/generic/NumberIncrement';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useSearchScopeHook } from '@/hooks/useSearchScopeHook';\nimport { Color } from '@/util/Color';\n\nexport interface PeoplePickerDetails {\n adults: number;\n children: number;\n infants: number;\n promoCode: string;\n roomCode: string;\n}\n\nexport interface PeoplePickerRowProps {\n details: PeoplePickerDetails;\n\n number: number;\n onChange?: (details: PeoplePickerDetails) => void;\n onRemove?: () => void;\n}\n\nexport default function PeoplePickerRow(pickerProps: PeoplePickerRowProps) {\n const { t } = useTranslation();\n const { adults, children, infants, roomCode } = pickerProps.details;\n\n const { hotel } = useCurrentHotel();\n\n const [animatedIn, setAnimation] = useState(false);\n\n const transition = useTransition(animatedIn, {\n from: { opacity: 0 },\n enter: { opacity: 1 },\n leave: { opacity: 0 },\n });\n\n const firstUpdate = useRef<HTMLDivElement \| null>(null);\n\n useEffect(() => {\n setAnimation(true);\n }, []);\n\n const onInputChanged = (val: any) => {\n if (pickerProps.onChange) {\n pickerProps.onChange({\n ...pickerProps.details,\n ...val,\n });\n }\n };\n\n const onClose = () => {\n if (pickerProps.onRemove) {\n setAnimation(false);\n setTimeout(() => {\n pickerProps.onRemove?.();\n }, 500);\n }\n };\n const adultsChangeHandler = (val: any) => {\n onInputChanged({ adults: val });\n };\n const childrenChangeHandler = (val: any) => {\n onInputChanged({ children: val });\n };\n const infantChangeHandler = (val: any) => {\n onInputChanged({ infants: val });\n };\n\n const { getMaxSelectableAdults, showChildren, getMaxSelectableChildren, getMaxSelectableInfants } = useSearchScopeHook();\n const maxAdults = getMaxSelectableAdults({ adults, children });\n const maxChildren = getMaxSelectableChildren({ adults });\n const maxInfants = getMaxSelectableInfants();\n const roomName = hotel?.rooms?.[roomCode]?.name \|\| '';\n const totalHeight = useMemo(() => {\n // Default: Line break + Adult row\n const itemHeight = 48;\n let height = 64 + 32;\n\n // Room number\n if (pickerProps.number) {\n height += 34;\n }\n\n // Children row\n if (showChildren) {\n height += itemHeight;\n }\n\n // Infant row\n if (hotel?.childConfiguration?.supportInfants) {\n height += itemHeight;\n }\n // Specific room\n if (roomName) {\n height += itemHeight;\n }\n\n return height;\n }, [showChildren, pickerProps.number, hotel?.childConfiguration?.supportInfants, roomName, roomCode]);\n\n const [heightProps] = useSpring(\n () => ({\n height: animatedIn ? totalHeight : 0,\n }),\n [totalHeight, animatedIn]\n );\n\n return (\n <>\n {transition(\n (props, item) =>\n item && (\n <animated.div ref={firstUpdate} style={{ ...props, ...heightProps } as any}>\n <div className=\"people-picker--item\">\n {pickerProps.number > 0 && (\n <div className=\"people-picker--item-row\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n <strong>\n {t(Translation.Misc.Room)} {pickerProps.number + 1}\n </strong>\n </Text>\n <div className=\"people-picker--item-remove\" onClick={onClose}>\n <Icon icon={IconType.Close} color={Color.Grey} />\n </div>\n </div>\n )}\n {roomName && (\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Room)}</Text>\n <Text className=\"room-name\">{roomName}</Text>\n </div>\n )}\n\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Adult_plural)}</Text>\n <NumberIncrement number={adults} min={1} max={maxAdults} onChange={adultsChangeHandler} />\n </div>\n {showChildren ? (\n <div>\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Child_plural)}</Text>\n <NumberIncrement number={children} min={0} max={maxChildren} onChange={childrenChangeHandler} />\n </div>\n <AgedBetweenLabel min={hotel?.childConfiguration?.childRange?.min} max={hotel?.childConfiguration?.childRange?.max} />\n </div>\n ) : null}\n {hotel?.childConfiguration?.supportInfants ? (\n <div>\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Infant_plural)}</Text>\n <NumberIncrement number={infants} min={0} max={maxInfants} onChange={infantChangeHandler} />\n </div>\n <AgedBetweenLabel min={hotel?.childConfiguration?.infantRange?.min} max={hotel?.childConfiguration?.infantRange?.max} />\n </div>\n ) : null}\n </div>\n <LineBreak />\n </animated.div>\n )\n )}\n </>\n );\n}\n"]}
1	+ {"version":3,"file":"PeoplePickerRow.js","sourceRoot":"/","sources":["src/components/steps/date/PeoplePickerRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCurrentHotel } from '@frontend/hooks';\nimport { animated, useSpring } from '@react-spring/web';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport { AgedBetweenLabel } from '@/components/generic/AgedBetweenLabel/AgedBetweenLabel';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport LineBreak from '@/components/generic/LineBreak';\nimport NumberIncrement from '@/components/generic/NumberIncrement';\nimport Text, { TextType } from '@/components/generic/Text';\nimport { useSearchScopeHook } from '@/hooks/useSearchScopeHook';\nimport { Color } from '@/util/Color';\n\nexport interface PeoplePickerDetails {\n adults: number;\n children: number;\n infants: number;\n promoCode: string;\n roomCode: string;\n}\n\nexport interface PeoplePickerRowProps {\n details: PeoplePickerDetails;\n\n number: number;\n onChange?: (details: PeoplePickerDetails) => void;\n onRemove?: () => void;\n}\n\nexport default function PeoplePickerRow(pickerProps: PeoplePickerRowProps) {\n const { t } = useTranslation();\n const { adults, children, infants, roomCode } = pickerProps.details;\n\n const { hotel } = useCurrentHotel();\n\n const [animatedIn, setAnimation] = useState(false);\n\n const firstUpdate = useRef<HTMLDivElement \| null>(null);\n\n useEffect(() => {\n setAnimation(true);\n }, []);\n\n const onInputChanged = (val: any) => {\n if (pickerProps.onChange) {\n pickerProps.onChange({\n ...pickerProps.details,\n ...val,\n });\n }\n };\n\n const onClose = () => {\n if (pickerProps.onRemove) {\n setAnimation(false);\n setTimeout(() => {\n pickerProps.onRemove?.();\n }, 500);\n }\n };\n const adultsChangeHandler = (val: any) => {\n onInputChanged({ adults: val });\n };\n const childrenChangeHandler = (val: any) => {\n onInputChanged({ children: val });\n };\n const infantChangeHandler = (val: any) => {\n onInputChanged({ infants: val });\n };\n\n const { getMaxSelectableAdults, showChildren, getMaxSelectableChildren, getMaxSelectableInfants } = useSearchScopeHook();\n const maxAdults = getMaxSelectableAdults({ adults, children });\n const maxChildren = getMaxSelectableChildren({ adults });\n const maxInfants = getMaxSelectableInfants();\n const roomName = hotel?.rooms?.[roomCode]?.name \|\| '';\n\n const containerRef = useRef<HTMLDivElement>(null);\n const [containerHeight, setContainerHeight] = useState(0);\n\n useEffect(() => {\n const resizeObserver = new ResizeObserver((entries) => {\n for (const entry of entries) {\n setContainerHeight(entry.contentRect.height);\n }\n });\n\n if (containerRef.current) {\n resizeObserver.observe(containerRef.current);\n }\n\n return () => {\n if (containerRef.current) {\n resizeObserver.unobserve(containerRef.current);\n }\n };\n }, [containerRef.current]);\n\n const heightProps = useSpring({\n height: containerHeight + 33, // 33 is for <LineBreak>\n opacity: animatedIn ? 1 : 0,\n });\n\n return (\n <animated.div ref={firstUpdate} style={heightProps}>\n <div className=\"people-picker--item\" ref={containerRef}>\n {pickerProps.number > 0 && (\n <div className=\"people-picker--item-row\">\n <Text type={TextType.Small} color={Color.DarkGrey}>\n <strong>\n {t(Translation.Misc.Room)} {pickerProps.number + 1}\n </strong>\n </Text>\n <div className=\"people-picker--item-remove\" onClick={onClose}>\n <Icon icon={IconType.Close} color={Color.Grey} />\n </div>\n </div>\n )}\n {roomName && (\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Room)}</Text>\n <Text className=\"room-name\">{roomName}</Text>\n </div>\n )}\n\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Adult_plural)}</Text>\n <NumberIncrement number={adults} min={1} max={maxAdults} onChange={adultsChangeHandler} />\n </div>\n {showChildren ? (\n <div>\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Child_plural)}</Text>\n <NumberIncrement number={children} min={0} max={maxChildren} onChange={childrenChangeHandler} />\n </div>\n <AgedBetweenLabel min={hotel?.childConfiguration?.childRange?.min} max={hotel?.childConfiguration?.childRange?.max} />\n </div>\n ) : null}\n {hotel?.childConfiguration?.supportInfants ? (\n <div>\n <div className=\"people-picker--item-row\">\n <Text>{t(Translation.Step.Date.Infant_plural)}</Text>\n <NumberIncrement number={infants} min={0} max={maxInfants} onChange={infantChangeHandler} />\n </div>\n <AgedBetweenLabel min={hotel?.childConfiguration?.infantRange?.min} max={hotel?.childConfiguration?.infantRange?.max} />\n </div>\n ) : null}\n </div>\n <LineBreak smallMargins />\n </animated.div>\n );\n}\n"]}

package/dist/src/components/steps/room/roomDetails/roomRates/RoomRateDescriptionTab.js CHANGED Viewed

@@ -78,7 +78,8 @@ function RoomRateDescriptionTab(props) {
         react_1.default.createElement("div", null,
             react_1.default.createElement("div", { className: "u-marg-bottom--light" },
                 react_1.default.createElement(Headline_1.default, { bold: true }, props.rate.name)),
-            react_1.default.createElement("div", { className: "text-small u-pre-wrap u-clear-font-weight", dangerouslySetInnerHTML: { __html: (_a = props.rate.longDescription) !== null && _a !== void 0 ? _a : props.rate.description } }),
+            react_1.default.createElement("div", { className: "text-small u-clear-font-weight" },
+                react_1.default.createElement(HtmlContentViewer_1.HtmlContentViewer, { content: (_a = props.rate.longDescription) !== null && _a !== void 0 ? _a : props.rate.description })),
             react_1.default.createElement(LineBreak_1.default, null),
             react_1.default.createElement("div", { className: "u-marg-bottom--light" },
                 react_1.default.createElement(Text_1.default, null,

package/dist/src/components/steps/room/roomDetails/roomRates/RoomRateDescriptionTab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RoomRateDescriptionTab.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/roomRates/RoomRateDescriptionTab.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iDAAoD;AACpD,+CAA0C;AAC1C,iDAA+C;AAC/C,0DAAuD;AAEvD,6EAAqD;AACrD,6EAAqD;AACrD,8EAA2E;AAC3E,+EAAuD;AACvD,kEAA2D;AAC3D,sHAA8F;AAC9F,gHAAwF;AACxF,mDAAmD;AAEnD,wCAAqC;AACrC,8DAA+E;AAC/E,wDAAiD;AAc1C,MAAM,yBAAyB,GAAG,CAAC,KAAqC,EAAE,EAAE;IAC/E,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,GAAG,GAAG,IAAA,kBAAU,EAAC,yBAAc,CAAC,CAAC;IAEvC,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAEvB,IAAI,QAAQ,GAAG,KAAK,CAAC;IAErB,IAAI,IAAI,CAAC,YAAY,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;QACxC,QAAQ,GAAG,IAAI,CAAC;KACnB;IAED,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAEhH,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAChC,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,qBAAqB,EAAE,2BAAe,CAAC,IAAI,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QACvG,GAAG,CAAC,qBAAqB,EAAE,CAAC;IAChC,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,QAAQ,CAAC,CAAC,CAAC,CAC7B,8BAAC,kBAAQ,IAAC,MAAM,QAAC,OAAO,QAAC,OAAO,EAAE,sBAAsB,IACnD,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,CACvC,CACd,CAAC,CAAC,CAAC,CACA,8BAAC,uBAAa,IAAC,QAAQ,QAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,WAAW,EAAE,eAAe,EAAE,qBAAqB,EAAE,KAAK,CAAC,qBAAqB,GAAI,CACjI,CAAC;IAEF,MAAM,UAAU,GAAG,uCAAK,SAAS,EAAC,+EAA+E,GAAG,CAAC;IAErH,OAAO,CACH,uCAAK,SAAS,EAAC,QAAQ;QAClB,UAAU;QACX,uCAAK,SAAS,EAAC,2BAA2B,IAAE,aAAa,CAAO,CAC9D,CACT,CAAC;AACN,CAAC,CAAC;AAnCW,QAAA,yBAAyB,6BAmCpC;AAEF,SAAwB,sBAAsB,CAAC,KAAkC;;IAC7E,MAAM,GAAG,GAAG,IAAA,kBAAU,EAAC,yBAAc,CAAC,CAAC;IAEvC,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC/B,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,0BAAa,GAAE,CAAC;IACrC,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;IACxD,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAExD,IAAI,QAAQ,GAAG,KAAK,CAAC;IACrB,IAAI,KAAK,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;QAC9C,QAAQ,GAAG,IAAI,CAAC;KACnB;IAED,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;IAExB,OAAO,CACH;QACI;YACI,uCAAK,SAAS,EAAC,sBAAsB;gBACjC,8BAAC,kBAAQ,IAAC,IAAI,UAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAY,CACzC;YAEN,uCAAK,SAAS,EAAC,~~2CAA2C~~,~~EAAC~~,~~uBAAuB~~,~~EAAE~~,~~EAAE~~,~~MAAM,~~EAAE,MAAA,KAAK,CAAC,IAAI,CAAC,eAAe,mCAAI,KAAK,CAAC,IAAI,CAAC,WAAW,~~EAAE~~,~~GAAI~~;~~YAExJ~~,8BAAC,mBAAS,OAAG;YACb,uCAAK,SAAS,EAAC,sBAAsB;gBACjC,8BAAC,cAAI;oBACD,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAU,CACzD,CACL;YACN,uCAAK,SAAS,EAAC,sBAAsB;gBAChC,eAAe,IAAI,CAChB,uCAAK,SAAS,EAAC,sBAAsB;oBACjC,uCAAK,SAAS,EAAC,sBAAsB;wBACjC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;4BACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,eAAe,CAAC,CAAU,CACnD,CACL;oBACN,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACtB,8BAAC,qCAAiB,IAAC,OAAO,EAAE,eAAe,GAAI,CAC5C,CACL,CACT;gBACD,uCAAK,SAAS,EAAC,sBAAsB;oBACjC,uCAAK,SAAS,EAAC,sBAAsB;wBACjC,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;4BACtB,8CAAS,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAU,CACtD,CACL;oBACN,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK;wBACtB,8BAAC,qCAAiB,IAAC,OAAO,EAAE,YAAY,GAAI,CACzC,CACL,CACJ;YAEN,uCAAK,SAAS,EAAC,6EAA6E;gBACxF,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,IAAI,IACxC,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CACvB;gBACP,8BAAC,+BAAqB,IAClB,QAAQ,EAAE,QAAQ,EAClB,kBAAkB,EAAE,IAAI,CAAC,2BAA2B,EAAE,EACtD,YAAY,EAAE,IAAI,CAAC,aAAa,EAAE,EAClC,YAAY,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,EACrC,YAAY,SACd;gBACF,8BAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,aAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,yBAAS,CAAC,IAAI,CAAC,CAAC,CAAC,yBAAS,CAAC,KAAK;oBACjG,wCAAM,uBAAuB,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,GAAS,CAChG,CACL,CACJ,CACP,CACN,CAAC;AACN,CAAC;~~AAzED~~,~~yCAyEC~~","sourcesContent":["import { CompanyContext } from '@frontend/contexts';\nimport React, { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Headline from '@/components/generic/Headline';\nimport { HtmlContentViewer } from '@/components/generic/HtmlContentViewer';\nimport LineBreak from '@/components/generic/LineBreak';\nimport Text, { TextType } from '@/components/generic/Text';\nimport RoomDetailsPriceBlock from '@/components/steps/room/roomDetails/RoomDetailsPriceBlock';\nimport BookNowButton from '@/components/steps/room/roomDetails/roomRates/BookNowButton';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\nimport { TextAlign } from '@/util/TextAlignment';\n\ninterface RoomRateDescriptionTabProps {\n rate: RoomRate;\n}\n\ninterface RoomRateDescriptionFooterProps {\n rate: RoomRate;\n onClose: () => void;\n\n getButtonLabel?: (isRoomSelectedAndEditing: boolean, isThisSelectedRow: boolean) => string;\n onAddToBasketOverride?: (rate: RoomRate) => void;\n}\n\nexport const RoomRateDescriptionFooter = (props: RoomRateDescriptionFooterProps) => {\n const { t } = useTranslation();\n const ccx = useContext(CompanyContext);\n\n const { rate } = props;\n\n let isLocked = false;\n\n if (rate.isMemberOnly && !ccx.signedInUser) {\n isLocked = true;\n }\n\n const bookButtonLabel = props.getButtonLabel ? props.getButtonLabel(false, false) : t(Translation.Misc.BookNow);\n\n const openSignupModalOnClick = () => {\n DataLayer.instance.sendInteraction('Member Signup Modal', InteractionType.LINK, InteractionStep.ROOMS);\n ccx.openMemberSignupModal();\n };\n\n const bookNowButton = isLocked ? (\n <BEButton filled success onClick={openSignupModalOnClick}>\n {t(Translation.Step.Room.RoomInfo.RevealPrice)}\n </BEButton>\n ) : (\n <BookNowButton isFilled rate={props.rate} buttonLabel={bookButtonLabel} onAddToBasketOverride={props.onAddToBasketOverride} />\n );\n\n const priceBlock = <div className=\"u-flex flex-column align-items-start align-items-md-end justify-content-start\" />;\n\n return (\n <div className=\"u-flex\">\n {priceBlock}\n <div className=\"u-flex align-items-center\">{bookNowButton}</div>\n </div>\n );\n};\n\nexport default function RoomRateDescriptionTab(props: RoomRateDescriptionTabProps) {\n const ccx = useContext(CompanyContext);\n\n const { t } = useTranslation();\n const { isMobile } = useWindowSize();\n const cancelPolicy = props.rate.getCancellationPolicy();\n const guaranteePolicy = props.rate.getGuaranteePolicy();\n\n let isLocked = false;\n if (props.rate.isMemberOnly && !ccx.signedInUser) {\n isLocked = true;\n }\n\n const rate = props.rate;\n\n return (\n <>\n <div>\n <div className=\"u-marg-bottom--light\">\n <Headline bold>{props.rate.name}</Headline>\n </div>\n\n <div className=\"text-small u-~~pre-wrap u-~~clear-font-weight\" ~~dangerouslySetInnerHTML~~={~~{ __html:~~ props.rate.longDescription ?? props.rate.description }} />\n\n <LineBreak />\n <div className=\"u-marg-bottom--light\">\n <Text>\n <strong>{t(Translation.Step.Confirmation.Policies)}</strong>\n </Text>\n </div>\n <div className=\"u-marg-bottom--heavy\">\n {guaranteePolicy && (\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Misc.GuaranteePolicy)}</strong>\n </Text>\n </div>\n <Text type={TextType.Small}>\n <HtmlContentViewer content={guaranteePolicy} />\n </Text>\n </div>\n )}\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Misc.CancellationPolicy)}</strong>\n </Text>\n </div>\n <Text type={TextType.Small}>\n <HtmlContentViewer content={cancelPolicy} />\n </Text>\n </div>\n </div>\n\n <div className=\"u-flex flex-column align-items-start align-items-md-end justify-content-end\">\n <Text type={TextType.Small} color={Color.Navy}>\n {t(Translation.Misc.Total)}\n </Text>\n <RoomDetailsPriceBlock\n isLocked={isLocked}\n averagePreDiscount={rate.getTotalPriceBeforeDiscount()}\n averagePrice={rate.getTotalPrice()}\n isMemberOnly={props.rate.isMemberOnly}\n hidePerNight\n />\n <Text type={TextType.Label} color={Color.DarkGrey} align={isMobile ? TextAlign.Left : TextAlign.Right}>\n <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n </Text>\n </div>\n </div>\n </>\n );\n}\n"]}
1	+ {"version":3,"file":"RoomRateDescriptionTab.js","sourceRoot":"/","sources":["src/components/steps/room/roomDetails/roomRates/RoomRateDescriptionTab.tsx"],"names":[],"mappings":"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","sourcesContent":["import { CompanyContext } from '@frontend/contexts';\nimport React, { useContext } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Headline from '@/components/generic/Headline';\nimport { HtmlContentViewer } from '@/components/generic/HtmlContentViewer';\nimport LineBreak from '@/components/generic/LineBreak';\nimport Text, { TextType } from '@/components/generic/Text';\nimport RoomDetailsPriceBlock from '@/components/steps/room/roomDetails/RoomDetailsPriceBlock';\nimport BookNowButton from '@/components/steps/room/roomDetails/roomRates/BookNowButton';\nimport { useWindowSize } from '@/hooks/WindowSize';\nimport { RoomRate } from '@/models/Room/RoomRate';\nimport { Color } from '@/util/Color';\nimport DataLayer, { InteractionStep, InteractionType } from '@/util/DataLayer';\nimport { TextAlign } from '@/util/TextAlignment';\n\ninterface RoomRateDescriptionTabProps {\n rate: RoomRate;\n}\n\ninterface RoomRateDescriptionFooterProps {\n rate: RoomRate;\n onClose: () => void;\n\n getButtonLabel?: (isRoomSelectedAndEditing: boolean, isThisSelectedRow: boolean) => string;\n onAddToBasketOverride?: (rate: RoomRate) => void;\n}\n\nexport const RoomRateDescriptionFooter = (props: RoomRateDescriptionFooterProps) => {\n const { t } = useTranslation();\n const ccx = useContext(CompanyContext);\n\n const { rate } = props;\n\n let isLocked = false;\n\n if (rate.isMemberOnly && !ccx.signedInUser) {\n isLocked = true;\n }\n\n const bookButtonLabel = props.getButtonLabel ? props.getButtonLabel(false, false) : t(Translation.Misc.BookNow);\n\n const openSignupModalOnClick = () => {\n DataLayer.instance.sendInteraction('Member Signup Modal', InteractionType.LINK, InteractionStep.ROOMS);\n ccx.openMemberSignupModal();\n };\n\n const bookNowButton = isLocked ? (\n <BEButton filled success onClick={openSignupModalOnClick}>\n {t(Translation.Step.Room.RoomInfo.RevealPrice)}\n </BEButton>\n ) : (\n <BookNowButton isFilled rate={props.rate} buttonLabel={bookButtonLabel} onAddToBasketOverride={props.onAddToBasketOverride} />\n );\n\n const priceBlock = <div className=\"u-flex flex-column align-items-start align-items-md-end justify-content-start\" />;\n\n return (\n <div className=\"u-flex\">\n {priceBlock}\n <div className=\"u-flex align-items-center\">{bookNowButton}</div>\n </div>\n );\n};\n\nexport default function RoomRateDescriptionTab(props: RoomRateDescriptionTabProps) {\n const ccx = useContext(CompanyContext);\n\n const { t } = useTranslation();\n const { isMobile } = useWindowSize();\n const cancelPolicy = props.rate.getCancellationPolicy();\n const guaranteePolicy = props.rate.getGuaranteePolicy();\n\n let isLocked = false;\n if (props.rate.isMemberOnly && !ccx.signedInUser) {\n isLocked = true;\n }\n\n const rate = props.rate;\n\n return (\n <>\n <div>\n <div className=\"u-marg-bottom--light\">\n <Headline bold>{props.rate.name}</Headline>\n </div>\n\n <div className=\"text-small u-clear-font-weight\">\n <HtmlContentViewer content={props.rate.longDescription ?? props.rate.description} />\n </div>\n\n <LineBreak />\n <div className=\"u-marg-bottom--light\">\n <Text>\n <strong>{t(Translation.Step.Confirmation.Policies)}</strong>\n </Text>\n </div>\n <div className=\"u-marg-bottom--heavy\">\n {guaranteePolicy && (\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Misc.GuaranteePolicy)}</strong>\n </Text>\n </div>\n <Text type={TextType.Small}>\n <HtmlContentViewer content={guaranteePolicy} />\n </Text>\n </div>\n )}\n <div className=\"u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--light\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Misc.CancellationPolicy)}</strong>\n </Text>\n </div>\n <Text type={TextType.Small}>\n <HtmlContentViewer content={cancelPolicy} />\n </Text>\n </div>\n </div>\n\n <div className=\"u-flex flex-column align-items-start align-items-md-end justify-content-end\">\n <Text type={TextType.Small} color={Color.Navy}>\n {t(Translation.Misc.Total)}\n </Text>\n <RoomDetailsPriceBlock\n isLocked={isLocked}\n averagePreDiscount={rate.getTotalPriceBeforeDiscount()}\n averagePrice={rate.getTotalPrice()}\n isMemberOnly={props.rate.isMemberOnly}\n hidePerNight\n />\n <Text type={TextType.Label} color={Color.DarkGrey} align={isMobile ? TextAlign.Left : TextAlign.Right}>\n <span dangerouslySetInnerHTML={{ __html: t(Translation.Step.Room.RoomInfo.IncludesTaxes) }}></span>\n </Text>\n </div>\n </div>\n </>\n );\n}\n"]}

package/dist/src/pages/hotel/HotelInfo.js CHANGED Viewed

@@ -200,28 +200,33 @@ function HotelInfo() {
 }
 exports.default = HotelInfo;
 const QuoteImage = ({ src, className, isMobile }) => {
-    const [aspectRatio, setAspectRatio] = (0, react_1.useState)(0);
-    const [imageHeight, setImageHeight] = (0, react_1.useState)(0);
+    const [aspectRatio, setAspectRatio] = (0, react_1.useState)(null);
+    const [imageHeight, setImageHeight] = (0, react_1.useState)(null);
     (0, react_1.useEffect)(() => {
-        if (isMobile && src) {
-            const img = new Image();
-            img.src = src;
-            img.onload = () => setAspectRatio(img.height / img.width);
-            img.onerror = () => {
-                console.error('Failed to load image');
-                setAspectRatio(0);
-            };
-        }
-    }, [src, isMobile]);
+        if (!src)
+            return;
+        const img = new Image();
+        img.src = src;
+        img.onload = () => setAspectRatio(img.width > 0 ? img.height / img.width : 1); // Fallback aspect ratio
+        img.onerror = () => {
+            console.error('Failed to load image');
+            setAspectRatio(1);
+        };
+    }, [src]);
     (0, react_1.useEffect)(() => {
-        if (!isMobile || !window)
+        if (!isMobile || aspectRatio === null || typeof window === 'undefined')
             return;
         const updateHeight = () => setImageHeight(window.innerWidth * aspectRatio);
         updateHeight();
         window.addEventListener('resize', updateHeight);
         return () => window.removeEventListener('resize', updateHeight);
     }, [aspectRatio, isMobile]);
-    const style = Object.assign({ backgroundImage: `url(${src})`, backgroundSize: 'cover', backgroundPosition: 'center', backgroundRepeat: 'no-repeat', width: '100%' }, (isMobile ? { maxWidth: '100vw', height: imageHeight ? `${imageHeight}px` : 'auto' } : { paddingTop: '75%' }));
-    return react_1.default.createElement("div", { className: className, style: style });
+    return (react_1.default.createElement("div", { className: className, style: { width: '100%', textAlign: 'center' } }, src && (react_1.default.createElement("img", { src: src, alt: "Quote", style: {
+            width: '100%',
+            height: isMobile && imageHeight ? `${imageHeight}px` : 'auto',
+            objectFit: 'contain',
+            display: 'block',
+            margin: '0 auto', // Centers the image in the div
+        } }))));
 };
 //# sourceMappingURL=HotelInfo.js.map

package/dist/src/pages/hotel/HotelInfo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HotelInfo.js","sourceRoot":"/","sources":["src/pages/hotel/HotelInfo.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StepHotelInfoViewEvent } from '@frontend/events';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport FsLightbox from 'fslightbox-react';\nimport { useHistoryConsistentPush } from 'hooks/HistoryConsistentPush';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Headline from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport HotelLocationMap from '@/components/generic/map/HotelLocationMap';\nimport { PageTitle } from '@/components/generic/PageTitle';\nimport Text, { TextType } from '@/components/generic/Text';\nimport HotelInfoPerkRow from '@/components/steps/hotel/HotelInfoPerksRow';\nimport TransportDistanceFromHotelBlock from '@/components/summary/TransportDistanceFromHotelBlock';\nimport { BookingEngineContext } from '@/index';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\nimport StepManager from '@/util/StepManager';\n\nexport default function HotelInfo() {\n const { hotel } = useCurrentHotel();\n const historyConsistentPush = useHistoryConsistentPush();\n const { t } = useTranslation();\n const context = useContext(BookingEngineContext);\n const isMobile = context.screenSize <= ScreenSize.Large;\n\n const imageUrl = hotel?.heroImage;\n\n const { line1, line2, postalCode, country } = hotel?.address ?? {};\n\n const [lightboxController, setLightboxController] = useState({ toggler: false, slide: 1 });\n const [images, setImages] = useState<string[]>([]);\n\n const openSlider = (slide: number) => {\n setLightboxController((controller) => ({ toggler: !controller.toggler, slide: slide + 1 }));\n };\n const openSliderOnClick = () => {\n openSlider(4);\n };\n\n const { raise } = useEvent();\n\n useEffect(() => {\n const event = new StepHotelInfoViewEvent();\n raise(event);\n }, []);\n\n useEffect(() => {\n const newImages: string[] = [];\n\n if (hotel?.images?.length) {\n newImages.push(...hotel.images);\n }\n\n if (hotel?.rooms) {\n for (const room of Object.values(hotel?.rooms)) {\n room.images?.forEach((image) => {\n newImages.push(image);\n });\n }\n }\n\n setImages(newImages);\n }, [hotel?.images, hotel?.rooms]);\n\n const onBookNowClick = () => {\n historyConsistentPush(StepManager.getFirstStep().getStepUrl());\n };\n\n const getImage = (index: number) => {\n const openSliderOnClickHandler = () => {\n openSlider(index);\n };\n\n const resizedUrl = ImageProvider.resizeImage(images[index], ImageSize.Small);\n\n return (\n <div\n style={{ backgroundImage: `url('${resizedUrl}')`, paddingTop: '75%' }}\n className=\"c-images u-block u-w-100 u-marg-bottom u-marg-bottom--heavy\"\n onClick={openSliderOnClickHandler}\n />\n );\n };\n\n const hotelServices = hotel?.hotelServices?.filter(({ name }) => !!name) \|\| [];\n const quoteImage = isMobile ? hotel?.quoteImageMobile : hotel?.quoteImageDesktop;\n\n return (\n <>\n <PageTitle step=\"HotelInfo\" />\n <div style={{ backgroundImage: `url('${imageUrl && ImageProvider.resizeImage(imageUrl, ImageSize.Original)}')` }} className=\"c-masthead has-tint\">\n <div className=\"container\">\n <div className=\"c-masthead__body u-fill-white u-pad--heavy u-shadow-accent\">\n <h1 className=\"c-masthead__header\">{hotel?.name}</h1>\n <h2 className=\"c-masthead__sub-header\">\n {hotel?.countryPrefix ?? ''} {hotel?.address?.country}\n </h2>\n </div>\n </div>\n </div>\n <div className=\"u-fill-snow u-pad--heavy-med u-pad-top-bottom--heavy@m-\">\n <div className=\"container\">\n <div className=\"row\">\n <div className=\"col-md-6 u-flex align-items-center\">\n <ul>\n <li className=\"u-flex u-marg-bottom--heavy\">\n <Icon icon={IconType.Map} size=\"1.3em\" color={Color.Accent} />\n <span className=\"u-flex__item u-marg-left\">\n {line1}\n <br />\n {line2} {postalCode}, {country}\n </span>\n </li>\n <li className=\"u-flex u-marg-bottom--heavy\">\n <Icon icon={IconType.Phone} size=\"1.3em\" color={Color.Accent} />\n <span className=\"u-flex__item u-marg-left\">{hotel?.phone}</span>\n </li>\n <li className=\"u-flex u-marg-bottom--heavy\">\n <Icon icon={IconType.Hotel2} size=\"1.3em\" color={Color.Accent} />\n <span className=\"u-flex__item u-marg-left\">\n <a href={hotel?.hotelUrl} style={{ color: 'var(--rs-color-accent-1)' }}>\n {hotel?.name}\n </a>\n </span>\n </li>\n <li className=\"u-flex\">\n <BEButton icon={IconType.ArrowRight} primary filled iconPosition=\"right\" onClick={onBookNowClick}>\n {t(Translation.Misc.BookNow)}\n </BEButton>\n </li>\n </ul>\n </div>\n <div className=\"col-md-6\">\n <div className=\"c-overlap\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy u-marg-top u-marg-top--heavy\" style={{ height: '240px' }}>\n <HotelLocationMap />\n </div>\n <div className=\"u-flex u-flex-column justify-content-center rs-hotelinfo-transport-distance u-w-100\">\n <TransportDistanceFromHotelBlock hotel={hotel} />\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div className=\"u-pad u-pad--heavy-plus u-pad-top-bottom--heavy@m-\">\n <div className=\"container rs-hotelinfo\">\n <div className=\"row\">\n <div className=\"col-lg-6\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-about\" bold>\n {t(Translation.Step.Hotel.About)}\n </Headline>\n </div>\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Text type={TextType.Small}>\n <span dangerouslySetInnerHTML={{ __html: hotel?.description?.replace('\\r\\n', '<br/><br/>') \|\| '' }} />\n </Text>\n {!!hotel?.locationDescription && (\n <>\n <div className=\"u-marg-top\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Step.Hotel.Location)}</strong>\n </Text>\n </div>\n <Text type={TextType.Small}>\n <span dangerouslySetInnerHTML={{ __html: hotel?.locationDescription?.replace('\\r\\n', '<br/><br/>') }} />\n </Text>\n </>\n )}\n </div>\n {!!hotel?.perks?.length && (\n <>\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Text type={TextType.Small}>\n <strong className=\"rs-hotelinfo-andyougetall\">{hotel.perkTitle \|\| t(Translation.Step.Hotel.AndYouGetAll)}</strong>\n </Text>\n </div>\n <div className=\"row\">\n <HotelInfoPerkRow hotel={hotel} />\n </div>\n {hotel?.perksShowDisclaimer && (\n <div className=\"row u-marg-top--lighter\">\n <small className=\"col-12\">{t(Translation.Misc.PerksDisclaimer)}</small>\n </div>\n )}\n </>\n )}\n </div>\n {!!hotelServices.length && (\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-hotelamenities\" bold>\n {t(Translation.Step.Hotel.HotelAmenities)}\n </Headline>\n </div>\n <div className=\"row\">\n {hotelServices.map((hotelService, index) => {\n return (\n <div key={index} className=\"col-md-6\">\n <div className=\"u-flex u-marg-bottom\">\n <Icon icon={IconType.Check} color={Color.White} backgroundColor={Color.Accent} borderRadius=\"round\" noPadding size=\"16px\" />\n <span className=\"u-flex__item u-marg-left--light\">\n <Text type={TextType.Small}>{hotelService.name}</Text>\n </span>\n </div>\n </div>\n );\n })}\n </div>\n </div>\n )}\n {!!hotel?.policies && (\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-policies\" bold>\n {t(Translation.Step.Hotel.Policies)}\n </Headline>\n </div>\n <Text type={TextType.Small}>\n <a href={hotel?.policies} target=\"_blank\" style={{ color: hotel?.colors.accent }} rel=\"noreferrer\">\n {hotel?.policies}\n </a>\n </Text>\n </div>\n )}\n\n {quoteImage && (\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <QuoteImage\n isMobile={isMobile}\n className={classNames('u-marg-bottom--heavy rs-hotelinfo-quote-images', {\n '--mobile': isMobile,\n '--desktop': !isMobile,\n })}\n src={quoteImage}\n ></QuoteImage>\n </div>\n )}\n </div>\n <div className=\"col-lg-6\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-gallery\" bold>\n {t(Translation.Step.Hotel.Gallery)}\n </Headline>\n </div>\n {images.length >= 1 && getImage(0)}\n <div className=\"row\">\n {[1, 2, 3].map((index) => {\n if (images.length > index) {\n return (\n <div key={index} className=\"col-6\">\n {getImage(index)}\n </div>\n );\n }\n })}\n {images.length > 5 && (\n <div className=\"col-6\">\n <div className=\"c-images c-images--more\" onClick={openSliderOnClick}>\n {getImage(4)}\n <span>+ {images.length - 5}</span>\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n {!!images?.length && (\n <FsLightbox\n toggler={lightboxController.toggler}\n slide={lightboxController.slide}\n sources={images.map((image) => ImageProvider.resizeImage(image, ImageSize.Original))}\n type=\"image\"\n />\n )}\n </>\n );\n}\n\nconst QuoteImage = ({ src, className, isMobile }: { src: string; className: string; isMobile: boolean }) => {\n const [aspectRatio, setAspectRatio] = useState(0);\n const [imageHeight, setImageHeight] = useState(0);\n\n useEffect(() => {\n if (isMobile && src) {\n const img = new Image();\n img.src = src;\n img.onload = () => setAspectRatio(img.height / img.width);\n img.onerror = () => {\n console.error('Failed to load image');\n setAspectRatio(0);\n };\n }\n }, [src, isMobile]);\n\n useEffect(() => {\n if (!isMobile \|\| !window) return;\n\n const updateHeight = () => setImageHeight(window.innerWidth * aspectRatio);\n updateHeight();\n\n window.addEventListener('resize', updateHeight);\n return () => window.removeEventListener('resize', updateHeight);\n }, [aspectRatio, isMobile]);\n\n const style = {\n backgroundImage: `url(${src})`,\n backgroundSize: 'cover',\n backgroundPosition: 'center',\n backgroundRepeat: 'no-repeat',\n width: '100%',\n ...(isMobile ? { maxWidth: '100vw', height: imageHeight ? `${imageHeight}px` : 'auto' } : { paddingTop: '75%' }),\n };\n\n return <div className={className} style={style}></div>;\n};\n"]}
1	+ {"version":3,"file":"HotelInfo.js","sourceRoot":"/","sources":["src/pages/hotel/HotelInfo.tsx"],"names":[],"mappings":"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","sourcesContent":["import { StepHotelInfoViewEvent } from '@frontend/events';\nimport { useCurrentHotel, useEvent } from '@frontend/hooks';\nimport classNames from 'classnames';\nimport FsLightbox from 'fslightbox-react';\nimport { useHistoryConsistentPush } from 'hooks/HistoryConsistentPush';\nimport React, { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\n\nimport BEButton from '@/components/generic/BEButton';\nimport Headline from '@/components/generic/Headline';\nimport Icon, { IconType } from '@/components/generic/Icon/Icon';\nimport HotelLocationMap from '@/components/generic/map/HotelLocationMap';\nimport { PageTitle } from '@/components/generic/PageTitle';\nimport Text, { TextType } from '@/components/generic/Text';\nimport HotelInfoPerkRow from '@/components/steps/hotel/HotelInfoPerksRow';\nimport TransportDistanceFromHotelBlock from '@/components/summary/TransportDistanceFromHotelBlock';\nimport { BookingEngineContext } from '@/index';\nimport ImageProvider, { ImageSize } from '@/providers/ImageProvider';\nimport { Color } from '@/util/Color';\nimport ScreenSize from '@/util/ScreenSize';\nimport StepManager from '@/util/StepManager';\n\nexport default function HotelInfo() {\n const { hotel } = useCurrentHotel();\n const historyConsistentPush = useHistoryConsistentPush();\n const { t } = useTranslation();\n const context = useContext(BookingEngineContext);\n const isMobile = context.screenSize <= ScreenSize.Large;\n\n const imageUrl = hotel?.heroImage;\n\n const { line1, line2, postalCode, country } = hotel?.address ?? {};\n\n const [lightboxController, setLightboxController] = useState({ toggler: false, slide: 1 });\n const [images, setImages] = useState<string[]>([]);\n\n const openSlider = (slide: number) => {\n setLightboxController((controller) => ({ toggler: !controller.toggler, slide: slide + 1 }));\n };\n const openSliderOnClick = () => {\n openSlider(4);\n };\n\n const { raise } = useEvent();\n\n useEffect(() => {\n const event = new StepHotelInfoViewEvent();\n raise(event);\n }, []);\n\n useEffect(() => {\n const newImages: string[] = [];\n\n if (hotel?.images?.length) {\n newImages.push(...hotel.images);\n }\n\n if (hotel?.rooms) {\n for (const room of Object.values(hotel?.rooms)) {\n room.images?.forEach((image) => {\n newImages.push(image);\n });\n }\n }\n\n setImages(newImages);\n }, [hotel?.images, hotel?.rooms]);\n\n const onBookNowClick = () => {\n historyConsistentPush(StepManager.getFirstStep().getStepUrl());\n };\n\n const getImage = (index: number) => {\n const openSliderOnClickHandler = () => {\n openSlider(index);\n };\n\n const resizedUrl = ImageProvider.resizeImage(images[index], ImageSize.Small);\n\n return (\n <div\n style={{ backgroundImage: `url('${resizedUrl}')`, paddingTop: '75%' }}\n className=\"c-images u-block u-w-100 u-marg-bottom u-marg-bottom--heavy\"\n onClick={openSliderOnClickHandler}\n />\n );\n };\n\n const hotelServices = hotel?.hotelServices?.filter(({ name }) => !!name) \|\| [];\n const quoteImage = isMobile ? hotel?.quoteImageMobile : hotel?.quoteImageDesktop;\n\n return (\n <>\n <PageTitle step=\"HotelInfo\" />\n <div style={{ backgroundImage: `url('${imageUrl && ImageProvider.resizeImage(imageUrl, ImageSize.Original)}')` }} className=\"c-masthead has-tint\">\n <div className=\"container\">\n <div className=\"c-masthead__body u-fill-white u-pad--heavy u-shadow-accent\">\n <h1 className=\"c-masthead__header\">{hotel?.name}</h1>\n <h2 className=\"c-masthead__sub-header\">\n {hotel?.countryPrefix ?? ''} {hotel?.address?.country}\n </h2>\n </div>\n </div>\n </div>\n <div className=\"u-fill-snow u-pad--heavy-med u-pad-top-bottom--heavy@m-\">\n <div className=\"container\">\n <div className=\"row\">\n <div className=\"col-md-6 u-flex align-items-center\">\n <ul>\n <li className=\"u-flex u-marg-bottom--heavy\">\n <Icon icon={IconType.Map} size=\"1.3em\" color={Color.Accent} />\n <span className=\"u-flex__item u-marg-left\">\n {line1}\n <br />\n {line2} {postalCode}, {country}\n </span>\n </li>\n <li className=\"u-flex u-marg-bottom--heavy\">\n <Icon icon={IconType.Phone} size=\"1.3em\" color={Color.Accent} />\n <span className=\"u-flex__item u-marg-left\">{hotel?.phone}</span>\n </li>\n <li className=\"u-flex u-marg-bottom--heavy\">\n <Icon icon={IconType.Hotel2} size=\"1.3em\" color={Color.Accent} />\n <span className=\"u-flex__item u-marg-left\">\n <a href={hotel?.hotelUrl} style={{ color: 'var(--rs-color-accent-1)' }}>\n {hotel?.name}\n </a>\n </span>\n </li>\n <li className=\"u-flex\">\n <BEButton icon={IconType.ArrowRight} primary filled iconPosition=\"right\" onClick={onBookNowClick}>\n {t(Translation.Misc.BookNow)}\n </BEButton>\n </li>\n </ul>\n </div>\n <div className=\"col-md-6\">\n <div className=\"c-overlap\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy u-marg-top u-marg-top--heavy\" style={{ height: '240px' }}>\n <HotelLocationMap />\n </div>\n <div className=\"u-flex u-flex-column justify-content-center rs-hotelinfo-transport-distance u-w-100\">\n <TransportDistanceFromHotelBlock hotel={hotel} />\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div className=\"u-pad u-pad--heavy-plus u-pad-top-bottom--heavy@m-\">\n <div className=\"container rs-hotelinfo\">\n <div className=\"row\">\n <div className=\"col-lg-6\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-about\" bold>\n {t(Translation.Step.Hotel.About)}\n </Headline>\n </div>\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Text type={TextType.Small}>\n <span dangerouslySetInnerHTML={{ __html: hotel?.description?.replace('\\r\\n', '<br/><br/>') \|\| '' }} />\n </Text>\n {!!hotel?.locationDescription && (\n <>\n <div className=\"u-marg-top\">\n <Text type={TextType.Small}>\n <strong>{t(Translation.Step.Hotel.Location)}</strong>\n </Text>\n </div>\n <Text type={TextType.Small}>\n <span dangerouslySetInnerHTML={{ __html: hotel?.locationDescription?.replace('\\r\\n', '<br/><br/>') }} />\n </Text>\n </>\n )}\n </div>\n {!!hotel?.perks?.length && (\n <>\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Text type={TextType.Small}>\n <strong className=\"rs-hotelinfo-andyougetall\">{hotel.perkTitle \|\| t(Translation.Step.Hotel.AndYouGetAll)}</strong>\n </Text>\n </div>\n <div className=\"row\">\n <HotelInfoPerkRow hotel={hotel} />\n </div>\n {hotel?.perksShowDisclaimer && (\n <div className=\"row u-marg-top--lighter\">\n <small className=\"col-12\">{t(Translation.Misc.PerksDisclaimer)}</small>\n </div>\n )}\n </>\n )}\n </div>\n {!!hotelServices.length && (\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-hotelamenities\" bold>\n {t(Translation.Step.Hotel.HotelAmenities)}\n </Headline>\n </div>\n <div className=\"row\">\n {hotelServices.map((hotelService, index) => {\n return (\n <div key={index} className=\"col-md-6\">\n <div className=\"u-flex u-marg-bottom\">\n <Icon icon={IconType.Check} color={Color.White} backgroundColor={Color.Accent} borderRadius=\"round\" noPadding size=\"16px\" />\n <span className=\"u-flex__item u-marg-left--light\">\n <Text type={TextType.Small}>{hotelService.name}</Text>\n </span>\n </div>\n </div>\n );\n })}\n </div>\n </div>\n )}\n {!!hotel?.policies && (\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-policies\" bold>\n {t(Translation.Step.Hotel.Policies)}\n </Headline>\n </div>\n <Text type={TextType.Small}>\n <a href={hotel?.policies} target=\"_blank\" style={{ color: hotel?.colors.accent }} rel=\"noreferrer\">\n {hotel?.policies}\n </a>\n </Text>\n </div>\n )}\n\n {quoteImage && (\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <QuoteImage\n isMobile={isMobile}\n className={classNames('u-marg-bottom--heavy rs-hotelinfo-quote-images', {\n '--mobile': isMobile,\n '--desktop': !isMobile,\n })}\n src={quoteImage}\n ></QuoteImage>\n </div>\n )}\n </div>\n <div className=\"col-lg-6\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <div className=\"u-marg-bottom u-marg-bottom--heavy\">\n <Headline className=\"rs-hotelinfo-gallery\" bold>\n {t(Translation.Step.Hotel.Gallery)}\n </Headline>\n </div>\n {images.length >= 1 && getImage(0)}\n <div className=\"row\">\n {[1, 2, 3].map((index) => {\n if (images.length > index) {\n return (\n <div key={index} className=\"col-6\">\n {getImage(index)}\n </div>\n );\n }\n })}\n {images.length > 5 && (\n <div className=\"col-6\">\n <div className=\"c-images c-images--more\" onClick={openSliderOnClick}>\n {getImage(4)}\n <span>+ {images.length - 5}</span>\n </div>\n </div>\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n {!!images?.length && (\n <FsLightbox\n toggler={lightboxController.toggler}\n slide={lightboxController.slide}\n sources={images.map((image) => ImageProvider.resizeImage(image, ImageSize.Original))}\n type=\"image\"\n />\n )}\n </>\n );\n}\n\nconst QuoteImage = ({ src, className, isMobile }: { src: string; className?: string; isMobile: boolean }) => {\n const [aspectRatio, setAspectRatio] = useState<number \| null>(null);\n const [imageHeight, setImageHeight] = useState<number \| null>(null);\n\n useEffect(() => {\n if (!src) return;\n\n const img = new Image();\n img.src = src;\n img.onload = () => setAspectRatio(img.width > 0 ? img.height / img.width : 1); // Fallback aspect ratio\n img.onerror = () => {\n console.error('Failed to load image');\n setAspectRatio(1);\n };\n }, [src]);\n\n useEffect(() => {\n if (!isMobile \|\| aspectRatio === null \|\| typeof window === 'undefined') return;\n\n const updateHeight = () => setImageHeight(window.innerWidth * aspectRatio);\n updateHeight();\n\n window.addEventListener('resize', updateHeight);\n return () => window.removeEventListener('resize', updateHeight);\n }, [aspectRatio, isMobile]);\n\n return (\n <div className={className} style={{ width: '100%', textAlign: 'center' }}>\n {src && (\n <img\n src={src}\n alt=\"Quote\"\n style={{\n width: '100%',\n height: isMobile && imageHeight ? `${imageHeight}px` : 'auto',\n objectFit: 'contain', // Ensures full image is visible, no cropping\n display: 'block', // Prevents inline whitespace issue\n margin: '0 auto', // Centers the image in the div\n }}\n />\n )}\n </div>\n );\n};\n"]}