@geotrekce/geotrek-rando-widget 0.0.21 → 0.2.0

package/dist/collection/components/grw-app/grw-app.js.map

@@ -1 +1 @@
-{"version":3,"file":"grw-app.js","sourceRoot":"","sources":["../../../src/components/grw-app/grw-app.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Listen, State, Prop, Element, Watch, getAssetPath } from '@stencil/core';\nimport state, { onChange, reset } from 'store/store';\n\n@Component({\n  tag: 'grw-app',\n  styleUrls: ['grw-app.scss'],\n  shadow: true,\n})\nexport class GrwApp {\n  @Element() element: HTMLElement;\n  @State() showTrek = false;\n  @State() showTreksMap = false;\n  @State() showTrekMap = false;\n  @State() showFilters = false;\n  @State() isLargeView = false;\n  @State() currentTrekId: number;\n  @Prop() api: string;\n  @Prop() language = 'fr';\n  @Prop() inBbox: string;\n  @Prop() cities: string;\n  @Prop() districts: string;\n  @Prop() structures: string;\n  @Prop() themes: string;\n  @Prop() portals: string;\n  @Prop() routes: string;\n  @Prop() practices: string;\n  @Prop() urlLayer: string;\n  @Prop() center: string;\n  @Prop() zoom: number;\n  @Prop() attribution: string;\n  @Prop() colorPrimary = '#6b0030';\n  @Prop() colorPrimaryShade = '#4a0021';\n  @Prop() colorPrimaryTint = '#974c6e';\n  @Prop() colorTrekLine = '#6b0030';\n  @Prop() colorDepartureIcon = '#006b3b';\n  @Prop() colorArrivalIcon = '#85003b';\n  @Prop() colorSensitiveArea = '#4974a5';\n  @Prop() colorPoiIcon = '#974c6e';\n  @Prop() linkName = 'GEOTREK';\n  @Prop() linkTarget = 'https://geotrek.fr';\n\n  largeViewSize = 1024;\n  handlePopStateBind: (event: any) => void = this.handlePopState.bind(this);\n\n  @Listen('trekCardPress')\n  onTrekCardPress(event: CustomEvent<number>) {\n    this.currentTrekId = event.detail;\n    this.showTrek = !this.showTrek;\n    const url = new URL(window.location.toString());\n    url.searchParams.set('trek', this.currentTrekId.toString());\n    window.history.pushState({}, '', url);\n  }\n\n  @Listen('resize', { target: 'window' })\n  onWindowResize() {\n    this.handleView();\n  }\n\n  @Watch('isLargeView')\n  watchPropHandler() {\n    window.dispatchEvent(new window.Event('resize'));\n  }\n\n  componentWillLoad() {\n    const url = new URL(window.location.toString());\n    const trekParam = url.searchParams.get('trek');\n    if (trekParam) {\n      window.history.replaceState({ isInitialHistoryWithTrek: true }, '', url);\n      this.currentTrekId = Number(trekParam);\n      this.showTrek = !this.showTrek;\n    }\n  }\n\n  componentDidLoad() {\n    onChange('trekNetworkError', () => {\n      if (state.trekNetworkError) {\n        const urlRedirect = new URL(window.location.toString());\n        urlRedirect.searchParams.delete('trek');\n        window.history.replaceState({}, '', urlRedirect);\n        this.onTrekDetailsClose();\n      }\n    });\n    window.addEventListener('popstate', this.handlePopStateBind, false);\n    this.handleView();\n  }\n\n  onTrekDetailsClose() {\n    state.currentTrek = null;\n    this.currentTrekId = null;\n    this.showTrek = !this.showTrek;\n  }\n\n  handleView() {\n    this.isLargeView = this.element.getBoundingClientRect().width >= this.largeViewSize;\n    this.showTreksMap = this.isLargeView;\n    this.showTrekMap = this.isLargeView;\n  }\n\n  handleFilters() {\n    this.showFilters = !this.showFilters;\n  }\n\n  handleBackButton() {\n    if (window.history.state.isInitialHistoryWithTrek) {\n      this.onTrekDetailsClose();\n      const url = new URL(window.location.toString());\n      url.searchParams.delete('trek');\n      window.history.pushState({}, '', url);\n    } else {\n      window.history.back();\n    }\n  }\n\n  handlePopState() {\n    const url = new URL(window.location.toString());\n    const trekParam = url.searchParams.get('trek');\n    if (trekParam) {\n      this.currentTrekId = Number(trekParam);\n      this.showTrek = !this.showTrek;\n    } else {\n      this.onTrekDetailsClose();\n    }\n  }\n\n  handleShowMap() {\n    if (this.currentTrekId) {\n      this.showTrekMap = !this.showTrekMap;\n    } else {\n      this.showTreksMap = !this.showTreksMap;\n    }\n  }\n\n  disconnectedCallback() {\n    reset();\n    window.removeEventListener('popstate', this.handlePopStateBind);\n  }\n\n  render() {\n    const arrowBackImageSrc = getAssetPath(`assets/arrow-back.svg`);\n    return (\n      <Host style={{ '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint, '--color-primary-shade': this.colorPrimaryShade }}>\n        {!state.currentTreks && !state.currentTrek && (\n          <div class=\"init-loader-container\">\n            <span class=\"loader\"></span>\n          </div>\n        )}\n        {!this.showTrek && !state.treks && (\n          <grw-treks-provider\n            api={this.api}\n            language={this.language}\n            in-bbox={this.inBbox}\n            cities={this.cities}\n            districts={this.districts}\n            structures={this.structures}\n            themes={this.themes}\n            portals={this.portals}\n            routes={this.routes}\n            practices={this.practices}\n          ></grw-treks-provider>\n        )}\n        {this.showTrek && this.currentTrekId && <grw-trek-provider api={this.api} language={this.language} trek-id={this.currentTrekId}></grw-trek-provider>}\n        {(state.currentTreks || state.currentTrek) && (\n          <div class=\"app-container\">\n            <div class={this.isLargeView ? 'large-view-header-container' : 'header-container'}>\n              {this.showTrek ? (\n                <div onClick={() => this.handleBackButton()} class=\"arrow-back-icon\">\n                  <img src={arrowBackImageSrc} />\n                </div>\n              ) : (\n                <div class=\"handle-filters-container\">\n                  <div onClick={() => this.handleFilters()} class=\"handle-filters-button\">\n                    FILTRER\n                  </div>\n                  {state.treksWithinBounds && (\n                    <div class=\"current-treks-within-bounds-length\">{`${state.treksWithinBounds.length} randonnée${state.treksWithinBounds.length > 1 ? 's' : ''}`}</div>\n                  )}\n                </div>\n              )}\n              {!this.showTrek && this.showFilters && (\n                <div class=\"options-container\">\n                  <div class=\"filters-container\">\n                    <div onClick={() => this.handleFilters()} class=\"close-filters-button\">\n                      X\n                    </div>\n                    <div>\n                      <grw-filter filterName=\"Pratique\" filterType=\"practices\" filterNameProperty=\"name\"></grw-filter>\n                    </div>\n                    <div class=\"filter-margin-top\">\n                      <grw-filter filterName=\"Difficulté\" filterType=\"difficulties\" filterNameProperty=\"label\"></grw-filter>\n                    </div>\n                    <div class=\"filter-margin-top\">\n                      <grw-filter filterName=\"Durée\" filterType=\"durations\" filterNameProperty=\"name\"></grw-filter>\n                    </div>\n                  </div>\n                  <div onClick={() => this.handleFilters()} class=\"back-filters-container\"></div>\n                </div>\n              )}\n              {this.linkName && (\n                <div class=\"attribution-container\">\n                  <a target=\"_blank\" href={this.linkTarget}>\n                    {this.linkName}\n                  </a>\n                </div>\n              )}\n            </div>\n            <div class=\"content-container\">\n              <div\n                class={this.isLargeView ? 'large-view-app-treks-list-container' : 'app-treks-list-container'}\n                style={{ display: this.showTrek ? 'none' : 'flex', position: this.showTrek ? 'absolute' : 'relative' }}\n              >\n                <grw-treks-list\n                  reset-store-on-disconnected=\"false\"\n                  is-large-view={this.isLargeView}\n                  color-primary={this.colorPrimary}\n                  color-primary-tint={this.colorPrimaryTint}\n                ></grw-treks-list>\n              </div>\n              {this.showTrek && !state.currentTrek && (\n                <div class={this.isLargeView ? 'large-view-loader-container' : 'loader-container'}>\n                  <span class=\"loader\"></span>\n                </div>\n              )}\n              {state.currentTrek && (\n                <div class={this.isLargeView ? 'large-view-app-trek-detail-container' : 'app-trek-detail-container'}>\n                  <grw-trek-detail\n                    reset-store-on-disconnected=\"false\"\n                    color-primary={this.colorPrimary}\n                    color-primary-shade={this.colorPrimaryShade}\n                    color-primary-tint={this.colorPrimaryTint}\n                  ></grw-trek-detail>\n                </div>\n              )}\n              <grw-map\n                reset-store-on-disconnected=\"false\"\n                class={this.isLargeView ? 'large-view-app-map-container' : 'app-map-container'}\n                style={{ visibility: (this.showTreksMap && !this.showTrek) || (this.showTrekMap && this.showTrek) ? 'visible' : 'hidden' }}\n                url-layer={this.urlLayer}\n                center={this.center}\n                zoom={this.zoom}\n                attribution={this.attribution}\n                color-primary={this.colorPrimary}\n                color-primary-tint={this.colorPrimaryTint}\n                color-trek-line={this.colorTrekLine}\n                color-departure-icon={this.colorDepartureIcon}\n                color-arrival-icon={this.colorArrivalIcon}\n                color-sensitive-area={this.colorSensitiveArea}\n                color-poi-icon={this.colorPoiIcon}\n              ></grw-map>\n            </div>\n            <div class=\"map-visibility-button\" style={{ display: this.isLargeView ? 'none' : 'flex' }}>\n              <div onClick={() => this.handleShowMap()}>\n                {this.showTrek ? (this.showTrekMap ? 'Voir la fiche' : 'Voir la carte') : this.showTreksMap ? 'Voir la liste' : 'Voir la carte'}\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"grw-app.js","sourceRoot":"","sources":["../../../src/components/grw-app/grw-app.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Listen, State, Prop, Element, Watch } from '@stencil/core';\nimport { translate } from 'i18n/i18n';\nimport state, { onChange, reset } from 'store/store';\n\n@Component({\n  tag: 'grw-app',\n  styleUrls: ['grw-app.scss'],\n  shadow: false,\n})\nexport class GrwApp {\n  @Element() element: HTMLElement;\n  @State() showTrek = false;\n  @State() showTreksMap = false;\n  @State() showTrekMap = false;\n  @State() showFilters = false;\n  @State() isLargeView = false;\n  @State() currentTrekId: number;\n  @Prop() api: string;\n  @Prop() languages = 'fr';\n  @Prop() inBbox: string;\n  @Prop() cities: string;\n  @Prop() districts: string;\n  @Prop() structures: string;\n  @Prop() themes: string;\n  @Prop() portals: string;\n  @Prop() routes: string;\n  @Prop() practices: string;\n  @Prop() urlLayer: string;\n  @Prop() center: string;\n  @Prop() zoom: number;\n  @Prop() attribution: string;\n  @Prop() linkName = 'GEOTREK';\n  @Prop() linkTarget = 'https://geotrek.fr';\n  @Prop() weather = false;\n\n  @Prop() colorPrimaryApp = '#6750a4';\n  @Prop() colorOnPrimary = '#ffffff';\n  @Prop() colorSurface = '#1c1b1f';\n  @Prop() colorOnSurface = '#49454e';\n  @Prop() colorSurfaceVariant = '#fef7ff';\n  @Prop() colorOnSurfaceVariant = '#1c1b1f';\n  @Prop() colorPrimaryContainer = '#eaddff';\n  @Prop() colorOnPrimaryContainer = '#21005e';\n  @Prop() colorSecondaryContainer = '#e8def8';\n  @Prop() colorOnSecondaryContainer = '#1d192b';\n  @Prop() colorBackground = '#fef7ff';\n  @Prop() colorSurfaceContainerHigh = '#ece6f0';\n  @Prop() colorSurfaceContainerLow = '#f7f2fa';\n  @Prop() fabBackgroundColor = '#eaddff';\n  @Prop() fabColor = '#21005d';\n\n  @Prop() colorTrekLine = '#6b0030';\n  @Prop() colorDepartureIcon = '#006b3b';\n  @Prop() colorArrivalIcon = '#85003b';\n  @Prop() colorSensitiveArea = '#4974a5';\n  @Prop() colorPoiIcon = '#974c6e';\n\n  largeViewSize = 1024;\n  handlePopStateBind: (event: any) => void = this.handlePopState.bind(this);\n\n  @Listen('trekCardPress', { target: 'window' })\n  onTrekCardPress(event: CustomEvent<number>) {\n    this.currentTrekId = event.detail;\n    this.showTrek = !this.showTrek;\n    this.showTrekMap = false;\n    const url = new URL(window.location.toString());\n    url.searchParams.set('trek', this.currentTrekId.toString());\n    window.history.pushState({}, '', url);\n  }\n\n  @Listen('resize', { target: 'window' })\n  onWindowResize() {\n    this.handleView();\n  }\n\n  @Listen('centerOnMap', { target: 'window' })\n  onCenterOnMap() {\n    if (!this.isLargeView) {\n      this.showTrekMap = true;\n    }\n  }\n\n  @Watch('isLargeView')\n  watchPropHandler() {\n    window.dispatchEvent(new window.Event('resize'));\n  }\n\n  componentWillLoad() {\n    const url = new URL(window.location.toString());\n    const trekParam = url.searchParams.get('trek');\n    if (trekParam) {\n      window.history.replaceState({ isInitialHistoryWithTrek: true }, '', url);\n      this.currentTrekId = Number(trekParam);\n      this.showTrek = !this.showTrek;\n    }\n  }\n\n  componentDidLoad() {\n    onChange('trekNetworkError', () => {\n      if (state.trekNetworkError) {\n        const urlRedirect = new URL(window.location.toString());\n        urlRedirect.searchParams.delete('trek');\n        window.history.replaceState({}, '', urlRedirect);\n        this.onTrekDetailsClose();\n      }\n    });\n    window.addEventListener('popstate', this.handlePopStateBind, false);\n    this.handleView();\n  }\n\n  onTrekDetailsClose() {\n    state.currentTrek = null;\n    this.currentTrekId = null;\n    this.showTrek = !this.showTrek;\n  }\n\n  handleView() {\n    this.isLargeView = this.element.getBoundingClientRect().width >= this.largeViewSize;\n    this.showTreksMap = this.isLargeView;\n    this.showTrekMap = this.isLargeView;\n  }\n\n  handleFilters() {\n    this.showFilters = !this.showFilters;\n  }\n\n  handleBackButton() {\n    if (window.history.state && window.history.state.isInitialHistoryWithTrek) {\n      this.onTrekDetailsClose();\n      const url = new URL(window.location.toString());\n      url.searchParams.delete('trek');\n      window.history.pushState({}, '', url);\n    } else {\n      window.history.back();\n    }\n  }\n\n  handlePopState() {\n    const url = new URL(window.location.toString());\n    const trekParam = Number(url.searchParams.get('trek'));\n    if (trekParam && this.currentTrekId !== trekParam) {\n      this.currentTrekId = trekParam;\n      this.showTrek = true;\n    } else if (!trekParam) {\n      this.onTrekDetailsClose();\n    }\n  }\n\n  handleShowMap() {\n    if (this.currentTrekId) {\n      this.showTrekMap = !this.showTrekMap;\n    } else {\n      this.showTreksMap = !this.showTreksMap;\n    }\n  }\n\n  disconnectedCallback() {\n    reset();\n    window.removeEventListener('popstate', this.handlePopStateBind);\n  }\n\n  render() {\n    return (\n      <Host\n        style={{\n          '--color-primary-app': this.colorPrimaryApp,\n          '--color-on-primary': this.colorOnPrimary,\n          '--color-surface': this.colorSurface,\n          '--color-on-surface': this.colorOnSurface,\n          '--color-surface-variant': this.colorSurfaceVariant,\n          '--color-on-surface-variant': this.colorOnSurfaceVariant,\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          '--color-surface-container-high': this.colorSurfaceContainerHigh,\n          '--color-surface-container-low': this.colorSurfaceContainerLow,\n          '--fab-background-color': this.fabBackgroundColor,\n          '--fab-color': this.fabColor,\n        }}\n      >\n        {!state.currentTreks && !state.currentTrek && (\n          <div class=\"init-loader-container\">\n            <span class=\"loader\"></span>\n          </div>\n        )}\n        {!this.showTrek && !state.treks && (\n          <grw-treks-provider\n            api={this.api}\n            languages={this.languages}\n            in-bbox={this.inBbox}\n            cities={this.cities}\n            districts={this.districts}\n            structures={this.structures}\n            themes={this.themes}\n            portals={this.portals}\n            routes={this.routes}\n            practices={this.practices}\n          ></grw-treks-provider>\n        )}\n        {this.showTrek && this.currentTrekId && !state.currentTrek && (\n          <grw-trek-provider api={this.api} languages={this.languages} trek-id={this.currentTrekId}></grw-trek-provider>\n        )}\n        {(state.currentTreks || state.currentTrek) && (\n          <div class=\"app-container\">\n            <div class={this.isLargeView ? 'large-view-header-container' : 'header-container'}>\n              <div class=\"header-top\">\n                <div class=\"header-left-container\">\n                  {this.showTrek ? (\n                    <button onClick={() => this.handleBackButton()} class=\"arrow-back-icon\">\n                      <span class=\"material-symbols-outlined\">arrow_back</span>\n                    </button>\n                  ) : (\n                    <div class=\"attribution-container\">\n                      <a target=\"_blank\" href={this.linkTarget}>\n                        {this.linkName}\n                      </a>\n                    </div>\n                  )}\n                </div>\n                <div class=\"header-right-container\">\n                  <span class=\"material-symbols-outlined margin-right-icon\">translate</span>\n                  {state.languages.length > 1 && <grw-select-language></grw-select-language>}\n                </div>\n              </div>\n              {!this.showTrek && (\n                <div class=\"handle-filters-container\">\n                  {state.treksWithinBounds && (\n                    <div class=\"current-treks-within-bounds-length\">{`${state.treksWithinBounds.length} ${\n                      state.treksWithinBounds.length > 1 ? translate[state.language].treks : translate[state.language].trek\n                    }`}</div>\n                  )}\n                  <button onClick={() => this.handleFilters()} class=\"handle-filters-button\">\n                    <span class=\"material-symbols-outlined margin-right-icon\">filter_list</span>\n                    {translate[state.language].filter}\n                  </button>\n                </div>\n              )}\n            </div>\n\n            <div class={`content-container ${this.showTrek ? 'content-trek' : 'content-treks'}`}>\n              <div\n                class={this.isLargeView ? 'large-view-app-treks-list-container' : 'app-treks-list-container'}\n                style={{ display: this.showTrek ? 'none' : 'flex', position: this.showTrek ? 'absolute' : 'relative' }}\n              >\n                <grw-treks-list\n                  reset-store-on-disconnected=\"false\"\n                  is-large-view={this.isLargeView}\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                ></grw-treks-list>\n              </div>\n              {this.showTrek && !state.currentTrek && (\n                <div class={this.isLargeView ? 'large-view-loader-container' : 'loader-container'}>\n                  <span class=\"loader\"></span>\n                </div>\n              )}\n              {state.currentTrek && (\n                <div class={this.isLargeView ? 'large-view-app-trek-detail-container' : 'app-trek-detail-container'}>\n                  <grw-trek-detail\n                    reset-store-on-disconnected=\"false\"\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                    weather={this.weather}\n                    style={{ zIndex: this.showTrekMap ? '0' : '1' }}\n                    is-large-view={this.isLargeView}\n                  ></grw-trek-detail>\n                </div>\n              )}\n              <grw-map\n                reset-store-on-disconnected=\"false\"\n                class={this.isLargeView ? 'large-view-app-map-container' : 'app-map-container'}\n                style={{\n                  visibility: (this.showTreksMap && !this.showTrek) || (this.showTrekMap && this.showTrek) || this.isLargeView ? 'visible' : 'hidden',\n                  zIndex: this.showTrekMap ? '1' : '0',\n                }}\n                url-layer={this.urlLayer}\n                center={this.center}\n                zoom={this.zoom}\n                attribution={this.attribution}\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-background={this.colorBackground}\n                color-trek-line={this.colorTrekLine}\n                color-departure-icon={this.colorDepartureIcon}\n                color-arrival-icon={this.colorArrivalIcon}\n                color-sensitive-area={this.colorSensitiveArea}\n                color-poi-icon={this.colorPoiIcon}\n                is-large-view={this.isLargeView}\n              ></grw-map>\n            </div>\n            {(!this.showTrek || (this.showTrek && state.currentTrek)) && (\n              <div class=\"map-visibility-button-container\">\n                <button onClick={() => this.handleShowMap()} class=\"map-visibility-button\" style={{ display: this.isLargeView ? 'none' : 'flex' }}>\n                  <span class=\"material-symbols-outlined\">{this.showTrek ? (this.showTrekMap ? 'summarize' : 'map') : this.showTreksMap ? 'list' : 'map'}</span>\n                  {this.showTrek\n                    ? this.showTrekMap\n                      ? translate[state.language].showDetails\n                      : translate[state.language].showRoute\n                    : this.showTreksMap\n                    ? translate[state.language].showList\n                    : translate[state.language].showMap}\n                </button>\n              </div>\n            )}\n          </div>\n        )}\n        {!this.showTrek && this.showFilters && (\n          <div class=\"options-container\">\n            <div class=\"filters-container\">\n              <grw-filter filterName={translate[state.language].practice} filterType=\"practices\" filterNameProperty=\"name\"></grw-filter>\n              <div class=\"divider\"></div>\n              <grw-filter filterName={translate[state.language].difficulty} filterType=\"difficulties\" filterNameProperty=\"label\"></grw-filter>\n              <div class=\"divider\"></div>\n              <grw-filter filterName={translate[state.language].duration} filterType=\"durations\" filterNameProperty=\"name\"></grw-filter>\n            </div>\n            <div onClick={() => this.handleFilters()} class=\"back-filters-container\"></div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/grw-filter/grw-filter.css

@@ -1,29 +1,62 @@
+@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");
+.material-symbols-outlined {
+  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48;
+}
+
+:host {
+  font-family: roboto;
+}
+
 .filter-name {
   margin-left: 8px;
-  color: var(--color-primary);
+  color: var(--color-on-surface);
+  line-height: 32px;
+  letter-spacing: 0px;
   font-size: 24px;
-  font-weight: bold;
+  font-weight: 400;
 }
 
 .filter-button-container {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
+  margin-right: 16px;
 }
 .filter-button-container .filter-button,
 .filter-button-container .selected-filter-button {
-  user-select: none;
   cursor: pointer;
-  border: 1px var(--color-primary) solid;
-  border-radius: 8px;
+  user-select: none;
+  font-size: 14px;
+  font-weight: 500;
   margin: 8px 0px 0px 8px;
-  padding: 8px;
+  padding: 8px 16px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: var(--elevation-1);
+  border: 1px solid var(--color-outline);
+  border-radius: 8px;
+  -webkit-tap-highlight-color: transparent;
+  line-height: 20px;
+  transition: box-shadow 0.2s ease-in-out 0s;
+  min-width: 100px;
+  white-space: nowrap;
+}
+.filter-button-container .filter-button:hover,
+.filter-button-container .selected-filter-button:hover {
+  box-shadow: var(--elevation-2);
 }
 .filter-button-container .filter-button {
-  color: var(--color-primary);
-  background-color: #ffffff;
+  color: var(--color-on-surface-variant);
+  background-color: transparent;
 }
 .filter-button-container .selected-filter-button {
-  color: #ffffff;
-  background-color: var(--color-primary);
+  color: var(--color-on-secondary-container);
+  background-color: var(--color-secondary-container);
+}
+.filter-button-container .selected-filter-button span {
+  margin-right: 8px;
+  font-size: 18px;
+  color: var(--color-on-secondary-container);
 }

package/dist/collection/components/grw-filter/grw-filter.js

@@ -66,7 +66,7 @@ export class GrwFilter {
     state.currentTreks = isUsingFilter ? filtersTreks : state.treks;
   }
   render() {
-    return (h(Host, null, h("div", { class: "filter-name" }, this.filterName), h("div", { class: "filter-button-container" }, state[this.filterType].map(currentFilter => (h("div", { onClick: event => this.handleFilter(event, currentFilter), class: currentFilter.selected ? 'selected-filter-button' : 'filter-button' }, currentFilter[this.filterNameProperty]))))));
+    return (h(Host, null, h("div", { class: "filter-name display-large" }, this.filterName), h("div", { class: "filter-button-container" }, state[this.filterType].map(currentFilter => (h("button", { onClick: event => this.handleFilter(event, currentFilter), class: currentFilter.selected ? 'selected-filter-button' : 'filter-button' }, currentFilter.selected && h("span", { class: "material-symbols-outlined" }, "check"), currentFilter[this.filterNameProperty]))))));
   }
   static get is() { return "grw-filter"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/grw-filter/grw-filter.js.map

@@ -1 +1 @@
-{"version":3,"file":"grw-filter.js","sourceRoot":"","sources":["../../../src/components/grw-filter/grw-filter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACzD,OAAO,KAAK,MAAM,aAAa,CAAC;AAQhC,MAAM,OAAO,SAAS;;IAIpB,YAAO,GAAY;MACjB,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,IAAI,EAAE,SAAS,EAAE;MACpE,EAAE,QAAQ,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,EAAE,IAAI,EAAE,SAAS,EAAE;MACzE,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE;KACtE,CAAC;;;;;EAEF,YAAY,CAAC,MAAkB,EAAE,cAAmB;IAClD,MAAM,eAAe,GAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;IACpD,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,KAAK,cAAc,CAAC,EAAE,CAAC,CAAC,QAAQ,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,KAAK,cAAc,CAAC,EAAE,CAAC;OACpK,QAAQ,CAAC;IACZ,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,GAAG,eAAe,CAAC;IACzC,IAAI,aAAa,GAAG,KAAK,CAAC;IAC1B,IAAI,YAAY,GAAG,EAAE,CAAC;IACtB,KAAK,MAAM,MAAM,IAAI,IAAI,CAAC,OAAO,EAAE;MACjC,MAAM,gBAAgB,GAAa,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;MACjJ,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;QAC/B,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;UAC3B,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,EAAE;YAC7B,YAAY,GAAG,CAAC,GAAG,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC;WACvG;eAAM,IAAI,MAAM,CAAC,IAAI,KAAK,UAAU,EAAE;YACrC,YAAY,GAAG;cACb,GAAG,YAAY,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;gBAC5B,KAAK,MAAM,eAAe,IAAI,gBAAgB,EAAE;kBAC9C,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,eAAe,CAAC,CAAC;kBAC/F,IAAI,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,aAAa,CAAC,QAAQ,IAAI,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,aAAa,CAAC,QAAQ,EAAE;oBAC9G,OAAO,IAAI,CAAC;mBACb;iBACF;gBACD,OAAO,KAAK,CAAC;cACf,CAAC,CAAC;aACH,CAAC;WACH;SACF;aAAM;UACL,IAAI,CAAC,aAAa,EAAE;YAClB,aAAa,GAAG,IAAI,CAAC;WACtB;UACD,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,EAAE;YAC7B,YAAY,GAAG,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC;WACtG;eAAM,IAAI,MAAM,CAAC,IAAI,KAAK,UAAU,EAAE;YACrC,IAAI,QAAgB,CAAC;YACrB,IAAI,QAAgB,CAAC;YACrB,KAAK,MAAM,eAAe,IAAI,gBAAgB,EAAE;cAC9C,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,eAAe,CAAC,CAAC;cAC/F,IAAI,KAAK,CAAC,QAAQ,CAAC,IAAI,aAAa,CAAC,QAAQ,GAAG,QAAQ,EAAE;gBACxD,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC;eACnC;cACD,IAAI,KAAK,CAAC,QAAQ,CAAC,IAAI,aAAa,CAAC,QAAQ,GAAG,QAAQ,EAAE;gBACxD,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC;eACnC;aACF;YACD,YAAY,GAAG,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,QAAQ,IAAI,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,IAAI,QAAQ,CAAC,CAAC,CAAC;WAChI;SACF;OACF;KACF;IACD,KAAK,CAAC,YAAY,GAAG,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC;EAClE,CAAC;EAED,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACH,WAAK,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,UAAU,CAAO;MAChD,WAAK,KAAK,EAAC,yBAAyB,IACjC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,aAAa,CAAC,EAAE,CAAC,CAC3C,WAAK,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,aAAa,CAAC,EAAE,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,eAAe,IACvI,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,CACnC,CACP,CAAC,CACE,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\nimport state from 'store/store';\nimport { Filters } from 'types/types';\n\n@Component({\n  tag: 'grw-filter',\n  styleUrl: 'grw-filter.scss',\n  shadow: true,\n})\nexport class GrwFilter {\n  @Prop() filterType: string;\n  @Prop() filterName: string;\n  @Prop() filterNameProperty: string;\n  filters: Filters = [\n    { property: 'practices', trekProperty: 'practice', type: 'include' },\n    { property: 'difficulties', trekProperty: 'difficulty', type: 'include' },\n    { property: 'durations', trekProperty: 'duration', type: 'interval' },\n  ];\n\n  handleFilter(_event: MouseEvent, filterToHandle: any) {\n    const filterFromState = [...state[this.filterType]];\n    filterFromState.find(currentFilter => currentFilter.id === filterToHandle.id).selected = !filterFromState.find(currentFilter => currentFilter.id === filterToHandle.id)\n      .selected;\n    state[this.filterType] = filterFromState;\n    let isUsingFilter = false;\n    let filtersTreks = [];\n    for (const filter of this.filters) {\n      const currentFiltersId: number[] = state[filter.property].filter(currentFilter => currentFilter.selected).map(currentFilter => currentFilter.id);\n      if (currentFiltersId.length > 0) {\n        if (filtersTreks.length > 0) {\n          if (filter.type === 'include') {\n            filtersTreks = [...filtersTreks.filter(trek => currentFiltersId.includes(trek[filter.trekProperty]))];\n          } else if (filter.type === 'interval') {\n            filtersTreks = [\n              ...filtersTreks.filter(trek => {\n                for (const currentFilterId of currentFiltersId) {\n                  const currentFilter = state[filter.property].find(property => property.id === currentFilterId);\n                  if (trek[filter.trekProperty] >= currentFilter.minValue && trek[filter.trekProperty] <= currentFilter.maxValue) {\n                    return true;\n                  }\n                }\n                return false;\n              }),\n            ];\n          }\n        } else {\n          if (!isUsingFilter) {\n            isUsingFilter = true;\n          }\n          if (filter.type === 'include') {\n            filtersTreks = [...state.treks.filter(trek => currentFiltersId.includes(trek[filter.trekProperty]))];\n          } else if (filter.type === 'interval') {\n            let minValue: number;\n            let maxValue: number;\n            for (const currentFilterId of currentFiltersId) {\n              const currentFilter = state[filter.property].find(property => property.id === currentFilterId);\n              if (isNaN(minValue) || currentFilter.minValue < minValue) {\n                minValue = currentFilter.minValue;\n              }\n              if (isNaN(maxValue) || currentFilter.maxValue > maxValue) {\n                maxValue = currentFilter.maxValue;\n              }\n            }\n            filtersTreks = [...state.treks.filter(trek => trek[filter.trekProperty] >= minValue && trek[filter.trekProperty] <= maxValue)];\n          }\n        }\n      }\n    }\n    state.currentTreks = isUsingFilter ? filtersTreks : state.treks;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"filter-name\">{this.filterName}</div>\n        <div class=\"filter-button-container\">\n          {state[this.filterType].map(currentFilter => (\n            <div onClick={event => this.handleFilter(event, currentFilter)} class={currentFilter.selected ? 'selected-filter-button' : 'filter-button'}>\n              {currentFilter[this.filterNameProperty]}\n            </div>\n          ))}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"grw-filter.js","sourceRoot":"","sources":["../../../src/components/grw-filter/grw-filter.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop } from '@stencil/core';\nimport state from 'store/store';\nimport { Filters } from 'types/types';\n\n@Component({\n  tag: 'grw-filter',\n  styleUrl: 'grw-filter.scss',\n  shadow: true,\n})\nexport class GrwFilter {\n  @Prop() filterType: string;\n  @Prop() filterName: string;\n  @Prop() filterNameProperty: string;\n  filters: Filters = [\n    { property: 'practices', trekProperty: 'practice', type: 'include' },\n    { property: 'difficulties', trekProperty: 'difficulty', type: 'include' },\n    { property: 'durations', trekProperty: 'duration', type: 'interval' },\n  ];\n\n  handleFilter(_event: MouseEvent, filterToHandle: any) {\n    const filterFromState = [...state[this.filterType]];\n    filterFromState.find(currentFilter => currentFilter.id === filterToHandle.id).selected = !filterFromState.find(currentFilter => currentFilter.id === filterToHandle.id)\n      .selected;\n    state[this.filterType] = filterFromState;\n    let isUsingFilter = false;\n    let filtersTreks = [];\n    for (const filter of this.filters) {\n      const currentFiltersId: number[] = state[filter.property].filter(currentFilter => currentFilter.selected).map(currentFilter => currentFilter.id);\n      if (currentFiltersId.length > 0) {\n        if (filtersTreks.length > 0) {\n          if (filter.type === 'include') {\n            filtersTreks = [...filtersTreks.filter(trek => currentFiltersId.includes(trek[filter.trekProperty]))];\n          } else if (filter.type === 'interval') {\n            filtersTreks = [\n              ...filtersTreks.filter(trek => {\n                for (const currentFilterId of currentFiltersId) {\n                  const currentFilter = state[filter.property].find(property => property.id === currentFilterId);\n                  if (trek[filter.trekProperty] >= currentFilter.minValue && trek[filter.trekProperty] <= currentFilter.maxValue) {\n                    return true;\n                  }\n                }\n                return false;\n              }),\n            ];\n          }\n        } else {\n          if (!isUsingFilter) {\n            isUsingFilter = true;\n          }\n          if (filter.type === 'include') {\n            filtersTreks = [...state.treks.filter(trek => currentFiltersId.includes(trek[filter.trekProperty]))];\n          } else if (filter.type === 'interval') {\n            let minValue: number;\n            let maxValue: number;\n            for (const currentFilterId of currentFiltersId) {\n              const currentFilter = state[filter.property].find(property => property.id === currentFilterId);\n              if (isNaN(minValue) || currentFilter.minValue < minValue) {\n                minValue = currentFilter.minValue;\n              }\n              if (isNaN(maxValue) || currentFilter.maxValue > maxValue) {\n                maxValue = currentFilter.maxValue;\n              }\n            }\n            filtersTreks = [...state.treks.filter(trek => trek[filter.trekProperty] >= minValue && trek[filter.trekProperty] <= maxValue)];\n          }\n        }\n      }\n    }\n    state.currentTreks = isUsingFilter ? filtersTreks : state.treks;\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"filter-name display-large\">{this.filterName}</div>\n        <div class=\"filter-button-container\">\n          {state[this.filterType].map(currentFilter => (\n            <button onClick={event => this.handleFilter(event, currentFilter)} class={currentFilter.selected ? 'selected-filter-button' : 'filter-button'}>\n              {currentFilter.selected && <span class=\"material-symbols-outlined\">check</span>}\n              {currentFilter[this.filterNameProperty]}\n            </button>\n          ))}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/grw-information-desk-detail/grw-information-desk-detail.css

@@ -1,31 +1,101 @@
+@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");
+.material-symbols-outlined {
+  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48;
+}
+
 :host {
   display: flex;
   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);
+  color: var(--color-primary-app);
 }
 
 .information-desk-img {
-  width: 180px;
+  position: relative;
 }
 .information-desk-img img {
-  width: 180px;
-  border-radius: 8px;
+  width: 100%;
+  height: 100%;
+  max-height: 200px;
+  object-fit: cover;
 }
 
 .information-desk-sub-container {
   display: flex;
   flex-direction: column;
+  padding: 12px;
 }
 
 .information-desk-name {
-  color: var(--color-primary);
-  font-size: 24px;
-  font-weight: bold;
-  padding: 12px 0px;
+  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: flex;
+  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;
+  box-shadow: var(--elevation-1);
+  height: 32px;
+  gap: 8px;
+  box-sizing: border-box;
+  text-align: start;
+  vertical-align: middle;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  border: none;
+  font-size: 14px;
+  margin: 12px 0px;
+}
+.center-on-map-button:hover {
+  box-shadow: var(--elevation-2);
+}
+.center-on-map-button span {
+  font-size: 18px;
 }

package/dist/collection/components/grw-information-desk-detail/grw-information-desk-detail.js

@@ -1,12 +1,17 @@
 import { Host, h } from '@stencil/core';
 export class GrwInformationDeskDetail {
   constructor() {
+    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'))))));
   }
   static get is() { return "grw-information-desk-detail"; }
   static get encapsulation() { return "shadow"; }
@@ -27,7 +32,7 @@ export class GrwInformationDeskDetail {
         "mutable": false,
         "complexType": {
           "original": "InformationDesk",
-          "resolved": "{ id: number; name: string; description: string; type: InformationDeskType; phone: string; email: string; website: string; municipality: string; postal_code: string; street: string; photo_url: string; latitude: string; longitude: string; }",
+          "resolved": "{ id: number; name: string; description: string; type: InformationDeskType; phone: string; email: string; website: string; municipality: string; postal_code: string; street: string; photo_url: string; latitude: number; longitude: number; }",
           "references": {
             "InformationDesk": {
               "location": "import",
@@ -44,5 +49,28 @@ export class GrwInformationDeskDetail {
       }
     };
   }
+  static get states() {
+    return {
+      "displayShortDescription": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "centerOnMap",
+        "name": "centerOnMap",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "{ latitude: number; longitude: number }",
+          "resolved": "{ latitude: number; longitude: number; }",
+          "references": {}
+        }
+      }];
+  }
 }
 //# sourceMappingURL=grw-information-desk-detail.js.map

package/dist/collection/components/grw-information-desk-detail/grw-information-desk-detail.js.map

@@ -1 +1 @@
-{"version":3,"file":"grw-information-desk-detail.js","sourceRoot":"","sources":["../../../src/components/grw-information-desk-detail/grw-information-desk-detail.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAQzD,MAAM,OAAO,wBAAwB;;;;EAGnC,MAAM;IACJ,OAAO,CACL,EAAC,IAAI;MACF,IAAI,CAAC,eAAe,CAAC,SAAS,IAAI,CACjC,WAAK,KAAK,EAAC,sBAAsB;QAC/B,WAAK,GAAG,EAAE,IAAI,CAAC,eAAe,CAAC,SAAS,EAAE,OAAO,EAAC,MAAM,GAAG,CACvD,CACP;MACD,WAAK,KAAK,EAAC,gCAAgC;QACxC,IAAI,CAAC,eAAe,CAAC,IAAI,IAAI,WAAK,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAO;QACjG,IAAI,CAAC,eAAe,CAAC,WAAW,IAAI,WAAK,KAAK,EAAC,8BAA8B,EAAC,SAAS,EAAE,IAAI,CAAC,eAAe,CAAC,WAAW,GAAQ;QACjI,IAAI,CAAC,eAAe,CAAC,WAAW;UAC/B,IAAI,CAAC,eAAe,CAAC,YAAY;UACjC,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,IAAI,CAC9B;YACG,IAAI,CAAC,eAAe,CAAC,WAAW;YAChC,IAAI,IAAI,CAAC,eAAe,CAAC,YAAY,EAAE;YACvC,IAAI,IAAI,CAAC,eAAe,CAAC,MAAM,EAAE,CAC9B,CACP,CAAC;QACH,IAAI,CAAC,eAAe,CAAC,KAAK,IAAI,CAC7B;UACE,SAAG,IAAI,EAAE,OAAO,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,IAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAK,CAC1E,CACP;QACA,IAAI,CAAC,eAAe,CAAC,KAAK,IAAI,CAC7B;UACE,SAAG,IAAI,EAAE,UAAU,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,IAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAK,CAC7E,CACP;QACA,IAAI,CAAC,eAAe,CAAC,OAAO,IAAI,CAC/B;UACE,SAAG,IAAI,EAAE,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,IAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAK,CAC1E,CACP,CACG,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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"]}
+{"version":3,"file":"grw-information-desk-detail.js","sourceRoot":"","sources":["../../../src/components/grw-information-desk-detail/grw-information-desk-detail.tsx"],"names":[],"mappings":"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","sourcesContent":["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"]}