@tripian/react 6.0.0 → 6.0.1

package/components/FormTemplate/FormTemplateTripNext/FormTemplateTripNext.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
 import Model from '@tripian/model';
-import { QuestionNext } from './model';
 /**
  * Destinations
  * Stay & Shares
@@ -9,7 +8,7 @@ import { QuestionNext } from './model';
  */
 interface IFormTemplateTripNext {
     tripProfile: Model.TripProfile;
-    tripQuestions: Array<QuestionNext>;
+    tripQuestions: Array<Model.Question>;
     cities: Array<Model.City>;
     isTripEdit?: boolean;
     callbackTripProfile: (tripProfile: Model.TripProfile) => void;
@@ -18,6 +17,20 @@ interface IFormTemplateTripNext {
     companionLoadingList: Array<number>;
     callbackUserCompanionAdd: (userCompoanion: Model.Companion) => void;
     showTripModeQuestion?: boolean;
+    stepHeaders: {
+        stepId: number;
+        header: string;
+    }[];
+    destinationTips: {
+        iconUrl: string;
+        title: string;
+        description: string;
+    }[];
+    stayAndShareTips: {
+        iconUrl: string;
+        title: string;
+        description: string;
+    }[];
     onSubmitText: string;
     onSubmit: () => void;
     onCancel: () => void;

package/components/FormTemplate/FormTemplateTripNext/StepComponent/QuestionComponent/QuestionComponent.d.ts

@@ -1,8 +1,7 @@
 import Model from '@tripian/model';
 import React from 'react';
-import { QuestionNext } from '../../model';
 export interface QuestionComponentProps {
-    question: QuestionNext;
+    question: Model.Question;
     tripProfile: Model.TripProfile;
     callbackTripAnswers: (answers: number[]) => void;
     onFocused: () => void;

package/components/FormTemplate/FormTemplateTripNext/StepComponent/StepComponent.d.ts

@@ -1,6 +1,5 @@
 import Model from '@tripian/model';
 import React from 'react';
-import { QuestionNext } from '../model';
 export interface StepComponentProps {
     header: string;
     defaultTip: {
@@ -8,7 +7,7 @@ export interface StepComponentProps {
         title: string;
         description: string;
     };
-    stepQuestions: QuestionNext[];
+    stepQuestions: Model.Question[];
     stepId: number;
     tripProfile: Model.TripProfile;
     callbackTripAnswers: (answers: number[]) => void;

package/components/FormTemplate/FormTemplateTripNext/StepDestination/StepDestination.d.ts

@@ -5,6 +5,11 @@ export interface StepDestinationProps {
     cities: Array<Model.City>;
     setTripProfile: (tripProfile: Model.TripProfile) => void;
     isTripEdit: boolean;
+    destinationTips: {
+        iconUrl: string;
+        title: string;
+        description: string;
+    }[];
 }
 declare const StepDestination: React.FC<StepDestinationProps>;
 export default StepDestination;

package/components/FormTemplate/FormTemplateTripNext/StepStayAndShares/StepStayAndShares.d.ts

@@ -11,6 +11,11 @@ export interface StepStayAndSharesProps {
     userCompanions?: Array<Model.Companion>;
     companionLoadingList: Array<number>;
     callbackUserCompanionAdd: (userCompoanion: Model.Companion) => void;
+    stayAndShareTips: {
+        iconUrl: string;
+        title: string;
+        description: string;
+    }[];
 }
 declare const StepStayAndShares: React.FC<StepStayAndSharesProps>;
 export default StepStayAndShares;

package/components/QuestionTemplateNext/Context/QuestionContext.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { QuestionNext } from '../../FormTemplate/FormTemplateTripNext/model';
+import Model from '@tripian/model';
 interface IQuestionContext {
-    question: QuestionNext;
+    question: Model.Question;
     defaultAnswers: Array<number>;
 }
 declare const questionContext: React.Context<IQuestionContext>;

package/components/QuestionTemplateNext/QuestionTemplate.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { QuestionNext } from '../FormTemplate/FormTemplateTripNext/model';
+import Model from '@tripian/model';
 interface IQuestionTemplate {
-    question: QuestionNext;
+    question: Model.Question;
     answers: Array<number>;
     callbackAnswers: (answers: Array<number>) => void;
     flexDirection?: 'column' | 'row';

package/index.js

@@ -7438,7 +7438,9 @@ var Dropdown = function (_a) {
             }, onBlur: function () {
                 if (onBlur)
                     onBlur();
-            } }, keyOptions.map(function (option) { return (react_1.default.createElement("option", { key: option.key, value: option.value }, option.label ? option.label : option.value)); }))));
+            } },
+            defaultValue === undefined && react_1.default.createElement("option", { value: undefined }, "Please Select"),
+            keyOptions.map(function (option) { return (react_1.default.createElement("option", { key: option.key, value: option.value }, option.label ? option.label : option.value)); }))));
 };
 exports.default = Dropdown;
 
