{"ast":null,"code":"import _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n\nimport cn from 'classnames';\nimport MapContainer from 'components/mapContainer/MapContainer';\nimport { useIsDesktop } from 'hooks/useIsDevice';\nimport { useState } from 'react';\nimport SliceIntro from 'slices/SliceIntro/SliceIntro';\nimport TabsSlice from 'slices/TabsSlice/TabsSlice';\nimport CitiesList, { CityItem } from './CitiesList';\nimport styles from './MapSlice.module.scss';\n\nvar DesktopMapSlice = function DesktopMapSlice(_ref) {\n  var cities = _ref.cities,\n      searchPlaceholder = _ref.searchPlaceholder,\n      loadMoreCities = _ref.loadMoreCities;\n\n  var _useState = useState(''),\n      highlightCity = _useState[0],\n      setHighlightCity = _useState[1];\n\n  var handleMouseEvent = function handleMouseEvent(type, slug) {\n    setHighlightCity(type == 'mouseover' ? slug : '');\n  };\n\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: cn(styles.tabsContainer),\n    children: [/*#__PURE__*/_jsx(\"div\", {\n      className: cn(styles.listContainer),\n      children: /*#__PURE__*/_jsx(CitiesList, {\n        cities: cities,\n        handleMouseEvent: handleMouseEvent,\n        highlightCity: highlightCity,\n        placeholder: searchPlaceholder,\n        loadMore: loadMoreCities\n      })\n    }), /*#__PURE__*/_jsx(\"div\", {\n      className: cn(styles.mapContainer),\n      children: /*#__PURE__*/_jsx(MapContainer, {\n        cities: cities,\n        centerOnFrance: true,\n        handleMouseEvent: handleMouseEvent,\n        highlightCity: highlightCity\n      })\n    })]\n  });\n};\n\nvar MobileMapSlice = function MobileMapSlice(_ref2) {\n  var listTab = _ref2.listTab,\n      mapTab = _ref2.mapTab,\n      cities = _ref2.cities,\n      searchPlaceholder = _ref2.searchPlaceholder,\n      loadMoreCities = _ref2.loadMoreCities;\n\n  var _useState2 = useState(null),\n      highlightCity = _useState2[0],\n      setHighlightCity = _useState2[1];\n\n  var handleMouseEvent = function handleMouseEvent(type, slug) {\n    if (type == 'click') {\n      setHighlightCity(highlightCity == slug ? null : slug);\n    }\n\n    if (type == 'mapClick') {\n      setHighlightCity(null);\n    }\n  };\n\n  return /*#__PURE__*/_jsx(TabsSlice, {\n    tabs: [{\n      label: listTab,\n      key: 'list',\n      render: function render() {\n        return /*#__PURE__*/_jsx(\"div\", {\n          className: cn(styles.listContainer),\n          children: /*#__PURE__*/_jsx(CitiesList, {\n            cities: cities,\n            placeholder: searchPlaceholder,\n            loadMore: loadMoreCities\n          })\n        }, 'list');\n      }\n    }, {\n      label: mapTab,\n      key: 'map',\n      render: function render() {\n        return /*#__PURE__*/_jsx(\"div\", {\n          className: cn(styles.mapContainer),\n          children: /*#__PURE__*/_jsx(MapContainer, {\n            cities: cities,\n            centerOnFrance: true,\n            handleMouseEvent: handleMouseEvent,\n            highlightCity: highlightCity,\n            centerOn: highlightCity,\n            overlayKey: highlightCity,\n            overlay: highlightCity && /*#__PURE__*/_jsx(CityItem, {\n              className: cn(styles.cityItem),\n              light: true,\n              city: cities.filter(function (city) {\n                return city.slug == highlightCity;\n              })[0]\n            })\n          })\n        }, 'map');\n      }\n    }]\n  });\n};\n\nvar MapSlice = function MapSlice(props) {\n  var id = props.id,\n      introText = props.introText,\n      rest = _objectWithoutProperties(props, [\"id\", \"introText\"]);\n\n  var isDesktop = useIsDesktop();\n  return /*#__PURE__*/_jsxs(\"section\", {\n    id: id,\n    className: cn(styles.mapSlice),\n    children: [/*#__PURE__*/_jsx(SliceIntro, {\n      text: introText,\n      mobileColor: \"green-grey\"\n    }), isDesktop ? /*#__PURE__*/_jsx(DesktopMapSlice, _objectSpread({}, rest)) : /*#__PURE__*/_jsx(MobileMapSlice, _objectSpread({}, rest))]\n  });\n};\n\nexport default MapSlice;","map":null,"metadata":{},"sourceType":"module"}