@geotrekce/geotrek-rando-widget 0.0.21 → 0.2.1

package/dist/esm/grw-information-desk-detail_3.entry.js

@@ -1,35 +1,77 @@
-import { r as registerInstance, h, H as Host } from './index-e862524f.js';
-import { s as state } from './store-5565fa38.js';
+import { r as registerInstance, e as createEvent, h, H as Host, i as getAssetPath } from './index-57c9193c.js';
+import { S as Swiper, N as Navigation, P as Pagination, K as Keyboard } from './pagination-24051620.js';
+import { s as state } from './store-b2d579d9.js';
 
-const grwInformationDeskDetailCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host a{color:var(--color-primary)}.information-desk-img{width:180px}.information-desk-img img{width:180px;border-radius:8px}.information-desk-sub-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.information-desk-name{color:var(--color-primary);font-size:24px;font-weight:bold;padding:12px 0px}.information-desk-description{font-size:16px}";
+const grwInformationDeskDetailCss = "@import url(\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\");:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden;border:1px solid gray;border-radius:12px;background-color:var(--color-surface-container-low);color:var(--color-on-surface)}:host a{color:var(--color-primary-app)}.information-desk-img{position:relative}.information-desk-img img{width:100%;height:100%;max-height:200px;-o-object-fit:cover;object-fit:cover}.information-desk-sub-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:12px}.information-desk-name{font-size:16px;line-height:24px;font-weight:500}.information-desk-description{font-size:14px;line-height:20px}.information-desk-description-short{font-size:14px;line-height:20px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.handle-information-desk-description{cursor:pointer;color:var(--color-primary-app);text-decoration:underline;margin-top:12px}.phone-container,.mail-container,.link-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.phone-container span,.mail-container span,.link-container span{font-size:16px;margin-right:8px}.center-on-map-button{cursor:pointer;background-color:var(--color-primary-container);color:var(--color-on-primary-container);border-radius:8px;padding:8px 16px;-webkit-box-shadow:var(--elevation-1);box-shadow:var(--elevation-1);height:32px;gap:8px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:start;vertical-align:middle;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;position:relative;border:none;font-size:14px;margin:12px 0px}.center-on-map-button:hover{-webkit-box-shadow:var(--elevation-2);box-shadow:var(--elevation-2)}.center-on-map-button span{font-size:18px}";
 
 const GrwInformationDeskDetail = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.centerOnMap = createEvent(this, "centerOnMap", 7);
+    this.displayShortDescription = true;
     this.informationDesk = undefined;
   }
+  handleInformationDeskDescription() {
+    this.displayShortDescription = !this.displayShortDescription;
+  }
+  handleCenterOnMap() {
+    this.centerOnMap.emit({ latitude: this.informationDesk.latitude, longitude: this.informationDesk.longitude });
+  }
   render() {
-    return (h(Host, null, this.informationDesk.photo_url && (h("div", { class: "information-desk-img" }, h("img", { src: this.informationDesk.photo_url, loading: "lazy" }))), h("div", { class: "information-desk-sub-container" }, this.informationDesk.name && h("div", { class: "information-desk-name" }, this.informationDesk.name), this.informationDesk.description && h("div", { class: "information-desk-description", innerHTML: this.informationDesk.description }), this.informationDesk.postal_code ||
-      this.informationDesk.municipality ||
-      (this.informationDesk.street && (h("div", null, this.informationDesk.postal_code, ` ${this.informationDesk.municipality}`, ` ${this.informationDesk.street}`))), this.informationDesk.phone && (h("div", null, h("a", { href: `tel:${this.informationDesk.phone}` }, this.informationDesk.phone))), this.informationDesk.email && (h("div", null, h("a", { href: `mailto:${this.informationDesk.email}` }, this.informationDesk.email))), this.informationDesk.website && (h("div", null, h("a", { href: `${this.informationDesk.website}` }, this.informationDesk.website))))));
+    return (h(Host, null, this.informationDesk.photo_url && (h("div", { class: "information-desk-img" }, h("img", { src: this.informationDesk.photo_url, loading: "lazy" }))), h("div", { class: "information-desk-sub-container" }, this.informationDesk.name && h("div", { class: "information-desk-name" }, this.informationDesk.name), this.informationDesk.latitude && this.informationDesk.longitude && (h("button", { class: "center-on-map-button", onClick: () => this.handleCenterOnMap() }, h("span", { class: "material-symbols-outlined" }, "location_searching"), "Centrer sur la carte")), (this.informationDesk.postal_code || this.informationDesk.municipality || this.informationDesk.street) && (h("div", null, this.informationDesk.postal_code && this.informationDesk.postal_code, this.informationDesk.municipality && ` ${this.informationDesk.municipality}`, this.informationDesk.street && ` ${this.informationDesk.street}`)), this.informationDesk.phone && (h("div", { class: "phone-container" }, h("span", { class: "material-symbols-outlined" }, "call"), h("a", { href: `tel:${this.informationDesk.phone}` }, this.informationDesk.phone))), this.informationDesk.email && (h("div", { class: "mail-container" }, h("span", { class: "material-symbols-outlined" }, "mail"), h("a", { href: `mailto:${this.informationDesk.email}` }, this.informationDesk.email))), this.informationDesk.website && (h("div", { class: "link-container" }, h("span", { class: "material-symbols-outlined" }, "link"), h("a", { href: `${this.informationDesk.website}` }, this.informationDesk.website))), this.informationDesk.description && (h("div", { class: "information-desk-description-container" }, h("div", { class: this.displayShortDescription ? 'information-desk-description-short' : 'information-desk-description', innerHTML: this.informationDesk.description }), h("div", { class: "handle-information-desk-description", onClick: () => this.handleInformationDeskDescription() }, this.displayShortDescription ? 'Lire plus' : 'Lire moins'))))));
   }
 };
 GrwInformationDeskDetail.style = grwInformationDeskDetailCss;
 
-const grwPoiDetailCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host a{color:var(--color-primary)}.poi-img{width:180px}.poi-img img{width:180px;border-radius:8px}.poi-sub-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.poi-name{color:var(--color-primary);font-size:24px;font-weight:bold;padding:12px 0px}.poi-description{font-size:16px}";
+const grwPoiDetailCss = "@import url(\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\");@font-face{font-family:\"swiper-icons\";src:url(\"data:application/font-woff;charset=utf-8;base64, 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\") format(\"woff\");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff;}.swiper,swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform, -webkit-transform;-webkit-transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial);-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0px, 0, 0);transform:translate3d(0px, 0, 0)}.swiper-horizontal{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-vertical{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-slide,swiper-slide{-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform, -webkit-transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height, -webkit-transform;transition-property:height, -webkit-transform;transition-property:transform, height;transition-property:transform, height, -webkit-transform}.swiper-backface-hidden .swiper-slide{-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{-webkit-perspective:1200px;perspective:1200px}.swiper-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-cube-shadow{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0, 0, 0, 0.15)}.swiper-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0))}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none;}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{-webkit-scroll-snap-type:y mandatory;-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{-webkit-scroll-snap-type:none;-ms-scroll-snap-type:none;scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-centered>.swiper-wrapper::before{content:\"\";-ms-flex-negative:0;flex-shrink:0;-ms-flex-order:9999;order:9999}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{-webkit-margin-start:var(--swiper-centered-offset-before);margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{-webkit-margin-before:var(--swiper-centered-offset-before);margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;transform-origin:50%;-webkit-box-sizing:border-box;box-sizing:border-box;border:4px solid var(--swiper-preloader-color, var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,swiper-container:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{-webkit-animation:swiper-preloader-spin 1s infinite linear;animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@-webkit-keyframes swiper-preloader-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:root{--swiper-navigation-size:44px;}.swiper-button-prev,.swiper-button-next{position:absolute;top:var(--swiper-navigation-top-offset, 50%);width:calc(var(--swiper-navigation-size) / 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - var(--swiper-navigation-size) / 2);z-index:10;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;color:var(--swiper-navigation-color, var(--swiper-theme-color))}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:0.35;cursor:auto;pointer-events:none}.swiper-button-prev.swiper-button-hidden,.swiper-button-next.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-prev,.swiper-navigation-disabled .swiper-button-next{display:none !important}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none !important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset, 10px);right:auto}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:\"prev\"}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset, 10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:\"next\"}.swiper-button-lock{display:none}:root{}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:300ms opacity;transition:300ms opacity;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none !important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom, 8px);top:var(--swiper-pagination-top, auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(0.33);transform:scale(0.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(0.66);transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(0.33);transform:scale(0.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(0.66);transform:scale(0.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(0.33);transform:scale(0.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));height:var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius, 50%);background:var(--swiper-pagination-bullet-inactive-color, #000);opacity:var(--swiper-pagination-bullet-inactive-opacity, 0.2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none !important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color, var(--swiper-theme-color))}.swiper-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right, 8px);left:var(--swiper-pagination-left, auto);top:50%;-webkit-transform:translate3d(0px, -50%, 0);transform:translate3d(0px, -50%, 0)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap, 6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:200ms top, 200ms -webkit-transform;transition:200ms top, 200ms -webkit-transform;transition:200ms transform, 200ms top;transition:200ms transform, 200ms top, 200ms -webkit-transform}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap, 4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms left, 200ms -webkit-transform;transition:200ms left, 200ms -webkit-transform;transition:200ms transform, 200ms left;transition:200ms transform, 200ms left, 200ms -webkit-transform}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,:host(.swiper-horizontal.swiper-rtl) .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms right, 200ms -webkit-transform;transition:200ms right, 200ms -webkit-transform;transition:200ms transform, 200ms right;transition:200ms transform, 200ms right, 200ms -webkit-transform}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color, inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));position:absolute;}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color, var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size, 4px);left:0;top:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size, 4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;overflow:hidden;border:1px solid gray;border-radius:12px;background-color:var(--color-surface-container-low);color:var(--color-on-surface);--swiper-navigation-size:32px;--swiper-navigation-color:var(--color-primary-app);--swiper-pagination-bullet-size:12px}:host a{color:var(--color-primary-app)}.poi-type-img-container{position:relative}.poi-type-img-container .poi-img,.poi-type-img-container .default-poi-img{width:100%;height:100%;max-height:200px;-o-object-fit:cover;object-fit:cover}.poi-type-img-container .poi-img{cursor:pointer;-o-object-fit:cover;object-fit:cover}.poi-type-img-container .default-poi-img{background-color:var(--color-primary-container);-o-object-fit:contain;object-fit:contain}.poi-type-img-container .img-fullscreen{max-height:none;-o-object-fit:contain;object-fit:contain}.poi-type-img-container .poi-type{width:24px;height:24px;padding:4px;border:2px solid #ffffff;border-radius:50%;background-color:var(--color-on-surface);position:absolute;top:8px;left:8px;z-index:200}.poi-sub-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:12px}.poi-name{font-size:16px;line-height:24px}.poi-description{font-size:14px;line-height:20px}.poi-description-short{font-size:14px;line-height:20px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.handle-poi-description{cursor:pointer;color:var(--color-primary-app);text-decoration:underline;margin-top:12px}";
 
 const GrwPoiDetail = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.poi = undefined;
