@roomstay/frontend 2.0.12 → 2.1.0

package/dist/src/components/steps/date/StepOneDateRangePicker.js

@@ -1,11 +1,37 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const DatePicker_1 = require("components/generic/date/DatePicker");
-const React = require("react");
+const DatePicker_1 = __importDefault(require("components/generic/date/DatePicker"));
+const React = __importStar(require("react"));
 const react_1 = require("react");
-const ScreenSize_1 = require("util/ScreenSize");
+const ScreenSize_1 = __importDefault(require("util/ScreenSize"));
 const contexts_1 = require("@frontend/contexts");
-const DataLayer_1 = require("util/DataLayer");
+const DataLayer_1 = __importStar(require("util/DataLayer"));
 function StepOneDateRangePicker() {
     const context = (0, react_1.useContext)(contexts_1.BasketContext);
     const appContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);

package/dist/src/components/steps/date/StepOneDateRangePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepOneDateRangePicker.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneDateRangePicker.tsx"],"names":[],"mappings":";;AAAA,mEAA4D;AAC5D,+BAA+B;AAC/B,iCAA4C;AAC5C,gDAAyC;AACzC,iDAAyE;AACzE,8CAA6E;AAE7E,SAAwB,sBAAsB;IAC1C,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAC1C,MAAM,UAAU,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEpD,OAAO,IAAA,eAAO,EAAC,GAAG,EAAE;QAChB,MAAM,yBAAyB,GAAG,CAAC,OAAY,EAAE,EAAE;YAC/C,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,eAAe,EAAE,2BAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YACrG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAClC,CAAC,CAAC;QACF,MAAM,uBAAuB,GAAG,CAAC,OAAY,EAAE,EAAE;YAC7C,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,gBAAgB,EAAE,2BAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YACtG,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAChC,CAAC,CAAC;QACF,OAAO,CACH,oBAAC,oBAAU,IACP,sBAAsB,EAAE,IAAI,EAC5B,kBAAkB,EAAE,UAAU,CAAC,UAAU,GAAG,oBAAU,CAAC,UAAU,EACjE,iBAAiB,EAAE,OAAO,CAAC,SAAS,EACpC,eAAe,EAAE,OAAO,CAAC,OAAO,EAChC,YAAY,EAAE,IAAI,EAClB,gBAAgB,EAAE,IAAI,EACtB,kBAAkB,EAAE,yBAAyB,EAC7C,gBAAgB,EAAE,uBAAuB,GAC3C,CACL,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC;AACpE,CAAC;AA1BD,yCA0BC","sourcesContent":["import DatePicker from 'components/generic/date/DatePicker';\nimport * as React from 'react';\nimport { useContext, useMemo } from 'react';\nimport ScreenSize from 'util/ScreenSize';\nimport { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport DataLayer, { InteractionStep, InteractionType } from 'util/DataLayer';\n\nexport default function StepOneDateRangePicker() {\n    const context = useContext(BasketContext);\n    const appContext = useContext(BookingEngineContext);\n\n    return useMemo(() => {\n        const onStartDateChangedHandler = (newDate: any) => {\n            DataLayer.instance.sendInteraction('Check In Date', InteractionType.CALENDAR, InteractionStep.DATES);\n            context.setStartDate(newDate);\n        };\n        const onEndDateChangedHandler = (newDate: any) => {\n            DataLayer.instance.sendInteraction('Check Out Date', InteractionType.CALENDAR, InteractionStep.DATES);\n            context.setEndDate(newDate);\n        };\n        return (\n            <DatePicker\n                supportsMultiSelecting={true}\n                showMultipleMonths={appContext.screenSize > ScreenSize.ExtraLarge}\n                selectedStartDate={context.startDate}\n                selectedEndDate={context.endDate}\n                supportsWeek={true}\n                showMinNightStay={true}\n                onStartDateChanged={onStartDateChangedHandler}\n                onEndDateChanged={onEndDateChangedHandler}\n            />\n        );\n    }, [context.startDate, context.endDate, appContext.screenSize]);\n}\n"]}
+{"version":3,"file":"StepOneDateRangePicker.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneDateRangePicker.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,oFAA4D;AAC5D,6CAA+B;AAC/B,iCAA4C;AAC5C,iEAAyC;AACzC,iDAAyE;AACzE,4DAA6E;AAE7E,SAAwB,sBAAsB;IAC1C,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAC1C,MAAM,UAAU,GAAG,IAAA,kBAAU,EAAC,+BAAoB,CAAC,CAAC;IAEpD,OAAO,IAAA,eAAO,EAAC,GAAG,EAAE;QAChB,MAAM,yBAAyB,GAAG,CAAC,OAAY,EAAE,EAAE;YAC/C,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,eAAe,EAAE,2BAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YACrG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAClC,CAAC,CAAC;QACF,MAAM,uBAAuB,GAAG,CAAC,OAAY,EAAE,EAAE;YAC7C,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,gBAAgB,EAAE,2BAAe,CAAC,QAAQ,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;YACtG,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAChC,CAAC,CAAC;QACF,OAAO,CACH,oBAAC,oBAAU,IACP,sBAAsB,EAAE,IAAI,EAC5B,kBAAkB,EAAE,UAAU,CAAC,UAAU,GAAG,oBAAU,CAAC,UAAU,EACjE,iBAAiB,EAAE,OAAO,CAAC,SAAS,EACpC,eAAe,EAAE,OAAO,CAAC,OAAO,EAChC,YAAY,EAAE,IAAI,EAClB,gBAAgB,EAAE,IAAI,EACtB,kBAAkB,EAAE,yBAAyB,EAC7C,gBAAgB,EAAE,uBAAuB,GAC3C,CACL,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC;AACpE,CAAC;AA1BD,yCA0BC","sourcesContent":["import DatePicker from 'components/generic/date/DatePicker';\nimport * as React from 'react';\nimport { useContext, useMemo } from 'react';\nimport ScreenSize from 'util/ScreenSize';\nimport { BasketContext, BookingEngineContext } from '@frontend/contexts';\nimport DataLayer, { InteractionStep, InteractionType } from 'util/DataLayer';\n\nexport default function StepOneDateRangePicker() {\n    const context = useContext(BasketContext);\n    const appContext = useContext(BookingEngineContext);\n\n    return useMemo(() => {\n        const onStartDateChangedHandler = (newDate: any) => {\n            DataLayer.instance.sendInteraction('Check In Date', InteractionType.CALENDAR, InteractionStep.DATES);\n            context.setStartDate(newDate);\n        };\n        const onEndDateChangedHandler = (newDate: any) => {\n            DataLayer.instance.sendInteraction('Check Out Date', InteractionType.CALENDAR, InteractionStep.DATES);\n            context.setEndDate(newDate);\n        };\n        return (\n            <DatePicker\n                supportsMultiSelecting={true}\n                showMultipleMonths={appContext.screenSize > ScreenSize.ExtraLarge}\n                selectedStartDate={context.startDate}\n                selectedEndDate={context.endDate}\n                supportsWeek={true}\n                showMinNightStay={true}\n                onStartDateChanged={onStartDateChangedHandler}\n                onEndDateChanged={onEndDateChangedHandler}\n            />\n        );\n    }, [context.startDate, context.endDate, appContext.screenSize]);\n}\n"]}

package/dist/src/components/steps/date/StepOneDateRangePickerLegend.js

@@ -1,12 +1,38 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
+const React = __importStar(require("react"));
 const Color_1 = require("util/Color");
 const Translation_1 = require("translations/Translation");
-const Text_1 = require("components/generic/Text");
+const Text_1 = __importStar(require("components/generic/Text"));
 const react_i18next_1 = require("react-i18next");
 const RoomstayThemeEngine_1 = require("providers/RoomstayThemeEngine");
-const RoomstayThemeEngine_2 = require("providers/RoomstayThemeEngine");
+const RoomstayThemeEngine_2 = __importDefault(require("providers/RoomstayThemeEngine"));
 function StepOneDateRangePickerLegend() {
     const { t } = (0, react_i18next_1.useTranslation)();
     return (React.createElement("div", { className: "diji-calendar-legend u-marg-top u-marg-bottom" },

package/dist/src/components/steps/date/StepOneDateRangePickerLegend.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepOneDateRangePickerLegend.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneDateRangePickerLegend.tsx"],"names":[],"mappings":";;AAAA,+BAA+B;AAC/B,sCAAmC;AACnC,0DAAuD;AACvD,kDAAyD;AACzD,iDAA+C;AAC/C,uEAA8D;AAC9D,uEAAgE;AAEhE,SAAwB,4BAA4B;IAChD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,OAAO,CACH,6BAAK,SAAS,EAAC,+CAA+C;QAC1D,4BAAI,SAAS,EAAC,2EAA2E,IACpF;YACG;gBACI,KAAK,EAAE,aAAK,CAAC,IAAI;gBACjB,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;aAC9C;YACD;gBACI,KAAK,EAAE,aAAK,CAAC,MAAM;gBACnB,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;aACtD;YACD;gBACI,KAAK,EAAE,aAAK,CAAC,OAAO;gBACpB,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;aACvD;YACD;gBACI,KAAK,EAAE,6BAAmB,CAAC,SAAS,KAAK,mCAAa,CAAC,KAAK,CAAC,CAAC,CAAC,aAAK,CAAC,IAAI,CAAC,CAAC,CAAC,aAAK,CAAC,SAAS;gBAC3F,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;aACvD;SACJ,CAAC,GAAG,CAAC,CAAC,GAAQ,EAAE,KAAa,EAAE,EAAE;YAC9B,OAAO,CACH,4BAAI,SAAS,EAAC,iCAAiC,EAAC,GAAG,EAAE,KAAK;gBACtD,8BAAM,SAAS,EAAC,2BAA2B,EAAC,KAAK,EAAE,EAAE,eAAe,EAAE,GAAG,CAAC,KAAK,EAAE,GAAI;gBACrF,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,IACnC,GAAG,CAAC,IAAI,CACN,CACN,CACR,CAAC;QACN,CAAC,CAAC,CACD,CACH,CACT,CAAC;AACN,CAAC;AApCD,+CAoCC","sourcesContent":["import * as React from 'react';\nimport { Color } from 'util/Color';\nimport { Translation } from 'translations/Translation';\nimport Text, { TextType } from 'components/generic/Text';\nimport { useTranslation } from 'react-i18next';\nimport { RoomstayTheme } from 'providers/RoomstayThemeEngine';\nimport RoomstayThemeEngine from 'providers/RoomstayThemeEngine';\n\nexport default function StepOneDateRangePickerLegend() {\n    const { t } = useTranslation();\n\n    return (\n        <div className=\"diji-calendar-legend u-marg-top u-marg-bottom\">\n            <ul className=\"u-list-inline-flex u-flex justify-content-xl-start justify-content-center\">\n                {[\n                    {\n                        color: Color.Navy,\n                        text: t(Translation.Step.Date.Legend.Today),\n                    },\n                    {\n                        color: Color.Accent,\n                        text: t(Translation.Step.Date.Legend.SelectedDates),\n                    },\n                    {\n                        color: Color.Success,\n                        text: t(Translation.Step.Date.Legend.AvailableDates),\n                    },\n                    {\n                        color: RoomstayThemeEngine.ThemeType === RoomstayTheme.Light ? Color.Snow : Color.LightGrey,\n                        text: t(Translation.Step.Date.Legend.NoAvailability),\n                    },\n                ].map((row: any, index: number) => {\n                    return (\n                        <li className=\"u-marg-right align-items-center\" key={index}>\n                            <span className=\"diji-calendar-legend-icon\" style={{ backgroundColor: row.color }} />\n                            <Text type={TextType.Small} inline={true}>\n                                {row.text}\n                            </Text>\n                        </li>\n                    );\n                })}\n            </ul>\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"StepOneDateRangePickerLegend.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneDateRangePickerLegend.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,sCAAmC;AACnC,0DAAuD;AACvD,gEAAyD;AACzD,iDAA+C;AAC/C,uEAA8D;AAC9D,wFAAgE;AAEhE,SAAwB,4BAA4B;IAChD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,OAAO,CACH,6BAAK,SAAS,EAAC,+CAA+C;QAC1D,4BAAI,SAAS,EAAC,2EAA2E,IACpF;YACG;gBACI,KAAK,EAAE,aAAK,CAAC,IAAI;gBACjB,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;aAC9C;YACD;gBACI,KAAK,EAAE,aAAK,CAAC,MAAM;gBACnB,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;aACtD;YACD;gBACI,KAAK,EAAE,aAAK,CAAC,OAAO;gBACpB,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;aACvD;YACD;gBACI,KAAK,EAAE,6BAAmB,CAAC,SAAS,KAAK,mCAAa,CAAC,KAAK,CAAC,CAAC,CAAC,aAAK,CAAC,IAAI,CAAC,CAAC,CAAC,aAAK,CAAC,SAAS;gBAC3F,IAAI,EAAE,CAAC,CAAC,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;aACvD;SACJ,CAAC,GAAG,CAAC,CAAC,GAAQ,EAAE,KAAa,EAAE,EAAE;YAC9B,OAAO,CACH,4BAAI,SAAS,EAAC,iCAAiC,EAAC,GAAG,EAAE,KAAK;gBACtD,8BAAM,SAAS,EAAC,2BAA2B,EAAC,KAAK,EAAE,EAAE,eAAe,EAAE,GAAG,CAAC,KAAK,EAAE,GAAI;gBACrF,oBAAC,cAAI,IAAC,IAAI,EAAE,eAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,IACnC,GAAG,CAAC,IAAI,CACN,CACN,CACR,CAAC;QACN,CAAC,CAAC,CACD,CACH,CACT,CAAC;AACN,CAAC;AApCD,+CAoCC","sourcesContent":["import * as React from 'react';\nimport { Color } from 'util/Color';\nimport { Translation } from 'translations/Translation';\nimport Text, { TextType } from 'components/generic/Text';\nimport { useTranslation } from 'react-i18next';\nimport { RoomstayTheme } from 'providers/RoomstayThemeEngine';\nimport RoomstayThemeEngine from 'providers/RoomstayThemeEngine';\n\nexport default function StepOneDateRangePickerLegend() {\n    const { t } = useTranslation();\n\n    return (\n        <div className=\"diji-calendar-legend u-marg-top u-marg-bottom\">\n            <ul className=\"u-list-inline-flex u-flex justify-content-xl-start justify-content-center\">\n                {[\n                    {\n                        color: Color.Navy,\n                        text: t(Translation.Step.Date.Legend.Today),\n                    },\n                    {\n                        color: Color.Accent,\n                        text: t(Translation.Step.Date.Legend.SelectedDates),\n                    },\n                    {\n                        color: Color.Success,\n                        text: t(Translation.Step.Date.Legend.AvailableDates),\n                    },\n                    {\n                        color: RoomstayThemeEngine.ThemeType === RoomstayTheme.Light ? Color.Snow : Color.LightGrey,\n                        text: t(Translation.Step.Date.Legend.NoAvailability),\n                    },\n                ].map((row: any, index: number) => {\n                    return (\n                        <li className=\"u-marg-right align-items-center\" key={index}>\n                            <span className=\"diji-calendar-legend-icon\" style={{ backgroundColor: row.color }} />\n                            <Text type={TextType.Small} inline={true}>\n                                {row.text}\n                            </Text>\n                        </li>\n                    );\n                })}\n            </ul>\n        </div>\n    );\n}\n"]}

package/dist/src/components/steps/date/StepOneNextStepButton.js

@@ -1,4 +1,27 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -8,14 +31,17 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const NextStepButton_1 = require("components/generic/buttons/NextStepButton");
-const React = require("react");
+const NextStepButton_1 = __importDefault(require("components/generic/buttons/NextStepButton"));
+const React = __importStar(require("react"));
 const react_1 = require("react");
 const Translation_1 = require("translations/Translation");
 const react_i18next_1 = require("react-i18next");
 const contexts_1 = require("@frontend/contexts");
-const DataLayer_1 = require("util/DataLayer");
+const DataLayer_1 = __importStar(require("util/DataLayer"));
 const contexts_2 = require("@frontend/contexts");
 function StepOneNextStepButton(props) {
     const { t } = (0, react_i18next_1.useTranslation)();

package/dist/src/components/steps/date/StepOneNextStepButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepOneNextStepButton.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneNextStepButton.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,8EAAuE;AACvE,+BAA+B;AAC/B,iCAAmC;AACnC,0DAAuD;AACvD,iDAA+C;AAC/C,iDAAmD;AACnD,8CAA6E;AAC7E,iDAA2D;AAE3D,SAAwB,qBAAqB,CAAC,KAAU;IACpD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAC1C,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAE1D,IAAI,KAAK,GAAG,EAAE,CAAC;IAEf,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE;QACpB,KAAK,GAAG,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;KACjD;SAAM,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;QACzB,KAAK,GAAG,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC;KACpD;SAAM;QACH,KAAK,GAAG,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC;KACnD;IAED,MAAM,oBAAoB,GAAG,GAAS,EAAE;;QACpC,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,oBAAoB,EAAE,2BAAe,CAAC,MAAM,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QAExG,IAAI,MAAA,OAAO,CAAC,iBAAiB,0CAAE,YAAY,EAAE,EAAE;YAC3C,MAAM,gBAAgB,GAAG,OAAO,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC,CAAC;YAExF,IAAI,gBAAgB,CAAC,MAAM,EAAE;gBACzB,gBAAgB,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;oBAC7B,GAAG,CAAC,YAAY,CAAC,OAAO,CAAC,iBAAiB,CAAC,YAAY,EAAE,CAAC,CAAC;oBAC3D,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;gBACjC,CAAC,CAAC,CAAC;aACN;SACJ;QAED,OAAO,IAAI,CAAC;IAChB,CAAC,CAAA,CAAC;IAEF,OAAO,CACH,oBAAC,wBAAc,IAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,QAAQ,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,OAAO,EAAE,oBAAoB,GAAI,CAC9K,CAAC;AACN,CAAC;AApCD,wCAoCC","sourcesContent":["import NextStepButton from 'components/generic/buttons/NextStepButton';\nimport * as React from 'react';\nimport { useContext } from 'react';\nimport { Translation } from 'translations/Translation';\nimport { useTranslation } from 'react-i18next';\nimport { BasketContext } from '@frontend/contexts';\nimport DataLayer, { InteractionStep, InteractionType } from 'util/DataLayer';\nimport { FullPageEngineContext } from '@frontend/contexts';\n\nexport default function StepOneNextStepButton(props: any) {\n    const { t } = useTranslation();\n\n    const context = useContext(BasketContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n\n    let label = '';\n\n    if (!context.startDate) {\n        label = Translation.Step.Date.SelectStartDate;\n    } else if (!context.endDate) {\n        label = Translation.Step.Date.SelectCheckoutDate;\n    } else {\n        label = Translation.Step.Date.CheckAvailability;\n    }\n\n    const buttonOnClickHandler = async () => {\n        DataLayer.instance.sendInteraction('Check Availability', InteractionType.BUTTON, InteractionStep.DATES);\n\n        if (context.selectedBasketRow?.getPromoCode()) {\n            const rowsWithoutPromo = context.currentBasketRows.filter((row) => !row.getPromoCode());\n\n            if (rowsWithoutPromo.length) {\n                rowsWithoutPromo.forEach((row) => {\n                    row.setPromoCode(context.selectedBasketRow.getPromoCode());\n                    context.updateBasketRow(row);\n                });\n            }\n        }\n\n        return true;\n    };\n\n    return (\n        <NextStepButton text={t(label)} history={props.history} disabled={!context.endDate} currentStep={currentStep} hideIcon={!context.endDate} onClick={buttonOnClickHandler} />\n    );\n}\n"]}
+{"version":3,"file":"StepOneNextStepButton.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneNextStepButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+FAAuE;AACvE,6CAA+B;AAC/B,iCAAmC;AACnC,0DAAuD;AACvD,iDAA+C;AAC/C,iDAAmD;AACnD,4DAA6E;AAC7E,iDAA2D;AAE3D,SAAwB,qBAAqB,CAAC,KAAU;IACpD,MAAM,EAAE,CAAC,EAAE,GAAG,IAAA,8BAAc,GAAE,CAAC;IAE/B,MAAM,OAAO,GAAG,IAAA,kBAAU,EAAC,wBAAa,CAAC,CAAC;IAC1C,MAAM,EAAE,WAAW,EAAE,GAAG,IAAA,kBAAU,EAAC,gCAAqB,CAAC,CAAC;IAE1D,IAAI,KAAK,GAAG,EAAE,CAAC;IAEf,IAAI,CAAC,OAAO,CAAC,SAAS,EAAE;QACpB,KAAK,GAAG,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC;KACjD;SAAM,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;QACzB,KAAK,GAAG,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC;KACpD;SAAM;QACH,KAAK,GAAG,yBAAW,CAAC,IAAI,CAAC,IAAI,CAAC,iBAAiB,CAAC;KACnD;IAED,MAAM,oBAAoB,GAAG,GAAS,EAAE;;QACpC,mBAAS,CAAC,QAAQ,CAAC,eAAe,CAAC,oBAAoB,EAAE,2BAAe,CAAC,MAAM,EAAE,2BAAe,CAAC,KAAK,CAAC,CAAC;QAExG,IAAI,MAAA,OAAO,CAAC,iBAAiB,0CAAE,YAAY,EAAE,EAAE;YAC3C,MAAM,gBAAgB,GAAG,OAAO,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,YAAY,EAAE,CAAC,CAAC;YAExF,IAAI,gBAAgB,CAAC,MAAM,EAAE;gBACzB,gBAAgB,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;oBAC7B,GAAG,CAAC,YAAY,CAAC,OAAO,CAAC,iBAAiB,CAAC,YAAY,EAAE,CAAC,CAAC;oBAC3D,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;gBACjC,CAAC,CAAC,CAAC;aACN;SACJ;QAED,OAAO,IAAI,CAAC;IAChB,CAAC,CAAA,CAAC;IAEF,OAAO,CACH,oBAAC,wBAAc,IAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAE,QAAQ,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC,OAAO,CAAC,OAAO,EAAE,OAAO,EAAE,oBAAoB,GAAI,CAC9K,CAAC;AACN,CAAC;AApCD,wCAoCC","sourcesContent":["import NextStepButton from 'components/generic/buttons/NextStepButton';\nimport * as React from 'react';\nimport { useContext } from 'react';\nimport { Translation } from 'translations/Translation';\nimport { useTranslation } from 'react-i18next';\nimport { BasketContext } from '@frontend/contexts';\nimport DataLayer, { InteractionStep, InteractionType } from 'util/DataLayer';\nimport { FullPageEngineContext } from '@frontend/contexts';\n\nexport default function StepOneNextStepButton(props: any) {\n    const { t } = useTranslation();\n\n    const context = useContext(BasketContext);\n    const { currentStep } = useContext(FullPageEngineContext);\n\n    let label = '';\n\n    if (!context.startDate) {\n        label = Translation.Step.Date.SelectStartDate;\n    } else if (!context.endDate) {\n        label = Translation.Step.Date.SelectCheckoutDate;\n    } else {\n        label = Translation.Step.Date.CheckAvailability;\n    }\n\n    const buttonOnClickHandler = async () => {\n        DataLayer.instance.sendInteraction('Check Availability', InteractionType.BUTTON, InteractionStep.DATES);\n\n        if (context.selectedBasketRow?.getPromoCode()) {\n            const rowsWithoutPromo = context.currentBasketRows.filter((row) => !row.getPromoCode());\n\n            if (rowsWithoutPromo.length) {\n                rowsWithoutPromo.forEach((row) => {\n                    row.setPromoCode(context.selectedBasketRow.getPromoCode());\n                    context.updateBasketRow(row);\n                });\n            }\n        }\n\n        return true;\n    };\n\n    return (\n        <NextStepButton text={t(label)} history={props.history} disabled={!context.endDate} currentStep={currentStep} hideIcon={!context.endDate} onClick={buttonOnClickHandler} />\n    );\n}\n"]}

package/dist/src/components/steps/date/StepOneStatusPeople.js

@@ -1,8 +1,34 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
+const React = __importStar(require("react"));
 const contexts_1 = require("@frontend/contexts");
-const Text_1 = require("components/generic/Text");
+const Text_1 = __importDefault(require("components/generic/Text"));
 function StepOneStatusPeople() {
     const context = React.useContext(contexts_1.BasketContext);
     return (React.createElement("div", { className: "step-one-status--people" },

package/dist/src/components/steps/date/StepOneStatusPeople.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepOneStatusPeople.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneStatusPeople.tsx"],"names":[],"mappings":";;AAAA,+BAA+B;AAC/B,iDAAmD;AACnD,kDAA2C;AAE3C,SAAwB,mBAAmB;IACvC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAa,CAAC,CAAC;IAChD,OAAO,CACH,6BAAK,SAAS,EAAC,yBAAyB;QACpC,oBAAC,cAAI;YACA,OAAO,CAAC,iBAAiB,CAAC,IAAI,CAAC;;YAC/B,OAAO,CAAC,mBAAmB,CAAC,IAAI,CAAC;;YACjC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAC5B,CACL,CACT,CAAC;AACN,CAAC;AAXD,sCAWC","sourcesContent":["import * as React from 'react';\nimport { BasketContext } from '@frontend/contexts';\nimport Text from 'components/generic/Text';\n\nexport default function StepOneStatusPeople() {\n    const context = React.useContext(BasketContext);\n    return (\n        <div className=\"step-one-status--people\">\n            <Text>\n                {context.getNumberOfAdults(true)},&nbsp;\n                {context.getNumberOfChildren(true)},&nbsp;\n                {context.getNumberOfRooms(true)}\n            </Text>\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"StepOneStatusPeople.js","sourceRoot":"/","sources":["src/components/steps/date/StepOneStatusPeople.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,iDAAmD;AACnD,mEAA2C;AAE3C,SAAwB,mBAAmB;IACvC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAa,CAAC,CAAC;IAChD,OAAO,CACH,6BAAK,SAAS,EAAC,yBAAyB;QACpC,oBAAC,cAAI;YACA,OAAO,CAAC,iBAAiB,CAAC,IAAI,CAAC;;YAC/B,OAAO,CAAC,mBAAmB,CAAC,IAAI,CAAC;;YACjC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAC5B,CACL,CACT,CAAC;AACN,CAAC;AAXD,sCAWC","sourcesContent":["import * as React from 'react';\nimport { BasketContext } from '@frontend/contexts';\nimport Text from 'components/generic/Text';\n\nexport default function StepOneStatusPeople() {\n    const context = React.useContext(BasketContext);\n    return (\n        <div className=\"step-one-status--people\">\n            <Text>\n                {context.getNumberOfAdults(true)},&nbsp;\n                {context.getNumberOfChildren(true)},&nbsp;\n                {context.getNumberOfRooms(true)}\n            </Text>\n        </div>\n    );\n}\n"]}

package/dist/src/components/steps/hotel/HotelCard.js

@@ -1,4 +1,27 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -8,26 +31,29 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
+const React = __importStar(require("react"));
 const react_1 = require("react");
 const react_i18next_1 = require("react-i18next");
 const Translation_1 = require("translations/Translation");
 const Color_1 = require("util/Color");
-const ScreenSize_1 = require("util/ScreenSize");
-const BEButton_1 = require("components/generic/BEButton");
-const Currency_1 = require("components/generic/Currency");
-const Headline_1 = require("components/generic/Headline");
-const Icon_1 = require("components/generic/Icon/Icon");
-const Text_1 = require("components/generic/Text");
-const ImageGallerySlider_1 = require("components/steps/room/ImageGallerySlider");
+const ScreenSize_1 = __importDefault(require("util/ScreenSize"));
+const BEButton_1 = __importDefault(require("components/generic/BEButton"));
+const Currency_1 = __importDefault(require("components/generic/Currency"));
+const Headline_1 = __importDefault(require("components/generic/Headline"));
+const Icon_1 = __importStar(require("components/generic/Icon/Icon"));
+const Text_1 = __importStar(require("components/generic/Text"));
+const ImageGallerySlider_1 = __importDefault(require("components/steps/room/ImageGallerySlider"));
 const react_router_dom_1 = require("react-router-dom");
-const Placeholder_1 = require("components/generic/Placeholder");
-const HotelCardModal_1 = require("components/steps/hotel/HotelCardModal");
+const Placeholder_1 = __importDefault(require("components/generic/Placeholder"));
+const HotelCardModal_1 = __importDefault(require("components/steps/hotel/HotelCardModal"));
 const contexts_1 = require("@frontend/contexts");
-const Tooltip_1 = require("components/generic/Tooltip/Tooltip");
-const SmallSpinner_1 = require("components/generic/loader/SmallSpinner");
-const StepRoom_1 = require("pages/steps/StepRoom/StepRoom");
+const Tooltip_1 = __importDefault(require("components/generic/Tooltip/Tooltip"));
+const SmallSpinner_1 = __importDefault(require("components/generic/loader/SmallSpinner"));
+const StepRoom_1 = __importDefault(require("pages/steps/StepRoom/StepRoom"));
 const HotelCard = ({ hotel }) => {
     var _a, _b, _c;
     const beContext = (0, react_1.useContext)(contexts_1.BookingEngineContext);

package/dist/src/components/steps/hotel/HotelCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"HotelCard.js","sourceRoot":"/","sources":["src/components/steps/hotel/HotelCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useState, useContext, useEffect, useMemo, useRef } from 'react';\n\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport { Color } from 'util/Color';\nimport ScreenSize from 'util/ScreenSize';\nimport BEButton from 'components/generic/BEButton';\nimport Currency from 'components/generic/Currency';\nimport Headline from 'components/generic/Headline';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport Text, { TextType } from 'components/generic/Text';\nimport ImageGallerySlider from 'components/steps/room/ImageGallerySlider';\nimport { useHistory } from 'react-router-dom';\nimport Placeholder from 'components/generic/Placeholder';\nimport HotelCardModal from 'components/steps/hotel/HotelCardModal';\nimport { BookingEngineContext, CompanyContext } from '@frontend/contexts';\nimport Tooltip from 'components/generic/Tooltip/Tooltip';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\n\nimport SmallSpinner from 'components/generic/loader/SmallSpinner';\nimport StepRoom from 'pages/steps/StepRoom/StepRoom';\n\ninterface HotelCardProps {\n    hotel: Hotel;\n}\n\nconst HotelCard = ({ hotel }: HotelCardProps) => {\n    const beContext = useContext(BookingEngineContext);\n    const ccx = useContext(CompanyContext);\n\n    const history = useHistory();\n\n    const [images, setImages] = useState([hotel.heroImage]);\n    const [modalOpen, setModalOpen] = useState(false);\n\n    const hotelCardRef = useRef();\n\n    const currentPrice = hotel.lowestPrice?.value;\n    const currentPriceLoading = hotel.lowestPrice?.isLoading;\n\n    const showPrice = currentPriceLoading || (!currentPriceLoading && currentPrice > 0);\n\n    const { t } = useTranslation();\n\n    useEffect(() => {\n        const newImages: string[] = [hotel.heroImage];\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.rooms]);\n\n    useEffect(() => {\n        if (!hotel.hasLoadedDetails) {\n            // If we haven't fetched this hotel yet, lets trigger\n            ccx.getHotel(hotel.hotelID);\n        }\n    }, [hotel.hasLoadedDetails]);\n\n    const [openPerk, setOpenPerk] = useState(hotel.perks[0]?.name);\n    const colorProfile = hotel.colors;\n\n    const onViewRoomsClicked = async () => {\n        ccx.changeHotel(hotel);\n\n        history.push(StepRoom.getStepUrl());\n    };\n\n    const onMoreDetailsClicked = async () => {\n        setModalOpen(true);\n    };\n\n    const onModalClose = () => {\n        setModalOpen(false);\n    };\n\n    const isLoading = !hotel.hasLoadedDetails;\n\n    return useMemo(() => {\n        const content = isLoading ? (\n            <div>\n                <div className=\"d-flex flex-column\">\n                    <Placeholder type=\"block\" blockSize=\"sm\" rounded=\"lg\" blink={true} />\n                    <div className=\"u-pad\">\n                        <Placeholder type=\"text\" w=\"md\" h=\"md\" blink={true} />\n                        <Placeholder type=\"text\" w=\"md\" h=\"md\" blink={true} />\n                        <div className=\"u-marg-top\">\n                            <div className=\"u-flex justify-space-between\">\n                                <Placeholder type=\"block\" blockSize=\"xs\" rounded=\"lg\" blink={true} />\n                                <Placeholder type=\"block\" blockSize=\"xs\" rounded=\"lg\" blink={true} />\n                                <Placeholder type=\"block\" blockSize=\"xs\" rounded=\"lg\" blink={true} />\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        ) : (\n            <div className=\"large-hotel-card u-rounded h-100 justify-items-between\">\n                <div className=\"large-hotel-card--image\">\n                    <ImageGallerySlider images={images} />\n                </div>\n                <div className=\"large-hotel-card--body u-pad--heavy u-pad-bottom--none container\">\n                    <Headline bold={true}>{hotel?.name}</Headline>\n                    <Text color={Color.DarkGrey} bold={true} className=\"u-marg-bottom--light\">\n                        {hotel?.address?.city}\n                    </Text>\n                    <div className=\"u-flex u-marg-bottom\">\n                        <Text type={TextType.Small}>{[hotel?.address?.line1, hotel?.address?.line2, hotel?.address?.state].filter((line) => !!line).join(', ')}</Text>\n                    </div>\n                    <div className=\"u-marg-bottom--medium large-hotel-card--description\">\n                        <Text className=\"text\" type={TextType.Small}>\n                            <span dangerouslySetInnerHTML={{ __html: hotel.description }}></span>\n                        </Text>\n                    </div>\n                    {!!hotel.perks?.length && (\n                        <Text className=\"u-marg-bottom\" bold={true} type={TextType.Small} color={Color.Accent}>\n                            And these come free...\n                        </Text>\n                    )}\n                    <div className=\"u-flex u-flex-align-center u-marg-bottom--medium\">\n                        {!!hotel.perks?.length && (\n                            <div className=\"u-flex\">\n                                {hotel.perks.slice(0, 5).map((perk) => {\n                                    const openPerkOnClick = () => {\n                                        setOpenPerk(perk.name);\n                                    };\n                                    return (\n                                        <div className=\"u-flex u-flex-align-center\" key={perk.name}>\n                                            <Tooltip title={perk.tooltip ?? perk.name} overrideContainer={hotelCardRef?.current}>\n                                                <div\n                                                    onClick={openPerkOnClick}\n                                                    style={{ backgroundColor: Color.Snow }}\n                                                    className=\"u-rounded u-pad--light u-marg-right--light d-flex justify-center\"\n                                                >\n                                                    <div className=\"u-mw-16 d-flex justify-content-center\">{perk.iconElement ? perk.iconElement : <Icon icon={perk.icon} />}</div>\n                                                </div>\n                                            </Tooltip>\n                                            <div\n                                                className={\n                                                    'u-marg-right u-none@l- u-block@m- ' +\n                                                    (beContext.screenSize > ScreenSize.Medium ||\n                                                    beContext.screenSize <= ScreenSize.Mobile ||\n                                                    (beContext.screenSize > ScreenSize.Mobile && beContext.screenSize <= ScreenSize.Medium && openPerk !== perk.name)\n                                                        ? 'u-none-2'\n                                                        : '')\n                                                }\n                                            >\n                                                <Text type={TextType.Small}>{perk.name}</Text>\n                                            </div>\n                                        </div>\n                                    );\n                                })}\n                            </div>\n                        )}\n                        <BEButton icon={IconType.ArrowRight2} isText={true} primary={true} size=\"tiny\" iconPosition=\"right\" onClick={onMoreDetailsClicked}>\n                            {t(Translation.Step.Room.RoomInfo.MoreDetails)}\n                        </BEButton>\n                    </div>\n                </div>\n                <div className=\"u-pad--heavy u-pad-top--none h-100 justify-content-end u-flex flex-column u-flex-align-flex-start align-items-md-start no-gutters\">\n                    {showPrice ? (\n                        <>\n                            <Text type={TextType.Small} color={Color.Navy} inline={true}>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"u-flex u-flex-flex-start u-flex-align-center flex-row\">\n                                <Headline bold={true} className=\"u-flex\">\n                                    {hotel.lowestPrice?.isLoading ? (\n                                        <SmallSpinner />\n                                    ) : (\n                                        <Currency hideDecimals={true} originalCurrencyCode={hotel.defaultCurrency}>\n                                            {currentPrice}\n                                        </Currency>\n                                    )}\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline={true}>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Small} color={Color.Grey} inline={true} className=\"u-nowrap\">\n                                    {t(Translation.Step.Room.ExcludingTaxes)}\n                                </Text>\n                            </div>\n                        </>\n                    ) : (\n                        <div className=\"u-h-fill d-flex align-items-center\">\n                            <Text type={TextType.Small} color={Color.Alert}>\n                                {t(Translation.Step.Hotel.HotelCard.DatesUnavailable)}\n                            </Text>\n                        </div>\n                    )}\n\n                    <div className=\"u-marg-top--light u-flex justify-content-end u-w-100@m-\">\n                        <BEButton\n                            name=\"ViewRatesNowButton\"\n                            primary={true}\n                            primaryActive={true}\n                            filled={true}\n                            icon={IconType.ArrowRight}\n                            iconPosition={'right'}\n                            wide={beContext.screenSize <= ScreenSize.Medium}\n                            onClick={onViewRoomsClicked}\n                        >\n                            View Rooms\n                        </BEButton>\n                    </div>\n                </div>\n                <HotelCardModal open={modalOpen} onClose={onModalClose} hotel={hotel} container={hotelCardRef?.current} />\n            </div>\n        );\n\n        return (\n            <span ref={hotelCardRef} id={`hotel-card-${hotel.hotelID}`}>\n                <style\n                    dangerouslySetInnerHTML={{\n                        __html: ` \n                    #hotel-card-modal-${hotel.hotelID},\n                    #hotel-card-${hotel.hotelID} {\n                        --rs-color-accent-1: ${colorProfile.accent}!important;\n                        --rs-color-accent-2: ${colorProfile.accent2}!important;\n                        --rs-color-accent-3: ${colorProfile.accent3}!important;\n                    }\n                `,\n                    }}\n                />\n                {content}\n            </span>\n        );\n    }, [currentPrice, isLoading, currentPriceLoading, modalOpen, hotelCardRef, openPerk]);\n};\n\nexport default HotelCard;\n"]}
+{"version":3,"file":"HotelCard.js","sourceRoot":"/","sources":["src/components/steps/hotel/HotelCard.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useState, useContext, useEffect, useMemo, useRef } from 'react';\n\nimport { useTranslation } from 'react-i18next';\nimport { Translation } from 'translations/Translation';\nimport { Color } from 'util/Color';\nimport ScreenSize from 'util/ScreenSize';\nimport BEButton from 'components/generic/BEButton';\nimport Currency from 'components/generic/Currency';\nimport Headline from 'components/generic/Headline';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport Text, { TextType } from 'components/generic/Text';\nimport ImageGallerySlider from 'components/steps/room/ImageGallerySlider';\nimport { useHistory } from 'react-router-dom';\nimport Placeholder from 'components/generic/Placeholder';\nimport HotelCardModal from 'components/steps/hotel/HotelCardModal';\nimport { BookingEngineContext, CompanyContext } from '@frontend/contexts';\nimport Tooltip from 'components/generic/Tooltip/Tooltip';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\n\nimport SmallSpinner from 'components/generic/loader/SmallSpinner';\nimport StepRoom from 'pages/steps/StepRoom/StepRoom';\n\ninterface HotelCardProps {\n    hotel: Hotel;\n}\n\nconst HotelCard = ({ hotel }: HotelCardProps) => {\n    const beContext = useContext(BookingEngineContext);\n    const ccx = useContext(CompanyContext);\n\n    const history = useHistory();\n\n    const [images, setImages] = useState([hotel.heroImage]);\n    const [modalOpen, setModalOpen] = useState(false);\n\n    const hotelCardRef = useRef();\n\n    const currentPrice = hotel.lowestPrice?.value;\n    const currentPriceLoading = hotel.lowestPrice?.isLoading;\n\n    const showPrice = currentPriceLoading || (!currentPriceLoading && currentPrice > 0);\n\n    const { t } = useTranslation();\n\n    useEffect(() => {\n        const newImages: string[] = [hotel.heroImage];\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.rooms]);\n\n    useEffect(() => {\n        if (!hotel.hasLoadedDetails) {\n            // If we haven't fetched this hotel yet, lets trigger\n            ccx.getHotel(hotel.hotelID);\n        }\n    }, [hotel.hasLoadedDetails]);\n\n    const [openPerk, setOpenPerk] = useState(hotel.perks[0]?.name);\n    const colorProfile = hotel.colors;\n\n    const onViewRoomsClicked = async () => {\n        ccx.changeHotel(hotel);\n\n        history.push(StepRoom.getStepUrl());\n    };\n\n    const onMoreDetailsClicked = async () => {\n        setModalOpen(true);\n    };\n\n    const onModalClose = () => {\n        setModalOpen(false);\n    };\n\n    const isLoading = !hotel.hasLoadedDetails;\n\n    return useMemo(() => {\n        const content = isLoading ? (\n            <div>\n                <div className=\"d-flex flex-column\">\n                    <Placeholder type=\"block\" blockSize=\"sm\" rounded=\"lg\" blink={true} />\n                    <div className=\"u-pad\">\n                        <Placeholder type=\"text\" w=\"md\" h=\"md\" blink={true} />\n                        <Placeholder type=\"text\" w=\"md\" h=\"md\" blink={true} />\n                        <div className=\"u-marg-top\">\n                            <div className=\"u-flex justify-space-between\">\n                                <Placeholder type=\"block\" blockSize=\"xs\" rounded=\"lg\" blink={true} />\n                                <Placeholder type=\"block\" blockSize=\"xs\" rounded=\"lg\" blink={true} />\n                                <Placeholder type=\"block\" blockSize=\"xs\" rounded=\"lg\" blink={true} />\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        ) : (\n            <div className=\"large-hotel-card u-rounded h-100 justify-items-between\">\n                <div className=\"large-hotel-card--image\">\n                    <ImageGallerySlider images={images} />\n                </div>\n                <div className=\"large-hotel-card--body u-pad--heavy u-pad-bottom--none container\">\n                    <Headline bold={true}>{hotel?.name}</Headline>\n                    <Text color={Color.DarkGrey} bold={true} className=\"u-marg-bottom--light\">\n                        {hotel?.address?.city}\n                    </Text>\n                    <div className=\"u-flex u-marg-bottom\">\n                        <Text type={TextType.Small}>{[hotel?.address?.line1, hotel?.address?.line2, hotel?.address?.state].filter((line) => !!line).join(', ')}</Text>\n                    </div>\n                    <div className=\"u-marg-bottom--medium large-hotel-card--description\">\n                        <Text className=\"text\" type={TextType.Small}>\n                            <span dangerouslySetInnerHTML={{ __html: hotel.description }}></span>\n                        </Text>\n                    </div>\n                    {!!hotel.perks?.length && (\n                        <Text className=\"u-marg-bottom\" bold={true} type={TextType.Small} color={Color.Accent}>\n                            And these come free...\n                        </Text>\n                    )}\n                    <div className=\"u-flex u-flex-align-center u-marg-bottom--medium\">\n                        {!!hotel.perks?.length && (\n                            <div className=\"u-flex\">\n                                {hotel.perks.slice(0, 5).map((perk) => {\n                                    const openPerkOnClick = () => {\n                                        setOpenPerk(perk.name);\n                                    };\n                                    return (\n                                        <div className=\"u-flex u-flex-align-center\" key={perk.name}>\n                                            <Tooltip title={perk.tooltip ?? perk.name} overrideContainer={hotelCardRef?.current}>\n                                                <div\n                                                    onClick={openPerkOnClick}\n                                                    style={{ backgroundColor: Color.Snow }}\n                                                    className=\"u-rounded u-pad--light u-marg-right--light d-flex justify-center\"\n                                                >\n                                                    <div className=\"u-mw-16 d-flex justify-content-center\">{perk.iconElement ? perk.iconElement : <Icon icon={perk.icon} />}</div>\n                                                </div>\n                                            </Tooltip>\n                                            <div\n                                                className={\n                                                    'u-marg-right u-none@l- u-block@m- ' +\n                                                    (beContext.screenSize > ScreenSize.Medium ||\n                                                    beContext.screenSize <= ScreenSize.Mobile ||\n                                                    (beContext.screenSize > ScreenSize.Mobile && beContext.screenSize <= ScreenSize.Medium && openPerk !== perk.name)\n                                                        ? 'u-none-2'\n                                                        : '')\n                                                }\n                                            >\n                                                <Text type={TextType.Small}>{perk.name}</Text>\n                                            </div>\n                                        </div>\n                                    );\n                                })}\n                            </div>\n                        )}\n                        <BEButton icon={IconType.ArrowRight2} isText={true} primary={true} size=\"tiny\" iconPosition=\"right\" onClick={onMoreDetailsClicked}>\n                            {t(Translation.Step.Room.RoomInfo.MoreDetails)}\n                        </BEButton>\n                    </div>\n                </div>\n                <div className=\"u-pad--heavy u-pad-top--none h-100 justify-content-end u-flex flex-column u-flex-align-flex-start align-items-md-start no-gutters\">\n                    {showPrice ? (\n                        <>\n                            <Text type={TextType.Small} color={Color.Navy} inline={true}>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"u-flex u-flex-flex-start u-flex-align-center flex-row\">\n                                <Headline bold={true} className=\"u-flex\">\n                                    {hotel.lowestPrice?.isLoading ? (\n                                        <SmallSpinner />\n                                    ) : (\n                                        <Currency hideDecimals={true} originalCurrencyCode={hotel.defaultCurrency}>\n                                            {currentPrice}\n                                        </Currency>\n                                    )}\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline={true}>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Small} color={Color.Grey} inline={true} className=\"u-nowrap\">\n                                    {t(Translation.Step.Room.ExcludingTaxes)}\n                                </Text>\n                            </div>\n                        </>\n                    ) : (\n                        <div className=\"u-h-fill d-flex align-items-center\">\n                            <Text type={TextType.Small} color={Color.Alert}>\n                                {t(Translation.Step.Hotel.HotelCard.DatesUnavailable)}\n                            </Text>\n                        </div>\n                    )}\n\n                    <div className=\"u-marg-top--light u-flex justify-content-end u-w-100@m-\">\n                        <BEButton\n                            name=\"ViewRatesNowButton\"\n                            primary={true}\n                            primaryActive={true}\n                            filled={true}\n                            icon={IconType.ArrowRight}\n                            iconPosition={'right'}\n                            wide={beContext.screenSize <= ScreenSize.Medium}\n                            onClick={onViewRoomsClicked}\n                        >\n                            View Rooms\n                        </BEButton>\n                    </div>\n                </div>\n                <HotelCardModal open={modalOpen} onClose={onModalClose} hotel={hotel} container={hotelCardRef?.current} />\n            </div>\n        );\n\n        return (\n            <span ref={hotelCardRef} id={`hotel-card-${hotel.hotelID}`}>\n                <style\n                    dangerouslySetInnerHTML={{\n                        __html: ` \n                    #hotel-card-modal-${hotel.hotelID},\n                    #hotel-card-${hotel.hotelID} {\n                        --rs-color-accent-1: ${colorProfile.accent}!important;\n                        --rs-color-accent-2: ${colorProfile.accent2}!important;\n                        --rs-color-accent-3: ${colorProfile.accent3}!important;\n                    }\n                `,\n                    }}\n                />\n                {content}\n            </span>\n        );\n    }, [currentPrice, isLoading, currentPriceLoading, modalOpen, hotelCardRef, openPerk]);\n};\n\nexport default HotelCard;\n"]}

package/dist/src/components/steps/hotel/HotelCardList.js

@@ -1,8 +1,34 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const HotelCard_1 = require("components/steps/hotel/HotelCard");
-const NoHotelsAvailable_1 = require("components/steps/hotel/NoHotelsAvailable");
+const React = __importStar(require("react"));
+const HotelCard_1 = __importDefault(require("components/steps/hotel/HotelCard"));
+const NoHotelsAvailable_1 = __importDefault(require("components/steps/hotel/NoHotelsAvailable"));
 function HotelCardList({ hotelList }) {
     return (hotelList === null || hotelList === void 0 ? void 0 : hotelList.length) > 0 ? (React.createElement("div", { className: "row" }, hotelList.map((hotel, index) => {
         return (React.createElement("div", { key: `${hotel.hotelID}-${index}`, className: "col-md-4 u-marg-bottom--heavy" },

package/dist/src/components/steps/hotel/HotelCardList.js.map

@@ -1 +1 @@
-{"version":3,"file":"HotelCardList.js","sourceRoot":"/","sources":["src/components/steps/hotel/HotelCardList.tsx"],"names":[],"mappings":";;AAAA,+BAA+B;AAG/B,gEAAyD;AACzD,gFAAyE;AAMzE,SAAwB,aAAa,CAAC,EAAE,SAAS,EAAsB;IACnE,OAAO,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,MAAM,IAAG,CAAC,CAAC,CAAC,CAAC,CAC3B,6BAAK,SAAS,EAAC,KAAK,IACf,SAAS,CAAC,GAAG,CAAC,CAAC,KAAY,EAAE,KAAa,EAAE,EAAE;QAC3C,OAAO,CACH,6BAAK,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,IAAI,KAAK,EAAE,EAAE,SAAS,EAAC,+BAA+B;YAC5E,oBAAC,mBAAS,IAAC,KAAK,EAAE,KAAK,GAAI,CACzB,CACT,CAAC;IACN,CAAC,CAAC,CACA,CACT,CAAC,CAAC,CAAC,CACA,oBAAC,2BAAiB,OAAG,CACxB,CAAC;AACN,CAAC;AAdD,gCAcC","sourcesContent":["import * as React from 'react';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\n\nimport HotelCard from 'components/steps/hotel/HotelCard';\nimport NoHotelsAvailable from 'components/steps/hotel/NoHotelsAvailable';\n\nexport interface HotelCardListProps {\n    hotelList: Hotel[];\n}\n\nexport default function HotelCardList({ hotelList }: HotelCardListProps) {\n    return hotelList?.length > 0 ? (\n        <div className=\"row\">\n            {hotelList.map((hotel: Hotel, index: number) => {\n                return (\n                    <div key={`${hotel.hotelID}-${index}`} className=\"col-md-4 u-marg-bottom--heavy\">\n                        <HotelCard hotel={hotel} />\n                    </div>\n                );\n            })}\n        </div>\n    ) : (\n        <NoHotelsAvailable />\n    );\n}\n"]}
+{"version":3,"file":"HotelCardList.js","sourceRoot":"/","sources":["src/components/steps/hotel/HotelCardList.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAG/B,iFAAyD;AACzD,iGAAyE;AAMzE,SAAwB,aAAa,CAAC,EAAE,SAAS,EAAsB;IACnE,OAAO,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,MAAM,IAAG,CAAC,CAAC,CAAC,CAAC,CAC3B,6BAAK,SAAS,EAAC,KAAK,IACf,SAAS,CAAC,GAAG,CAAC,CAAC,KAAY,EAAE,KAAa,EAAE,EAAE;QAC3C,OAAO,CACH,6BAAK,GAAG,EAAE,GAAG,KAAK,CAAC,OAAO,IAAI,KAAK,EAAE,EAAE,SAAS,EAAC,+BAA+B;YAC5E,oBAAC,mBAAS,IAAC,KAAK,EAAE,KAAK,GAAI,CACzB,CACT,CAAC;IACN,CAAC,CAAC,CACA,CACT,CAAC,CAAC,CAAC,CACA,oBAAC,2BAAiB,OAAG,CACxB,CAAC;AACN,CAAC;AAdD,gCAcC","sourcesContent":["import * as React from 'react';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\n\nimport HotelCard from 'components/steps/hotel/HotelCard';\nimport NoHotelsAvailable from 'components/steps/hotel/NoHotelsAvailable';\n\nexport interface HotelCardListProps {\n    hotelList: Hotel[];\n}\n\nexport default function HotelCardList({ hotelList }: HotelCardListProps) {\n    return hotelList?.length > 0 ? (\n        <div className=\"row\">\n            {hotelList.map((hotel: Hotel, index: number) => {\n                return (\n                    <div key={`${hotel.hotelID}-${index}`} className=\"col-md-4 u-marg-bottom--heavy\">\n                        <HotelCard hotel={hotel} />\n                    </div>\n                );\n            })}\n        </div>\n    ) : (\n        <NoHotelsAvailable />\n    );\n}\n"]}

package/dist/src/components/steps/hotel/HotelCardModal.js

@@ -1,23 +1,49 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
+const React = __importStar(require("react"));
 const react_1 = require("react");
 const react_i18next_1 = require("react-i18next");
 const react_router_dom_1 = require("react-router-dom");
 const contexts_1 = require("@frontend/contexts");
-const StepHotel_1 = require("pages/steps/StepHotel/StepHotel");
+const StepHotel_1 = __importDefault(require("pages/steps/StepHotel/StepHotel"));
 const Translation_1 = require("translations/Translation");
 const Color_1 = require("util/Color");
-const StepManager_1 = require("util/StepManager");
-const BEButton_1 = require("components/generic/BEButton");
-const Currency_1 = require("components/generic/Currency");
-const Headline_1 = require("components/generic/Headline");
-const Icon_1 = require("components/generic/Icon/Icon");
-const LineBreak_1 = require("components/generic/LineBreak");
-const SimpleModal_1 = require("components/generic/modal/SimpleModal");
-const Text_1 = require("components/generic/Text");
-const TransportDistanceFromHotelBlock_1 = require("components/summary/TransportDistanceFromHotelBlock");
-const ImageGallerySlider_1 = require("components/steps/room/ImageGallerySlider");
+const StepManager_1 = __importDefault(require("util/StepManager"));
+const BEButton_1 = __importDefault(require("components/generic/BEButton"));
+const Currency_1 = __importDefault(require("components/generic/Currency"));
+const Headline_1 = __importDefault(require("components/generic/Headline"));
+const Icon_1 = __importStar(require("components/generic/Icon/Icon"));
+const LineBreak_1 = __importDefault(require("components/generic/LineBreak"));
+const SimpleModal_1 = __importStar(require("components/generic/modal/SimpleModal"));
+const Text_1 = __importStar(require("components/generic/Text"));
+const TransportDistanceFromHotelBlock_1 = __importDefault(require("components/summary/TransportDistanceFromHotelBlock"));
+const ImageGallerySlider_1 = __importDefault(require("components/steps/room/ImageGallerySlider"));
 const HotelCardModal = (props) => {
     var _a;
     const hotel = props.hotel;

package/dist/src/components/steps/hotel/HotelCardModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"HotelCardModal.js","sourceRoot":"/","sources":["src/components/steps/hotel/HotelCardModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useHistory } from 'react-router-dom';\nimport { CompanyContext } from '@frontend/contexts';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\n\nimport StepHotel from 'pages/steps/StepHotel/StepHotel';\nimport { Translation } from 'translations/Translation';\nimport { Color } from 'util/Color';\nimport StepManager from 'util/StepManager';\nimport BEButton from 'components/generic/BEButton';\nimport Currency from 'components/generic/Currency';\nimport Headline from 'components/generic/Headline';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport LineBreak from 'components/generic/LineBreak';\nimport SimpleModal, { SimpleModalSize } from 'components/generic/modal/SimpleModal';\nimport Text, { TextType } from 'components/generic/Text';\nimport TransportDistanceFromHotelBlock from 'components/summary/TransportDistanceFromHotelBlock';\nimport ImageGallerySlider from 'components/steps/room/ImageGallerySlider';\n\ninterface HotelCardModalProps {\n    open: boolean;\n    hotel: Hotel;\n\n    onClose: () => void;\n\n    container: HTMLElement;\n}\n\nconst HotelCardModal = (props: HotelCardModalProps) => {\n    const hotel = props.hotel;\n\n    const [images, setImages] = useState([props.hotel.heroImage]);\n    const ccx = useContext(CompanyContext);\n    const history = useHistory();\n\n    const { t } = useTranslation();\n\n    const currentPrice = hotel.lowestPrice?.value;\n\n    useEffect(() => {\n        const newImages: string[] = [hotel.heroImage];\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.rooms]);\n\n    const perksFree = hotel.perks;\n\n    const onClickViewRooms = () => {\n        ccx.changeHotel(hotel);\n        history.push(StepManager.getNextStepUrl(StepHotel));\n    };\n\n    return (\n        <SimpleModal style={{ overflow: 'scroll' }} size={SimpleModalSize.Small} open={props.open} onClose={props.onClose} title={hotel.name} modalTarget={props.container}>\n            <div style={{ backgroundColor: Color.White }} id={`hotel-card-modal-${hotel.hotelID}`}>\n                <div style={{ height: '350px' }}>\n                    <ImageGallerySlider images={images} />\n                </div>\n                <div className=\"container u-pad--heavy\">\n                    <div className=\"u-marg-bottom--heavy\">\n                        <div className=\"u-marg-bottom--light\">\n                            <Headline size=\"large\" bold={true}>\n                                {hotel.name}\n                            </Headline>\n                        </div>\n                        <Text bold={true} color={Color.DarkGrey}>\n                            {hotel.address.city}\n                        </Text>\n                    </div>\n                    <div className=\"u-marg-top-bottom--heavy row\">\n                        <TransportDistanceFromHotelBlock tightMargins={true} hotel={hotel} />\n                    </div>\n                    <div className=\"u-marg-bottom--heavy\">\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {hotel.address.line1}, {hotel.address.line2}\n                        </Text>\n                    </div>\n                    {!!hotel.perks.length && (\n                        <div>\n                            <Text className=\"u-marg-bottom\" bold={true} color={Color.Accent}>\n                                And these come free...\n                            </Text>\n                            <div className=\"u-flex row u-marg-bottom--massive\">\n                                {perksFree.map((perk) => {\n                                    return (\n                                        <div className=\"u-flex u-flex-align-center u-flex-flex-start col-sm-4 col-6 u-marg-bottom--light\" key={perk.name}>\n                                            <div style={{ backgroundColor: Color.Snow }} className=\"u-rounded u-pad--light u-marg-right--light\">\n                                                <div className=\"u-mw-16 d-flex justify-content-center\">{perk.iconElement ? perk.iconElement : <Icon icon={perk.icon} />}</div>\n                                            </div>\n                                            <div className=\"u-marg-right u-block@m-\">\n                                                <Text type={TextType.Small}>{perk.name}</Text>\n                                            </div>\n                                        </div>\n                                    );\n                                })}\n                            </div>\n                        </div>\n                    )}\n                    <div>\n                        <Text type={TextType.Small}>\n                            <span dangerouslySetInnerHTML={{ __html: hotel.description }}></span>\n                        </Text>\n                    </div>\n                    <LineBreak />\n                    <div className=\"u-flex\">\n                        <div style={{ paddingLeft: '0' }} className=\"col-md-6 u-flex justify-content-start flex-column align-items-start\">\n                            <Text type={TextType.Small} color={Color.Navy} inline={true}>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"room-details--content-price flex-row\">\n                                <Headline bold={true}>\n                                    <Currency hideDecimals={true} originalCurrencyCode={hotel.defaultCurrency}>\n                                        {currentPrice}\n                                    </Currency>\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline={true}>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Small} color={Color.Grey} inline={true} className=\"u-nowrap\">\n                                    {t(Translation.Step.Room.ExcludingTaxes)}\n                                </Text>\n                            </div>\n                        </div>\n                        <div>\n                            <BEButton primary={true} filled={true} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={onClickViewRooms}>\n                                View Rooms\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n};\n\nexport default HotelCardModal;\n"]}
+{"version":3,"file":"HotelCardModal.js","sourceRoot":"/","sources":["src/components/steps/hotel/HotelCardModal.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useContext, useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useHistory } from 'react-router-dom';\nimport { CompanyContext } from '@frontend/contexts';\nimport { Hotel } from 'models/Client/Hotel/Hotel';\n\nimport StepHotel from 'pages/steps/StepHotel/StepHotel';\nimport { Translation } from 'translations/Translation';\nimport { Color } from 'util/Color';\nimport StepManager from 'util/StepManager';\nimport BEButton from 'components/generic/BEButton';\nimport Currency from 'components/generic/Currency';\nimport Headline from 'components/generic/Headline';\nimport Icon, { IconType } from 'components/generic/Icon/Icon';\nimport LineBreak from 'components/generic/LineBreak';\nimport SimpleModal, { SimpleModalSize } from 'components/generic/modal/SimpleModal';\nimport Text, { TextType } from 'components/generic/Text';\nimport TransportDistanceFromHotelBlock from 'components/summary/TransportDistanceFromHotelBlock';\nimport ImageGallerySlider from 'components/steps/room/ImageGallerySlider';\n\ninterface HotelCardModalProps {\n    open: boolean;\n    hotel: Hotel;\n\n    onClose: () => void;\n\n    container: HTMLElement;\n}\n\nconst HotelCardModal = (props: HotelCardModalProps) => {\n    const hotel = props.hotel;\n\n    const [images, setImages] = useState([props.hotel.heroImage]);\n    const ccx = useContext(CompanyContext);\n    const history = useHistory();\n\n    const { t } = useTranslation();\n\n    const currentPrice = hotel.lowestPrice?.value;\n\n    useEffect(() => {\n        const newImages: string[] = [hotel.heroImage];\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.rooms]);\n\n    const perksFree = hotel.perks;\n\n    const onClickViewRooms = () => {\n        ccx.changeHotel(hotel);\n        history.push(StepManager.getNextStepUrl(StepHotel));\n    };\n\n    return (\n        <SimpleModal style={{ overflow: 'scroll' }} size={SimpleModalSize.Small} open={props.open} onClose={props.onClose} title={hotel.name} modalTarget={props.container}>\n            <div style={{ backgroundColor: Color.White }} id={`hotel-card-modal-${hotel.hotelID}`}>\n                <div style={{ height: '350px' }}>\n                    <ImageGallerySlider images={images} />\n                </div>\n                <div className=\"container u-pad--heavy\">\n                    <div className=\"u-marg-bottom--heavy\">\n                        <div className=\"u-marg-bottom--light\">\n                            <Headline size=\"large\" bold={true}>\n                                {hotel.name}\n                            </Headline>\n                        </div>\n                        <Text bold={true} color={Color.DarkGrey}>\n                            {hotel.address.city}\n                        </Text>\n                    </div>\n                    <div className=\"u-marg-top-bottom--heavy row\">\n                        <TransportDistanceFromHotelBlock tightMargins={true} hotel={hotel} />\n                    </div>\n                    <div className=\"u-marg-bottom--heavy\">\n                        <Text type={TextType.Small} color={Color.DarkGrey}>\n                            {hotel.address.line1}, {hotel.address.line2}\n                        </Text>\n                    </div>\n                    {!!hotel.perks.length && (\n                        <div>\n                            <Text className=\"u-marg-bottom\" bold={true} color={Color.Accent}>\n                                And these come free...\n                            </Text>\n                            <div className=\"u-flex row u-marg-bottom--massive\">\n                                {perksFree.map((perk) => {\n                                    return (\n                                        <div className=\"u-flex u-flex-align-center u-flex-flex-start col-sm-4 col-6 u-marg-bottom--light\" key={perk.name}>\n                                            <div style={{ backgroundColor: Color.Snow }} className=\"u-rounded u-pad--light u-marg-right--light\">\n                                                <div className=\"u-mw-16 d-flex justify-content-center\">{perk.iconElement ? perk.iconElement : <Icon icon={perk.icon} />}</div>\n                                            </div>\n                                            <div className=\"u-marg-right u-block@m-\">\n                                                <Text type={TextType.Small}>{perk.name}</Text>\n                                            </div>\n                                        </div>\n                                    );\n                                })}\n                            </div>\n                        </div>\n                    )}\n                    <div>\n                        <Text type={TextType.Small}>\n                            <span dangerouslySetInnerHTML={{ __html: hotel.description }}></span>\n                        </Text>\n                    </div>\n                    <LineBreak />\n                    <div className=\"u-flex\">\n                        <div style={{ paddingLeft: '0' }} className=\"col-md-6 u-flex justify-content-start flex-column align-items-start\">\n                            <Text type={TextType.Small} color={Color.Navy} inline={true}>\n                                {t(Translation.Misc.From)}\n                            </Text>\n                            <div className=\"room-details--content-price flex-row\">\n                                <Headline bold={true}>\n                                    <Currency hideDecimals={true} originalCurrencyCode={hotel.defaultCurrency}>\n                                        {currentPrice}\n                                    </Currency>\n                                </Headline>\n                                <Text color={Color.DarkGrey} inline={true}>\n                                    /{t(Translation.Misc.Night)}\n                                </Text>\n                            </div>\n                            <div className=\"u-marg-bottom\">\n                                <Text type={TextType.Small} color={Color.Grey} inline={true} className=\"u-nowrap\">\n                                    {t(Translation.Step.Room.ExcludingTaxes)}\n                                </Text>\n                            </div>\n                        </div>\n                        <div>\n                            <BEButton primary={true} filled={true} icon={IconType.ArrowRight} iconPosition=\"right\" onClick={onClickViewRooms}>\n                                View Rooms\n                            </BEButton>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </SimpleModal>\n    );\n};\n\nexport default HotelCardModal;\n"]}