thm-p3-configurator 0.0.372 → 0.0.375

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

@@ -0,0 +1,320 @@
+"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 _queries = require("../../__api__/queries");
+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 => {
+  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.haalEnBrengServiceJaNee,
+      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.extraGeslotenDagen
+  };
+};
+
+/**
+ * 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 {
+    id
+  } = _ref4;
+  const {
+    branchById,
+    isLoadingBranchById
+  } = (0, _queries.useBranchByIdOrWidgetId)(id || '');
+  const today = (0, _react.useMemo)(() => {
+    const d = new Date();
+    d.setHours(0, 0, 0, 0);
+    return d;
+  }, []);
+  if (isLoadingBranchById && !branchById) {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _helpers__.withStyle)('d-flex align-items-center gap-1 mt-2 pt-2'),
+      style: {
+        borderTop: '1px solid #e9ecef'
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _helpers__.withStyle)('spinner-border spinner-border-sm text-primary'),
+      role: "status",
+      style: {
+        width: 12,
+        height: 12,
+        borderWidth: 2
+      }
+    }), /*#__PURE__*/_react.default.createElement("small", {
+      className: (0, _helpers__.withStyle)('text-muted'),
+      style: {
+        fontSize: 11
+      }
+    }, "Vestigingsdetails laden\u2026"));
+  }
+  const props = buildDetailProps(branchById);
+  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;

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

@@ -0,0 +1,180 @@
+"use strict";
+
+require("core-js/modules/es.array.sort.js");
+require("core-js/modules/es.number.to-fixed.js");
+require("core-js/modules/es.parse-float.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.for-each.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/esnext.iterator.for-each.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+require("core-js/modules/es.array.sort.js");
+require("core-js/modules/es.number.to-fixed.js");
+require("core-js/modules/es.parse-float.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");
+var _react = _interopRequireWildcard(require("react"));
+var _ActiveMarkerContext = require("../../__context__/ActiveMarkerContext");
+var _OrderSessionContext = require("../../__context__/OrderSessionContext");
+var _helpers__ = require("../../__helpers__");
+var _geolocation = require("../../__helpers__/geolocation");
+var _LocationListItem = _interopRequireDefault(require("./LocationListItem"));
+function _interopRequireDefault(e) {
+  return e && e.__esModule ? e : {
+    default: e
+  };
+}
+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;
+}
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+      _defineProperty(e, r, t[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
+    });
+  }
+  return e;
+}
+function _defineProperty(e, r, t) {
+  return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+    value: t,
+    enumerable: !0,
+    configurable: !0,
+    writable: !0
+  }) : e[r] = t, e;
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
+const LocationsLoading = () => {
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('w-100 text-center')
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _helpers__.withStyle)('spinner-border text-primary mx-auto'),
+    role: "status"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "sr-only"
+  }, "Loading...")));
+};
+const NoLocationFound = () => {
+  return /*#__PURE__*/_react.default.createElement("h4", null, "Geen montagelocaties gevonden");
+};
+const LocationList = _ref => {
+  let {
+    locationsById,
+    locationIds,
+    userLocation,
+    isLocationSetViaSearch = false,
+    isLoading = false
+  } = _ref;
+  const {
+    activeMarkerId
+  } = (0, _ActiveMarkerContext.useActiveMarker)();
+  const [{
+    selectedBranch
+  }] = (0, _OrderSessionContext.useOrderSession)();
+  const listRef = (0, _react.useRef)(null);
+  const locationsWithDistance = locationIds.map((locationId, index) => {
+    const location = locationsById[locationId];
+    const coordinates = location.googleMapsLocation;
+    if (!coordinates) return null;
+    const [latStr, lngStr] = coordinates.split(',');
+    const lat = parseFloat(latStr);
+    const lng = parseFloat(lngStr);
+    const distance = userLocation ? (0, _geolocation.calculateDistance)({
+      lat1: userLocation.lat,
+      lng1: userLocation.lng,
+      lat2: lat,
+      lng2: lng
+    }).toFixed(2) : null;
+    return _objectSpread(_objectSpread({}, location), {}, {
+      distance: distance ? parseFloat(distance) : null
+    });
+  }).filter(location => location !== null);
+  const sortedLocations = locationsWithDistance.sort((a, b) => {
+    const aIsSelected = a.entityId === activeMarkerId || a.entityId === selectedBranch;
+    const bIsSelected = b.entityId === activeMarkerId || b.entityId === selectedBranch;
+    if (aIsSelected && !bIsSelected) return -1; // a goes to top
+    if (!aIsSelected && bIsSelected) return 1; // b goes to top
+
+    if (a.distance === null) return 1;
+    if (b.distance === null) return -1;
+    return a.distance - b.distance;
+  });
+
+  // Handle scrolling when location is set via search
+  (0, _react.useEffect)(() => {
+    if (isLocationSetViaSearch && listRef.current) {
+      listRef.current.scrollTop = 0;
+    }
+  }, [isLocationSetViaSearch, userLocation]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: listRef,
+    className: (0, _helpers__.withStyle)('dealer-list')
+  }, /*#__PURE__*/_react.default.createElement("h5", null, userLocation ? 'Dichtsbijzijnde montagelocaties' : 'Montagelocaties'), isLoading && /*#__PURE__*/_react.default.createElement(LocationsLoading, null), !isLoading && !locationIds.length && /*#__PURE__*/_react.default.createElement(NoLocationFound, null), sortedLocations.map(location => /*#__PURE__*/_react.default.createElement(_LocationListItem.default, {
+    openingHours: location.openingstijden,
+    title: location.naamVestiging,
+    city: location.city,
+    distance: location.distance ? location.distance : null,
+    id: location.entityId,
+    key: location.entityId,
+    isSelected: location.entityId === activeMarkerId || location.entityId === selectedBranch,
+    userLocation: userLocation
+  })));
+};
+var _default = exports.default = LocationList;