+    this.displayShortDescription = true;
+    this.displayFullscreen = false;
+  }
+  componentDidLoad() {
+    this.swiperPoi = new Swiper(this.swiperPoiRef, {
+      modules: [Navigation, Pagination, Keyboard],
+      navigation: {
+        prevEl: this.prevElPoiRef,
+        nextEl: this.nextElPoiRef,
+      },
+      pagination: { el: this.paginationElPoiRef },
+      allowTouchMove: false,
+      keyboard: false,
+    });
+    this.swiperPoiRef.onfullscreenchange = () => {
+      this.displayFullscreen = !this.displayFullscreen;
+      if (this.displayFullscreen) {
+        this.swiperPoi.keyboard.enable();
+      }
+      else {
+        this.swiperPoi.keyboard.disable();
+      }
+    };
+  }
+  handlePoiDescription() {
+    this.displayShortDescription = !this.displayShortDescription;
+  }
+  handleFullscreen() {
+    if (this.poi.attachments && this.poi.attachments[0] && this.poi.attachments[0].url) {
+      this.swiperPoiRef.requestFullscreen();
+    }
   }
   render() {
-    return (h(Host, null, this.poi.attachments && this.poi.attachments[0] && this.poi.attachments[0].thumbnail && (h("div", { class: "poi-img" }, h("img", { src: this.poi.attachments[0].thumbnail, loading: "lazy" }))), h("div", { class: "poi-sub-container" }, h("div", { class: "poi-name" }, this.poi.name), h("div", { class: "poi-description", innerHTML: this.poi.description }))));
+    var _a;
+    const defaultImageSrc = getAssetPath(`${''}assets/default-image.svg`);
+    return (h(Host, null, h("div", { class: "poi-type-img-container" }, h("img", { class: "poi-type", src: `${(_a = state.poiTypes.find(poiType => poiType.id === this.poi.type)) === null || _a === void 0 ? void 0 : _a.pictogram}` }), h("div", { class: "swiper", ref: el => (this.swiperPoiRef = el) }, h("div", { class: "swiper-wrapper" }, this.poi.attachments.length > 0 ? (this.poi.attachments
+      .filter(attachment => attachment.type === 'image')
+      .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: `poi-img${this.displayFullscreen ? ' img-fullscreen' : ''}`, src: this.displayFullscreen ? attachment.url : attachment.thumbnail, loading: "lazy", onClick: () => this.handleFullscreen() }))))) : (h("div", { class: "swiper-slide" }, h("img", { class: "default-poi-img", src: defaultImageSrc, loading: "lazy" })))), h("div", { class: "swiper-pagination", ref: el => (this.paginationElPoiRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElPoiRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElPoiRef = el) }))), h("div", { class: "poi-sub-container" }, h("div", { class: "poi-name" }, this.poi.name), h("div", { class: this.displayShortDescription ? 'poi-description-short' : 'poi-description', innerHTML: this.poi.description }), h("div", { class: "handle-poi-description", onClick: () => this.handlePoiDescription() }, this.displayShortDescription ? 'Lire plus' : 'Lire moins'))));
   }
 };
 GrwPoiDetail.style = grwPoiDetailCss;
 
-const grwSensitiveAreaDetailCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host a{color:var(--color-primary)}.sensitive-area-title{color:var(--color-primary);font-size:24px;padding:12px 0px;font-weight:bold}.sensitive-area-description{font-size:16px}.sensitive-area-period-container .sensitive-area-period-title,.sensitive-area-period-container .sensitive-area-practice-title,.sensitive-area-period-container .sensitive-area-contact-title,.sensitive-area-practice-container .sensitive-area-period-title,.sensitive-area-practice-container .sensitive-area-practice-title,.sensitive-area-practice-container .sensitive-area-contact-title,.sensitive-area-contact-container .sensitive-area-period-title,.sensitive-area-contact-container .sensitive-area-practice-title,.sensitive-area-contact-container .sensitive-area-contact-title{color:var(--color-primary);font-size:24px;padding:12px 0px}.sensitive-area-period-container .sensitive-area-period-values,.sensitive-area-period-container .sensitive-area-practice-values,.sensitive-area-practice-container .sensitive-area-period-values,.sensitive-area-practice-container .sensitive-area-practice-values,.sensitive-area-contact-container .sensitive-area-period-values,.sensitive-area-contact-container .sensitive-area-practice-values{display:-ms-flexbox;display:flex}";
+const grwSensitiveAreaDetailCss = "@import url(\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\");:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;color:var(--color-on-surface)}:host a{color:var(--color-primary-app)}.sensitive-area-title{font-size:22px;line-height:28px;padding:12px 0px;font-weight:400}.sensitive-area-description{font-size:16px;line-height:24px}.sensitive-area-period-container .sensitive-area-period-title,.sensitive-area-period-container .sensitive-area-practice-title,.sensitive-area-period-container .sensitive-area-contact-title,.sensitive-area-practice-container .sensitive-area-period-title,.sensitive-area-practice-container .sensitive-area-practice-title,.sensitive-area-practice-container .sensitive-area-contact-title,.sensitive-area-contact-container .sensitive-area-period-title,.sensitive-area-contact-container .sensitive-area-practice-title,.sensitive-area-contact-container .sensitive-area-contact-title{font-size:16px;line-height:24px;padding:12px 0px}.sensitive-area-period-container .sensitive-area-period-values,.sensitive-area-period-container .sensitive-area-practice-values,.sensitive-area-practice-container .sensitive-area-period-values,.sensitive-area-practice-container .sensitive-area-practice-values,.sensitive-area-contact-container .sensitive-area-period-values,.sensitive-area-contact-container .sensitive-area-practice-values{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}";
 
 const GrwSensitiveAreaDetail = class {
   constructor(hostRef) {

package/dist/esm/grw-information-desk-detail_3.entry.js.map

@@ -1 +1 @@
-{"file":"grw-information-desk-detail.grw-poi-detail.grw-sensitive-area-detail.entry.js","mappings":"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","names":[],"sources":["./src/components/grw-information-desk-detail/grw-information-desk-detail.scss?tag=grw-information-desk-detail&encapsulation=shadow","./src/components/grw-information-desk-detail/grw-information-desk-detail.tsx","./src/components/grw-poi-detail/grw-poi-detail.scss?tag=grw-poi-detail&encapsulation=shadow","./src/components/grw-poi-detail/grw-poi-detail.tsx","./src/components/grw-sensitive-area-detail/grw-sensitive-area-detail.scss?tag=grw-sensitive-area-detail&encapsulation=shadow","./src/components/grw-sensitive-area-detail/grw-sensitive-area-detail.tsx"],"sourcesContent":[":host {\n  display: flex;\n  flex-direction: column;\n  a {\n    color: var(--color-primary);\n  }\n}\n\n.information-desk-img {\n  width: 180px;\n  img {\n    width: 180px;\n    border-radius: 8px;\n  }\n}\n\n.information-desk-sub-container {\n  display: flex;\n  flex-direction: column;\n}\n\n.information-desk-name {\n  color: var(--color-primary);\n  font-size: 24px;\n  font-weight: bold;\n  padding: 12px 0px;\n}\n\n.information-desk-description {\n  font-size: 16px;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { InformationDesk } from 'types/types';\n\n@Component({\n  tag: 'grw-information-desk-detail',\n  styleUrl: 'grw-information-desk-detail.scss',\n  shadow: true,\n})\nexport class GrwInformationDeskDetail {\n  @Prop() informationDesk: InformationDesk;\n\n  render() {\n    return (\n      <Host>\n        {this.informationDesk.photo_url && (\n          <div class=\"information-desk-img\">\n            <img src={this.informationDesk.photo_url} loading=\"lazy\" />\n          </div>\n        )}\n        <div class=\"information-desk-sub-container\">\n          {this.informationDesk.name && <div class=\"information-desk-name\">{this.informationDesk.name}</div>}\n          {this.informationDesk.description && <div class=\"information-desk-description\" innerHTML={this.informationDesk.description}></div>}\n          {this.informationDesk.postal_code ||\n            this.informationDesk.municipality ||\n            (this.informationDesk.street && (\n              <div>\n                {this.informationDesk.postal_code}\n                {` ${this.informationDesk.municipality}`}\n                {` ${this.informationDesk.street}`}\n              </div>\n            ))}\n          {this.informationDesk.phone && (\n            <div>\n              <a href={`tel:${this.informationDesk.phone}`}>{this.informationDesk.phone}</a>\n            </div>\n          )}\n          {this.informationDesk.email && (\n            <div>\n              <a href={`mailto:${this.informationDesk.email}`}>{this.informationDesk.email}</a>\n            </div>\n          )}\n          {this.informationDesk.website && (\n            <div>\n              <a href={`${this.informationDesk.website}`}>{this.informationDesk.website}</a>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n",":host {\n  display: flex;\n  flex-direction: column;\n  a {\n    color: var(--color-primary);\n  }\n}\n\n.poi-img {\n  width: 180px;\n  img {\n    width: 180px;\n    border-radius: 8px;\n  }\n}\n\n.poi-sub-container {\n  display: flex;\n  flex-direction: column;\n}\n\n.poi-name {\n  color: var(--color-primary);\n  font-size: 24px;\n  font-weight: bold;\n  padding: 12px 0px;\n}\n\n.poi-description {\n  font-size: 16px;\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport { Poi } from 'types/types';\n\n@Component({\n  tag: 'grw-poi-detail',\n  styleUrl: 'grw-poi-detail.scss',\n  shadow: true,\n})\nexport class GrwPoiDetail {\n  @Prop() poi: Poi;\n\n  render() {\n    return (\n      <Host>\n        {this.poi.attachments && this.poi.attachments[0] && this.poi.attachments[0].thumbnail && (\n          <div class=\"poi-img\">\n            <img src={this.poi.attachments[0].thumbnail} loading=\"lazy\" />\n          </div>\n        )}\n        <div class=\"poi-sub-container\">\n          <div class=\"poi-name\">{this.poi.name}</div>\n          <div class=\"poi-description\" innerHTML={this.poi.description}></div>\n        </div>\n      </Host>\n    );\n  }\n}\n",":host {\n  display: flex;\n  flex-direction: column;\n  a {\n    color: var(--color-primary);\n  }\n}\n\n.sensitive-area-title {\n  color: var(--color-primary);\n  font-size: 24px;\n  padding: 12px 0px;\n  font-weight: bold;\n}\n\n.sensitive-area-description {\n  font-size: 16px;\n}\n\n.sensitive-area-period-container,\n.sensitive-area-practice-container,\n.sensitive-area-contact-container {\n  .sensitive-area-period-title,\n  .sensitive-area-practice-title,\n  .sensitive-area-contact-title {\n    color: var(--color-primary);\n    font-size: 24px;\n    padding: 12px 0px;\n  }\n  .sensitive-area-period-values,\n  .sensitive-area-practice-values {\n    display: flex;\n  }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport state from 'store/store';\nimport { SensitiveArea } from 'types/types';\n\n@Component({\n  tag: 'grw-sensitive-area-detail',\n  styleUrl: 'grw-sensitive-area-detail.scss',\n  shadow: true,\n})\nexport class GrwSensitiveAreaDetail {\n  @Prop() sensitiveArea: SensitiveArea;\n\n  render() {\n    return (\n      <Host>\n        <div class=\"sensitive-area-title\">{this.sensitiveArea.name}</div>\n        <div class=\"sensitive-area-description\" innerHTML={this.sensitiveArea.description}></div>\n        {this.sensitiveArea.practices && this.sensitiveArea.practices.length > 0 && (\n          <div class=\"sensitive-area-practice-container\">\n            <div class=\"sensitive-area-practice-title\">Domaines d'activités concernés :</div>\n            <div class=\"sensitive-area-practice-values\">\n              {this.sensitiveArea.practices.map((sensitiveAreaPractice, index) => {\n                const practice = state.practices.find(statePractice => statePractice.id === sensitiveAreaPractice);\n                if (practice) {\n                  return <div innerHTML={`${practice.name.toUpperCase()}${index + 1 !== this.sensitiveArea.practices.length ? ' -&nbsp;' : ''}`}></div>;\n                }\n              })}\n            </div>\n          </div>\n        )}\n        {this.sensitiveArea.period && this.sensitiveArea.period.length > 0 && (\n          <div class=\"sensitive-area-period-container\">\n            <div class=\"sensitive-area-period-title\">Périodes de sensibilité</div>\n            <div class=\"sensitive-area-period-values\">\n              {this.sensitiveArea.period.map((month, index) => {\n                if (month) {\n                  return (\n                    <div\n                      innerHTML={`${new Date(0, index + 1, 0).toLocaleDateString('fr', { month: 'long' }).toUpperCase()}${\n                        this.sensitiveArea.period.slice(index + 1).find(month => month) ? ' -&nbsp;' : ''\n                      }`}\n                    ></div>\n                  );\n                }\n              })}\n            </div>\n          </div>\n        )}\n        <div class=\"sensitive-area-contact-container\">\n          <div class=\"sensitive-area-contact-title\">Contact</div>\n          <div innerHTML={this.sensitiveArea.contact} class=\"sensitive-area-contact-value\"></div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"grw-information-desk-detail.grw-poi-detail.grw-sensitive-area-detail.entry.js","mappings":"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","names":[],"sources":["./src/components/grw-information-desk-detail/grw-information-desk-detail.scss?tag=grw-information-desk-detail&encapsulation=shadow","./src/components/grw-information-desk-detail/grw-information-desk-detail.tsx","./src/components/grw-poi-detail/grw-poi-detail.scss?tag=grw-poi-detail&encapsulation=shadow","./src/components/grw-poi-detail/grw-poi-detail.tsx","./src/components/grw-sensitive-area-detail/grw-sensitive-area-detail.scss?tag=grw-sensitive-area-detail&encapsulation=shadow","./src/components/grw-sensitive-area-detail/grw-sensitive-area-detail.tsx"],"sourcesContent":["@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0');\n\n:host {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  border: 1px solid gray;\n  border-radius: 12px;\n  background-color: var(--color-surface-container-low);\n  color: var(--color-on-surface);\n  a {\n    color: var(--color-primary-app);\n  }\n}\n\n.information-desk-img {\n  position: relative;\n  img {\n    width: 100%;\n    height: 100%;\n    max-height: 200px;\n    object-fit: cover;\n  }\n}\n\n.information-desk-sub-container {\n  display: flex;\n  flex-direction: column;\n  padding: 12px;\n}\n\n.information-desk-name {\n  font-size: 16px;\n  line-height: 24px;\n  font-weight: 500;\n}\n\n.information-desk-description {\n  font-size: 14px;\n  line-height: 20px;\n}\n\n.information-desk-description-short {\n  font-size: 14px;\n  line-height: 20px;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 4;\n  overflow: hidden;\n}\n\n.handle-information-desk-description {\n  cursor: pointer;\n  color: var(--color-primary-app);\n  text-decoration: underline;\n  margin-top: 12px;\n}\n\n.phone-container,\n.mail-container,\n.link-container {\n  display: flex;\n  align-items: center;\n  span {\n    font-size: 16px;\n    margin-right: 8px;\n  }\n}\n\n.center-on-map-button {\n  cursor: pointer;\n  background-color: var(--color-primary-container);\n  color: var(--color-on-primary-container);\n  border-radius: 8px;\n  padding: 8px 16px;\n  box-shadow: var(--elevation-1);\n  height: 32px;\n  gap: 8px;\n  box-sizing: border-box;\n  text-align: start;\n  vertical-align: middle;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  border: none;\n  font-size: 14px;\n  margin: 12px 0px;\n  &:hover {\n    box-shadow: var(--elevation-2);\n  }\n  span {\n    font-size: 18px;\n  }\n}\n","import { Component, Host, h, Prop, State, Event, EventEmitter } from '@stencil/core';\nimport { InformationDesk } from 'types/types';\n\n@Component({\n  tag: 'grw-information-desk-detail',\n  styleUrl: 'grw-information-desk-detail.scss',\n  shadow: true,\n})\nexport class GrwInformationDeskDetail {\n  @Event() centerOnMap: EventEmitter<{ latitude: number; longitude: number }>;\n  @State() displayShortDescription = true;\n  @Prop() informationDesk: InformationDesk;\n\n  handleInformationDeskDescription() {\n    this.displayShortDescription = !this.displayShortDescription;\n  }\n\n  handleCenterOnMap() {\n    this.centerOnMap.emit({ latitude: this.informationDesk.latitude, longitude: this.informationDesk.longitude });\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.informationDesk.photo_url && (\n          <div class=\"information-desk-img\">\n            <img src={this.informationDesk.photo_url} loading=\"lazy\" />\n          </div>\n        )}\n        <div class=\"information-desk-sub-container\">\n          {this.informationDesk.name && <div class=\"information-desk-name\">{this.informationDesk.name}</div>}\n          {this.informationDesk.latitude && this.informationDesk.longitude && (\n            <button class=\"center-on-map-button\" onClick={() => this.handleCenterOnMap()}>\n              <span class=\"material-symbols-outlined\">location_searching</span>\n              Centrer sur la carte\n            </button>\n          )}\n          {(this.informationDesk.postal_code || this.informationDesk.municipality || this.informationDesk.street) && (\n            <div>\n              {this.informationDesk.postal_code && this.informationDesk.postal_code}\n              {this.informationDesk.municipality && ` ${this.informationDesk.municipality}`}\n              {this.informationDesk.street && ` ${this.informationDesk.street}`}\n            </div>\n          )}\n          {this.informationDesk.phone && (\n            <div class=\"phone-container\">\n              <span class=\"material-symbols-outlined\">call</span>\n              <a href={`tel:${this.informationDesk.phone}`}>{this.informationDesk.phone}</a>\n            </div>\n          )}\n          {this.informationDesk.email && (\n            <div class=\"mail-container\">\n              <span class=\"material-symbols-outlined\">mail</span>\n              <a href={`mailto:${this.informationDesk.email}`}>{this.informationDesk.email}</a>\n            </div>\n          )}\n          {this.informationDesk.website && (\n            <div class=\"link-container\">\n              <span class=\"material-symbols-outlined\">link</span>\n              <a href={`${this.informationDesk.website}`}>{this.informationDesk.website}</a>\n            </div>\n          )}\n          {this.informationDesk.description && (\n            <div class=\"information-desk-description-container\">\n              <div class={this.displayShortDescription ? 'information-desk-description-short' : 'information-desk-description'} innerHTML={this.informationDesk.description}></div>\n              <div class=\"handle-information-desk-description\" onClick={() => this.handleInformationDeskDescription()}>\n                {this.displayShortDescription ? 'Lire plus' : 'Lire moins'}\n              </div>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n","@use '~swiper/swiper.scss';\n@use '~swiper/modules/navigation/navigation.scss';\n@use '~swiper/modules/pagination/pagination.scss';\n\n@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0');\n\n:host {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  border: 1px solid gray;\n  border-radius: 12px;\n  background-color: var(--color-surface-container-low);\n  color: var(--color-on-surface);\n  --swiper-navigation-size: 32px;\n  --swiper-navigation-color: var(--color-primary-app);\n  --swiper-pagination-bullet-size: 12px;\n  a {\n    color: var(--color-primary-app);\n  }\n}\n\n.poi-type-img-container {\n  position: relative;\n  .poi-img,\n  .default-poi-img {\n    width: 100%;\n    height: 100%;\n    max-height: 200px;\n    object-fit: cover;\n  }\n  .poi-img {\n    cursor: pointer;\n    object-fit: cover;\n  }\n  .default-poi-img {\n    background-color: var(--color-primary-container);\n    object-fit: contain;\n  }\n  .img-fullscreen {\n    max-height: none;\n    object-fit: contain;\n  }\n  .poi-type {\n    width: 24px;\n    height: 24px;\n    padding: 4px;\n    border: 2px solid #ffffff;\n    border-radius: 50%;\n    background-color: var(--color-on-surface);\n    position: absolute;\n    top: 8px;\n    left: 8px;\n    z-index: 200;\n  }\n}\n\n.poi-sub-container {\n  display: flex;\n  flex-direction: column;\n  padding: 12px;\n}\n\n.poi-name {\n  font-size: 16px;\n  line-height: 24px;\n}\n\n.poi-description {\n  font-size: 14px;\n  line-height: 20px;\n}\n\n.poi-description-short {\n  font-size: 14px;\n  line-height: 20px;\n  display: -webkit-box;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 4;\n  overflow: hidden;\n}\n\n.handle-poi-description {\n  cursor: pointer;\n  color: var(--color-primary-app);\n  text-decoration: underline;\n  margin-top: 12px;\n}\n","import { Component, Host, h, Prop, State, Build, getAssetPath } from '@stencil/core';\nimport Swiper, { Navigation, Pagination, Keyboard } from 'swiper';\nimport state from 'store/store';\nimport { Poi } from 'types/types';\n\n@Component({\n  tag: 'grw-poi-detail',\n  styleUrl: 'grw-poi-detail.scss',\n  shadow: true,\n})\nexport class GrwPoiDetail {\n  swiperPoi?: Swiper;\n  swiperPoiRef?: HTMLDivElement;\n  prevElPoiRef?: HTMLDivElement;\n  nextElPoiRef?: HTMLDivElement;\n  paginationElPoiRef?: HTMLDivElement;\n  @Prop() poi: Poi;\n  @State() displayShortDescription = true;\n  @State() displayFullscreen = false;\n\n  componentDidLoad() {\n    this.swiperPoi = new Swiper(this.swiperPoiRef, {\n      modules: [Navigation, Pagination, Keyboard],\n      navigation: {\n        prevEl: this.prevElPoiRef,\n        nextEl: this.nextElPoiRef,\n      },\n      pagination: { el: this.paginationElPoiRef },\n      allowTouchMove: false,\n      keyboard: false,\n    });\n    this.swiperPoiRef.onfullscreenchange = () => {\n      this.displayFullscreen = !this.displayFullscreen;\n      if (this.displayFullscreen) {\n        this.swiperPoi.keyboard.enable();\n      } else {\n        this.swiperPoi.keyboard.disable();\n      }\n    };\n  }\n\n  handlePoiDescription() {\n    this.displayShortDescription = !this.displayShortDescription;\n  }\n\n  handleFullscreen() {\n    if (this.poi.attachments && this.poi.attachments[0] && this.poi.attachments[0].url) {\n      this.swiperPoiRef.requestFullscreen();\n    }\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    return (\n      <Host>\n        <div class=\"poi-type-img-container\">\n          <img class=\"poi-type\" src={`${state.poiTypes.find(poiType => poiType.id === this.poi.type)?.pictogram}`} />\n          <div class=\"swiper\" ref={el => (this.swiperPoiRef = el)}>\n            <div class=\"swiper-wrapper\">\n              {this.poi.attachments.length > 0 ? (\n                this.poi.attachments\n                  .filter(attachment => attachment.type === 'image')\n                  .map(attachment => (\n                    <div class=\"swiper-slide\">\n                      <img\n                        class={`poi-img${this.displayFullscreen ? ' img-fullscreen' : ''}`}\n                        src={this.displayFullscreen ? attachment.url : attachment.thumbnail}\n                        loading=\"lazy\"\n                        onClick={() => this.handleFullscreen()}\n                      />\n                    </div>\n                  ))\n              ) : (\n                <div class=\"swiper-slide\">\n                  <img class=\"default-poi-img\" src={defaultImageSrc} loading=\"lazy\" />\n                </div>\n              )}\n            </div>\n            <div class=\"swiper-pagination\" ref={el => (this.paginationElPoiRef = el)}></div>\n            <div class=\"swiper-button-prev\" ref={el => (this.prevElPoiRef = el)}></div>\n            <div class=\"swiper-button-next\" ref={el => (this.nextElPoiRef = el)}></div>\n          </div>\n        </div>\n        <div class=\"poi-sub-container\">\n          <div class=\"poi-name\">{this.poi.name}</div>\n          <div class={this.displayShortDescription ? 'poi-description-short' : 'poi-description'} innerHTML={this.poi.description}></div>\n          <div class=\"handle-poi-description\" onClick={() => this.handlePoiDescription()}>\n            {this.displayShortDescription ? 'Lire plus' : 'Lire moins'}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n","@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0');\n\n:host {\n  display: flex;\n  flex-direction: column;\n  color: var(--color-on-surface);\n  a {\n    color: var(--color-primary-app);\n  }\n}\n\n.sensitive-area-title {\n  font-size: 22px;\n  line-height: 28px;\n  padding: 12px 0px;\n  font-weight: 400;\n}\n\n.sensitive-area-description {\n  font-size: 16px;\n  line-height: 24px;\n}\n\n.sensitive-area-period-container,\n.sensitive-area-practice-container,\n.sensitive-area-contact-container {\n  .sensitive-area-period-title,\n  .sensitive-area-practice-title,\n  .sensitive-area-contact-title {\n    font-size: 16px;\n    line-height: 24px;\n    padding: 12px 0px;\n  }\n  .sensitive-area-period-values,\n  .sensitive-area-practice-values {\n    display: flex;\n    flex-wrap: wrap;\n  }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport state from 'store/store';\nimport { SensitiveArea } from 'types/types';\n\n@Component({\n  tag: 'grw-sensitive-area-detail',\n  styleUrl: 'grw-sensitive-area-detail.scss',\n  shadow: true,\n})\nexport class GrwSensitiveAreaDetail {\n  @Prop() sensitiveArea: SensitiveArea;\n\n  render() {\n    return (\n      <Host>\n        <div class=\"sensitive-area-title\">{this.sensitiveArea.name}</div>\n        <div class=\"sensitive-area-description\" innerHTML={this.sensitiveArea.description}></div>\n        {this.sensitiveArea.practices && this.sensitiveArea.practices.length > 0 && (\n          <div class=\"sensitive-area-practice-container\">\n            <div class=\"sensitive-area-practice-title\">Domaines d'activités concernés :</div>\n            <div class=\"sensitive-area-practice-values\">\n              {this.sensitiveArea.practices.map((sensitiveAreaPractice, index) => {\n                const practice = state.practices.find(statePractice => statePractice.id === sensitiveAreaPractice);\n                if (practice) {\n                  return <div innerHTML={`${practice.name.toUpperCase()}${index + 1 !== this.sensitiveArea.practices.length ? ' -&nbsp;' : ''}`}></div>;\n                }\n              })}\n            </div>\n          </div>\n        )}\n        {this.sensitiveArea.period && this.sensitiveArea.period.length > 0 && (\n          <div class=\"sensitive-area-period-container\">\n            <div class=\"sensitive-area-period-title\">Périodes de sensibilité</div>\n            <div class=\"sensitive-area-period-values\">\n              {this.sensitiveArea.period.map((month, index) => {\n                if (month) {\n                  return (\n                    <div\n                      innerHTML={`${new Date(0, index + 1, 0).toLocaleDateString('fr', { month: 'long' }).toUpperCase()}${\n                        this.sensitiveArea.period.slice(index + 1).find(month => month) ? ' -&nbsp;' : ''\n                      }`}\n                    ></div>\n                  );\n                }\n              })}\n            </div>\n          </div>\n        )}\n        <div class=\"sensitive-area-contact-container\">\n          <div class=\"sensitive-area-contact-title\">Contact</div>\n          <div innerHTML={this.sensitiveArea.contact} class=\"sensitive-area-contact-value\"></div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/grw-trek-card.entry.js

@@ -1,8 +1,8 @@
-import { r as registerInstance, i as createEvent, g as getAssetPath, h, H as Host } from './index-e862524f.js';
-import { s as state, o as onChange, r as reset } from './store-5565fa38.js';
+import { r as registerInstance, e as createEvent, h, H as Host } from './index-57c9193c.js';
+import { s as state, o as onChange, r as reset } from './store-b2d579d9.js';
 import { f as formatDuration, a as formatLength, b as formatAscent } from './utils-160ec4d0.js';
 
-const grwTrekCardCss = ".trek-card-container,.trek-card-large-view-container{font-family:\"Roboto\";border-radius:8px;-webkit-box-shadow:4px 8px 24px rgba(0, 0, 0, 0.25);box-shadow:4px 8px 24px rgba(0, 0, 0, 0.25);cursor:pointer}.trek-card-container .image,.trek-card-large-view-container .image{-o-object-fit:cover;object-fit:cover}.trek-card-container .sub-container,.trek-card-large-view-container .sub-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;padding:12px}.trek-card-container .sub-container .name,.trek-card-large-view-container .sub-container .name{color:var(--color-primary);font-size:24px;font-weight:bold;margin-bottom:8px}.trek-card-container .sub-container .departure,.trek-card-large-view-container .sub-container .departure{color:rgba(0, 0, 0, 0.7);font-size:16px;margin:4px 0px}.trek-card-container .sub-container .themes-container,.trek-card-large-view-container .sub-container .themes-container{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap}.trek-card-container .sub-container .themes-container .theme,.trek-card-large-view-container .sub-container .themes-container .theme{background-color:var(--color-primary-tint);color:#ffffff;border-radius:8px;padding:8px;margin:0px 8px 8px 0px}.trek-card-container .sub-container .icons-labels-container,.trek-card-large-view-container .sub-container .icons-labels-container{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap}.trek-card-container .sub-container .icons-labels-container .row,.trek-card-large-view-container .sub-container .icons-labels-container .row{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;width:100%}.trek-card-container .sub-container .icons-labels-container .row:not(:last-child),.trek-card-large-view-container .sub-container .icons-labels-container .row:not(:last-child){margin-bottom:12px}.trek-card-container .sub-container .icons-labels-container .row .icon-label,.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:50%}.trek-card-container .sub-container .icons-labels-container .row .icon-label:nth-child(2),.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label:nth-child(2){margin:0px 4px}.trek-card-container .sub-container .icons-labels-container .row .icon-label img,.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label img{width:24px;height:auto;margin-right:8px}.trek-card-container .sub-container .icons-labels-container .row .practice img,.trek-card-large-view-container .sub-container .icons-labels-container .row .practice img{background-color:var(--color-primary)}.trek-card-container{width:350px;height:auto}.trek-card-container .image{width:100%}.trek-card-large-view-container{height:auto;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}.trek-card-large-view-container .image{width:250px}";
+const grwTrekCardCss = "@import url(\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0\");.trek-card-container,.trek-card-large-view-container{cursor:pointer;font-family:\"Roboto\";border-radius:12px;-webkit-box-shadow:var(--elevation-1);box-shadow:var(--elevation-1);background-color:var(--color-surface-container-low)}.trek-card-container .image,.trek-card-large-view-container .image{-o-object-fit:cover;object-fit:cover;border-top-left-radius:12px;border-top-right-radius:12px}.trek-card-container .sub-container,.trek-card-large-view-container .sub-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;padding:8px 16px}.trek-card-container .sub-container .name,.trek-card-large-view-container .sub-container .name{color:var(--color-on-surface);font-size:22px;line-height:28px;font-weight:400;margin-bottom:8px}.trek-card-container .sub-container .departure,.trek-card-large-view-container .sub-container .departure{color:var(--color-on-surface);font-size:16px;line-height:24px;font-weight:500;margin-bottom:4px}.trek-card-container .sub-container .themes-container,.trek-card-large-view-container .sub-container .themes-container{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap}.trek-card-container .sub-container .themes-container .theme,.trek-card-large-view-container .sub-container .themes-container .theme{background-color:var(--color-secondary-container);color:var(--color-on-secondary-container);border-radius:8px;padding:8px 16px;margin:0px 8px 8px 0px;-webkit-box-shadow:var(--elevation-0);box-shadow:var(--elevation-0);border:1px solid var(--color-outline);height:32px;gap:8px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:start;vertical-align:middle;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;position:relative}.trek-card-container .sub-container .icons-labels-container,.trek-card-large-view-container .sub-container .icons-labels-container{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;color:var(--color-on-surface);font-size:14px;line-height:20px;font-weight:500}.trek-card-container .sub-container .icons-labels-container .row,.trek-card-large-view-container .sub-container .icons-labels-container .row{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;width:100%}.trek-card-container .sub-container .icons-labels-container .row:not(:last-child),.trek-card-large-view-container .sub-container .icons-labels-container .row:not(:last-child){margin-bottom:12px}.trek-card-container .sub-container .icons-labels-container .row .icon-label,.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:50%}.trek-card-container .sub-container .icons-labels-container .row .icon-label:nth-child(2),.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label:nth-child(2){margin:0px 4px}.trek-card-container .sub-container .icons-labels-container .row .icon-label img,.trek-card-container .sub-container .icons-labels-container .row .icon-label span,.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label img,.trek-card-large-view-container .sub-container .icons-labels-container .row .icon-label span{width:24px;height:auto;margin-right:8px}.trek-card-container .sub-container .icons-labels-container .row .practice img,.trek-card-large-view-container .sub-container .icons-labels-container .row .practice img{background-color:var(--color-primary-app)}.trek-card-container{width:350px}.trek-card-container .image{width:100%;max-height:200px}.trek-card-large-view-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}.trek-card-large-view-container .image{width:250px}";
 
 const GrwTrekCard = class {
   constructor(hostRef) {
@@ -15,8 +15,11 @@ const GrwTrekCard = class {
     this.themes = undefined;
     this.departureCity = undefined;
     this.trek = undefined;
-    this.colorPrimary = '#6b0030';
-    this.colorPrimaryTint = '#974c6e';
+    this.colorPrimaryApp = '#6b0030';
+    this.colorOnSurface = '#49454e';
+    this.colorSecondaryContainer = '#e8def8';
+    this.colorOnSecondaryContainer = '#1d192b';
+    this.colorSurfaceContainerLow = '#f7f2fa';
     this.isLargeView = false;
     this.resetStoreOnDisconnected = true;
   }
@@ -47,11 +50,15 @@ const GrwTrekCard = class {
   }
   render() {
     var _a, _b, _c, _d, _e, _f, _g;
-    const durationImageSrc = getAssetPath(`assets/duration.svg`);
-    const lengthImageSrc = getAssetPath(`assets/length.svg`);
-    const ascentImageSrc = getAssetPath(`assets/ascent.svg`);
-    return (h(Host, { onClick: () => this.trekCardPress.emit(this.currentTrek.id), style: { 'width': this.isLargeView ? '100%' : 'auto', '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: this.isLargeView ? 'trek-card-large-view-container' : 'trek-card-container' }, this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: `${this.currentTrek.attachments[0].thumbnail}`, loading: "lazy" })), h("div", { class: "sub-container" }, this.departureCity && h("div", { class: "departure" }, this.departureCity.name), h("div", { class: "name" }, (_a = this.currentTrek) === null || _a === void 0 ? void 0 : _a.name), h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label)))), h("div", { class: "icons-labels-container" }, h("div", { class: "row" }, h("div", { class: "icon-label difficulty" }, ((_b = this.difficulty) === null || _b === void 0 ? void 0 : _b.pictogram) && h("img", { src: this.difficulty.pictogram }), (_c = this.difficulty) === null || _c === void 0 ? void 0 :
-      _c.label), h("div", { class: "icon-label duration" }, h("img", { src: durationImageSrc }), formatDuration(this.currentTrek.duration))), h("div", { class: "row" }, h("div", { class: "icon-label length" }, h("img", { src: lengthImageSrc }), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("img", { src: ascentImageSrc }), formatAscent(this.currentTrek.ascent))), h("div", { class: "row" }, h("div", { class: "icon-label route" }, ((_d = this.route) === null || _d === void 0 ? void 0 : _d.pictogram) && h("img", { src: this.route.pictogram }), (_e = this.route) === null || _e === void 0 ? void 0 :
+    return (h(Host, { style: {
+        'width': this.isLargeView ? '100%' : 'auto',
+        '--color-primary-app': this.colorPrimaryApp,
+        '--color-on-surface': this.colorOnSurface,
+        '--color-secondary-container': this.colorSecondaryContainer,
+        '--color-on-secondary-container': this.colorOnSecondaryContainer,
+        '--color-surface-container-low': this.colorSurfaceContainerLow,
+      } }, this.currentTrek && (h("div", { class: this.isLargeView ? 'trek-card-large-view-container' : 'trek-card-container', onClick: () => this.trekCardPress.emit(this.currentTrek.id) }, this.currentTrek.attachments.filter(attachment => attachment.type === 'image').length > 0 && (h("img", { class: "image", src: `${this.currentTrek.attachments.filter(attachment => attachment.type === 'image')[0].thumbnail}`, loading: "lazy" })), h("div", { class: "sub-container" }, this.departureCity && h("div", { class: "departure" }, this.departureCity.name), h("div", { class: "name" }, (_a = this.currentTrek) === null || _a === void 0 ? void 0 : _a.name), h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label)))), h("div", { class: "icons-labels-container" }, h("div", { class: "row" }, h("div", { class: "icon-label difficulty" }, ((_b = this.difficulty) === null || _b === void 0 ? void 0 : _b.pictogram) && h("img", { src: this.difficulty.pictogram }), (_c = this.difficulty) === null || _c === void 0 ? void 0 :
+      _c.label), h("div", { class: "icon-label duration" }, h("span", { class: "material-symbols-outlined" }, "timelapse"), formatDuration(this.currentTrek.duration))), h("div", { class: "row" }, h("div", { class: "icon-label length" }, h("span", { class: "material-symbols-outlined" }, "open_in_full"), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("span", { class: "material-symbols-outlined" }, "moving"), formatAscent(this.currentTrek.ascent))), h("div", { class: "row" }, h("div", { class: "icon-label route" }, ((_d = this.route) === null || _d === void 0 ? void 0 : _d.pictogram) && h("img", { src: this.route.pictogram }), (_e = this.route) === null || _e === void 0 ? void 0 :
       _e.route), h("div", { class: "icon-label practice" }, ((_f = this.practice) === null || _f === void 0 ? void 0 : _f.pictogram) && h("img", { src: this.practice.pictogram }), (_g = this.practice) === null || _g === void 0 ? void 0 :
       _g.name))))))));
   }

package/dist/esm/grw-trek-card.entry.js.map

@@ -1 +1 @@
-{"file":"grw-trek-card.entry.js","mappings":"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","names":[],"sources":["./src/components/grw-trek-card/grw-trek-card.scss?tag=grw-trek-card&encapsulation=shadow","./src/components/grw-trek-card/grw-trek-card.tsx"],"sourcesContent":[".trek-card-container,\n.trek-card-large-view-container {\n  font-family: 'Roboto';\n  border-radius: 8px;\n  box-shadow: 4px 8px 24px rgba(0, 0, 0, 0.25);\n  cursor: pointer;\n  .image {\n    object-fit: cover;\n  }\n  .sub-container {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: 12px;\n    .name {\n      color: var(--color-primary);\n      font-size: 24px;\n      font-weight: bold;\n      margin-bottom: 8px;\n    }\n    .departure {\n      color: rgba(0, 0, 0, 0.7);\n      font-size: 16px;\n      margin: 4px 0px;\n    }\n    .themes-container {\n      display: flex;\n      justify-content: flex-start;\n      align-items: center;\n      flex-wrap: wrap;\n      .theme {\n        background-color: var(--color-primary-tint);\n        color: #ffffff;\n        border-radius: 8px;\n        padding: 8px;\n        margin: 0px 8px 8px 0px;\n      }\n    }\n    .icons-labels-container {\n      display: flex;\n      justify-content: flex-start;\n      align-items: center;\n      flex-wrap: wrap;\n      .row {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        width: 100%;\n        &:not(:last-child) {\n          margin-bottom: 12px;\n        }\n        .icon-label {\n          &:nth-child(2) {\n            margin: 0px 4px;\n          }\n          display: flex;\n          align-items: center;\n          width: 50%;\n          img {\n            width: 24px;\n            height: auto;\n            margin-right: 8px;\n          }\n        }\n        .practice {\n          img {\n            background-color: var(--color-primary);\n          }\n        }\n      }\n    }\n  }\n}\n\n.trek-card-container {\n  width: 350px;\n  height: auto;\n  .image {\n    width: 100%;\n  }\n}\n\n.trek-card-large-view-container {\n  height: auto;\n  display: flex;\n  flex-direction: row;\n  .image {\n    width: 250px;\n  }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, State, getAssetPath } from '@stencil/core';\nimport state, { onChange, reset } from 'store/store';\nimport { City, Difficulty, Practice, Route, Themes, Trek } from 'types/types';\nimport { formatDuration, formatLength, formatAscent } from 'utils/utils';\n\n@Component({\n  tag: 'grw-trek-card',\n  styleUrl: 'grw-trek-card.scss',\n  shadow: true,\n})\nexport class GrwTrekCard {\n  @Event() trekCardPress: EventEmitter<number>;\n  @State() currentTrek: Trek;\n  @State() difficulty: Difficulty;\n  @State() route: Route;\n  @State() practice: Practice;\n  @State() themes: Themes;\n  @State() departureCity: City;\n  @Prop() trek: Trek;\n  @Prop() colorPrimary = '#6b0030';\n  @Prop() colorPrimaryTint = '#974c6e';\n  @Prop() isLargeView = false;\n  @Prop() resetStoreOnDisconnected = true;\n\n  connectedCallback() {\n    this.currentTrek = this.trek ? this.trek : state.currentTrek;\n    if (this.currentTrek) {\n      this.difficulty = state.difficulties.find(difficulty => difficulty.id === this.currentTrek.difficulty);\n      this.route = state.routes.find(route => route.id === this.currentTrek.route);\n      this.practice = state.practices.find(practice => practice.id === this.currentTrek.practice);\n      this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));\n      this.departureCity = state.cities.find(city => city.id === this.currentTrek.departure_city);\n    }\n    onChange('currentTrek', () => {\n      this.currentTrek = this.trek ? this.trek : state.currentTrek;\n      if (this.currentTrek) {\n        this.difficulty = state.difficulties.find(difficulty => difficulty.id === this.currentTrek.difficulty);\n        this.route = state.routes.find(route => route.id === this.currentTrek.route);\n        this.practice = state.practices.find(practice => practice.id === this.currentTrek.practice);\n        this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));\n        this.departureCity = state.cities.find(city => city.id === this.currentTrek.departure_city);\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.resetStoreOnDisconnected) {\n      reset();\n    }\n  }\n\n  render() {\n    const durationImageSrc = getAssetPath(`assets/duration.svg`);\n    const lengthImageSrc = getAssetPath(`assets/length.svg`);\n    const ascentImageSrc = getAssetPath(`assets/ascent.svg`);\n    return (\n      <Host\n        onClick={() => this.trekCardPress.emit(this.currentTrek.id)}\n        style={{ 'width': this.isLargeView ? '100%' : 'auto', '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint }}\n      >\n        {this.currentTrek && (\n          <div class={this.isLargeView ? 'trek-card-large-view-container' : 'trek-card-container'}>\n            {this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (\n              <img class=\"image\" src={`${this.currentTrek.attachments[0].thumbnail}`} loading=\"lazy\" />\n            )}\n            <div class=\"sub-container\">\n              {this.departureCity && <div class=\"departure\">{this.departureCity.name}</div>}\n              <div class=\"name\">{this.currentTrek?.name}</div>\n              <div class=\"themes-container\">\n                {this.themes.map(theme => (\n                  <div class=\"theme\">{theme.label}</div>\n                ))}\n              </div>\n              <div class=\"icons-labels-container\">\n                <div class=\"row\">\n                  <div class=\"icon-label difficulty\">\n                    {this.difficulty?.pictogram && <img src={this.difficulty.pictogram} />}\n                    {this.difficulty?.label}\n                  </div>\n                  <div class=\"icon-label duration\">\n                    <img src={durationImageSrc} />\n                    {formatDuration(this.currentTrek.duration)}\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"icon-label length\">\n                    <img src={lengthImageSrc} />\n                    {formatLength(this.currentTrek.length_2d)}\n                  </div>\n                  <div class=\"icon-label ascent\">\n                    <img src={ascentImageSrc} />\n                    {formatAscent(this.currentTrek.ascent)}\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"icon-label route\">\n                    {this.route?.pictogram && <img src={this.route.pictogram} />}\n                    {this.route?.route}\n                  </div>\n                  <div class=\"icon-label practice\">\n                    {this.practice?.pictogram && <img src={this.practice.pictogram} />}\n                    {this.practice?.name}\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"grw-trek-card.entry.js","mappings":"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","names":[],"sources":["./src/components/grw-trek-card/grw-trek-card.scss?tag=grw-trek-card&encapsulation=shadow","./src/components/grw-trek-card/grw-trek-card.tsx"],"sourcesContent":["@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0');\n\n.trek-card-container,\n.trek-card-large-view-container {\n  cursor: pointer;\n  font-family: 'Roboto';\n  border-radius: 12px;\n  box-shadow: var(--elevation-1);\n  background-color: var(--color-surface-container-low);\n  .image {\n    object-fit: cover;\n    border-top-left-radius: 12px;\n    border-top-right-radius: 12px;\n  }\n  .sub-container {\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    padding: 8px 16px;\n    .name {\n      color: var(--color-on-surface);\n      font-size: 22px;\n      line-height: 28px;\n      font-weight: 400;\n      margin-bottom: 8px;\n    }\n    .departure {\n      color: var(--color-on-surface);\n      font-size: 16px;\n      line-height: 24px;\n      font-weight: 500;\n      margin-bottom: 4px;\n    }\n    .themes-container {\n      display: flex;\n      justify-content: flex-start;\n      align-items: center;\n      flex-wrap: wrap;\n      .theme {\n        background-color: var(--color-secondary-container);\n        color: var(--color-on-secondary-container);\n        border-radius: 8px;\n        padding: 8px 16px;\n        margin: 0px 8px 8px 0px;\n        box-shadow: var(--elevation-0);\n        border: 1px solid var(--color-outline);\n        height: 32px;\n        gap: 8px;\n        box-sizing: border-box;\n        text-align: start;\n        vertical-align: middle;\n        display: flex;\n        flex-direction: row;\n        align-items: center;\n        justify-content: center;\n        position: relative;\n      }\n    }\n    .icons-labels-container {\n      display: flex;\n      justify-content: flex-start;\n      align-items: center;\n      flex-wrap: wrap;\n      color: var(--color-on-surface);\n      font-size: 14px;\n      line-height: 20px;\n      font-weight: 500;\n      .row {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        width: 100%;\n        &:not(:last-child) {\n          margin-bottom: 12px;\n        }\n        .icon-label {\n          &:nth-child(2) {\n            margin: 0px 4px;\n          }\n          display: flex;\n          align-items: center;\n          width: 50%;\n          img,\n          span {\n            width: 24px;\n            height: auto;\n            margin-right: 8px;\n          }\n        }\n        .practice {\n          img {\n            background-color: var(--color-primary-app);\n          }\n        }\n      }\n    }\n  }\n}\n\n.trek-card-container {\n  width: 350px;\n  .image {\n    width: 100%;\n    max-height: 200px;\n  }\n}\n\n.trek-card-large-view-container {\n  display: flex;\n  flex-direction: row;\n  .image {\n    width: 250px;\n  }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, State } from '@stencil/core';\nimport state, { onChange, reset } from 'store/store';\nimport { City, Difficulty, Practice, Route, Themes, Trek } from 'types/types';\nimport { formatDuration, formatLength, formatAscent } from 'utils/utils';\n\n@Component({\n  tag: 'grw-trek-card',\n  styleUrl: 'grw-trek-card.scss',\n  shadow: true,\n})\nexport class GrwTrekCard {\n  @Event() trekCardPress: EventEmitter<number>;\n  @State() currentTrek: Trek;\n  @State() difficulty: Difficulty;\n  @State() route: Route;\n  @State() practice: Practice;\n  @State() themes: Themes;\n  @State() departureCity: City;\n  @Prop() trek: Trek;\n  @Prop() colorPrimaryApp = '#6b0030';\n  @Prop() colorOnSurface = '#49454e';\n  @Prop() colorSecondaryContainer = '#e8def8';\n  @Prop() colorOnSecondaryContainer = '#1d192b';\n  @Prop() colorSurfaceContainerLow = '#f7f2fa';\n  @Prop() isLargeView = false;\n  @Prop() resetStoreOnDisconnected = true;\n\n  connectedCallback() {\n    this.currentTrek = this.trek ? this.trek : state.currentTrek;\n    if (this.currentTrek) {\n      this.difficulty = state.difficulties.find(difficulty => difficulty.id === this.currentTrek.difficulty);\n      this.route = state.routes.find(route => route.id === this.currentTrek.route);\n      this.practice = state.practices.find(practice => practice.id === this.currentTrek.practice);\n      this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));\n      this.departureCity = state.cities.find(city => city.id === this.currentTrek.departure_city);\n    }\n    onChange('currentTrek', () => {\n      this.currentTrek = this.trek ? this.trek : state.currentTrek;\n      if (this.currentTrek) {\n        this.difficulty = state.difficulties.find(difficulty => difficulty.id === this.currentTrek.difficulty);\n        this.route = state.routes.find(route => route.id === this.currentTrek.route);\n        this.practice = state.practices.find(practice => practice.id === this.currentTrek.practice);\n        this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));\n        this.departureCity = state.cities.find(city => city.id === this.currentTrek.departure_city);\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.resetStoreOnDisconnected) {\n      reset();\n    }\n  }\n\n  render() {\n    return (\n      <Host\n        style={{\n          'width': this.isLargeView ? '100%' : 'auto',\n          '--color-primary-app': this.colorPrimaryApp,\n          '--color-on-surface': this.colorOnSurface,\n          '--color-secondary-container': this.colorSecondaryContainer,\n          '--color-on-secondary-container': this.colorOnSecondaryContainer,\n          '--color-surface-container-low': this.colorSurfaceContainerLow,\n        }}\n      >\n        {this.currentTrek && (\n          <div class={this.isLargeView ? 'trek-card-large-view-container' : 'trek-card-container'} onClick={() => this.trekCardPress.emit(this.currentTrek.id)}>\n            {this.currentTrek.attachments.filter(attachment => attachment.type === 'image').length > 0 && (\n              <img class=\"image\" src={`${this.currentTrek.attachments.filter(attachment => attachment.type === 'image')[0].thumbnail}`} loading=\"lazy\" />\n            )}\n            <div class=\"sub-container\">\n              {this.departureCity && <div class=\"departure\">{this.departureCity.name}</div>}\n              <div class=\"name\">{this.currentTrek?.name}</div>\n              <div class=\"themes-container\">\n                {this.themes.map(theme => (\n                  <div class=\"theme\">{theme.label}</div>\n                ))}\n              </div>\n              <div class=\"icons-labels-container\">\n                <div class=\"row\">\n                  <div class=\"icon-label difficulty\">\n                    {this.difficulty?.pictogram && <img src={this.difficulty.pictogram} />}\n                    {this.difficulty?.label}\n                  </div>\n                  <div class=\"icon-label duration\">\n                    <span class=\"material-symbols-outlined\">timelapse</span>\n                    {formatDuration(this.currentTrek.duration)}\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"icon-label length\">\n                    <span class=\"material-symbols-outlined\">open_in_full</span>\n                    {formatLength(this.currentTrek.length_2d)}\n                  </div>\n                  <div class=\"icon-label ascent\">\n                    <span class=\"material-symbols-outlined\">moving</span>\n                    {formatAscent(this.currentTrek.ascent)}\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"icon-label route\">\n                    {this.route?.pictogram && <img src={this.route.pictogram} />}\n                    {this.route?.route}\n                  </div>\n                  <div class=\"icon-label practice\">\n                    {this.practice?.pictogram && <img src={this.practice.pictogram} />}\n                    {this.practice?.name}\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/i18n-b25e6b48.js

@@ -0,0 +1,106 @@
+const translate = {
+  fr: {
+    filter: 'Filtrer',
+    practice: 'Pratique',
+    difficulty: 'Difficulté',
+    duration: 'Durée',
+    treks: 'randonnées',
+    trek: 'randonnée',
+    showList: 'Voir la liste',
+    showMap: 'Voir la carte',
+    showRoute: "Voir l'itinéraire",
+    showDetails: 'Voir la fiche',
+    downloads: 'Téléchargements',
+    description: 'Description',
+    departure: 'Départ',
+    arrival: 'Arrivée',
+    elevationProfile: 'Profil altimétrique',
+    roadAccess: 'Accès routier',
+    transport: 'Transport',
+    recommendations: 'Recommandations',
+    recommendedParking: 'Parking conseillé',
+    equipments: 'Équipements',
+    environmentalSensitiveAreas: 'Zones de sensibilité environnementale',
+    informationPlaces: 'Lieux de renseignement',
+    accessibility: 'Accessibilité',
+    accessibilityLevel: "Niveau d'accessibilité",
+    accessibilitySlope: 'Pente',
+    accessibilityWidth: 'Largeur',
+    accessibilitySignage: 'Signalisation',
+    accessibilityCovering: 'Revêtement',
+    accessibilityExposure: 'Exposition',
+    accessibilityAdvices: 'Conseils',
+    pois: (poisLength) => `Les ${poisLength} patrimoines à découvrir`,
+    sources: 'Sources',
+    cities: 'Communes traversées',
+    options: {
+      presentation: 'Présentation',
+      description: 'Description',
+      recommendations: 'Recommandations',
+      environmentalSensitiveAreas: 'Zones sensibles',
+      informationPlaces: "Lieux d'informations",
+      pois: 'Patrimoines',
+    },
+    layers: {
+      pointsReference: 'Points de référence',
+      parking: 'Parking conseillé',
+      sensitiveArea: 'Zones de sensibilité environnementale',
+      informationPlaces: 'Lieux de renseignement',
+      pois: 'Patrimoines',
+    },
+  },
+  en: {
+    filter: 'Filter',
+    practice: 'Practice',
+    difficulty: 'Difficulty',
+    duration: 'Duration',
+    treks: 'Hikes',
+    trek: 'Hike',
+    showList: 'Show the list',
+    showMap: 'Show the map',
+    showRoute: 'Show the route',
+    showDetails: 'Show the details',
+    downloads: 'Downloads',
+    description: 'Description',
+    departure: 'Departure',
+    arrival: 'Arrival',
+    elevationProfile: 'Elevation profile',
+    roadAccess: 'Road acess',
+    transport: 'Transport',
+    recommendations: 'Recommendations',
+    recommendedParking: 'Parking recommended',
+    equipments: 'Equipements',
+    environmentalSensitiveAreas: 'Areas of environmental sensitivity',
+    informationPlaces: 'Information places',
+    accessibility: 'Accessibility',
+    accessibilityLevel: 'Accessibility level',
+    accessibilitySlope: 'Slope',
+    accessibilityWidth: 'Width',
+    accessibilitySignage: 'Signage',
+    accessibilityCovering: 'Covering',
+    accessibilityExposure: 'Exposure',
+    accessibilityAdvices: 'Advices',
+    pois: (poisLength) => `${poisLength} points of interest`,
+    sources: 'Sources',
+    cities: 'Cities crossed',
+    options: {
+      presentation: 'Presentation',
+      description: 'Description',
+      recommendations: 'Recommendations',
+      environmentalSensitiveAreas: 'Sensitive areas',
+      informationPlaces: 'Information places',
+      pois: 'Points of interest',
+    },
+    layers: {
+      pointsReference: 'Reference points',
+      parking: 'Parking',
+      sensitiveArea: 'Sensitive areas',
+      informationPlaces: 'Information places',
+      pois: 'Points of interest',
+    },
+  },
+};
+
+export { translate as t };
+
+//# sourceMappingURL=i18n-b25e6b48.js.map

package/dist/esm/i18n-b25e6b48.js.map

@@ -0,0 +1 @@
+{"file":"i18n-b25e6b48.js","mappings":"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","names":[],"sources":["./src/i18n/i18n.ts"],"sourcesContent":["interface Translation {\n  filter: string;\n  practice: string;\n  difficulty: string;\n  duration: string;\n  treks: string;\n  trek: string;\n  showList: string;\n  showMap: string;\n  showRoute: string;\n  showDetails: string;\n  downloads: string;\n  description: string;\n  departure: string;\n  arrival: string;\n  elevationProfile: string;\n  roadAccess: string;\n  transport: string;\n  recommendations: string;\n  recommendedParking: string;\n  equipments: string;\n  environmentalSensitiveAreas: string;\n  informationPlaces: string;\n  accessibility: string;\n  accessibilityLevel: string;\n  accessibilitySlope: string;\n  accessibilityWidth: string;\n  accessibilitySignage: string;\n  accessibilityCovering: string;\n  accessibilityExposure: string;\n  accessibilityAdvices: string;\n  pois: Function;\n  sources: string;\n  cities: string;\n  options: {\n    presentation: string;\n    description: string;\n    recommendations: string;\n    environmentalSensitiveAreas: string;\n    informationPlaces: string;\n    pois: string;\n  };\n  layers: {\n    pointsReference: string;\n    parking: string;\n    sensitiveArea: string;\n    informationPlaces: string;\n    pois: string;\n  };\n}\n\ninterface AvailableTranslations {\n  fr: Translation;\n  en: Translation;\n}\n\nexport const translate: AvailableTranslations = {\n  fr: {\n    filter: 'Filtrer',\n    practice: 'Pratique',\n    difficulty: 'Difficulté',\n    duration: 'Durée',\n    treks: 'randonnées',\n    trek: 'randonnée',\n    showList: 'Voir la liste',\n    showMap: 'Voir la carte',\n    showRoute: \"Voir l'itinéraire\",\n    showDetails: 'Voir la fiche',\n    downloads: 'Téléchargements',\n    description: 'Description',\n    departure: 'Départ',\n    arrival: 'Arrivée',\n    elevationProfile: 'Profil altimétrique',\n    roadAccess: 'Accès routier',\n    transport: 'Transport',\n    recommendations: 'Recommandations',\n    recommendedParking: 'Parking conseillé',\n    equipments: 'Équipements',\n    environmentalSensitiveAreas: 'Zones de sensibilité environnementale',\n    informationPlaces: 'Lieux de renseignement',\n    accessibility: 'Accessibilité',\n    accessibilityLevel: \"Niveau d'accessibilité\",\n    accessibilitySlope: 'Pente',\n    accessibilityWidth: 'Largeur',\n    accessibilitySignage: 'Signalisation',\n    accessibilityCovering: 'Revêtement',\n    accessibilityExposure: 'Exposition',\n    accessibilityAdvices: 'Conseils',\n    pois: (poisLength: number) => `Les ${poisLength} patrimoines à découvrir`,\n    sources: 'Sources',\n    cities: 'Communes traversées',\n    options: {\n      presentation: 'Présentation',\n      description: 'Description',\n      recommendations: 'Recommandations',\n      environmentalSensitiveAreas: 'Zones sensibles',\n      informationPlaces: \"Lieux d'informations\",\n      pois: 'Patrimoines',\n    },\n    layers: {\n      pointsReference: 'Points de référence',\n      parking: 'Parking conseillé',\n      sensitiveArea: 'Zones de sensibilité environnementale',\n      informationPlaces: 'Lieux de renseignement',\n      pois: 'Patrimoines',\n    },\n  },\n  en: {\n    filter: 'Filter',\n    practice: 'Practice',\n    difficulty: 'Difficulty',\n    duration: 'Duration',\n    treks: 'Hikes',\n    trek: 'Hike',\n    showList: 'Show the list',\n    showMap: 'Show the map',\n    showRoute: 'Show the route',\n    showDetails: 'Show the details',\n    downloads: 'Downloads',\n    description: 'Description',\n    departure: 'Departure',\n    arrival: 'Arrival',\n    elevationProfile: 'Elevation profile',\n    roadAccess: 'Road acess',\n    transport: 'Transport',\n    recommendations: 'Recommendations',\n    recommendedParking: 'Parking recommended',\n    equipments: 'Equipements',\n    environmentalSensitiveAreas: 'Areas of environmental sensitivity',\n    informationPlaces: 'Information places',\n    accessibility: 'Accessibility',\n    accessibilityLevel: 'Accessibility level',\n    accessibilitySlope: 'Slope',\n    accessibilityWidth: 'Width',\n    accessibilitySignage: 'Signage',\n    accessibilityCovering: 'Covering',\n    accessibilityExposure: 'Exposure',\n    accessibilityAdvices: 'Advices',\n    pois: (poisLength: number) => `${poisLength} points of interest`,\n    sources: 'Sources',\n    cities: 'Cities crossed',\n    options: {\n      presentation: 'Presentation',\n      description: 'Description',\n      recommendations: 'Recommendations',\n      environmentalSensitiveAreas: 'Sensitive areas',\n      informationPlaces: 'Information places',\n      pois: 'Points of interest',\n    },\n    layers: {\n      pointsReference: 'Reference points',\n      parking: 'Parking',\n      sensitiveArea: 'Sensitive areas',\n      informationPlaces: 'Information places',\n      pois: 'Points of interest',\n    },\n  },\n};\n"],"version":3}