@geotrekce/geotrek-rando-widget 0.4.1 → 0.4.3

package/dist/collection/components/grw-touristic-content/grw-touristic-content-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"grw-touristic-content-card.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-content/grw-touristic-content-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Host, getAssetPath, h, State, Prop, Event, EventEmitter, Listen } from '@stencil/core';\nimport state from 'store/store';\nimport Swiper, { Keyboard, Navigation, Pagination } from 'swiper';\nimport { TouristicContent } from 'types/types';\n\n@Component({\n  tag: 'grw-touristic-content-card',\n  styleUrl: 'grw-touristic-content-card.scss',\n  shadow: true,\n})\nexport class GrwTouristicContentCard {\n  @Event() touristicContentCardPress: EventEmitter<number>;\n  swiperTouristicContent?: Swiper;\n  swiperTouristicContentRef?: HTMLDivElement;\n  prevElTouristicContentRef?: HTMLDivElement;\n  nextElTouristicContentRef?: HTMLDivElement;\n  paginationElTouristicContentRef?: HTMLDivElement;\n  @Prop() touristicContent: TouristicContent;\n  @Prop() isLargeView = false;\n  @Prop() isInsideHorizontalList = false;\n  @State() displayFullscreen = false;\n\n  @Event() cardTouristicContentMouseOver: EventEmitter<number>;\n  @Event() cardTouristicContentMouseLeave: EventEmitter;\n\n  componentDidLoad() {\n    if (this.swiperTouristicContentRef) {\n      this.swiperTouristicContent = new Swiper(this.swiperTouristicContentRef, {\n        modules: [Navigation, Pagination, Keyboard],\n        navigation: {\n          prevEl: this.prevElTouristicContentRef,\n          nextEl: this.nextElTouristicContentRef,\n        },\n        pagination: { el: this.paginationElTouristicContentRef },\n        allowTouchMove: false,\n        keyboard: false,\n      });\n      this.swiperTouristicContentRef.onfullscreenchange = () => {\n        this.displayFullscreen = !this.displayFullscreen;\n        if (this.displayFullscreen) {\n          this.swiperTouristicContent.keyboard.enable();\n        } else {\n          this.swiperTouristicContent.keyboard.disable();\n        }\n      };\n    }\n  }\n\n  handleFullscreen() {\n    if (this.touristicContent.attachments && this.touristicContent.attachments[0] && this.touristicContent.attachments[0].url) {\n      this.swiperTouristicContentRef.requestFullscreen();\n    }\n  }\n\n  @Listen('mouseover')\n  handleMouseOver() {\n    this.cardTouristicContentMouseOver.emit(this.touristicContent.id);\n  }\n\n  @Listen('mouseleave')\n  handleMouseLeave() {\n    this.cardTouristicContentMouseLeave.emit();\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicContentCategory = state.touristicContentCategories.find(touristicContentCategory => touristicContentCategory.id === this.touristicContent.category);\n    return (\n      <Host\n        style={{\n          width: this.isLargeView ? '100%' : 'auto',\n        }}\n      >\n        <div\n          class={\n            this.isLargeView\n              ? `touristic-content-card-large-view-container${state.selectedTouristicContentId === this.touristicContent.id ? ' selected-touristic-content-card' : ''}${\n                  !this.isInsideHorizontalList ? ' is-inside-vertical-list' : ''\n                }`\n              : `touristic-content-card-container${state.selectedTouristicContentId === this.touristicContent.id ? ' selected-touristic-content-card' : ''}${\n                  !this.isInsideHorizontalList ? ' is-inside-vertical-list' : ''\n                }`\n          }\n          onClick={() => {\n            if (!this.isInsideHorizontalList) {\n              this.touristicContentCardPress.emit(this.touristicContent.id);\n            }\n          }}\n        >\n          <div class=\"touristic-content-type-img-container\">\n            {this.isInsideHorizontalList ? (\n              <div class=\"swiper\" ref={el => (this.swiperTouristicContentRef = el)}>\n                <div class=\"swiper-wrapper\">\n                  {this.touristicContent.attachments.length > 0 ? (\n                    this.touristicContent.attachments\n                      .filter(attachment => attachment.type === 'image')\n                      .map(attachment => (\n                        <div class=\"swiper-slide\">\n                          <img\n                            class={`touristic-content-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-touristic-content-img\" src={defaultImageSrc} loading=\"lazy\" />\n                    </div>\n                  )}\n                </div>\n                <div class=\"swiper-pagination\" ref={el => (this.paginationElTouristicContentRef = el)}></div>\n                <div class=\"swiper-button-prev\" ref={el => (this.prevElTouristicContentRef = el)}></div>\n                <div class=\"swiper-button-next\" ref={el => (this.nextElTouristicContentRef = el)}></div>\n              </div>\n            ) : this.touristicContent.attachments.filter(attachment => attachment.type === 'image').length > 0 ? (\n              <img class=\"image\" src={`${this.touristicContent.attachments.filter(attachment => attachment.type === 'image')[0].thumbnail}`} loading=\"lazy\" />\n            ) : (\n              <div></div>\n            )}\n          </div>\n          <div class=\"touristic-content-sub-container\">\n            <div class=\"touristic-content-category-container\">\n              <img src={touristicContentCategory.pictogram} />\n              <div class=\"touristic-content-category-name\">{touristicContentCategory.label}</div>\n            </div>\n            <div class=\"touristic-content-name\">{this.touristicContent.name}</div>\n          </div>\n          {this.isInsideHorizontalList && (\n            <div class=\"touristic-content-more-detail-container\">\n              <button class=\"more-details-button\" onClick={() => this.touristicContentCardPress.emit(this.touristicContent.id)}>\n                Plus de détails\n              </button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"grw-touristic-content-card.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-content/grw-touristic-content-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAgB,MAAM,EAAE,MAAM,eAAe,CAAC;AAClH,OAAO,KAAK,MAAM,aAAa,CAAC;AAChC,OAAO,MAAM,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAQlE,MAAM,OAAO,uBAAuB;;;uBAQZ,KAAK;kCACM,KAAK;6BACT,KAAK;;EAKlC,gBAAgB;IACd,IAAI,IAAI,CAAC,yBAAyB,EAAE;MAClC,IAAI,CAAC,sBAAsB,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,yBAAyB,EAAE;QACvE,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,QAAQ,CAAC;QAC3C,UAAU,EAAE;UACV,MAAM,EAAE,IAAI,CAAC,yBAAyB;UACtC,MAAM,EAAE,IAAI,CAAC,yBAAyB;SACvC;QACD,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,+BAA+B,EAAE;QACxD,cAAc,EAAE,KAAK;QACrB,QAAQ,EAAE,KAAK;OAChB,CAAC,CAAC;MACH,IAAI,CAAC,yBAAyB,CAAC,kBAAkB,GAAG,GAAG,EAAE;QACvD,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;QACjD,IAAI,IAAI,CAAC,iBAAiB,EAAE;UAC1B,IAAI,CAAC,sBAAsB,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;SAC/C;aAAM;UACL,IAAI,CAAC,sBAAsB,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;SAChD;MACH,CAAC,CAAC;KACH;EACH,CAAC;EAED,gBAAgB;IACd,IAAI,IAAI,CAAC,gBAAgB,CAAC,WAAW,IAAI,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE;MACzH,IAAI,CAAC,yBAAyB,CAAC,iBAAiB,EAAE,CAAC;KACpD;EACH,CAAC;EAGD,eAAe;IACb,IAAI,CAAC,6BAA6B,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;EACpE,CAAC;EAGD,gBAAgB;IACd,IAAI,CAAC,8BAA8B,CAAC,IAAI,EAAE,CAAC;EAC7C,CAAC;EAED,MAAM;IACJ,MAAM,eAAe,GAAG,YAAY,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,0BAA0B,CAAC,CAAC;IAC1F,MAAM,wBAAwB,GAAG,KAAK,CAAC,0BAA0B,CAAC,IAAI,CAAC,wBAAwB,CAAC,EAAE,CAAC,wBAAwB,CAAC,EAAE,KAAK,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACnK,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;OAC1C;MAED,WACE,KAAK,EACH,IAAI,CAAC,WAAW;UACd,CAAC,CAAC,8CAA8C,KAAK,CAAC,0BAA0B,KAAK,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC,CAAC,kCAAkC,CAAC,CAAC,CAAC,EAAE,GACnJ,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAC9D,EAAE;UACJ,CAAC,CAAC,mCAAmC,KAAK,CAAC,0BAA0B,KAAK,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC,CAAC,kCAAkC,CAAC,CAAC,CAAC,EAAE,GACxI,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,EAC9D,EAAE,EAER,OAAO,EAAE,GAAG,EAAE;UACZ,IAAI,CAAC,IAAI,CAAC,sBAAsB,EAAE;YAChC,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;WAC/D;QACH,CAAC;QAED,WAAK,KAAK,EAAC,sCAAsC,IAC9C,IAAI,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAC7B,WAAK,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,yBAAyB,GAAG,EAAE,CAAC;UAClE,WAAK,KAAK,EAAC,gBAAgB,IACxB,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAChG,IAAI,CAAC,gBAAgB,CAAC,WAAW;aAC9B,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,KAAK,OAAO,CAAC;aACjD,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC,CACjB,WAAK,KAAK,EAAC,cAAc;YACvB,WACE,KAAK,EAAE,wBAAwB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,EAAE,EAChF,GAAG,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,UAAU,CAAC,SAAS,EACnE,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,GACtC,CACE,CACP,CAAC,CACL,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,cAAc;YACvB,WAAK,KAAK,EAAC,+BAA+B,EAAC,GAAG,EAAE,eAAe,EAAE,OAAO,EAAC,MAAM,GAAG,CAC9E,CACP,CACG;UACN,WAAK,KAAK,EAAC,mBAAmB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,+BAA+B,GAAG,EAAE,CAAC,GAAQ;UAC7F,WAAK,KAAK,EAAC,oBAAoB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,yBAAyB,GAAG,EAAE,CAAC,GAAQ;UACxF,WAAK,KAAK,EAAC,oBAAoB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,yBAAyB,GAAG,EAAE,CAAC,GAAQ,CACpF,CACP,CAAC,CAAC,CAAC,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACnG,WAAK,KAAK,EAAC,OAAO,EAAC,GAAG,EAAE,GAAG,IAAI,CAAC,gBAAgB,CAAC,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,EAAE,OAAO,EAAC,MAAM,GAAG,CACjJ,CAAC,CAAC,CAAC,CACF,cAAW,CACZ,CACG;QACN,WAAK,KAAK,EAAC,iCAAiC;UAC1C,WAAK,KAAK,EAAC,sCAAsC;YAC/C,WAAK,GAAG,EAAE,wBAAwB,CAAC,SAAS,GAAI;YAChD,WAAK,KAAK,EAAC,iCAAiC,IAAE,wBAAwB,CAAC,KAAK,CAAO,CAC/E;UACN,WAAK,KAAK,EAAC,wBAAwB,IAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAO,CAClE;QACL,IAAI,CAAC,sBAAsB,IAAI,CAC9B,WAAK,KAAK,EAAC,yCAAyC;UAClD,cAAQ,KAAK,EAAC,qBAAqB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,2BAEvG,CACL,CACP,CACG,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Build, Component, Host, getAssetPath, h, State, Prop, Event, EventEmitter, Listen } from '@stencil/core';\nimport state from 'store/store';\nimport Swiper, { Keyboard, Navigation, Pagination } from 'swiper';\nimport { TouristicContent } from 'types/types';\n\n@Component({\n  tag: 'grw-touristic-content-card',\n  styleUrl: 'grw-touristic-content-card.scss',\n  shadow: true,\n})\nexport class GrwTouristicContentCard {\n  @Event() touristicContentCardPress: EventEmitter<number>;\n  swiperTouristicContent?: Swiper;\n  swiperTouristicContentRef?: HTMLDivElement;\n  prevElTouristicContentRef?: HTMLDivElement;\n  nextElTouristicContentRef?: HTMLDivElement;\n  paginationElTouristicContentRef?: HTMLDivElement;\n  @Prop() touristicContent: TouristicContent;\n  @Prop() isLargeView = false;\n  @Prop() isInsideHorizontalList = false;\n  @State() displayFullscreen = false;\n\n  @Event() cardTouristicContentMouseOver: EventEmitter<number>;\n  @Event() cardTouristicContentMouseLeave: EventEmitter;\n\n  componentDidLoad() {\n    if (this.swiperTouristicContentRef) {\n      this.swiperTouristicContent = new Swiper(this.swiperTouristicContentRef, {\n        modules: [Navigation, Pagination, Keyboard],\n        navigation: {\n          prevEl: this.prevElTouristicContentRef,\n          nextEl: this.nextElTouristicContentRef,\n        },\n        pagination: { el: this.paginationElTouristicContentRef },\n        allowTouchMove: false,\n        keyboard: false,\n      });\n      this.swiperTouristicContentRef.onfullscreenchange = () => {\n        this.displayFullscreen = !this.displayFullscreen;\n        if (this.displayFullscreen) {\n          this.swiperTouristicContent.keyboard.enable();\n        } else {\n          this.swiperTouristicContent.keyboard.disable();\n        }\n      };\n    }\n  }\n\n  handleFullscreen() {\n    if (this.touristicContent.attachments && this.touristicContent.attachments[0] && this.touristicContent.attachments[0].url) {\n      this.swiperTouristicContentRef.requestFullscreen();\n    }\n  }\n\n  @Listen('mouseover')\n  handleMouseOver() {\n    this.cardTouristicContentMouseOver.emit(this.touristicContent.id);\n  }\n\n  @Listen('mouseleave')\n  handleMouseLeave() {\n    this.cardTouristicContentMouseLeave.emit();\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicContentCategory = state.touristicContentCategories.find(touristicContentCategory => touristicContentCategory.id === this.touristicContent.category);\n    return (\n      <Host\n        style={{\n          width: this.isLargeView ? '100%' : 'auto',\n        }}\n      >\n        <div\n          class={\n            this.isLargeView\n              ? `touristic-content-card-large-view-container${state.selectedTouristicContentId === this.touristicContent.id ? ' selected-touristic-content-card' : ''}${\n                  !this.isInsideHorizontalList ? ' is-inside-vertical-list' : ''\n                }`\n              : `touristic-content-card-container${state.selectedTouristicContentId === this.touristicContent.id ? ' selected-touristic-content-card' : ''}${\n                  !this.isInsideHorizontalList ? ' is-inside-vertical-list' : ''\n                }`\n          }\n          onClick={() => {\n            if (!this.isInsideHorizontalList) {\n              this.touristicContentCardPress.emit(this.touristicContent.id);\n            }\n          }}\n        >\n          <div class=\"touristic-content-type-img-container\">\n            {this.isInsideHorizontalList ? (\n              <div class=\"swiper\" ref={el => (this.swiperTouristicContentRef = el)}>\n                <div class=\"swiper-wrapper\">\n                  {this.touristicContent.attachments.filter(attachment => attachment.type === 'image').length > 0 ? (\n                    this.touristicContent.attachments\n                      .filter(attachment => attachment.type === 'image')\n                      .map(attachment => (\n                        <div class=\"swiper-slide\">\n                          <img\n                            class={`touristic-content-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-touristic-content-img\" src={defaultImageSrc} loading=\"lazy\" />\n                    </div>\n                  )}\n                </div>\n                <div class=\"swiper-pagination\" ref={el => (this.paginationElTouristicContentRef = el)}></div>\n                <div class=\"swiper-button-prev\" ref={el => (this.prevElTouristicContentRef = el)}></div>\n                <div class=\"swiper-button-next\" ref={el => (this.nextElTouristicContentRef = el)}></div>\n              </div>\n            ) : this.touristicContent.attachments.filter(attachment => attachment.type === 'image').length > 0 ? (\n              <img class=\"image\" src={`${this.touristicContent.attachments.filter(attachment => attachment.type === 'image')[0].thumbnail}`} loading=\"lazy\" />\n            ) : (\n              <div></div>\n            )}\n          </div>\n          <div class=\"touristic-content-sub-container\">\n            <div class=\"touristic-content-category-container\">\n              <img src={touristicContentCategory.pictogram} />\n              <div class=\"touristic-content-category-name\">{touristicContentCategory.label}</div>\n            </div>\n            <div class=\"touristic-content-name\">{this.touristicContent.name}</div>\n          </div>\n          {this.isInsideHorizontalList && (\n            <div class=\"touristic-content-more-detail-container\">\n              <button class=\"more-details-button\" onClick={() => this.touristicContentCardPress.emit(this.touristicContent.id)}>\n                Plus de détails\n              </button>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/grw-touristic-content-detail/grw-touristic-content-detail.js

@@ -55,7 +55,7 @@ export class GrwTouristicContentDetail {
         '--detail-bottom-space-height': this.isLargeView ? '8px' : '104px',
       } }, state.currentTouristicContent && (h("div", { class: "touristic-content-detail-container", ref: el => (this.touristicContentDetailContainerRef = el) }, h("div", { class: "images-container", ref: el => (this.presentationRef = el) }, h("div", { class: "swiper swiper-images", ref: el => (this.swiperImagesRef = el) }, h("div", { class: "swiper-wrapper" }, state.currentTouristicContent.attachments.length > 0 ? (state.currentTouristicContent.attachments
       .filter(attachment => attachment.type === 'image')
-      .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: "image", src: attachment.url, 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.paginationElImagesRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElImagesRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElImagesRef = el) }))), h("div", { class: "touristic-content-category-container" }, h("img", { src: touristicContentCategory.pictogram }), h("div", { class: "touristic-content-category-name" }, touristicContentCategory.label)), h("div", { class: "name" }, state.currentTouristicContent.name), h("div", { class: "divider" }), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, translate[state.language].download), h("div", { class: "links-container" }, h("a", { href: `${state.currentTouristicContent.pdf}` }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "PDF"))), state.currentTouristicContent.description_teaser && (h("div", null, h("div", { class: "divider" }), h("div", { class: "description-teaser", innerHTML: state.currentTouristicContent.description_teaser }))), h("div", { class: "divider" }), state.currentTouristicContent.practical_info && (h("div", { class: "description-container", ref: el => (this.descriptionRef = el) }, h("div", { class: "description-title" }, translate[state.language].description), h("div", { class: "description", innerHTML: state.currentTouristicContent.description }))), cities && cities.length > 0 && (h("div", { class: "cities-container" }, h("div", { class: "cities-title" }, translate[state.language].city, " :\u00A0"), h("div", { innerHTML: cities.join(', ') }))), state.currentTouristicContent.practical_info && (h("div", null, h("div", { class: "divider" }), h("div", { class: "useful-information-container" }, h("div", { class: "useful-information-title" }, translate[state.language].usefulInformation, " :\u00A0"), h("div", { innerHTML: state.currentTouristicContent.practical_info })))), (state.currentTouristicContent.contact || state.currentTouristicContent.email || state.currentTouristicContent.website) && (h("div", null, h("div", { class: "divider" }), h("div", { class: "contact-container" }, h("div", { class: "contact-title" }, translate[state.language].contact, " :\u00A0"), state.currentTouristicContent.contact && h("div", { innerHTML: state.currentTouristicContent.contact }), state.currentTouristicContent.email && (h("div", { class: "email-container" }, h("div", null, translate[state.language].email, " :\u00A0"), h("div", { innerHTML: state.currentTouristicContent.email }))), state.currentTouristicContent.website && (h("div", { class: "website-container" }, h("div", null, translate[state.language].website, " :\u00A0"), h("div", { innerHTML: state.currentTouristicContent.website })))))), h("div", { class: "detail-bottom-space" })))));
+      .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: "image", src: attachment.url, 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.paginationElImagesRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElImagesRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElImagesRef = el) }))), h("div", { class: "touristic-content-category-container" }, h("img", { src: touristicContentCategory.pictogram }), h("div", { class: "touristic-content-category-name" }, touristicContentCategory.label)), h("div", { class: "name" }, state.currentTouristicContent.name), h("div", { class: "divider" }), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, translate[state.language].download), h("div", { class: "links-container" }, h("a", { href: `${state.currentTouristicContent.pdf}`, target: "_blank", rel: "noopener noreferrer" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "PDF"))), state.currentTouristicContent.description_teaser && (h("div", null, h("div", { class: "divider" }), h("div", { class: "description-teaser", innerHTML: state.currentTouristicContent.description_teaser }))), h("div", { class: "divider" }), state.currentTouristicContent.practical_info && (h("div", { class: "description-container", ref: el => (this.descriptionRef = el) }, h("div", { class: "description-title" }, translate[state.language].description), h("div", { class: "description", innerHTML: state.currentTouristicContent.description }))), cities && cities.length > 0 && (h("div", { class: "cities-container" }, h("div", { class: "cities-title" }, translate[state.language].city, " :\u00A0"), h("div", { innerHTML: cities.join(', ') }))), state.currentTouristicContent.practical_info && (h("div", null, h("div", { class: "divider" }), h("div", { class: "useful-information-container" }, h("div", { class: "useful-information-title" }, translate[state.language].usefulInformation, " :\u00A0"), h("div", { innerHTML: state.currentTouristicContent.practical_info })))), (state.currentTouristicContent.contact || state.currentTouristicContent.email || state.currentTouristicContent.website) && (h("div", null, h("div", { class: "divider" }), h("div", { class: "contact-container" }, h("div", { class: "contact-title" }, translate[state.language].contact, " :\u00A0"), state.currentTouristicContent.contact && h("div", { innerHTML: state.currentTouristicContent.contact }), state.currentTouristicContent.email && (h("div", { class: "email-container" }, h("div", null, translate[state.language].email, " :\u00A0"), h("div", { innerHTML: state.currentTouristicContent.email }))), state.currentTouristicContent.website && (h("div", { class: "website-container" }, h("div", null, translate[state.language].website, " :\u00A0"), h("div", { innerHTML: state.currentTouristicContent.website })))))), h("div", { class: "detail-bottom-space" })))));
   }
   static get is() { return "grw-touristic-content-detail"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/grw-touristic-content-detail/grw-touristic-content-detail.js.map

@@ -1 +1 @@
-{"version":3,"file":"grw-touristic-content-detail.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-content-detail/grw-touristic-content-detail.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACrF,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,KAAK,MAAM,aAAa,CAAC;AAChC,OAAO,MAAM,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAOxF,MAAM,OAAO,yBAAyB;;6BAQP,KAAK;2BACR,SAAS;0BACV,SAAS;iCACF,SAAS;mCACP,SAAS;mCACT,SAAS;qCACP,SAAS;oCACV,SAAS;2BAClB,SAAS;uBACb,KAAK;;EAK3B,gBAAgB;IACd,IAAI,IAAI,CAAC,eAAe,EAAE;MACxB,IAAI,CAAC,YAAY,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,eAAe,EAAE;QACnD,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,CAAC;QACjE,UAAU,EAAE;UACV,MAAM,EAAE,IAAI,CAAC,eAAe;UAC5B,MAAM,EAAE,IAAI,CAAC,eAAe;SAC7B;QACD,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,CAAC,qBAAqB,EAAE;QAC9C,cAAc,EAAE,KAAK;QACrB,QAAQ,EAAE,KAAK;OAChB,CAAC,CAAC;MACH,IAAI,CAAC,eAAe,CAAC,kBAAkB,GAAG,GAAG,EAAE;QAC7C,IAAI,CAAC,iBAAiB,GAAG,CAAC,IAAI,CAAC,iBAAiB,CAAC;QACjD,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAC;MACtG,CAAC,CAAC;KACH;EACH,CAAC;EAED,gBAAgB;IACd,IAAI,KAAK,CAAC,uBAAuB,CAAC,WAAW,IAAI,KAAK,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,uBAAuB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE;MACjJ,IAAI,CAAC,eAAe,CAAC,iBAAiB,EAAE,CAAC;KAC1C;EACH,CAAC;EAED,MAAM;IACJ,MAAM,eAAe,GAAG,YAAY,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,0BAA0B,CAAC,CAAC;IAC1F,MAAM,wBAAwB,GAC5B,KAAK,CAAC,0BAA0B;MAChC,KAAK,CAAC,uBAAuB;MAC7B,KAAK,CAAC,0BAA0B,CAAC,IAAI,CAAC,wBAAwB,CAAC,EAAE,CAAC,wBAAwB,CAAC,EAAE,KAAK,KAAK,CAAC,uBAAuB,CAAC,QAAQ,CAAC,CAAC;IAC5I,MAAM,MAAM,GAAG,KAAK,CAAC,uBAAuB,IAAI,KAAK,CAAC,uBAAuB,CAAC,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,WAAC,OAAA,MAAA,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,WAAW,CAAC,0CAAE,IAAI,CAAA,EAAA,CAAC,CAAC;IAClK,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,qBAAqB,EAAE,IAAI,CAAC,eAAe;QAC3C,oBAAoB,EAAE,IAAI,CAAC,cAAc;QACzC,2BAA2B,EAAE,IAAI,CAAC,qBAAqB;QACvD,8BAA8B,EAAE,IAAI,CAAC,uBAAuB;QAC5D,6BAA6B,EAAE,IAAI,CAAC,uBAAuB;QAC3D,gCAAgC,EAAE,IAAI,CAAC,yBAAyB;QAChE,oBAAoB,EAAE,IAAI,CAAC,eAAe;QAC1C,8BAA8B,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO;OACnE,IAEA,KAAK,CAAC,uBAAuB,IAAI,CAChC,WAAK,KAAK,EAAC,oCAAoC,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,kCAAkC,GAAG,EAAE,CAAC;MACvG,WAAK,KAAK,EAAC,kBAAkB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;QAClE,WAAK,KAAK,EAAC,sBAAsB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;UACtE,WAAK,KAAK,EAAC,gBAAgB,IACxB,KAAK,CAAC,uBAAuB,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACtD,KAAK,CAAC,uBAAuB,CAAC,WAAW;aACtC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,IAAI,KAAK,OAAO,CAAC;aACjD,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC,CACjB,WAAK,KAAK,EAAC,cAAc;YACvB,WAAK,KAAK,EAAC,OAAO,EAAC,GAAG,EAAE,UAAU,CAAC,GAAG,EAAE,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,GAAI,CAC7F,CACP,CAAC,CACL,CAAC,CAAC,CAAC,CACF,WAAK,KAAK,EAAC,cAAc;YACvB,WAAK,KAAK,EAAC,iBAAiB,EAAC,GAAG,EAAE,eAAe,EAAE,OAAO,EAAC,MAAM,GAAG,CAChE,CACP,CACG;UACN,WAAK,KAAK,EAAC,mBAAmB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,qBAAqB,GAAG,EAAE,CAAC,GAAQ;UACnF,WAAK,KAAK,EAAC,oBAAoB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,GAAQ;UAC9E,WAAK,KAAK,EAAC,oBAAoB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC,GAAQ,CAC1E,CACF;MACN,WAAK,KAAK,EAAC,sCAAsC;QAC/C,WAAK,GAAG,EAAE,wBAAwB,CAAC,SAAS,GAAI;QAChD,WAAK,KAAK,EAAC,iCAAiC,IAAE,wBAAwB,CAAC,KAAK,CAAO,CAC/E;MACN,WAAK,KAAK,EAAC,MAAM,IAAE,KAAK,CAAC,uBAAuB,CAAC,IAAI,CAAO;MAC5D,WAAK,KAAK,EAAC,SAAS,GAAO;MAC3B,WAAK,KAAK,EAAC,qBAAqB;QAC9B,WAAK,KAAK,EAAC,gBAAgB,IAAE,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAO;QACtE,WAAK,KAAK,EAAC,iBAAiB;UAC1B,SAAG,IAAI,EAAE,GAAG,KAAK,CAAC,uBAAuB,CAAC,GAAG,EAAE;YAE7C,YAAM,SAAS,EAAE,KAAK,EAAE,KAAK,EAAC,4CAA4C,eAEnE;kBAEL,CACA,CACF;MACL,KAAK,CAAC,uBAAuB,CAAC,kBAAkB,IAAI,CACnD;QACE,WAAK,KAAK,EAAC,SAAS,GAAO;QAC3B,WAAK,KAAK,EAAC,oBAAoB,EAAC,SAAS,EAAE,KAAK,CAAC,uBAAuB,CAAC,kBAAkB,GAAQ,CAC/F,CACP;MACD,WAAK,KAAK,EAAC,SAAS,GAAO;MAC1B,KAAK,CAAC,uBAAuB,CAAC,cAAc,IAAI,CAC/C,WAAK,KAAK,EAAC,uBAAuB,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;QACtE,WAAK,KAAK,EAAC,mBAAmB,IAAE,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,WAAW,CAAO;QAC5E,WAAK,KAAK,EAAC,aAAa,EAAC,SAAS,EAAE,KAAK,CAAC,uBAAuB,CAAC,WAAW,GAAQ,CACjF,CACP;MACA,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,IAAI,CAC9B,WAAK,KAAK,EAAC,kBAAkB;QAC3B,WAAK,KAAK,EAAC,cAAc;UAAE,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI;qBAAe;QACxE,WAAK,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,GAAQ,CACrC,CACP;MACA,KAAK,CAAC,uBAAuB,CAAC,cAAc,IAAI,CAC/C;QACE,WAAK,KAAK,EAAC,SAAS,GAAO;QAC3B,WAAK,KAAK,EAAC,8BAA8B;UACvC,WAAK,KAAK,EAAC,0BAA0B;YAAE,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,iBAAiB;uBAAe;UACjG,WAAK,SAAS,EAAE,KAAK,CAAC,uBAAuB,CAAC,cAAc,GAAQ,CAChE,CACF,CACP;MACA,CAAC,KAAK,CAAC,uBAAuB,CAAC,OAAO,IAAI,KAAK,CAAC,uBAAuB,CAAC,KAAK,IAAI,KAAK,CAAC,uBAAuB,CAAC,OAAO,CAAC,IAAI,CAC1H;QACE,WAAK,KAAK,EAAC,SAAS,GAAO;QAE3B,WAAK,KAAK,EAAC,mBAAmB;UAC5B,WAAK,KAAK,EAAC,eAAe;YAAE,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,OAAO;uBAAe;UAC3E,KAAK,CAAC,uBAAuB,CAAC,OAAO,IAAI,WAAK,SAAS,EAAE,KAAK,CAAC,uBAAuB,CAAC,OAAO,GAAQ;UACtG,KAAK,CAAC,uBAAuB,CAAC,KAAK,IAAI,CACtC,WAAK,KAAK,EAAC,iBAAiB;YAC1B;cAAM,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,KAAK;yBAAe;YACpD,WAAK,SAAS,EAAE,KAAK,CAAC,uBAAuB,CAAC,KAAK,GAAQ,CACvD,CACP;UACA,KAAK,CAAC,uBAAuB,CAAC,OAAO,IAAI,CACxC,WAAK,KAAK,EAAC,mBAAmB;YAC5B;cAAM,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,OAAO;yBAAe;YACtD,WAAK,SAAS,EAAE,KAAK,CAAC,uBAAuB,CAAC,OAAO,GAAQ,CACzD,CACP,CACG,CACF,CACP;MACD,WAAK,KAAK,EAAC,qBAAqB,GAAO,CACnC,CACP,CACI,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Build, Component, Host, Prop, State, getAssetPath, h } from '@stencil/core';\nimport { translate } from 'i18n/i18n';\nimport state from 'store/store';\nimport Swiper, { FreeMode, Keyboard, Mousewheel, Navigation, Pagination } from 'swiper';\n\n@Component({\n  tag: 'grw-touristic-content-detail',\n  styleUrl: 'grw-touristic-content-detail.scss',\n  shadow: true,\n})\nexport class GrwTouristicContentDetail {\n  swiperImages?: Swiper;\n  swiperImagesRef?: HTMLDivElement;\n  prevElImagesRef?: HTMLDivElement;\n  nextElImagesRef?: HTMLDivElement;\n  paginationElImagesRef?: HTMLDivElement;\n  presentationRef?: HTMLDivElement;\n\n  @State() displayFullscreen = false;\n  @Prop() colorPrimaryApp = '#6b0030';\n  @Prop() colorOnSurface = '#49454e';\n  @Prop() colorPrimaryContainer = '#eaddff';\n  @Prop() colorOnPrimaryContainer = '#21005e';\n  @Prop() colorSecondaryContainer = '#e8def8';\n  @Prop() colorOnSecondaryContainer = '#1d192b';\n  @Prop() colorSurfaceContainerLow = '#f7f2fa';\n  @Prop() colorBackground = '#fef7ff';\n  @Prop() isLargeView = false;\n\n  descriptionRef?: HTMLDivElement;\n  touristicContentDetailContainerRef?: HTMLElement;\n\n  componentDidLoad() {\n    if (this.swiperImagesRef) {\n      this.swiperImages = new Swiper(this.swiperImagesRef, {\n        modules: [Navigation, Pagination, Keyboard, FreeMode, Mousewheel],\n        navigation: {\n          prevEl: this.prevElImagesRef,\n          nextEl: this.nextElImagesRef,\n        },\n        pagination: { el: this.paginationElImagesRef },\n        allowTouchMove: false,\n        keyboard: false,\n      });\n      this.swiperImagesRef.onfullscreenchange = () => {\n        this.displayFullscreen = !this.displayFullscreen;\n        this.displayFullscreen ? this.swiperImages.keyboard.enable() : this.swiperImages.keyboard.disable();\n      };\n    }\n  }\n\n  handleFullscreen() {\n    if (state.currentTouristicContent.attachments && state.currentTouristicContent.attachments[0] && state.currentTouristicContent.attachments[0].url) {\n      this.swiperImagesRef.requestFullscreen();\n    }\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicContentCategory =\n      state.touristicContentCategories &&\n      state.currentTouristicContent &&\n      state.touristicContentCategories.find(touristicContentCategory => touristicContentCategory.id === state.currentTouristicContent.category);\n    const cities = state.currentTouristicContent && state.currentTouristicContent.cities.map(currentCity => state.cities.find(city => city.id === currentCity)?.name);\n    return (\n      <Host\n        style={{\n          '--color-primary-app': this.colorPrimaryApp,\n          '--color-on-surface': this.colorOnSurface,\n          '--color-primary-container': this.colorPrimaryContainer,\n          '--color-on-primary-container': this.colorOnPrimaryContainer,\n          '--color-secondary-container': this.colorSecondaryContainer,\n          '--color-on-secondary-container': this.colorOnSecondaryContainer,\n          '--color-background': this.colorBackground,\n          '--detail-bottom-space-height': this.isLargeView ? '8px' : '104px',\n        }}\n      >\n        {state.currentTouristicContent && (\n          <div class=\"touristic-content-detail-container\" ref={el => (this.touristicContentDetailContainerRef = el)}>\n            <div class=\"images-container\" ref={el => (this.presentationRef = el)}>\n              <div class=\"swiper swiper-images\" ref={el => (this.swiperImagesRef = el)}>\n                <div class=\"swiper-wrapper\">\n                  {state.currentTouristicContent.attachments.length > 0 ? (\n                    state.currentTouristicContent.attachments\n                      .filter(attachment => attachment.type === 'image')\n                      .map(attachment => (\n                        <div class=\"swiper-slide\">\n                          <img class=\"image\" src={attachment.url} loading=\"lazy\" onClick={() => this.handleFullscreen()} />\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.paginationElImagesRef = el)}></div>\n                <div class=\"swiper-button-prev\" ref={el => (this.prevElImagesRef = el)}></div>\n                <div class=\"swiper-button-next\" ref={el => (this.nextElImagesRef = el)}></div>\n              </div>\n            </div>\n            <div class=\"touristic-content-category-container\">\n              <img src={touristicContentCategory.pictogram} />\n              <div class=\"touristic-content-category-name\">{touristicContentCategory.label}</div>\n            </div>\n            <div class=\"name\">{state.currentTouristicContent.name}</div>\n            <div class=\"divider\"></div>\n            <div class=\"downloads-container\">\n              <div class=\"download-title\">{translate[state.language].download}</div>\n              <div class=\"links-container\">\n                <a href={`${state.currentTouristicContent.pdf}`}>\n                  {/* @ts-ignore */}\n                  <span translate={false} class=\"material-symbols material-symbols-outlined\">\n                    download\n                  </span>\n                  PDF\n                </a>\n              </div>\n            </div>\n            {state.currentTouristicContent.description_teaser && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"description-teaser\" innerHTML={state.currentTouristicContent.description_teaser}></div>\n              </div>\n            )}\n            <div class=\"divider\"></div>\n            {state.currentTouristicContent.practical_info && (\n              <div class=\"description-container\" ref={el => (this.descriptionRef = el)}>\n                <div class=\"description-title\">{translate[state.language].description}</div>\n                <div class=\"description\" innerHTML={state.currentTouristicContent.description}></div>\n              </div>\n            )}\n            {cities && cities.length > 0 && (\n              <div class=\"cities-container\">\n                <div class=\"cities-title\">{translate[state.language].city} :&nbsp;</div>\n                <div innerHTML={cities.join(', ')}></div>\n              </div>\n            )}\n            {state.currentTouristicContent.practical_info && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"useful-information-container\">\n                  <div class=\"useful-information-title\">{translate[state.language].usefulInformation} :&nbsp;</div>\n                  <div innerHTML={state.currentTouristicContent.practical_info}></div>\n                </div>\n              </div>\n            )}\n            {(state.currentTouristicContent.contact || state.currentTouristicContent.email || state.currentTouristicContent.website) && (\n              <div>\n                <div class=\"divider\"></div>\n\n                <div class=\"contact-container\">\n                  <div class=\"contact-title\">{translate[state.language].contact} :&nbsp;</div>\n                  {state.currentTouristicContent.contact && <div innerHTML={state.currentTouristicContent.contact}></div>}\n                  {state.currentTouristicContent.email && (\n                    <div class=\"email-container\">\n                      <div>{translate[state.language].email} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicContent.email}></div>\n                    </div>\n                  )}\n                  {state.currentTouristicContent.website && (\n                    <div class=\"website-container\">\n                      <div>{translate[state.language].website} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicContent.website}></div>\n                    </div>\n                  )}\n                </div>\n              </div>\n            )}\n            <div class=\"detail-bottom-space\"></div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"grw-touristic-content-detail.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-content-detail/grw-touristic-content-detail.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Host, Prop, State, getAssetPath, h } from '@stencil/core';\nimport { translate } from 'i18n/i18n';\nimport state from 'store/store';\nimport Swiper, { FreeMode, Keyboard, Mousewheel, Navigation, Pagination } from 'swiper';\n\n@Component({\n  tag: 'grw-touristic-content-detail',\n  styleUrl: 'grw-touristic-content-detail.scss',\n  shadow: true,\n})\nexport class GrwTouristicContentDetail {\n  swiperImages?: Swiper;\n  swiperImagesRef?: HTMLDivElement;\n  prevElImagesRef?: HTMLDivElement;\n  nextElImagesRef?: HTMLDivElement;\n  paginationElImagesRef?: HTMLDivElement;\n  presentationRef?: HTMLDivElement;\n\n  @State() displayFullscreen = false;\n  @Prop() colorPrimaryApp = '#6b0030';\n  @Prop() colorOnSurface = '#49454e';\n  @Prop() colorPrimaryContainer = '#eaddff';\n  @Prop() colorOnPrimaryContainer = '#21005e';\n  @Prop() colorSecondaryContainer = '#e8def8';\n  @Prop() colorOnSecondaryContainer = '#1d192b';\n  @Prop() colorSurfaceContainerLow = '#f7f2fa';\n  @Prop() colorBackground = '#fef7ff';\n  @Prop() isLargeView = false;\n\n  descriptionRef?: HTMLDivElement;\n  touristicContentDetailContainerRef?: HTMLElement;\n\n  componentDidLoad() {\n    if (this.swiperImagesRef) {\n      this.swiperImages = new Swiper(this.swiperImagesRef, {\n        modules: [Navigation, Pagination, Keyboard, FreeMode, Mousewheel],\n        navigation: {\n          prevEl: this.prevElImagesRef,\n          nextEl: this.nextElImagesRef,\n        },\n        pagination: { el: this.paginationElImagesRef },\n        allowTouchMove: false,\n        keyboard: false,\n      });\n      this.swiperImagesRef.onfullscreenchange = () => {\n        this.displayFullscreen = !this.displayFullscreen;\n        this.displayFullscreen ? this.swiperImages.keyboard.enable() : this.swiperImages.keyboard.disable();\n      };\n    }\n  }\n\n  handleFullscreen() {\n    if (state.currentTouristicContent.attachments && state.currentTouristicContent.attachments[0] && state.currentTouristicContent.attachments[0].url) {\n      this.swiperImagesRef.requestFullscreen();\n    }\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicContentCategory =\n      state.touristicContentCategories &&\n      state.currentTouristicContent &&\n      state.touristicContentCategories.find(touristicContentCategory => touristicContentCategory.id === state.currentTouristicContent.category);\n    const cities = state.currentTouristicContent && state.currentTouristicContent.cities.map(currentCity => state.cities.find(city => city.id === currentCity)?.name);\n    return (\n      <Host\n        style={{\n          '--color-primary-app': this.colorPrimaryApp,\n          '--color-on-surface': this.colorOnSurface,\n          '--color-primary-container': this.colorPrimaryContainer,\n          '--color-on-primary-container': this.colorOnPrimaryContainer,\n          '--color-secondary-container': this.colorSecondaryContainer,\n          '--color-on-secondary-container': this.colorOnSecondaryContainer,\n          '--color-background': this.colorBackground,\n          '--detail-bottom-space-height': this.isLargeView ? '8px' : '104px',\n        }}\n      >\n        {state.currentTouristicContent && (\n          <div class=\"touristic-content-detail-container\" ref={el => (this.touristicContentDetailContainerRef = el)}>\n            <div class=\"images-container\" ref={el => (this.presentationRef = el)}>\n              <div class=\"swiper swiper-images\" ref={el => (this.swiperImagesRef = el)}>\n                <div class=\"swiper-wrapper\">\n                  {state.currentTouristicContent.attachments.length > 0 ? (\n                    state.currentTouristicContent.attachments\n                      .filter(attachment => attachment.type === 'image')\n                      .map(attachment => (\n                        <div class=\"swiper-slide\">\n                          <img class=\"image\" src={attachment.url} loading=\"lazy\" onClick={() => this.handleFullscreen()} />\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.paginationElImagesRef = el)}></div>\n                <div class=\"swiper-button-prev\" ref={el => (this.prevElImagesRef = el)}></div>\n                <div class=\"swiper-button-next\" ref={el => (this.nextElImagesRef = el)}></div>\n              </div>\n            </div>\n            <div class=\"touristic-content-category-container\">\n              <img src={touristicContentCategory.pictogram} />\n              <div class=\"touristic-content-category-name\">{touristicContentCategory.label}</div>\n            </div>\n            <div class=\"name\">{state.currentTouristicContent.name}</div>\n            <div class=\"divider\"></div>\n            <div class=\"downloads-container\">\n              <div class=\"download-title\">{translate[state.language].download}</div>\n              <div class=\"links-container\">\n                <a href={`${state.currentTouristicContent.pdf}`} target=\"_blank\" rel=\"noopener noreferrer\">\n                  {/* @ts-ignore */}\n                  <span translate={false} class=\"material-symbols material-symbols-outlined\">\n                    download\n                  </span>\n                  PDF\n                </a>\n              </div>\n            </div>\n            {state.currentTouristicContent.description_teaser && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"description-teaser\" innerHTML={state.currentTouristicContent.description_teaser}></div>\n              </div>\n            )}\n            <div class=\"divider\"></div>\n            {state.currentTouristicContent.practical_info && (\n              <div class=\"description-container\" ref={el => (this.descriptionRef = el)}>\n                <div class=\"description-title\">{translate[state.language].description}</div>\n                <div class=\"description\" innerHTML={state.currentTouristicContent.description}></div>\n              </div>\n            )}\n            {cities && cities.length > 0 && (\n              <div class=\"cities-container\">\n                <div class=\"cities-title\">{translate[state.language].city} :&nbsp;</div>\n                <div innerHTML={cities.join(', ')}></div>\n              </div>\n            )}\n            {state.currentTouristicContent.practical_info && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"useful-information-container\">\n                  <div class=\"useful-information-title\">{translate[state.language].usefulInformation} :&nbsp;</div>\n                  <div innerHTML={state.currentTouristicContent.practical_info}></div>\n                </div>\n              </div>\n            )}\n            {(state.currentTouristicContent.contact || state.currentTouristicContent.email || state.currentTouristicContent.website) && (\n              <div>\n                <div class=\"divider\"></div>\n\n                <div class=\"contact-container\">\n                  <div class=\"contact-title\">{translate[state.language].contact} :&nbsp;</div>\n                  {state.currentTouristicContent.contact && <div innerHTML={state.currentTouristicContent.contact}></div>}\n                  {state.currentTouristicContent.email && (\n                    <div class=\"email-container\">\n                      <div>{translate[state.language].email} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicContent.email}></div>\n                    </div>\n                  )}\n                  {state.currentTouristicContent.website && (\n                    <div class=\"website-container\">\n                      <div>{translate[state.language].website} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicContent.website}></div>\n                    </div>\n                  )}\n                </div>\n              </div>\n            )}\n            <div class=\"detail-bottom-space\"></div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/grw-touristic-event-detail/grw-touristic-event-detail.js

@@ -53,7 +53,7 @@ export class GrwTouristicEventDetail {
         '--detail-bottom-space-height': this.isLargeView ? '8px' : '104px',
       } }, state.currentTouristicEvent && (h("div", { class: "touristic-event-detail-container", ref: el => (this.touristicEventDetailContainerRef = el) }, h("div", { class: "images-container", ref: el => (this.presentationRef = el) }, h("div", { class: "swiper swiper-images", ref: el => (this.swiperImagesRef = el) }, h("div", { class: "swiper-wrapper" }, state.currentTouristicEvent.attachments.length > 0 ? (state.currentTouristicEvent.attachments
       .filter(attachment => attachment.type === 'image')
-      .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: "image", src: attachment.url, 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.paginationElImagesRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElImagesRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElImagesRef = el) }))), h("div", { class: "touristic-event-category-container" }, h("img", { src: touristicEventType.pictogram }), h("div", { class: "touristic-event-category-name" }, touristicEventType.type)), h("div", { class: "name" }, state.currentTouristicEvent.name), h("div", { class: "divider" }), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, translate[state.language].download), h("div", { class: "links-container" }, h("a", { href: `${state.currentTouristicEvent.pdf}` }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "PDF"))), state.currentTouristicEvent.description_teaser && (h("div", null, h("div", { class: "divider" }), h("div", { class: "description-teaser", innerHTML: state.currentTouristicEvent.description_teaser }))), h("div", { class: "divider" }), state.currentTouristicEvent.practical_info && (h("div", { class: "description-container", ref: el => (this.descriptionRef = el) }, h("div", { class: "description-title" }, translate[state.language].description), h("div", { class: "description", innerHTML: state.currentTouristicEvent.description }))), cities && cities.length > 0 && (h("div", { class: "cities-container" }, h("div", { class: "cities-title" }, translate[state.language].city, " :\u00A0"), h("div", { innerHTML: cities.join(', ') }))), state.currentTouristicEvent.practical_info && (h("div", null, h("div", { class: "divider" }), h("div", { class: "useful-information-container" }, h("div", { class: "useful-information-title" }, translate[state.language].usefulInformation, " :\u00A0"), h("div", { innerHTML: state.currentTouristicEvent.practical_info })))), (state.currentTouristicEvent.contact || state.currentTouristicEvent.email || state.currentTouristicEvent.website) && (h("div", null, h("div", { class: "divider" }), h("div", { class: "contact-container" }, h("div", { class: "contact-title" }, translate[state.language].contact, " :\u00A0"), state.currentTouristicEvent.contact && h("div", { innerHTML: state.currentTouristicEvent.contact }), state.currentTouristicEvent.email && (h("div", { class: "email-container" }, h("div", null, translate[state.language].email, " :\u00A0"), h("div", { innerHTML: state.currentTouristicEvent.email }))), state.currentTouristicEvent.website && (h("div", { class: "website-container" }, h("div", null, translate[state.language].website, " :\u00A0"), h("div", { innerHTML: state.currentTouristicEvent.website })))))), h("div", { class: "detail-bottom-space" })))));
+      .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: "image", src: attachment.url, 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.paginationElImagesRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElImagesRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElImagesRef = el) }))), h("div", { class: "touristic-event-category-container" }, h("img", { src: touristicEventType.pictogram }), h("div", { class: "touristic-event-category-name" }, touristicEventType.type)), h("div", { class: "name" }, state.currentTouristicEvent.name), h("div", { class: "divider" }), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, translate[state.language].download), h("div", { class: "links-container" }, h("a", { href: `${state.currentTouristicEvent.pdf}`, target: "_blank", rel: "noopener noreferrer" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "PDF"))), state.currentTouristicEvent.description_teaser && (h("div", null, h("div", { class: "divider" }), h("div", { class: "description-teaser", innerHTML: state.currentTouristicEvent.description_teaser }))), h("div", { class: "divider" }), state.currentTouristicEvent.practical_info && (h("div", { class: "description-container", ref: el => (this.descriptionRef = el) }, h("div", { class: "description-title" }, translate[state.language].description), h("div", { class: "description", innerHTML: state.currentTouristicEvent.description }))), cities && cities.length > 0 && (h("div", { class: "cities-container" }, h("div", { class: "cities-title" }, translate[state.language].city, " :\u00A0"), h("div", { innerHTML: cities.join(', ') }))), state.currentTouristicEvent.practical_info && (h("div", null, h("div", { class: "divider" }), h("div", { class: "useful-information-container" }, h("div", { class: "useful-information-title" }, translate[state.language].usefulInformation, " :\u00A0"), h("div", { innerHTML: state.currentTouristicEvent.practical_info })))), (state.currentTouristicEvent.contact || state.currentTouristicEvent.email || state.currentTouristicEvent.website) && (h("div", null, h("div", { class: "divider" }), h("div", { class: "contact-container" }, h("div", { class: "contact-title" }, translate[state.language].contact, " :\u00A0"), state.currentTouristicEvent.contact && h("div", { innerHTML: state.currentTouristicEvent.contact }), state.currentTouristicEvent.email && (h("div", { class: "email-container" }, h("div", null, translate[state.language].email, " :\u00A0"), h("div", { innerHTML: state.currentTouristicEvent.email }))), state.currentTouristicEvent.website && (h("div", { class: "website-container" }, h("div", null, translate[state.language].website, " :\u00A0"), h("div", { innerHTML: state.currentTouristicEvent.website })))))), h("div", { class: "detail-bottom-space" })))));
   }
   static get is() { return "grw-touristic-event-detail"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/grw-touristic-event-detail/grw-touristic-event-detail.js.map

@@ -1 +1 @@
-{"version":3,"file":"grw-touristic-event-detail.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-event-detail/grw-touristic-event-detail.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Host, Prop, State, getAssetPath, h } from '@stencil/core';\nimport { translate } from 'i18n/i18n';\nimport state from 'store/store';\nimport Swiper, { FreeMode, Keyboard, Mousewheel, Navigation, Pagination } from 'swiper';\n\n@Component({\n  tag: 'grw-touristic-event-detail',\n  styleUrl: 'grw-touristic-event-detail.scss',\n  shadow: true,\n})\nexport class GrwTouristicEventDetail {\n  swiperImages?: Swiper;\n  swiperImagesRef?: HTMLDivElement;\n  prevElImagesRef?: HTMLDivElement;\n  nextElImagesRef?: HTMLDivElement;\n  paginationElImagesRef?: HTMLDivElement;\n  presentationRef?: HTMLDivElement;\n\n  @State() displayFullscreen = false;\n  @Prop() colorPrimaryApp = '#6b0030';\n  @Prop() colorOnSurface = '#49454e';\n  @Prop() colorPrimaryContainer = '#eaddff';\n  @Prop() colorOnPrimaryContainer = '#21005e';\n  @Prop() colorSecondaryContainer = '#e8def8';\n  @Prop() colorOnSecondaryContainer = '#1d192b';\n  @Prop() colorSurfaceContainerLow = '#f7f2fa';\n  @Prop() colorBackground = '#fef7ff';\n  @Prop() isLargeView = false;\n\n  descriptionRef?: HTMLDivElement;\n  touristicEventDetailContainerRef?: HTMLElement;\n\n  componentDidLoad() {\n    this.swiperImages = new Swiper(this.swiperImagesRef, {\n      modules: [Navigation, Pagination, Keyboard, FreeMode, Mousewheel],\n      navigation: {\n        prevEl: this.prevElImagesRef,\n        nextEl: this.nextElImagesRef,\n      },\n      pagination: { el: this.paginationElImagesRef },\n      allowTouchMove: false,\n      keyboard: false,\n    });\n    this.swiperImagesRef.onfullscreenchange = () => {\n      this.displayFullscreen = !this.displayFullscreen;\n      this.displayFullscreen ? this.swiperImages.keyboard.enable() : this.swiperImages.keyboard.disable();\n    };\n  }\n\n  handleFullscreen() {\n    if (state.currentTouristicEvent.attachments && state.currentTouristicEvent.attachments[0] && state.currentTouristicEvent.attachments[0].url) {\n      this.swiperImagesRef.requestFullscreen();\n    }\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicEventType =\n      state.touristicEventTypes &&\n      state.currentTouristicEvent &&\n      state.touristicEventTypes.find(touristicEventCategory => touristicEventCategory.id === state.currentTouristicEvent.type);\n    const cities = state.currentTouristicEvent && state.currentTouristicEvent.cities.map(currentCity => state.cities.find(city => city.id === currentCity)?.name);\n    return (\n      <Host\n        style={{\n          '--color-primary-app': this.colorPrimaryApp,\n          '--color-on-surface': this.colorOnSurface,\n          '--color-primary-container': this.colorPrimaryContainer,\n          '--color-on-primary-container': this.colorOnPrimaryContainer,\n          '--color-secondary-container': this.colorSecondaryContainer,\n          '--color-on-secondary-container': this.colorOnSecondaryContainer,\n          '--color-background': this.colorBackground,\n          '--detail-bottom-space-height': this.isLargeView ? '8px' : '104px',\n        }}\n      >\n        {state.currentTouristicEvent && (\n          <div class=\"touristic-event-detail-container\" ref={el => (this.touristicEventDetailContainerRef = el)}>\n            <div class=\"images-container\" ref={el => (this.presentationRef = el)}>\n              <div class=\"swiper swiper-images\" ref={el => (this.swiperImagesRef = el)}>\n                <div class=\"swiper-wrapper\">\n                  {state.currentTouristicEvent.attachments.length > 0 ? (\n                    state.currentTouristicEvent.attachments\n                      .filter(attachment => attachment.type === 'image')\n                      .map(attachment => (\n                        <div class=\"swiper-slide\">\n                          <img class=\"image\" src={attachment.url} loading=\"lazy\" onClick={() => this.handleFullscreen()} />\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.paginationElImagesRef = el)}></div>\n                <div class=\"swiper-button-prev\" ref={el => (this.prevElImagesRef = el)}></div>\n                <div class=\"swiper-button-next\" ref={el => (this.nextElImagesRef = el)}></div>\n              </div>\n            </div>\n            <div class=\"touristic-event-category-container\">\n              <img src={touristicEventType.pictogram} />\n              <div class=\"touristic-event-category-name\">{touristicEventType.type}</div>\n            </div>\n            <div class=\"name\">{state.currentTouristicEvent.name}</div>\n            <div class=\"divider\"></div>\n            <div class=\"downloads-container\">\n              <div class=\"download-title\">{translate[state.language].download}</div>\n              <div class=\"links-container\">\n                <a href={`${state.currentTouristicEvent.pdf}`}>\n                  {/* @ts-ignore */}\n                  <span translate={false} class=\"material-symbols material-symbols-outlined\">\n                    download\n                  </span>\n                  PDF\n                </a>\n              </div>\n            </div>\n            {state.currentTouristicEvent.description_teaser && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"description-teaser\" innerHTML={state.currentTouristicEvent.description_teaser}></div>\n              </div>\n            )}\n            <div class=\"divider\"></div>\n            {state.currentTouristicEvent.practical_info && (\n              <div class=\"description-container\" ref={el => (this.descriptionRef = el)}>\n                <div class=\"description-title\">{translate[state.language].description}</div>\n                <div class=\"description\" innerHTML={state.currentTouristicEvent.description}></div>\n              </div>\n            )}\n            {cities && cities.length > 0 && (\n              <div class=\"cities-container\">\n                <div class=\"cities-title\">{translate[state.language].city} :&nbsp;</div>\n                <div innerHTML={cities.join(', ')}></div>\n              </div>\n            )}\n            {state.currentTouristicEvent.practical_info && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"useful-information-container\">\n                  <div class=\"useful-information-title\">{translate[state.language].usefulInformation} :&nbsp;</div>\n                  <div innerHTML={state.currentTouristicEvent.practical_info}></div>\n                </div>\n              </div>\n            )}\n            {(state.currentTouristicEvent.contact || state.currentTouristicEvent.email || state.currentTouristicEvent.website) && (\n              <div>\n                <div class=\"divider\"></div>\n\n                <div class=\"contact-container\">\n                  <div class=\"contact-title\">{translate[state.language].contact} :&nbsp;</div>\n                  {state.currentTouristicEvent.contact && <div innerHTML={state.currentTouristicEvent.contact}></div>}\n                  {state.currentTouristicEvent.email && (\n                    <div class=\"email-container\">\n                      <div>{translate[state.language].email} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicEvent.email}></div>\n                    </div>\n                  )}\n                  {state.currentTouristicEvent.website && (\n                    <div class=\"website-container\">\n                      <div>{translate[state.language].website} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicEvent.website}></div>\n                    </div>\n                  )}\n                </div>\n              </div>\n            )}\n            <div class=\"detail-bottom-space\"></div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"grw-touristic-event-detail.js","sourceRoot":"","sources":["../../../src/components/grw-touristic-event-detail/grw-touristic-event-detail.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Build, Component, Host, Prop, State, getAssetPath, h } from '@stencil/core';\nimport { translate } from 'i18n/i18n';\nimport state from 'store/store';\nimport Swiper, { FreeMode, Keyboard, Mousewheel, Navigation, Pagination } from 'swiper';\n\n@Component({\n  tag: 'grw-touristic-event-detail',\n  styleUrl: 'grw-touristic-event-detail.scss',\n  shadow: true,\n})\nexport class GrwTouristicEventDetail {\n  swiperImages?: Swiper;\n  swiperImagesRef?: HTMLDivElement;\n  prevElImagesRef?: HTMLDivElement;\n  nextElImagesRef?: HTMLDivElement;\n  paginationElImagesRef?: HTMLDivElement;\n  presentationRef?: HTMLDivElement;\n\n  @State() displayFullscreen = false;\n  @Prop() colorPrimaryApp = '#6b0030';\n  @Prop() colorOnSurface = '#49454e';\n  @Prop() colorPrimaryContainer = '#eaddff';\n  @Prop() colorOnPrimaryContainer = '#21005e';\n  @Prop() colorSecondaryContainer = '#e8def8';\n  @Prop() colorOnSecondaryContainer = '#1d192b';\n  @Prop() colorSurfaceContainerLow = '#f7f2fa';\n  @Prop() colorBackground = '#fef7ff';\n  @Prop() isLargeView = false;\n\n  descriptionRef?: HTMLDivElement;\n  touristicEventDetailContainerRef?: HTMLElement;\n\n  componentDidLoad() {\n    this.swiperImages = new Swiper(this.swiperImagesRef, {\n      modules: [Navigation, Pagination, Keyboard, FreeMode, Mousewheel],\n      navigation: {\n        prevEl: this.prevElImagesRef,\n        nextEl: this.nextElImagesRef,\n      },\n      pagination: { el: this.paginationElImagesRef },\n      allowTouchMove: false,\n      keyboard: false,\n    });\n    this.swiperImagesRef.onfullscreenchange = () => {\n      this.displayFullscreen = !this.displayFullscreen;\n      this.displayFullscreen ? this.swiperImages.keyboard.enable() : this.swiperImages.keyboard.disable();\n    };\n  }\n\n  handleFullscreen() {\n    if (state.currentTouristicEvent.attachments && state.currentTouristicEvent.attachments[0] && state.currentTouristicEvent.attachments[0].url) {\n      this.swiperImagesRef.requestFullscreen();\n    }\n  }\n\n  render() {\n    const defaultImageSrc = getAssetPath(`${Build.isDev ? '/' : ''}assets/default-image.svg`);\n    const touristicEventType =\n      state.touristicEventTypes &&\n      state.currentTouristicEvent &&\n      state.touristicEventTypes.find(touristicEventCategory => touristicEventCategory.id === state.currentTouristicEvent.type);\n    const cities = state.currentTouristicEvent && state.currentTouristicEvent.cities.map(currentCity => state.cities.find(city => city.id === currentCity)?.name);\n    return (\n      <Host\n        style={{\n          '--color-primary-app': this.colorPrimaryApp,\n          '--color-on-surface': this.colorOnSurface,\n          '--color-primary-container': this.colorPrimaryContainer,\n          '--color-on-primary-container': this.colorOnPrimaryContainer,\n          '--color-secondary-container': this.colorSecondaryContainer,\n          '--color-on-secondary-container': this.colorOnSecondaryContainer,\n          '--color-background': this.colorBackground,\n          '--detail-bottom-space-height': this.isLargeView ? '8px' : '104px',\n        }}\n      >\n        {state.currentTouristicEvent && (\n          <div class=\"touristic-event-detail-container\" ref={el => (this.touristicEventDetailContainerRef = el)}>\n            <div class=\"images-container\" ref={el => (this.presentationRef = el)}>\n              <div class=\"swiper swiper-images\" ref={el => (this.swiperImagesRef = el)}>\n                <div class=\"swiper-wrapper\">\n                  {state.currentTouristicEvent.attachments.length > 0 ? (\n                    state.currentTouristicEvent.attachments\n                      .filter(attachment => attachment.type === 'image')\n                      .map(attachment => (\n                        <div class=\"swiper-slide\">\n                          <img class=\"image\" src={attachment.url} loading=\"lazy\" onClick={() => this.handleFullscreen()} />\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.paginationElImagesRef = el)}></div>\n                <div class=\"swiper-button-prev\" ref={el => (this.prevElImagesRef = el)}></div>\n                <div class=\"swiper-button-next\" ref={el => (this.nextElImagesRef = el)}></div>\n              </div>\n            </div>\n            <div class=\"touristic-event-category-container\">\n              <img src={touristicEventType.pictogram} />\n              <div class=\"touristic-event-category-name\">{touristicEventType.type}</div>\n            </div>\n            <div class=\"name\">{state.currentTouristicEvent.name}</div>\n            <div class=\"divider\"></div>\n            <div class=\"downloads-container\">\n              <div class=\"download-title\">{translate[state.language].download}</div>\n              <div class=\"links-container\">\n                <a href={`${state.currentTouristicEvent.pdf}`} target=\"_blank\" rel=\"noopener noreferrer\">\n                  {/* @ts-ignore */}\n                  <span translate={false} class=\"material-symbols material-symbols-outlined\">\n                    download\n                  </span>\n                  PDF\n                </a>\n              </div>\n            </div>\n            {state.currentTouristicEvent.description_teaser && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"description-teaser\" innerHTML={state.currentTouristicEvent.description_teaser}></div>\n              </div>\n            )}\n            <div class=\"divider\"></div>\n            {state.currentTouristicEvent.practical_info && (\n              <div class=\"description-container\" ref={el => (this.descriptionRef = el)}>\n                <div class=\"description-title\">{translate[state.language].description}</div>\n                <div class=\"description\" innerHTML={state.currentTouristicEvent.description}></div>\n              </div>\n            )}\n            {cities && cities.length > 0 && (\n              <div class=\"cities-container\">\n                <div class=\"cities-title\">{translate[state.language].city} :&nbsp;</div>\n                <div innerHTML={cities.join(', ')}></div>\n              </div>\n            )}\n            {state.currentTouristicEvent.practical_info && (\n              <div>\n                <div class=\"divider\"></div>\n                <div class=\"useful-information-container\">\n                  <div class=\"useful-information-title\">{translate[state.language].usefulInformation} :&nbsp;</div>\n                  <div innerHTML={state.currentTouristicEvent.practical_info}></div>\n                </div>\n              </div>\n            )}\n            {(state.currentTouristicEvent.contact || state.currentTouristicEvent.email || state.currentTouristicEvent.website) && (\n              <div>\n                <div class=\"divider\"></div>\n\n                <div class=\"contact-container\">\n                  <div class=\"contact-title\">{translate[state.language].contact} :&nbsp;</div>\n                  {state.currentTouristicEvent.contact && <div innerHTML={state.currentTouristicEvent.contact}></div>}\n                  {state.currentTouristicEvent.email && (\n                    <div class=\"email-container\">\n                      <div>{translate[state.language].email} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicEvent.email}></div>\n                    </div>\n                  )}\n                  {state.currentTouristicEvent.website && (\n                    <div class=\"website-container\">\n                      <div>{translate[state.language].website} :&nbsp;</div>\n                      <div innerHTML={state.currentTouristicEvent.website}></div>\n                    </div>\n                  )}\n                </div>\n              </div>\n            )}\n            <div class=\"detail-bottom-space\"></div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/grw-trek-detail/grw-trek-detail.js

@@ -358,7 +358,7 @@ export class GrwTrekDetail {
       .map(attachment => (h("div", { class: "swiper-slide" }, h("img", { class: "image", src: attachment.url, loading: "lazy", onClick: () => this.handleFullscreen() }))))), h("div", { class: "swiper-pagination", ref: el => (this.paginationElImagesRef = el) }), h("div", { class: "swiper-button-prev", ref: el => (this.prevElImagesRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.nextElImagesRef = el) }))), h("div", { class: "name" }, this.currentTrek.name), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), h("div", { class: "sub-container" }, h("div", { class: "icons-labels-container" }, h("div", { class: "row" }, h("div", { class: "icon-label difficulty" }, ((_a = this.difficulty) === null || _a === void 0 ? void 0 : _a.pictogram) && h("img", { src: this.difficulty.pictogram }), (_b = this.difficulty) === null || _b === void 0 ? void 0 :
       _b.label), h("div", { class: "icon-label duration" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "timelapse"), formatDuration((_c = this.currentTrek) === null || _c === void 0 ? void 0 : _c.duration)), 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: "row" }, h("div", { class: "icon-label length" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "open_in_full"), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "moving"), formatAscent(this.currentTrek.ascent)), 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)))), h("div", { class: "divider" }), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, translate[state.language].downloads), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "GPX"), h("a", { href: `${this.currentTrek.kml}` }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "KML"), h("a", { href: `${this.currentTrek.pdf}` }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "PDF"))), h("div", { class: "divider" }), this.currentTrek.description_teaser && h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), state.parentTrekId && state.parentTrek && this.currentTrek.id !== state.parentTrekId && (h("div", null, h("div", { class: "divider" }), h("div", { class: "parent-trek-container" }, h("button", { class: "parent-trek-title", onClick: () => this.parentTrekPress.emit(state.parentTrekId) }, h("div", null, "<"), state.parentTrek.name)))), state.currentTrekSteps && (h("div", { class: "step-container", ref: el => (this.stepsRef = el) }, h("div", { class: "step-title" }, `${state.currentTrekSteps.length} ${translate[state.language].steps}`), h("div", { class: "swiper swiper-step", ref: el => (this.swiperStepRef = el) }, h("div", { class: "swiper-wrapper" }, state.currentTrekSteps &&
+      _g.name)))), h("div", { class: "divider" }), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, translate[state.language].downloads), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}`, target: "_blank", rel: "noopener noreferrer" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "GPX"), h("a", { href: `${this.currentTrek.kml}`, target: "_blank", rel: "noopener noreferrer" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "KML"), h("a", { href: `${this.currentTrek.pdf}`, target: "_blank", rel: "noopener noreferrer" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "download"), "PDF"))), h("div", { class: "divider" }), this.currentTrek.description_teaser && h("div", { class: "description-teaser", innerHTML: this.currentTrek.description_teaser }), this.currentTrek.ambiance && h("div", { class: "ambiance", innerHTML: this.currentTrek.ambiance }), state.parentTrekId && state.parentTrek && this.currentTrek.id !== state.parentTrekId && (h("div", null, h("div", { class: "divider" }), h("div", { class: "parent-trek-container" }, h("button", { class: "parent-trek-title", onClick: () => this.parentTrekPress.emit(state.parentTrekId) }, h("div", null, "<"), state.parentTrek.name)))), state.currentTrekSteps && (h("div", { class: "step-container", ref: el => (this.stepsRef = el) }, h("div", { class: "step-title" }, `${state.currentTrekSteps.length} ${translate[state.language].steps}`), h("div", { class: "swiper swiper-step", ref: el => (this.swiperStepRef = el) }, h("div", { class: "swiper-wrapper" }, state.currentTrekSteps &&
       state.currentTrekSteps.map(trek => {
         return (h("div", { class: "swiper-slide" }, h("grw-trek-card", { "reset-store-on-disconnected": "false", key: `trek-${trek.id}`, trek: trek, "is-large-view": false, "is-step": true, "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 })));
       }))))), h("div", { class: "divider" }), this.currentTrek.description && (h("div", { class: "description-container", ref: el => (this.descriptionRef = el) }, h("div", { class: "description-title" }, translate[state.language].description), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, translate[state.language].departure, " :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, translate[state.language].arrival, " :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.cities && this.currentTrek.cities.length > 0 && (h("div", { class: "cities-container" }, h("div", { class: "cities-title" }, translate[state.language].crossedCities, " :\u00A0"), h("div", { innerHTML: this.cities.join(', ') }))), this.weather && this.currentTrek.departure_city && (h("div", { class: "weather-container" }, h("iframe", { height: "150", frameborder: "0", src: `https://meteofrance.com/widget/prevision/${this.currentTrek.departure_city}0#${this.colorPrimaryApp}` }))), this.currentTrek.access && (h("div", null, h("div", { class: "divider" }), h("div", { class: "access-container" }, h("div", { class: "access-title" }, translate[state.language].roadAccess), h("div", { class: "access", innerHTML: this.currentTrek.access })))), this.currentTrek.public_transport && (h("div", null, h("div", { class: "divider" }), h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, translate[state.language].transport), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport })))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", null, h("div", { class: "divider" }), h("div", { class: "advice-container", ref: el => (this.recommendationRef = el) }, h("div", { class: "advice-title" }, translate[state.language].recommendations), this.currentTrek.advice && (h("div", { class: "current-advice-container" }, h("span", { translate: false, class: "material-symbols material-symbols-outlined" }, "warning"), h("div", { class: "advice", innerHTML: this.currentTrek.advice }))), this.labels.map(label => (h("div", { class: "label-container" }, h("div", { class: "label-sub-container" }, label.pictogram && h("img", { src: label.pictogram }), h("div", { class: "label-name", innerHTML: label.name })), h("div", { class: "label-advice", innerHTML: label.advice }))))))), this.currentTrek.advised_parking && (h("div", null, h("div", { class: "divider" }), h("div", { class: "advised-parking-container", ref: el => (this.parkingRef = el) }, h("div", { class: "advised-parking-title" }, translate[state.language].recommendedParking), h("div", { class: "advised-parking", innerHTML: this.currentTrek.advised_parking })))), this.currentTrek.gear && (h("div", null, h("div", { class: "divider" }), h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, translate[state.language].equipments), h("div", { class: "gear", innerHTML: this.currentTrek.gear })))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", null, h("div", { class: "divider" }), h("div", { class: "sensitive-areas-container", ref: el => (this.sensitiveAreaRef = el) }, h("div", { class: "sensitive-areas-title" }, translate[state.language].environmentalSensitiveAreas), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea })))))), state.currentInformationDesks &&