thm-p3-configurator 0.0.458 → 0.0.462

package/dist/src/shared/__api__/queries.js

@@ -541,7 +541,8 @@ exports.useSingleOrderCart = useSingleOrderCart;
 const useOrderDataQuery = exports.useOrderDataQuery = function useOrderDataQuery() {
   let orderParameters = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const [{
-    existingDossierId
+    existingDossierId,
+    singleOrderFlowRevision
   }] = (0, _OrderSessionContext.useOrderSession)();
   const pricingFormula = (0, _usePricingFormula.usePricingFormula)();
   const normalizedOrderParams = (0, _queryKeyFactory.normalizeOrderParams)(_objectSpread(_objectSpread({}, orderParameters), {}, {
@@ -558,7 +559,7 @@ const useOrderDataQuery = exports.useOrderDataQuery = function useOrderDataQuery
     initialized
   } = (0, _AuthSessionContext.useAuthSession)();
   const isSessionContextReady = (0, _useSessionContextReady.useSessionContextReady)();
-  const orderQueryKey = APP_CONFIG.internal ? [...(0, _queryKeyFactory.getOrderQueryKey)(normalizedOrderParams), initialized, authenticated, isSessionContextReady] : (0, _queryKeyFactory.getOrderQueryKey)(normalizedOrderParams);
+  const orderQueryKey = APP_CONFIG.internal ? [...(0, _queryKeyFactory.getOrderQueryKey)(normalizedOrderParams), initialized, authenticated, isSessionContextReady, singleOrderFlowRevision] : (0, _queryKeyFactory.getOrderQueryKey)(normalizedOrderParams);
   const serializedOrderParams = (0, _queryKeyFactory.serializeOrderParams)(normalizedOrderParams);
   const hasOrderInput = (licensePlate === null || licensePlate === void 0 ? void 0 : licensePlate.length) > 5 || !!(model !== null && model !== void 0 && model.length);
   const orderQuery = (0, _reactQuery.useQuery)(orderQueryKey, {
@@ -704,6 +705,7 @@ const useQuestionsQuery = exports.useQuestionsQuery = function useQuestionsQuery
   const {
     orderData,
     isFetchingOrder,
+    isLoadingOrder,
     isOrderError,
     orderError
   } = useOrderDataQuery(normalizedQuestionParams);
@@ -719,7 +721,7 @@ const useQuestionsQuery = exports.useQuestionsQuery = function useQuestionsQuery
   }, [orderData === null || orderData === void 0 || (_orderData$executionA4 = orderData.executionAnswerOptions) === null || _orderData$executionA4 === void 0 ? void 0 : _orderData$executionA4.execution2AnswerOptions]);
   const durationQuestion = (0, _react.useMemo)(() => (0, _helpers__.parseArrayToInputOptions)(orderData === null || orderData === void 0 ? void 0 : orderData.durationAnswerOptions), [orderData === null || orderData === void 0 ? void 0 : orderData.durationAnswerOptions]);
   return {
-    isLoadingQuestions: isFetchingOrder,
+    isLoadingQuestions: isFetchingOrder || isLoadingOrder,
     isQuestionsError: isOrderError,
     execution1Answer: orderData === null || orderData === void 0 || (_orderData$answers = orderData.answers) === null || _orderData$answers === void 0 ? void 0 : _orderData$answers.execution1,
     execution2Answer: orderData === null || orderData === void 0 || (_orderData$answers2 = orderData.answers) === null || _orderData$answers2 === void 0 ? void 0 : _orderData$answers2.execution2,
@@ -733,14 +735,14 @@ const useQuestionsQuery = exports.useQuestionsQuery = function useQuestionsQuery
   };
 };
 const useSingleOrderBranchesQuery = branchesParams => {
-  var _branchesParams;
+  var _branchesParams, _branchesParams2;
   branchesParams = _objectSpread(_objectSpread({}, branchesParams), {}, {
     type: 'single-order'
   });
   const branchesParamsString = new URLSearchParams((0, _helpers__.removeNullishProps)(branchesParams)).toString();
   const branchesQuery = (0, _reactQuery.useQuery)(['single-order-branches', branchesParamsString], {
     queryFn: () => _authenticatedProxyApi.authenticatedProxyApi.getSingleOrderBranches(branchesParamsString).then(res => res.data),
-    enabled: !!((_branchesParams = branchesParams) !== null && _branchesParams !== void 0 && _branchesParams.branchTypeId)
+    enabled: !!((_branchesParams = branchesParams) !== null && _branchesParams !== void 0 && _branchesParams.branchTypeId) || (0, _constants__.isLooseOrderOnlyFormula)((_branchesParams2 = branchesParams) === null || _branchesParams2 === void 0 ? void 0 : _branchesParams2.formula)
   });
   return {
     isLoadingSingleOrderBranches: branchesQuery.isLoading,

package/dist/src/shared/__components__/Header.js

@@ -9,6 +9,9 @@ var _logoPrimaryIcon = _interopRequireDefault(require("../../../public/assets/im
 var _logoThcWhite = _interopRequireDefault(require("../../../public/assets/images/logo-thc-white.svg"));
 var _logoTmgPrimary = _interopRequireDefault(require("../../../public/assets/images/logo-tmg-primary.png"));
 var _tmLogo = _interopRequireDefault(require("../../../public/assets/images/tm-logo.png"));
+var _logoWbPrimary = _interopRequireDefault(require("../../../public/assets/images/logo-wb-primary.png"));
+var _logoThlPrimary = _interopRequireDefault(require("../../../public/assets/images/logo-thl-primary.png"));
+var _logoThPrimary = _interopRequireDefault(require("../../../public/assets/images/logo-th-primary.png"));
 var _constants__ = require("../__constants__");
 var _helpers__ = require("../__helpers__");
 var _useBranchTheme = require("../__hooks__/useBranchTheme");
@@ -17,12 +20,53 @@ function _interopRequireDefault(e) {
     default: e
   };
 }
+const getHeaderLogo = theme => {
+  switch (theme) {
+    case _constants__.BRANCH_THEME_BY_FORMULA.TowMotive:
+      return {
+        src: _tmLogo.default,
+        alt: 'TowMotive'
+      };
+    case _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum:
+      return {
+        src: _logoThcWhite.default,
+        alt: 'Trekhaakcentrum'
+      };
+    case _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup:
+      return {
+        src: _logoTmgPrimary.default,
+        alt: 'TowMotive Group'
+      };
+    case _constants__.BRANCH_THEME_BY_FORMULA.WestfaliaBenelux:
+      return {
+        src: _logoWbPrimary.default,
+        alt: 'Westfalia Benelux'
+      };
+    case _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakland:
+      return {
+        src: _logoThlPrimary.default,
+        alt: 'Trekhaakland'
+      };
+    case _constants__.BRANCH_THEME_BY_FORMULA.Trekhaken:
+      return {
+        src: _logoThPrimary.default,
+        alt: 'Trekhaken.nl'
+      };
+    default:
+      return {
+        src: _logoPrimaryIcon.default,
+        alt: 'Trekhaak Montage'
+      };
+  }
+};
 const Header = _ref => {
   let {
     title,
     subtitle = ''
   } = _ref;
   const theme = (0, _useBranchTheme.useBranchTheme)();
+  const headerLogo = getHeaderLogo(theme);
+  const isWebshopTheme = theme === _constants__.BRANCH_THEME_BY_FORMULA.WestfaliaBenelux || theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakland || theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaken;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)("hero hero--offset")
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -32,9 +76,9 @@ const Header = _ref => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('col hero__logo-container')
   }, /*#__PURE__*/_react.default.createElement("img", {
-    className: (0, _helpers__.withStyle)("hero__logo ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'hero__logo--tmg' : '')),
-    src: theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotive ? _tmLogo.default : theme === _constants__.BRANCH_THEME_BY_FORMULA.Trekhaakcentrum ? _logoThcWhite.default : theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? _logoTmgPrimary.default : _logoPrimaryIcon.default,
-    alt: "Trekhaak Montage"
+    className: (0, _helpers__.withStyle)("hero__logo ".concat(theme === _constants__.BRANCH_THEME_BY_FORMULA.TowMotiveGroup ? 'hero__logo--tmg' : '', " ").concat(isWebshopTheme ? 'hero__logo--webshop' : '')),
+    src: headerLogo.src,
+    alt: headerLogo.alt
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _helpers__.withStyle)('hero__inner d-none d-lg-block')
   }, /*#__PURE__*/_react.default.createElement("h2", null, (title === null || title === void 0 ? void 0 : title.length) > 0 ? title : 'Trekhaak offerte opstellen'), (subtitle === null || subtitle === void 0 ? void 0 : subtitle.length) > 0 && /*#__PURE__*/_react.default.createElement("p", {

package/dist/src/shared/__components__/LocationsSelector/LocationDetails.js

@@ -0,0 +1,295 @@
+"use strict";
+
+require("core-js/modules/es.number.to-fixed.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.number.to-fixed.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.map.js");
+var _react = _interopRequireWildcard(require("react"));
+var _helpers__ = require("../../__helpers__");
+function _getRequireWildcardCache(e) {
+  if ("function" != typeof WeakMap) return null;
+  var r = new WeakMap(),
+    t = new WeakMap();
+  return (_getRequireWildcardCache = function _getRequireWildcardCache(e) {
+    return e ? t : r;
+  })(e);
+}
+function _interopRequireWildcard(e, r) {
+  if (!r && e && e.__esModule) return e;
+  if (null === e || "object" != typeof e && "function" != typeof e) return {
+    default: e
+  };
+  var t = _getRequireWildcardCache(r);
+  if (t && t.has(e)) return t.get(e);
+  var n = {
+      __proto__: null
+    },
+    a = Object.defineProperty && Object.getOwnPropertyDescriptor;
+  for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) {
+    var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;
+    i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u];
+  }
+  return n.default = e, t && t.set(e, n), n;
+}
+const isStatusPositive = status => status === true || status === 1 || status === 'ja' || status === 'Ja';
+const StatusDot = _ref => {
+  let {
+    status
+  } = _ref;
+  const positive = isStatusPositive(status);
+  return /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _helpers__.withStyle)('d-flex align-items-center gap-1')
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      width: 7,
+      height: 7,
+      borderRadius: '50%',
+      flexShrink: 0,
+      background: positive ? '#038808' : '#adb5bd',
+      display: 'inline-block'
+    }
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      fontSize: 11,
+      fontWeight: 600,
+      color: positive ? '#038808' : '#6c757d'
+    }
+  }, positive ? 'Ja' : 'Nee'));
+};
+const ServiceRow = _ref2 => {
+  let {
+    icon,
+    label,
+    status,
+    bedrag,
+    voorwaarden
+  } = _ref2;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      marginBottom: 6
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('d-flex align-items-center justify-content-between')
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _helpers__.withStyle)('d-flex align-items-center gap-1')
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: icon,
+    style: {
+      width: 14,
+      textAlign: 'center',
+      fontSize: 11,
+      color: '#6c757d'
+    }
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      fontSize: 12,
+      fontWeight: 600,
+      color: '#343a40'
+    }
+  }, label)), /*#__PURE__*/_react.default.createElement("span", {
+    className: (0, _helpers__.withStyle)('d-flex align-items-center gap-2')
+  }, bedrag != null && bedrag !== '' && /*#__PURE__*/_react.default.createElement("span", {
+    style: {
+      fontSize: 11,
+      color: '#6c757d'
+    }
+  }, typeof bedrag === 'number' ? "\u20AC\xA0".concat(bedrag.toFixed(2)) : bedrag), /*#__PURE__*/_react.default.createElement(StatusDot, {
+    status: status
+  }))), voorwaarden && /*#__PURE__*/_react.default.createElement("p", {
+    style: {
+      margin: '2px 0 0 18px',
+      fontSize: 10,
+      color: '#6c757d',
+      fontStyle: 'italic',
+      lineHeight: 1.4
+    }
+  }, voorwaarden));
+};
+const SectionLabel = _ref3 => {
+  let {
+    icon,
+    label
+  } = _ref3;
+  return /*#__PURE__*/_react.default.createElement("p", {
+    className: (0, _helpers__.withStyle)('d-flex align-items-center gap-1 mb-1'),
+    style: {
+      fontSize: 11,
+      fontWeight: 700,
+      color: '#495057',
+      textTransform: 'uppercase',
+      letterSpacing: '0.04em'
+    }
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: icon,
+    style: {
+      width: 14,
+      textAlign: 'center',
+      fontSize: 10,
+      color: '#6c757d'
+    }
+  }), label);
+};
+const formatDate = dateStr => {
+  if (!dateStr) return '';
+  const date = new Date(dateStr);
+  if (isNaN(date.getTime())) return dateStr;
+  return date.toLocaleDateString('nl-NL', {
+    day: '2-digit',
+    month: '2-digit',
+    year: 'numeric'
+  });
+};
+
+/**
+ * Normalises a raw branch object (from GET /branches/:id) into display props.
+ */
+const buildDetailProps = branch => {
+  var _branch$haalEnBrengSe, _branch$extraGesloten;
+  if (!branch) return null;
+  return {
+    leenauto: {
+      status: branch.leenautoJaNee,
+      voorwaarden: branch.leenautoVoorwaarden,
+      bedrag: branch.leenautoBedrag
+    },
+    leenfiets: {
+      status: branch.leenfietsJaNee,
+      voorwaarden: branch.leenfietsVoorwaarden
+    },
+    haalEnBrengservice: {
+      status: (_branch$haalEnBrengSe = branch.haalEnBrengServiceJaNee) !== null && _branch$haalEnBrengSe !== void 0 ? _branch$haalEnBrengSe : branch.haalEnBrengService,
+      voorwaarden: branch.haalEnBrengServiceVoorwaarden
+    },
+    betaalmethoden: Array.isArray(branch.betaalmethoden) ? branch.betaalmethoden.map(m => m && typeof m === 'object' ? m.title : m).filter(Boolean) : branch.betaalmethoden,
+    extraGeslotenDagen: (_branch$extraGesloten = branch.extraGeslotenDagen) !== null && _branch$extraGesloten !== void 0 ? _branch$extraGesloten : branch.extraGeslotenDagenVestiging
+  };
+};
+
+/**
+ * Fetches and displays extra location-specific details in the Partner Portal configurator.
+ * Only rendered when APP_CONFIG.internal is true — never on the public website.
+ */
+const LocationDetails = _ref4 => {
+  let {
+    initialBranch = null
+  } = _ref4;
+  const today = (0, _react.useMemo)(() => {
+    const d = new Date();
+    d.setHours(0, 0, 0, 0);
+    return d;
+  }, []);
+  const props = buildDetailProps(initialBranch);
+  if (!props) return null;
+  const {
+    leenauto,
+    leenfiets,
+    haalEnBrengservice,
+    betaalmethoden,
+    extraGeslotenDagen
+  } = props;
+  const upcomingGeslotenDagen = Array.isArray(extraGeslotenDagen) ? extraGeslotenDagen.filter(dag => {
+    if (!(dag !== null && dag !== void 0 && dag.einddatum)) return false;
+    const eindDatum = new Date(dag.einddatum);
+    eindDatum.setHours(0, 0, 0, 0);
+    return eindDatum >= today;
+  }) : [];
+  const hasLeenauto = leenauto != null;
+  const hasLeenfiets = leenfiets != null;
+  const hasHaalEnBreng = haalEnBrengservice != null;
+  const hasBetaalmethoden = Array.isArray(betaalmethoden) && betaalmethoden.length > 0;
+  const hasGeslotenDagen = upcomingGeslotenDagen.length > 0;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      marginTop: 10,
+      paddingTop: 10,
+      borderTop: '1px solid #e9ecef'
+    }
+  }, (hasLeenauto || hasLeenfiets || hasHaalEnBreng) && /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      marginBottom: hasBetaalmethoden || hasGeslotenDagen ? 8 : 0
+    }
+  }, hasLeenauto && /*#__PURE__*/_react.default.createElement(ServiceRow, {
+    icon: "fas fa-car",
+    label: "Leenauto",
+    status: leenauto.status,
+    bedrag: leenauto.bedrag,
+    voorwaarden: leenauto.voorwaarden
+  }), hasLeenfiets && /*#__PURE__*/_react.default.createElement(ServiceRow, {
+    icon: "fas fa-bicycle",
+    label: "Leenfiets",
+    status: leenfiets.status,
+    voorwaarden: leenfiets.voorwaarden
+  }), hasHaalEnBreng && /*#__PURE__*/_react.default.createElement(ServiceRow, {
+    icon: "fas fa-truck",
+    label: "Haal- en brengservice",
+    status: haalEnBrengservice.status,
+    voorwaarden: haalEnBrengservice.voorwaarden
+  })), hasBetaalmethoden && /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      marginBottom: hasGeslotenDagen ? 8 : 0,
+      paddingTop: hasLeenauto || hasLeenfiets || hasHaalEnBreng ? 8 : 0,
+      borderTop: hasLeenauto || hasLeenfiets || hasHaalEnBreng ? '1px solid #f1f3f5' : 'none'
+    }
+  }, /*#__PURE__*/_react.default.createElement(SectionLabel, {
+    icon: "fas fa-credit-card",
+    label: "Betaalmethoden"
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('d-flex flex-wrap gap-1')
+  }, betaalmethoden.map((method, i) => /*#__PURE__*/_react.default.createElement("span", {
+    key: i,
+    style: {
+      fontSize: 10,
+      fontWeight: 600,
+      padding: '2px 7px',
+      borderRadius: 4,
+      border: '1px solid #dee2e6',
+      color: '#495057',
+      background: '#f8f9fa'
+    }
+  }, method)))), hasGeslotenDagen && /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      paddingTop: hasBetaalmethoden || hasLeenauto || hasLeenfiets || hasHaalEnBreng ? 8 : 0,
+      borderTop: hasBetaalmethoden || hasLeenauto || hasLeenfiets || hasHaalEnBreng ? '1px solid #f1f3f5' : 'none'
+    }
+  }, /*#__PURE__*/_react.default.createElement(SectionLabel, {
+    icon: "fas fa-calendar-times",
+    label: "Extra gesloten"
+  }), /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _helpers__.withStyle)('list-unstyled mb-0')
+  }, upcomingGeslotenDagen.map((dag, i) => {
+    const heeftBereik = dag.startdatum && dag.einddatum && dag.startdatum !== dag.einddatum;
+    const datumLabel = heeftBereik ? "".concat(formatDate(dag.startdatum), " \u2013 ").concat(formatDate(dag.einddatum)) : formatDate(dag.einddatum || dag.startdatum);
+    return /*#__PURE__*/_react.default.createElement("li", {
+      key: i,
+      className: (0, _helpers__.withStyle)('d-flex justify-content-between align-items-baseline'),
+      style: {
+        marginBottom: 2
+      }
+    }, /*#__PURE__*/_react.default.createElement("span", {
+      style: {
+        fontSize: 11,
+        color: '#495057'
+      }
+    }, dag.omschrijving || '—'), /*#__PURE__*/_react.default.createElement("span", {
+      style: {
+        fontSize: 10,
+        color: '#6c757d',
+        marginLeft: 8,
+        whiteSpace: 'nowrap'
+      }
+    }, datumLabel));
+  }))));
+};
+var _default = exports.default = LocationDetails;