@@ -18760,7 +18762,20 @@ var react_1 = __importDefault(__webpack_require__(0));
 // eslint-disable-next-line import/no-extraneous-dependencies
 var model_1 = __importDefault(__webpack_require__(4));
 var questionContext = react_1.default.createContext({
-    question: { id: 0, skippable: false, selectMultiple: false, name: '', category: model_1.default.QUESTIONS_CATEGORY.TRIP, order: 0, answers: [{ id: 0, name: '', subAnswers: [] }] },
+    question: {
+        id: 0,
+        skippable: false,
+        selectMultiple: false,
+        name: '',
+        category: model_1.default.QUESTIONS_CATEGORY.TRIP,
+        order: 0,
+        title: '',
+        theme: '',
+        stepId: -1,
+        iconUrl: '',
+        description: '',
+        answers: [{ id: 0, name: '', subAnswers: [], description: '' }],
+    },
     defaultAnswers: [0],
 });
 exports.default = questionContext;
@@ -45491,6 +45506,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(__webpack_require__(0));
+// eslint-disable-next-line import/no-extraneous-dependencies
 var model_1 = __importStar(__webpack_require__(4));
 var Price_1 = __importDefault(__webpack_require__(80));
 var RatingStars_1 = __importDefault(__webpack_require__(31));
@@ -45509,6 +45525,7 @@ var TapRight_1 = __importDefault(__webpack_require__(734));
 var Phone_1 = __importDefault(__webpack_require__(735));
 var Mask_1 = __importDefault(__webpack_require__(736));
 var PoiInfoText_scss_1 = __importDefault(__webpack_require__(737));
+// eslint-disable-next-line @typescript-eslint/naming-convention
 var POI_CARD_ACTION;
 (function (POI_CARD_ACTION) {
     POI_CARD_ACTION[POI_CARD_ACTION["ADD"] = 0] = "ADD";
@@ -63713,33 +63730,15 @@ var StepComponent_1 = __importDefault(__webpack_require__(649));
 var StepDestination_1 = __importDefault(__webpack_require__(662));
 var StepStayAndShares_1 = __importDefault(__webpack_require__(664));
 var ArrowRight_1 = __importDefault(__webpack_require__(667));
-var stepHeaders = [
-    {
-        stepId: -1,
-        header: 'Destinations',
-    },
-    {
-        stepId: 0,
-        header: 'Stay & Shares',
-    },
-    {
-        stepId: 1,
-        header: 'Picked Informations',
-    },
-    {
-        stepId: 2,
-        header: 'Personalize tour trip',
-    },
-];
 var FormTemplateTripNext = function (_a) {
-    var tripProfileInitial = _a.tripProfile, tripQuestions = _a.tripQuestions, cities = _a.cities, _b = _a.isTripEdit, isTripEdit = _b === void 0 ? false : _b, callbackTripProfile = _a.callbackTripProfile, userCompanionQuestions = _a.userCompanionQuestions, userCompanions = _a.userCompanions, companionLoadingList = _a.companionLoadingList, callbackUserCompanionAdd = _a.callbackUserCompanionAdd, _c = _a.showTripModeQuestion, showTripModeQuestion = _c === void 0 ? false : _c, onSubmitText = _a.onSubmitText, onSubmit = _a.onSubmit, onCancel = _a.onCancel;
+    var tripProfileInitial = _a.tripProfile, tripQuestions = _a.tripQuestions, cities = _a.cities, _b = _a.isTripEdit, isTripEdit = _b === void 0 ? false : _b, callbackTripProfile = _a.callbackTripProfile, userCompanionQuestions = _a.userCompanionQuestions, userCompanions = _a.userCompanions, companionLoadingList = _a.companionLoadingList, callbackUserCompanionAdd = _a.callbackUserCompanionAdd, _c = _a.showTripModeQuestion, showTripModeQuestion = _c === void 0 ? false : _c, stepHeaders = _a.stepHeaders, destinationTips = _a.destinationTips, stayAndShareTips = _a.stayAndShareTips, onSubmitText = _a.onSubmitText, onSubmit = _a.onSubmit, onCancel = _a.onCancel;
     var _d = (0, react_1.useState)(-1), stepId = _d[0], setStepId = _d[1];
     var _e = (0, react_1.useState)(tripProfileInitial), tripProfile = _e[0], setTripProfile = _e[1];
     var _f = (0, react_1.useState)(), bound = _f[0], setBound = _f[1];
     // const tripModeQuestion = tripQuestions.find((question) => question.id === 19);
     var filteredQuestions = (0, react_1.useMemo)(function () { return (showTripModeQuestion ? tripQuestions : tripQuestions.filter(function (x) { return x.id !== 19; })); }, [tripQuestions, showTripModeQuestion]);
     var stepQuestions = (0, react_1.useMemo)(function () { return filteredQuestions.filter(function (x) { return x.stepId === stepId; }).sort(function (a, b) { return a.order - b.order; }); }, [filteredQuestions, stepId]);
-    var stepHeader = (0, react_1.useMemo)(function () { var _a; return (_a = stepHeaders.find(function (x) { return x.stepId === stepId; })) !== null && _a !== void 0 ? _a : stepHeaders[0]; }, [stepId]);
+    var stepHeader = (0, react_1.useMemo)(function () { var _a; return (_a = stepHeaders.find(function (x) { return x.stepId === stepId; })) !== null && _a !== void 0 ? _a : stepHeaders[0]; }, [stepHeaders, stepId]);
     var isNextButtonDisabled = (0, react_1.useMemo)(function () { return !tripProfile.cityId || (0, moment_1.default)(tripProfile.arrivalDatetime).utcOffset(0) < (0, moment_1.default)().utcOffset(0); }, [tripProfile.arrivalDatetime, tripProfile.cityId]);
     var callbackTripAnswers = (0, react_1.useCallback)(function (answers) {
         var newTripProfile = __assign({}, tripProfile);
@@ -63759,11 +63758,11 @@ var FormTemplateTripNext = function (_a) {
             stepId === -1 && cities.length > 0 && (react_1.default.createElement(StepDestination_1.default, { tripProfile: tripProfile, cities: cities, setTripProfile: function (newTripProfile) {
                     setTripProfile(newTripProfile);
                     callbackTripProfile(newTripProfile);
-                }, isTripEdit: isTripEdit })),
+                }, isTripEdit: isTripEdit, destinationTips: destinationTips })),
             stepId === 0 && (react_1.default.createElement(StepStayAndShares_1.default, { tripProfile: tripProfile, cities: cities, bound: bound, setBound: function (newBound) { return setBound(newBound); }, setTripProfile: function (newTripProfile) {
                     setTripProfile(newTripProfile);
                     callbackTripProfile(newTripProfile);
-                }, callbackUserCompanionAdd: callbackUserCompanionAdd, companionLoadingList: companionLoadingList, userCompanionQuestions: userCompanionQuestions, userCompanions: userCompanions })),
+                }, callbackUserCompanionAdd: callbackUserCompanionAdd, companionLoadingList: companionLoadingList, userCompanionQuestions: userCompanionQuestions, userCompanions: userCompanions, stayAndShareTips: stayAndShareTips })),
             stepId > 0 && (react_1.default.createElement(StepComponent_1.default, { defaultTip: { title: 'Hover the areas for more info', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' }, header: stepHeader.header, stepQuestions: stepQuestions, stepId: stepId, tripProfile: tripProfile, callbackTripAnswers: callbackTripAnswers })),
             react_1.default.createElement("div", { className: "row center" },
                 react_1.default.createElement("div", { className: "col col6" }, stepId === -1 ? (react_1.default.createElement(Button_1.default, { text: "Cancel", color: "primary", onClick: function () {
@@ -63825,6 +63824,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(__webpack_require__(0));
+// import Header from '../../../base/Header/Header';
 var InfoBox_1 = __importDefault(__webpack_require__(105));
 var QuestionTemplate_1 = __importDefault(__webpack_require__(651));
 var QuestionTemplate2_1 = __importDefault(__webpack_require__(659));
@@ -63834,6 +63834,7 @@ var StepComponent = function (_a) {
     var onFocus = function (qId) {
         var focusedQ = stepQuestions.find(function (x) { return x.id === qId; });
         if (focusedQ) {
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
             setTip({ title: focusedQ.title, description: focusedQ.description, iconUrl: focusedQ.iconUrl });
         }
     };
@@ -63877,7 +63878,7 @@ var Question_1 = __importDefault(__webpack_require__(652));
 var QuestionTemplate = function (_a) {
     var question = _a.question, answers = _a.answers, callbackAnswers = _a.callbackAnswers, _b = _a.flexDirection, flexDirection = _b === void 0 ? 'row' : _b, onFocused = _a.onFocused;
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", { key: question.id },
+        react_1.default.createElement("div", { key: question.id, className: "col col12 col12-m p2" },
             react_1.default.createElement(QuestionContext_1.default.Provider, { value: {
                     question: question,
                     defaultAnswers: answers,
@@ -64333,9 +64334,8 @@ var react_1 = __importStar(__webpack_require__(0));
 var QuestionContext2_1 = __importDefault(__webpack_require__(348));
 var SelectQuestion_1 = __importDefault(__webpack_require__(661));
 var Question2 = function (_a) {
-    var _b, _c;
     var changed = _a.changed, flexDirection = _a.flexDirection;
-    var _d = (0, react_1.useContext)(QuestionContext2_1.default), questions = _d.questions, defaultAnswers = _d.defaultAnswers;
+    var _b = (0, react_1.useContext)(QuestionContext2_1.default), questions = _b.questions, defaultAnswers = _b.defaultAnswers;
     var selectionChanged = function (addedOptionId, removedOptionId) {
         var newAnswers = __spreadArray([], defaultAnswers, true);
         if (removedOptionId) {
@@ -64345,14 +64345,14 @@ var Question2 = function (_a) {
             newAnswers.push(addedOptionId);
         changed(newAnswers);
     };
-    var defaultAnswer1 = (_b = questions[0].answers.find(function (option) { return defaultAnswers.includes(option.id); })) === null || _b === void 0 ? void 0 : _b.id;
-    var defaultAnswer2 = (_c = questions[1].answers.find(function (option) { return defaultAnswers.includes(option.id); })) === null || _c === void 0 ? void 0 : _c.id;
+    // const defaultAnswer1 = questions[0].answers.find((option) => defaultAnswers.includes(option.id))?.id;
+    // const defaultAnswer2 = questions[1].answers.find((option) => defaultAnswers.includes(option.id))?.id;
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("h3", { className: "mt10 mb6" }, "What type of restaurants do you prefer?"),
-        react_1.default.createElement("h4", { className: "mb4" }, "Lunch/Brunch"),
-        react_1.default.createElement(SelectQuestion_1.default, { question: questions[0], defaultAnswer: defaultAnswer1, selectionChanged: selectionChanged, flexDirection: flexDirection }),
-        react_1.default.createElement("h4", { className: "mb4" }, "Dinner"),
-        react_1.default.createElement(SelectQuestion_1.default, { question: questions[1], defaultAnswer: defaultAnswer2, selectionChanged: selectionChanged, flexDirection: flexDirection })));
+        react_1.default.createElement("h4", { className: "my2" }, "Lunch/Brunch"),
+        react_1.default.createElement(SelectQuestion_1.default, { question: questions[0], selectionChanged: selectionChanged, flexDirection: flexDirection }),
+        react_1.default.createElement("h4", { className: "my2" }, "Dinner"),
+        react_1.default.createElement(SelectQuestion_1.default, { question: questions[1], selectionChanged: selectionChanged, flexDirection: flexDirection })));
 };
 exports.default = Question2;
 
@@ -64395,7 +64395,7 @@ var Dropdown_1 = __importDefault(__webpack_require__(25));
 var SelectQuestion = function (_a) {
     var question = _a.question, defaultAnswer = _a.defaultAnswer, selectionChanged = _a.selectionChanged, flexDirection = _a.flexDirection;
     var _b = (0, react_1.useState)(defaultAnswer), answer = _b[0], setAnswer = _b[1];
-    var handleChange = function (value, index) {
+    var handleChange = function (value) {
         var removedOptionId = answer;
         var addedOptionId = Number(value);
         selectionChanged(addedOptionId, removedOptionId);
@@ -64457,21 +64457,14 @@ var model_1 = __webpack_require__(4);
 var moment_1 = __importDefault(__webpack_require__(1));
 var react_1 = __importStar(__webpack_require__(0));
 var Dropdown_1 = __importDefault(__webpack_require__(25));
+// import Header from '../../../base/Header/Header';
 var InfoBox_1 = __importDefault(__webpack_require__(105));
 var Required_1 = __importDefault(__webpack_require__(345));
 var RSelect_1 = __importDefault(__webpack_require__(33));
 var DateRangePicker_1 = __importDefault(__webpack_require__(62));
 var StepDestination_scss_1 = __importDefault(__webpack_require__(663));
-var destinationTips = [
-    { title: 'Hover the areas for info', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select City', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select Start Dates', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select End Dates', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select arrival time', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select depature time', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-];
 var StepDestination = function (_a) {
-    var tripProfile = _a.tripProfile, cities = _a.cities, setTripProfile = _a.setTripProfile, isTripEdit = _a.isTripEdit;
+    var tripProfile = _a.tripProfile, cities = _a.cities, setTripProfile = _a.setTripProfile, isTripEdit = _a.isTripEdit, destinationTips = _a.destinationTips;
     var _b = (0, react_1.useState)(destinationTips[0]), tip = _b[0], setTip = _b[1];
     var startTimeOptions = (0, react_1.useMemo)(function () {
         var sameDay = tripProfile.arrivalDatetime.split('T')[0] === tripProfile.departureDatetime.split('T')[0];
@@ -64530,10 +64523,11 @@ var StepDestination = function (_a) {
         setTripProfile(newTripProfile);
     };
     var callbackCitySelect = function (selectedOption) {
+        var _a;
         var newTripProfile = model_1.helper.deepCopy(tripProfile);
         if (selectedOption) {
             // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access
-            newTripProfile.cityId = selectedOption.payload.id;
+            newTripProfile.cityId = (_a = selectedOption.payload) === null || _a === void 0 ? void 0 : _a.id;
             // newTripProfile.accommodation = null;
             setTripProfile(newTripProfile);
         }
@@ -64635,17 +64629,10 @@ var model_1 = __webpack_require__(4);
 var NumberCounter_1 = __importDefault(__webpack_require__(665));
 var GPlacesAutocomplete2_1 = __importDefault(__webpack_require__(103));
 var UserCompanionSelection_1 = __importDefault(__webpack_require__(104));
+// import Header from '../../../base/Header/Header';
 var InfoBox_1 = __importDefault(__webpack_require__(105));
-// import classes from './StepStayAndShares.scss';
-var stayAndShareTips = [
-    { title: 'Hover the areas for info', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select Adults Number', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Select Children Number', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Where will you stay?', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-    { title: 'Add Your Companions', description: 'If you close a field, we will provide you with relevant explatanions.', iconUrl: 'https://poi-pics.s3.eu-west-1.amazonaws.com/project-images/tripian-one/logo.png' },
-];
 var StepStayAndShares = function (_a) {
-    var tripProfile = _a.tripProfile, setTripProfile = _a.setTripProfile, bound = _a.bound, cities = _a.cities, setBound = _a.setBound, userCompanionQuestions = _a.userCompanionQuestions, userCompanions = _a.userCompanions, companionLoadingList = _a.companionLoadingList, callbackUserCompanionAdd = _a.callbackUserCompanionAdd;
+    var tripProfile = _a.tripProfile, setTripProfile = _a.setTripProfile, bound = _a.bound, cities = _a.cities, setBound = _a.setBound, userCompanionQuestions = _a.userCompanionQuestions, userCompanions = _a.userCompanions, companionLoadingList = _a.companionLoadingList, callbackUserCompanionAdd = _a.callbackUserCompanionAdd, stayAndShareTips = _a.stayAndShareTips;
     var _b = (0, react_1.useState)(stayAndShareTips[0]), tip = _b[0], setTip = _b[1];
     (0, react_1.useEffect)(function () {
         var currentCity = cities.find(function (city) { return city.id === tripProfile.cityId; });
@@ -67384,6 +67371,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.HourItem = void 0;
+/* eslint-disable react/no-array-index-key */
 /* eslint-disable import/no-extraneous-dependencies */
 var react_1 = __importStar(__webpack_require__(0));
 var moment_1 = __importDefault(__webpack_require__(1));
@@ -67407,7 +67395,7 @@ var OpenedHours = function (_a) {
     var date = planDate ? (0, moment_1.default)(planDate).format('ddd') : (0, moment_1.default)().format('ddd');
     var findToday = hours === null || hours === void 0 ? void 0 : hours.find(function (hour) { return hour.day === date; });
     return (react_1.default.createElement("div", { className: OpenedHours_scss_1.default.openedHours },
-        react_1.default.createElement("div", null, showHours ? hours.map(function (h) { return react_1.default.createElement(exports.HourItem, { hour: h, lineHeight: "35px" }); }) : react_1.default.createElement(exports.HourItem, { hour: findToday || hours[0] })),
+        react_1.default.createElement("div", null, showHours ? hours.map(function (h, i) { return react_1.default.createElement(exports.HourItem, { key: "".concat(h.day, "-").concat(i), hour: h, lineHeight: "35px" }); }) : react_1.default.createElement(exports.HourItem, { hour: findToday || hours[0] })),
         react_1.default.createElement("div", { className: OpenedHours_scss_1.default.exploreButton, role: "button", tabIndex: 0, onKeyPress: function () { }, onClick: function () { return setShowHours(!showHours); } }, showHours ? 'Close' : 'Explore')));
 };
 exports.default = OpenedHours;