package/dist/src/shared/__components__/LocationsSelector/LocationInfo.js

@@ -0,0 +1,140 @@
+"use strict";
+
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+var _react = _interopRequireDefault(require("react"));
+var _logoThcWhite = _interopRequireDefault(require("../../../../public/assets/images/logo-thc-white.svg"));
+var _thLogoBlack = _interopRequireDefault(require("../../../../public/assets/images/th-logo-black.png"));
+var _constants__ = require("../../__constants__");
+var _helpers__ = require("../../__helpers__");
+var _image = require("../../__helpers__/image");
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+const FORMULAS = {
+  mZHgPhfuStmqHfHqSOhWY: _thLogoBlack.default,
+  nFbSnWdtLZBmEhhpHFGVO: _logoThcWhite.default
+};
+const LocationInfo = _ref => {
+  var _FORMULAS$formula;
+  let {
+    street,
+    houseNumber,
+    houseNumberExtra,
+    postCode,
+    city,
+    telephoneNumber,
+    locationImage,
+    title,
+    email,
+    website,
+    openingHours,
+    province,
+    formula
+  } = _ref;
+  const fallbackLogo = (0, _constants__.getThemeFormulaForConfiguratorFormula)(formula) === _constants__.CONFIGURATOR_FORMULAS.THC ? _logoThcWhite.default : (_FORMULAS$formula = FORMULAS[formula]) !== null && _FORMULAS$formula !== void 0 ? _FORMULAS$formula : _thLogoBlack.default;
+
+  // Function to format opening hours display text
+  const formatOpeningHours = dayData => {
+    if (!dayData) return {
+      text: 'Onbekend',
+      isUnknown: true
+    };
+    if (!dayData.isOpen) return {
+      text: 'Gesloten',
+      isUnknown: false
+    };
+    if (dayData.opensAt && dayData.closesAt) {
+      return {
+        text: "".concat(dayData.opensAt, " - ").concat(dayData.closesAt),
+        isUnknown: false
+      };
+    } else if (dayData.opensAt) {
+      return {
+        text: "".concat(dayData.opensAt),
+        isUnknown: false
+      };
+    } else if (dayData.closesAt) {
+      return {
+        text: "".concat(dayData.closesAt),
+        isUnknown: false
+      };
+    }
+    return {
+      text: 'Onbekend',
+      isUnknown: true
+    };
+  };
+  // Order of days to display
+  const daysOrder = ['monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday'];
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('dealer-map__infowindow p-0 shadow-none')
+  }, /*#__PURE__*/_react.default.createElement("h4", {
+    className: (0, _helpers__.withStyle)('text-primary')
+  }, title), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('row row__body no-gutters flex-md-nowrap justify-content-between align-items-start')
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12 col-md-6 px-0')
+  }, /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _helpers__.withStyle)('mb-2')
+  }, /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fas fa-map-marker-alt ".concat((0, _helpers__.withStyle)('me-1'))
+  }), ["".concat(street).concat(houseNumber ? " ".concat(houseNumber) : '').concat(houseNumberExtra ? " ".concat(houseNumberExtra) : ''), postCode, city].filter(item => item).join(', ')), telephoneNumber && /*#__PURE__*/_react.default.createElement("li", {
+    className: (0, _helpers__.withStyle)('mt-1')
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fas fa-phone-alt ".concat((0, _helpers__.withStyle)('mx-1'))
+  }), /*#__PURE__*/_react.default.createElement("a", {
+    href: "tel:".concat(telephoneNumber)
+  }, /*#__PURE__*/_react.default.createElement("u", null, telephoneNumber))), email && /*#__PURE__*/_react.default.createElement("li", {
+    className: (0, _helpers__.withStyle)('mt-1')
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fas fa-envelope ".concat((0, _helpers__.withStyle)('mx-1'))
+  }), /*#__PURE__*/_react.default.createElement("a", {
+    href: "mailto:".concat(email)
+  }, /*#__PURE__*/_react.default.createElement("u", null, email))), website && /*#__PURE__*/_react.default.createElement("li", {
+    className: (0, _helpers__.withStyle)('mt-1')
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fas fa-globe ".concat((0, _helpers__.withStyle)('mx-1'))
+  }), /*#__PURE__*/_react.default.createElement("a", {
+    href: website
+  }, /*#__PURE__*/_react.default.createElement("u", null, website)))), /*#__PURE__*/_react.default.createElement("p", {
+    className: (0, _helpers__.withStyle)('font-weight-bold mb-1 d-none d-md-block')
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "fas fa-clock ".concat((0, _helpers__.withStyle)('mx-1'))
+  }), "Openingstijden"), /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _helpers__.withStyle)('ml-3 p-0 d-none d-md-block'),
+    style: {
+      lineHeight: '1.2'
+    }
+  }, daysOrder.map(day => {
+    const hoursInfo = openingHours && formatOpeningHours(openingHours[day]);
+    return /*#__PURE__*/_react.default.createElement("li", {
+      key: day,
+      className: (0, _helpers__.withStyle)('d-flex align-content-center justify-content-between mb-0'),
+      style: {
+        marginBottom: '2px'
+      }
+    }, /*#__PURE__*/_react.default.createElement("p", {
+      className: (0, _helpers__.withStyle)('mb-0')
+    }, _constants__.DAY_NAMES[day]), /*#__PURE__*/_react.default.createElement("p", {
+      className: "".concat(hoursInfo !== null && hoursInfo !== void 0 && hoursInfo.isUnknown ? (0, _helpers__.withStyle)('text-muted fst-italic') : '', " ").concat((0, _helpers__.withStyle)('mb-0'))
+    }, (hoursInfo === null || hoursInfo === void 0 ? void 0 : hoursInfo.text) || 'Onbekend'));
+  }))), /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('col-12 col-md-6 d-flex flex-column justify-content-evenly align-items-center')
+  }, /*#__PURE__*/_react.default.createElement("img", {
+    className: (0, _helpers__.withStyle)('mb-1'),
+    src: locationImage !== null && locationImage !== void 0 && locationImage.length ? (0, _image.getImageFromHyper)({
+      imageId: locationImage
+    }) : fallbackLogo,
+    alt: title
+  }))));
+};
+var _default = exports.default = LocationInfo;