@geotrekce/geotrek-rando-widget 0.0.7 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/dist/cjs/geotrek-rando-widget.cjs.js +2 -2
  2. package/dist/cjs/grw-app.cjs.entry.js +14 -5
  3. package/dist/cjs/grw-filter_6.cjs.entry.js +70 -44
  4. package/dist/cjs/grw-information-desk-detail_3.cjs.entry.js +2 -2
  5. package/dist/cjs/grw-trek-card.cjs.entry.js +3 -3
  6. package/dist/cjs/{index-c2c4531d.js → index-4c76daa3.js} +8 -3
  7. package/dist/cjs/loader.cjs.js +2 -2
  8. package/dist/cjs/{store-fd04a216.js → store-b4c3c507.js} +6 -4
  9. package/dist/collection/components/grw-app/grw-app.css +17 -11
  10. package/dist/collection/components/grw-app/grw-app.js +21 -9
  11. package/dist/collection/components/grw-filter/grw-filter.js +11 -12
  12. package/dist/collection/components/grw-map/grw-map.js +22 -15
  13. package/dist/collection/components/grw-trek-card/grw-trek-card.js +1 -1
  14. package/dist/collection/components/grw-trek-detail/grw-trek-detail.js +4 -2
  15. package/dist/collection/components/grw-treks-list/grw-treks-list.css +0 -12
  16. package/dist/collection/components/grw-treks-list/grw-treks-list.js +16 -9
  17. package/dist/collection/store/grw-trek-provider.js +8 -2
  18. package/dist/collection/store/grw-treks-provider.js +6 -3
  19. package/dist/collection/store/store.js +5 -3
  20. package/dist/components/grw-app.js +14 -5
  21. package/dist/components/grw-filter2.js +11 -12
  22. package/dist/components/grw-map2.js +22 -15
  23. package/dist/components/grw-trek-card2.js +1 -1
  24. package/dist/components/grw-trek-detail2.js +4 -2
  25. package/dist/components/grw-trek-provider2.js +8 -2
  26. package/dist/components/grw-treks-list2.js +18 -9
  27. package/dist/components/grw-treks-provider2.js +6 -3
  28. package/dist/components/store.js +5 -3
  29. package/dist/esm/geotrek-rando-widget.js +2 -2
  30. package/dist/esm/grw-app.entry.js +14 -5
  31. package/dist/esm/grw-filter_6.entry.js +70 -44
  32. package/dist/esm/grw-information-desk-detail_3.entry.js +2 -2
  33. package/dist/esm/grw-trek-card.entry.js +3 -3
  34. package/dist/esm/{index-192d910f.js → index-ee473772.js} +8 -3
  35. package/dist/esm/loader.js +2 -2
  36. package/dist/esm/{store-b2c76c0c.js → store-a5f523fd.js} +6 -4
  37. package/dist/geotrek-rando-widget/geotrek-rando-widget.esm.js +1 -1
  38. package/dist/geotrek-rando-widget/{p-7715153d.entry.js → p-0510e16b.entry.js} +1 -1
  39. package/dist/geotrek-rando-widget/p-22562f4d.js +1 -0
  40. package/dist/geotrek-rando-widget/{p-1b2ba86d.entry.js → p-500436f1.entry.js} +1 -1
  41. package/dist/geotrek-rando-widget/p-94f0db4d.entry.js +1 -0
  42. package/dist/geotrek-rando-widget/p-9a25f817.entry.js +1 -0
  43. package/dist/geotrek-rando-widget/p-b62909db.js +2 -0
  44. package/dist/types/components/grw-app/grw-app.d.ts +2 -2
  45. package/dist/types/components/grw-filter/grw-filter.d.ts +1 -1
  46. package/dist/types/components/grw-map/grw-map.d.ts +1 -1
  47. package/dist/types/components/grw-trek-card/grw-trek-card.d.ts +1 -1
  48. package/dist/types/components/grw-trek-detail/grw-trek-detail.d.ts +1 -1
  49. package/dist/types/components/grw-treks-list/grw-treks-list.d.ts +3 -2
  50. package/dist/types/components.d.ts +2 -2
  51. package/dist/types/store/grw-trek-provider.d.ts +2 -1
  52. package/dist/types/store/grw-treks-provider.d.ts +1 -1
  53. package/dist/types/store/store.d.ts +4 -0
  54. package/package.json +1 -1
  55. package/readme.md +4 -0
  56. package/dist/geotrek-rando-widget/p-4361afd2.entry.js +0 -1
  57. package/dist/geotrek-rando-widget/p-5f17d340.entry.js +0 -1
  58. package/dist/geotrek-rando-widget/p-6dce5e6c.js +0 -2
  59. package/dist/geotrek-rando-widget/p-e6710c64.js +0 -1
package/dist/components/grw-trek-detail2.js CHANGED
@@ -16,7 +16,7 @@ const GrwTrekDetail = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
16
16
  this.colorPrimaryShade = '#4a0021';
17
17
  this.colorPrimaryTint = '#974c6e';
18
18
  }
19
- componentWillLoad() {
19
+ connectedCallback() {
20
20
  this.currentTrek = this.trek ? this.trek : state.currentTrek;
21
21
  if (this.currentTrek) {
22
22
  this.difficulty = state.difficulties.find(difficulty => difficulty.id === this.currentTrek.difficulty);
@@ -51,7 +51,9 @@ const GrwTrekDetail = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
51
51
  return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-shade': this.colorPrimaryShade, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: "trek-detail-container" }, h("div", { class: "name" }, this.currentTrek.name), this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: this.currentTrek.attachments[0].thumbnail, loading: "lazy" })), h("div", { class: "sub-container" }, 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 :
52
52
  _b.label), h("div", { class: "icon-label duration" }, h("div", { class: "svg-icon", innerHTML: durationImage }), 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 :
53
53
  _e.route)), h("div", { class: "row" }, h("div", { class: "icon-label length" }, h("div", { class: "svg-icon", innerHTML: lengthImage }), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("div", { class: "svg-icon", innerHTML: ascentImage }), 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 :
54
- _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), 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 }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && 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", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
54
+ _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), 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 }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: this.currentTrek.altimetric_profile.endsWith('.json')
55
+ ? this.currentTrek.altimetric_profile.replace('.json', '.svg')
56
+ : `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && 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", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
55
57
  (this.accessibilities && this.accessibilities.length > 0) ||
56
58
  this.currentTrek.accessibility_level ||
57
59
  this.currentTrek.accessibility_slope ||
package/dist/components/grw-trek-provider2.js CHANGED
@@ -7,17 +7,18 @@ const GrwTrekProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
7
7
  this.__registerHost();
8
8
  this.__attachShadow();
9
9
  this.language = 'fr';
10
+ this.trekNetworkError = false;
10
11
  this.controller = new AbortController();
11
12
  this.signal = this.controller.signal;
12
13
  }
13
- componentWillLoad() {
14
+ connectedCallback() {
14
15
  state.api = this.api;
15
16
  const requests = [];
16
17
  requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
17
18
  requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }) : new Response('null'));
18
19
  requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }) : new Response('null'));
19
20
  requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
20
- return Promise.all([
21
+ Promise.all([
21
22
  ...requests,
22
23
  fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`, {
23
24
  signal: this.signal,
@@ -32,6 +33,7 @@ const GrwTrekProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
32
33
  ])
33
34
  .then(responses => Promise.all(responses.map(response => response.json())))
34
35
  .then(([difficulties, routes, practices, themes, sensitiveAreas, labels, sources, accessibilities, accessibilitiesLevel, pois, informationDesks, trek]) => {
36
+ state.trekNetworkError = false;
35
37
  if (difficulties) {
36
38
  state.difficulties = difficulties.results;
37
39
  }
@@ -56,11 +58,15 @@ const GrwTrekProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
56
58
  state.currentPois = pois.results;
57
59
  state.currentInformationDesks = informationDesks.results;
58
60
  state.currentTrek = trek;
61
+ })
62
+ .catch(() => {
63
+ state.trekNetworkError = true;
59
64
  });
60
65
  }
61
66
  disconnectedCallback() {
62
67
  this.controller.abort();
63
68
  state.currentTrek = null;
69
+ state.trekNetworkError = false;
64
70
  }
65
71
  render() {
66
72
  return h(Host, null);
package/dist/components/grw-treks-list2.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
- import { o as onChange, s as state } from './store.js';
2
+ import { s as state, o as onChange } from './store.js';
3
3
  import { d as defineCustomElement$1 } from './grw-trek-card2.js';
4
4
 
5
- const grwTreksListCss = ":host{font-family:\"Roboto\";width:100%;height:100%;max-height:100vh;overflow-y:auto}.current-treks-length{width:100%;text-align:center;padding:32px 0px;color:var(--color-primary);font-size:24px;font-weight:bold}.current-treks-container{display:flex;flex-wrap:wrap;justify-content:space-around}grw-trek-card{margin:6px}";
5
+ const grwTreksListCss = ":host{font-family:\"Roboto\";width:100%;height:100%;max-height:100vh;overflow-y:auto;display:flex;flex-wrap:wrap;justify-content:space-around}grw-trek-card{margin:6px}";
6
6
 
7
7
  const GrwTreksList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
8
8
  constructor() {
@@ -13,19 +13,25 @@ const GrwTreksList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
13
13
  this.colorPrimary = '#6b0030';
14
14
  this.colorPrimaryTint = '#974c6e';
15
15
  this.isLargeView = false;
16
- this.handleInfiniteScrollBind = this.handleInfiniteScroll.bind(this);
17
16
  this.step = 10;
17
+ this.handleInfiniteScrollBind = this.handleInfiniteScroll.bind(this);
18
18
  }
19
- componentWillLoad() {
19
+ connectedCallback() {
20
+ this.element.addEventListener('scroll', this.handleInfiniteScrollBind);
21
+ if (state.currentTreks) {
22
+ this.treksToDisplay = [...state.currentTreks.slice(0, this.step)];
23
+ }
20
24
  onChange('currentTreks', () => {
21
- this.element.addEventListener('scroll', this.handleInfiniteScrollBind);
22
25
  this.element.scroll({ top: 0 });
23
- this.treksToDisplay = [...state.currentTreks.slice(0, this.step)];
26
+ if (state.currentTreks) {
27
+ this.treksToDisplay = [...state.currentTreks.slice(0, this.step)];
28
+ }
24
29
  });
25
30
  onChange('treksWithinBounds', () => {
26
- this.element.addEventListener('scroll', this.handleInfiniteScrollBind);
27
31
  this.element.scroll({ top: 0 });
28
- this.treksToDisplay = [...state.treksWithinBounds.slice(0, this.step)];
32
+ if (state.treksWithinBounds) {
33
+ this.treksToDisplay = [...state.treksWithinBounds.slice(0, this.step)];
34
+ }
29
35
  });
30
36
  }
31
37
  handleInfiniteScroll(event) {
@@ -38,8 +44,11 @@ const GrwTreksList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
38
44
  }
39
45
  }
40
46
  }
47
+ disconnectedCallback() {
48
+ this.element.removeEventListener('scroll', this.handleInfiniteScrollBind);
49
+ }
41
50
  render() {
42
- return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, h("div", { class: "current-treks-length" }, `${state.treksWithinBounds.length} résultat${state.treksWithinBounds.length > 1 ? 's' : ''}`), h("div", { class: "current-treks-container" }, this.treksToDisplay.map(trek => (h("grw-trek-card", { key: `trek-${trek.id}`, trek: trek, "is-large-view": this.isLargeView, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint }))))));
51
+ return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, this.treksToDisplay.map(trek => (h("grw-trek-card", { key: `trek-${trek.id}`, trek: trek, "is-large-view": this.isLargeView, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint })))));
43
52
  }
44
53
  get element() { return this; }
45
54
  static get style() { return grwTreksListCss; }
package/dist/components/grw-treks-provider2.js CHANGED
@@ -10,7 +10,7 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
10
10
  this.controller = new AbortController();
11
11
  this.signal = this.controller.signal;
12
12
  }
13
- componentWillLoad() {
13
+ connectedCallback() {
14
14
  state.api = this.api;
15
15
  let treksRequest = `${this.api}trek/?language=${this.language}&published=true`;
16
16
  this.inBbox && (treksRequest += `&in_bbox=${this.inBbox}`);
@@ -22,7 +22,7 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
22
22
  this.routes && (treksRequest += `&routes=${this.routes}`);
23
23
  this.practices && (treksRequest += `&practices=${this.practices}`);
24
24
  treksRequest += `&fields=id,name,attachments,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,departure,departure_geom&page_size=999`;
25
- return Promise.all([
25
+ Promise.all([
26
26
  fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
27
27
  fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }),
28
28
  fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
@@ -31,6 +31,7 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
31
31
  ])
32
32
  .then(responses => Promise.all(responses.map(response => response.json())))
33
33
  .then(([difficulties, routes, practices, themes, treks]) => {
34
+ state.treksNetworkError = false;
34
35
  state.difficulties = difficulties.results;
35
36
  state.routes = routes.results;
36
37
  state.practices = practices.results.map(practice => (Object.assign(Object.assign({}, practice), { selected: false })));
@@ -44,10 +45,12 @@ const GrwTreksProvider = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
44
45
  state.treks = treks.results;
45
46
  state.currentTreks = treks.results;
46
47
  state.treksWithinBounds = treks.results;
47
- });
48
+ })
49
+ .catch(() => (state.treksNetworkError = true));
48
50
  }
49
51
  disconnectedCallback() {
50
52
  this.controller.abort();
53
+ state.treksNetworkError = false;
51
54
  }
52
55
  render() {
53
56
  return h(Host, null);
package/dist/components/store.js CHANGED
@@ -186,9 +186,9 @@ const createStore = (defaultState, shouldUpdate) => {
186
186
 
187
187
  const { state, onChange } = createStore({
188
188
  api: '',
189
- treks: [],
190
- currentTreks: [],
191
- treksWithinBounds: [],
189
+ treks: null,
190
+ currentTreks: null,
191
+ treksWithinBounds: null,
192
192
  currentMapTreksBounds: null,
193
193
  difficulties: [],
194
194
  routes: [],
@@ -203,6 +203,8 @@ const { state, onChange } = createStore({
203
203
  currentTrek: null,
204
204
  currentPois: null,
205
205
  currentInformationDesks: null,
206
+ treksNetworkError: false,
207
+ trekNetworkError: false,
206
208
  });
207
209
 
208
210
  export { onChange as o, state as s };
package/dist/esm/geotrek-rando-widget.js CHANGED
@@ -1,4 +1,4 @@
1
- import { p as promiseResolve, b as bootstrapLazy } from './index-192d910f.js';
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-ee473772.js';
2
2
 
3
3
  /*
4
4
  Stencil Client Patch Browser v2.16.1 | MIT Licensed | https://stenciljs.com
@@ -13,5 +13,5 @@ const patchBrowser = () => {
13
13
  };
14
14
 
15
15
  patchBrowser().then(options => {
16
- return bootstrapLazy([["grw-trek-card",[[1,"grw-trek-card",{"trek":[16],"colorPrimary":[1,"color-primary"],"colorPrimaryTint":[1,"color-primary-tint"],"isLargeView":[4,"is-large-view"],"currentTrek":[32],"difficulty":[32],"route":[32],"practice":[32],"themes":[32]}]]],["grw-information-desk-detail_3",[[1,"grw-information-desk-detail",{"informationDesk":[16]}],[1,"grw-poi-detail",{"poi":[16]}],[1,"grw-sensitive-area-detail",{"sensitiveArea":[16]}]]],["grw-filter_6",[[1,"grw-trek-detail",{"trek":[16],"colorPrimary":[1,"color-primary"],"colorPrimaryShade":[1,"color-primary-shade"],"colorPrimaryTint":[1,"color-primary-tint"],"difficulty":[32],"route":[32],"practice":[32],"themes":[32],"labels":[32],"sources":[32],"accessibilities":[32],"accessibilityLevel":[32],"currentTrek":[32]}],[1,"grw-treks-list",{"colorPrimary":[1,"color-primary"],"colorPrimaryTint":[1,"color-primary-tint"],"isLargeView":[4,"is-large-view"],"treksToDisplay":[32]}],[1,"grw-filter",{"filterType":[1,"filter-type"],"filterName":[1,"filter-name"],"filterNameProperty":[1,"filter-name-property"]}],[0,"grw-map",{"urlLayer":[1,"url-layer"],"attribution":[1],"center":[1],"zoom":[2],"colorPrimary":[1,"color-primary"],"colorPrimaryTint":[1,"color-primary-tint"],"colorTrekLine":[1,"color-trek-line"],"colorDepartureIcon":[1,"color-departure-icon"],"colorArrivalIcon":[1,"color-arrival-icon"],"colorSensitiveArea":[1,"color-sensitive-area"],"colorPoiIcon":[1,"color-poi-icon"],"mapIsReady":[32]}],[1,"grw-trek-provider",{"language":[1],"api":[1],"trekId":[1,"trek-id"]}],[1,"grw-treks-provider",{"language":[1],"api":[1],"inBbox":[1,"in-bbox"],"cities":[1],"districts":[1],"structures":[1],"themes":[1],"portals":[1],"routes":[1],"practices":[1]}]]],["grw-app",[[1,"grw-app",{"api":[1],"language":[1],"inBbox":[1,"in-bbox"],"cities":[1],"districts":[1],"structures":[1],"themes":[1],"portals":[1],"routes":[1],"practices":[1],"urlLayer":[1,"url-layer"],"center":[1],"zoom":[8],"attribution":[1],"colorPrimary":[1,"color-primary"],"colorPrimaryShade":[1,"color-primary-shade"],"colorPrimaryTint":[1,"color-primary-tint"],"colorTrekLine":[1,"color-trek-line"],"colorDepartureIcon":[1,"color-departure-icon"],"colorArrivalIcon":[1,"color-arrival-icon"],"colorSensitiveArea":[1,"color-sensitive-area"],"colorPoiIcon":[1,"color-poi-icon"],"showTrek":[32],"showTreksMap":[32],"showTrekMap":[32],"showFilters":[32],"isLargeView":[32],"currentTrekId":[32]},[[0,"trekCardPress","onTrekCardPress"],[9,"resize","onWindowResize"]]]]]], options);
16
+ return bootstrapLazy([["grw-trek-card",[[1,"grw-trek-card",{"trek":[16],"colorPrimary":[1,"color-primary"],"colorPrimaryTint":[1,"color-primary-tint"],"isLargeView":[4,"is-large-view"],"currentTrek":[32],"difficulty":[32],"route":[32],"practice":[32],"themes":[32]}]]],["grw-information-desk-detail_3",[[1,"grw-information-desk-detail",{"informationDesk":[16]}],[1,"grw-poi-detail",{"poi":[16]}],[1,"grw-sensitive-area-detail",{"sensitiveArea":[16]}]]],["grw-filter_6",[[1,"grw-trek-detail",{"trek":[16],"colorPrimary":[1,"color-primary"],"colorPrimaryShade":[1,"color-primary-shade"],"colorPrimaryTint":[1,"color-primary-tint"],"difficulty":[32],"route":[32],"practice":[32],"themes":[32],"labels":[32],"sources":[32],"accessibilities":[32],"accessibilityLevel":[32],"currentTrek":[32]}],[1,"grw-treks-list",{"colorPrimary":[1,"color-primary"],"colorPrimaryTint":[1,"color-primary-tint"],"isLargeView":[4,"is-large-view"],"treksToDisplay":[32]}],[1,"grw-filter",{"filterType":[1,"filter-type"],"filterName":[1,"filter-name"],"filterNameProperty":[1,"filter-name-property"]}],[0,"grw-map",{"urlLayer":[1,"url-layer"],"attribution":[1],"center":[1],"zoom":[2],"colorPrimary":[1,"color-primary"],"colorPrimaryTint":[1,"color-primary-tint"],"colorTrekLine":[1,"color-trek-line"],"colorDepartureIcon":[1,"color-departure-icon"],"colorArrivalIcon":[1,"color-arrival-icon"],"colorSensitiveArea":[1,"color-sensitive-area"],"colorPoiIcon":[1,"color-poi-icon"],"mapIsReady":[32]}],[1,"grw-trek-provider",{"language":[1],"api":[1],"trekId":[1,"trek-id"]}],[1,"grw-treks-provider",{"language":[1],"api":[1],"inBbox":[1,"in-bbox"],"cities":[1],"districts":[1],"structures":[1],"themes":[1],"portals":[1],"routes":[1],"practices":[1]}]]],["grw-app",[[1,"grw-app",{"api":[1],"language":[1],"inBbox":[1,"in-bbox"],"cities":[1],"districts":[1],"structures":[1],"themes":[1],"portals":[1],"routes":[1],"practices":[1],"urlLayer":[1,"url-layer"],"center":[1],"zoom":[2],"attribution":[1],"colorPrimary":[1,"color-primary"],"colorPrimaryShade":[1,"color-primary-shade"],"colorPrimaryTint":[1,"color-primary-tint"],"colorTrekLine":[1,"color-trek-line"],"colorDepartureIcon":[1,"color-departure-icon"],"colorArrivalIcon":[1,"color-arrival-icon"],"colorSensitiveArea":[1,"color-sensitive-area"],"colorPoiIcon":[1,"color-poi-icon"],"showTrek":[32],"showTreksMap":[32],"showTrekMap":[32],"showFilters":[32],"isLargeView":[32],"currentTrekId":[32]},[[0,"trekCardPress","onTrekCardPress"],[9,"resize","onWindowResize"]]]]]], options);
17
17
  });
package/dist/esm/grw-app.entry.js CHANGED
@@ -1,9 +1,9 @@
1
- import { r as registerInstance, h, H as Host, g as getElement } from './index-192d910f.js';
2
- import { s as state } from './store-b2c76c0c.js';
1
+ import { r as registerInstance, h, H as Host, g as getElement } from './index-ee473772.js';
2
+ import { o as onChange, s as state } from './store-a5f523fd.js';
3
3
 
4
4
  const arrowBackImage = `<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><polyline points="244 400 100 256 244 112" style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round;stroke-width:48px"/><line x1="120" y1="256" x2="412" y2="256" style="fill:none;stroke:#ffffff;stroke-linecap:round;stroke-linejoin:round;stroke-width:48px"/></svg>`;
5
5
 
6
- const grwAppCss = ".app-container{position:relative;height:100%;max-height:100vh;font-family:\"Roboto\"}.header-container,.large-view-header-container{display:flex;align-items:center;background-color:var(--color-primary);height:64px}.header-container .arrow-back-icon,.large-view-header-container .arrow-back-icon{width:48px;height:auto;margin-left:24px}.header-container .arrow-back-icon svg,.large-view-header-container .arrow-back-icon svg{cursor:pointer;width:48px;height:auto}.header-container .handle-filters-button,.large-view-header-container .handle-filters-button{user-select:none;cursor:pointer;color:var(--color-primary);background-color:#ffffff;margin-left:36px;border-radius:8px;padding:8px}.header-container .attribution-container,.large-view-header-container .attribution-container{position:absolute;right:24px}.header-container .attribution-container a,.large-view-header-container .attribution-container a{color:#ffffff;text-decoration:none}.options-container{height:calc(100% - 64px);position:absolute;width:100%;z-index:1100;top:64px}.filters-container{position:absolute;width:100%;background-color:#ffffff;padding:36px 0px;z-index:1100}.filters-container .close-filters-button{cursor:pointer;font-weight:bold;position:absolute;top:12px;right:12px;padding:12px;border-radius:12px;color:var(--color-primary);border:1px var(--color-primary) solid}.filters-container .close-filters-button:hover{background-color:var(--color-primary);color:#ffffff}.filters-container .filter-margin-top{margin-top:24px}.filters-container .current-treks-length{margin:0px 0px 32px 8px;color:var(--color-primary);font-size:24px;font-weight:bold}.back-filters-container{background-color:rgba(0, 0, 0, 0.5);width:100%;height:calc(100% - 64px);position:absolute;z-index:1099;top:64px}.loader-container,.large-view-loader-container{display:flex;justify-content:center;align-items:center;height:100%}.loader-container .loader,.large-view-loader-container .loader{width:48px;height:48px;border:5px solid var(--color-primary-tint);border-bottom-color:var(--color-primary);border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.content-container{position:relative;display:flex;height:calc(100% - 64px)}.app-treks-list-container,.app-trek-detail-container,.large-view-app-treks-list-container,.large-view-app-trek-detail-container{height:100%}.app-map-container,.large-view-app-map-container{width:100%;height:100%}.map-visibility-button{cursor:pointer;display:flex;justify-content:center;align-items:center;position:absolute;bottom:24px;width:100%;z-index:400;user-select:none}.map-visibility-button div{background-color:var(--color-primary);color:#ffffff;padding:12px;border-radius:24px;width:120px;text-align:center}.header-container .title{font-size:24px}.loader-container{position:absolute;width:100%}.app-treks-list-container,.app-trek-detail-container{width:100%}.app-map-container{position:relative;width:100%;position:absolute}.large-view-header-container .title{font-size:32px}.large-view-loader-container{position:relative;width:50%}.large-view-app-treks-list-container,.large-view-app-trek-detail-container{width:50%}.large-view-app-map-container{position:relative;width:50%}";
6
+ const grwAppCss = ".app-container{position:relative;height:100%;max-height:100vh;font-family:\"Roboto\"}.header-container,.large-view-header-container{display:flex;flex-direction:row;align-items:center;background-color:var(--color-primary);height:64px}.header-container .arrow-back-icon,.large-view-header-container .arrow-back-icon{width:48px;height:auto;margin-left:24px}.header-container .arrow-back-icon svg,.large-view-header-container .arrow-back-icon svg{cursor:pointer;width:48px;height:auto}.header-container .handle-filters-container,.large-view-header-container .handle-filters-container{display:flex;align-items:center}.header-container .handle-filters-container .handle-filters-button,.large-view-header-container .handle-filters-container .handle-filters-button{user-select:none;cursor:pointer;color:var(--color-primary);background-color:#ffffff;margin-left:12px;border-radius:8px;padding:8px}.header-container .handle-filters-container .current-treks-within-bounds-length,.large-view-header-container .handle-filters-container .current-treks-within-bounds-length{margin-left:12px;color:#ffffff}.header-container .attribution-container,.large-view-header-container .attribution-container{position:absolute;right:24px}.header-container .attribution-container a,.large-view-header-container .attribution-container a{color:#ffffff;text-decoration:none}.options-container{height:calc(100% - 64px);position:absolute;width:100%;z-index:1100;top:64px}.filters-container{position:absolute;width:100%;background-color:#ffffff;padding:36px 0px;z-index:1100}.filters-container .close-filters-button{cursor:pointer;font-weight:bold;position:absolute;top:12px;right:12px;padding:12px;border-radius:12px;color:var(--color-primary);border:1px var(--color-primary) solid}.filters-container .close-filters-button:hover{background-color:var(--color-primary);color:#ffffff}.filters-container .filter-margin-top{margin-top:24px}.back-filters-container{background-color:rgba(0, 0, 0, 0.5);width:100%;height:calc(100% - 64px);position:absolute;z-index:1099;top:64px}.init-loader-container,.loader-container,.large-view-loader-container{display:flex;justify-content:center;align-items:center;height:100%}.init-loader-container .loader,.loader-container .loader,.large-view-loader-container .loader{width:48px;height:48px;border:5px solid var(--color-primary-tint);border-bottom-color:var(--color-primary);border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.content-container{position:relative;display:flex;height:calc(100% - 64px)}.app-treks-list-container,.app-trek-detail-container,.large-view-app-treks-list-container,.large-view-app-trek-detail-container{height:100%}.app-map-container,.large-view-app-map-container{width:100%;height:100%}.map-visibility-button{cursor:pointer;display:flex;justify-content:center;align-items:center;position:absolute;bottom:24px;width:100%;z-index:400;user-select:none}.map-visibility-button div{background-color:var(--color-primary);color:#ffffff;padding:12px;border-radius:24px;width:120px;text-align:center}.header-container .title{font-size:24px}.init-loader-container,.loader-container{width:100%}.app-treks-list-container,.app-trek-detail-container{width:100%}.app-map-container{position:relative;width:100%;position:absolute}.large-view-header-container .title{font-size:32px}.large-view-loader-container{width:50%}.large-view-app-treks-list-container,.large-view-app-trek-detail-container{width:50%}.large-view-app-map-container{position:relative;width:50%}";
7
7
 
8
8
  const GrwApp = class {
9
9
  constructor(hostRef) {
@@ -22,8 +22,8 @@ const GrwApp = class {
22
22
  this.colorArrivalIcon = '#85003b';
23
23
  this.colorSensitiveArea = '#4974a5';
24
24
  this.colorPoiIcon = '#974c6e';
25
- this.handlePopStateBind = this.handlePopState.bind(this);
26
25
  this.largeViewSize = 1024;
26
+ this.handlePopStateBind = this.handlePopState.bind(this);
27
27
  }
28
28
  onTrekCardPress(event) {
29
29
  this.currentTrekId = event.detail;
@@ -39,6 +39,14 @@ const GrwApp = class {
39
39
  window.dispatchEvent(new window.Event('resize'));
40
40
  }
41
41
  componentDidLoad() {
42
+ onChange('trekNetworkError', () => {
43
+ if (state.trekNetworkError) {
44
+ const urlRedirect = new URL(window.location.toString());
45
+ urlRedirect.searchParams.delete('trek');
46
+ window.history.replaceState({}, '', urlRedirect);
47
+ this.onTrekDetailsClose();
48
+ }
49
+ });
42
50
  this.handleView();
43
51
  window.addEventListener('popstate', this.handlePopStateBind, false);
44
52
  const url = new URL(window.location.toString());
@@ -50,6 +58,7 @@ const GrwApp = class {
50
58
  }
51
59
  }
52
60
  onTrekDetailsClose() {
61
+ state.currentTrek = null;
53
62
  this.currentTrekId = null;
54
63
  this.showTrek = !this.showTrek;
55
64
  }
@@ -95,7 +104,7 @@ const GrwApp = class {
95
104
  window.removeEventListener('popstate', this.handlePopStateBind);
96
105
  }
97
106
  render() {
98
- return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint, '--color-primary-shade': this.colorPrimaryShade } }, h("grw-treks-provider", { api: this.api, language: this.language, "in-bbox": this.inBbox, cities: this.cities, districts: this.districts, structures: this.structures, themes: this.themes, portals: this.portals, routes: this.routes, practices: this.practices }), this.showTrek && this.currentTrekId && h("grw-trek-provider", { api: state.api, language: this.language, "trek-id": this.currentTrekId }), h("div", { class: "app-container" }, h("div", { class: this.isLargeView ? 'large-view-header-container' : 'header-container' }, this.showTrek ? (h("div", { onClick: () => this.handleBackButton(), class: "arrow-back-icon", innerHTML: arrowBackImage })) : (h("div", { onClick: () => this.handleFilters(), class: "handle-filters-button" }, "FILTRER")), !this.showTrek && this.showFilters && (h("div", { class: "options-container" }, h("div", { class: "filters-container" }, h("div", { class: "current-treks-length" }, `${state.currentTreks.length} résultat${state.currentTreks.length > 1 ? 's' : ''}`), h("div", { onClick: () => this.handleFilters(), class: "close-filters-button" }, "X"), h("div", null, h("grw-filter", { filterName: "Pratique", filterType: "practices", filterNameProperty: "name" })), h("div", { class: "filter-margin-top" }, h("grw-filter", { filterName: "Difficult\u00E9", filterType: "difficulties", filterNameProperty: "label" })), h("div", { class: "filter-margin-top" }, h("grw-filter", { filterName: "Dur\u00E9e", filterType: "durations", filterNameProperty: "name" }))), h("div", { onClick: () => this.handleFilters(), class: "back-filters-container" }))), h("div", { class: "attribution-container" }, h("a", { target: "_blank", href: "https://geotrek.fr" }, "GEOTREK"))), h("div", { class: "content-container" }, h("div", { class: this.isLargeView ? 'large-view-app-treks-list-container' : 'app-treks-list-container', style: { display: this.showTrek ? 'none' : 'flex', position: this.showTrek ? 'absolute' : 'relative' } }, h("grw-treks-list", { "is-large-view": this.isLargeView, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint })), this.showTrek && !state.currentTrek && (h("div", { class: this.isLargeView ? 'large-view-loader-container' : 'loader-container' }, h("span", { class: "loader" }))), state.currentTrek && (h("div", { class: this.isLargeView ? 'large-view-app-trek-detail-container' : 'app-trek-detail-container' }, h("grw-trek-detail", { "color-primary": this.colorPrimary, "color-primary-shade": this.colorPrimaryShade, "color-primary-tint": this.colorPrimaryTint }))), h("grw-map", { class: this.isLargeView ? 'large-view-app-map-container' : 'app-map-container', style: { visibility: (this.showTreksMap && !this.showTrek) || (this.showTrekMap && this.showTrek) ? 'visible' : 'hidden' }, "url-layer": this.urlLayer, center: this.center, zoom: this.zoom, attribution: this.attribution, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint, "color-trek-line": this.colorTrekLine, "color-departure-icon": this.colorDepartureIcon, "color-arrival-icon": this.colorArrivalIcon, "color-sensitive-area": this.colorSensitiveArea, "color-poi-icon": this.colorPoiIcon })), h("div", { class: "map-visibility-button", style: { display: this.isLargeView ? 'none' : 'flex' } }, h("div", { onClick: () => this.handleShowMap() }, this.showTreksMap || this.showTrekMap ? (this.showTrek ? 'Voir la fiche' : 'Voir la liste') : 'Voir la carte')))));
107
+ return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint, '--color-primary-shade': this.colorPrimaryShade } }, h("grw-treks-provider", { api: this.api, language: this.language, "in-bbox": this.inBbox, cities: this.cities, districts: this.districts, structures: this.structures, themes: this.themes, portals: this.portals, routes: this.routes, practices: this.practices }), !state.currentTreks && !state.currentTrek && (h("div", { class: "init-loader-container" }, h("span", { class: "loader" }))), this.showTrek && this.currentTrekId && h("grw-trek-provider", { api: state.api, language: this.language, "trek-id": this.currentTrekId }), (state.currentTreks || state.currentTrek) && (h("div", { class: "app-container" }, h("div", { class: this.isLargeView ? 'large-view-header-container' : 'header-container' }, this.showTrek ? (h("div", { onClick: () => this.handleBackButton(), class: "arrow-back-icon", innerHTML: arrowBackImage })) : (h("div", { class: "handle-filters-container" }, h("div", { onClick: () => this.handleFilters(), class: "handle-filters-button" }, "FILTRER"), state.treksWithinBounds && (h("div", { class: "current-treks-within-bounds-length" }, `${state.treksWithinBounds.length} randonnée${state.treksWithinBounds.length > 1 ? 's' : ''}`)))), !this.showTrek && this.showFilters && (h("div", { class: "options-container" }, h("div", { class: "filters-container" }, h("div", { onClick: () => this.handleFilters(), class: "close-filters-button" }, "X"), h("div", null, h("grw-filter", { filterName: "Pratique", filterType: "practices", filterNameProperty: "name" })), h("div", { class: "filter-margin-top" }, h("grw-filter", { filterName: "Difficult\u00E9", filterType: "difficulties", filterNameProperty: "label" })), h("div", { class: "filter-margin-top" }, h("grw-filter", { filterName: "Dur\u00E9e", filterType: "durations", filterNameProperty: "name" }))), h("div", { onClick: () => this.handleFilters(), class: "back-filters-container" }))), h("div", { class: "attribution-container" }, h("a", { target: "_blank", href: "https://geotrek.fr" }, "GEOTREK"))), h("div", { class: "content-container" }, h("div", { class: this.isLargeView ? 'large-view-app-treks-list-container' : 'app-treks-list-container', style: { display: this.showTrek ? 'none' : 'flex', position: this.showTrek ? 'absolute' : 'relative' } }, h("grw-treks-list", { "is-large-view": this.isLargeView, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint })), this.showTrek && !state.currentTrek && (h("div", { class: this.isLargeView ? 'large-view-loader-container' : 'loader-container' }, h("span", { class: "loader" }))), state.currentTrek && (h("div", { class: this.isLargeView ? 'large-view-app-trek-detail-container' : 'app-trek-detail-container' }, h("grw-trek-detail", { "color-primary": this.colorPrimary, "color-primary-shade": this.colorPrimaryShade, "color-primary-tint": this.colorPrimaryTint }))), h("grw-map", { class: this.isLargeView ? 'large-view-app-map-container' : 'app-map-container', style: { visibility: (this.showTreksMap && !this.showTrek) || (this.showTrekMap && this.showTrek) ? 'visible' : 'hidden' }, "url-layer": this.urlLayer, center: this.center, zoom: this.zoom, attribution: this.attribution, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint, "color-trek-line": this.colorTrekLine, "color-departure-icon": this.colorDepartureIcon, "color-arrival-icon": this.colorArrivalIcon, "color-sensitive-area": this.colorSensitiveArea, "color-poi-icon": this.colorPoiIcon })), h("div", { class: "map-visibility-button", style: { display: this.isLargeView ? 'none' : 'flex' } }, h("div", { onClick: () => this.handleShowMap() }, this.showTrek ? (this.showTrekMap ? 'Voir la fiche' : 'Voir la carte') : this.showTreksMap ? 'Voir la liste' : 'Voir la carte'))))));
99
108
  }
100
109
  get element() { return getElement(this); }
101
110
  static get watchers() { return {
package/dist/esm/grw-filter_6.entry.js CHANGED
@@ -1,5 +1,5 @@
1
- import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-192d910f.js';
2
- import { s as state, o as onChange } from './store-b2c76c0c.js';
1
+ import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-ee473772.js';
2
+ import { s as state, o as onChange } from './store-a5f523fd.js';
3
3
  import { d as durationImage, f as formatDuration, l as lengthImage, a as formatLength, b as ascentImage, c as formatAscent } from './length-d82189db.js';
4
4
 
5
5
  const grwFilterCss = ".filter-name{margin-left:8px;color:var(--color-primary);font-size:24px;font-weight:bold}.filter-button-container{display:flex;flex-direction:row;flex-wrap:wrap}.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;margin:8px 0px 0px 8px;padding:8px}.filter-button-container .filter-button{color:var(--color-primary);background-color:#ffffff}.filter-button-container .selected-filter-button{color:#ffffff;background-color:var(--color-primary)}";
@@ -28,18 +28,17 @@ const GrwFilter = class {
28
28
  filtersTreks = [...filtersTreks.filter(trek => currentFiltersId.includes(trek[filter.trekProperty]))];
29
29
  }
30
30
  else if (filter.type === 'interval') {
31
- let minValue;
32
- let maxValue;
33
- for (const currentFilterId of currentFiltersId) {
34
- const currentFilter = state[filter.property].find(property => property.id === currentFilterId);
35
- if (isNaN(minValue) || currentFilter.minValue < minValue) {
36
- minValue = currentFilter.minValue;
37
- }
38
- if (isNaN(maxValue) || currentFilter.maxValue > maxValue) {
39
- maxValue = currentFilter.maxValue;
40
- }
41
- }
42
- filtersTreks = [...filtersTreks.filter(trek => trek[filter.trekProperty] >= minValue && trek[filter.trekProperty] <= maxValue)];
31
+ filtersTreks = [
32
+ ...filtersTreks.filter(trek => {
33
+ for (const currentFilterId of currentFiltersId) {
34
+ const currentFilter = state[filter.property].find(property => property.id === currentFilterId);
35
+ if (trek[filter.trekProperty] >= currentFilter.minValue && trek[filter.trekProperty] <= currentFilter.maxValue) {
36
+ return true;
37
+ }
38
+ }
39
+ return false;
40
+ }),
41
+ ];
43
42
  }
44
43
  }
45
44
  else {
@@ -14233,7 +14232,7 @@ const GrwMap = class {
14233
14232
  this.colorPoiIcon = '#974c6e';
14234
14233
  this.handleTreksWithinBoundsBind = this.handleTreksWithinBounds.bind(this);
14235
14234
  }
14236
- componentDidLoad() {
14235
+ connectedCallback() {
14237
14236
  this.map = leafletSrc.map(this.element, {
14238
14237
  center: this.center.split(',').map(Number),
14239
14238
  zoom: this.zoom,
@@ -14246,7 +14245,7 @@ const GrwMap = class {
14246
14245
  if (state.currentTrek) {
14247
14246
  this.addTrek();
14248
14247
  }
14249
- else if (state.currentTrek) {
14248
+ else if (state.currentTreks) {
14250
14249
  this.addTreks();
14251
14250
  }
14252
14251
  onChange('currentTreks', () => {
@@ -14275,18 +14274,20 @@ const GrwMap = class {
14275
14274
  type: 'FeatureCollection',
14276
14275
  features: [],
14277
14276
  };
14278
- for (const trek of state.currentTreks) {
14279
- trekscurrentDepartureCoordinates.push(trek.departure_geom);
14280
- treksFeatureCollection.features.push({
14281
- type: 'Feature',
14282
- geometry: { type: 'Point', coordinates: trek.departure_geom },
14283
- properties: {
14284
- id: trek.id,
14285
- name: trek.name,
14286
- practice: (_a = state.practices.find(practice => practice.id === trek.practice)) === null || _a === void 0 ? void 0 : _a.pictogram,
14287
- imgSrc: trek.attachments && trek.attachments.length > 0 && trek.attachments[0].thumbnail,
14288
- },
14289
- });
14277
+ if (state.currentTreks) {
14278
+ for (const trek of state.currentTreks) {
14279
+ trekscurrentDepartureCoordinates.push(trek.departure_geom);
14280
+ treksFeatureCollection.features.push({
14281
+ type: 'Feature',
14282
+ geometry: { type: 'Point', coordinates: trek.departure_geom },
14283
+ properties: {
14284
+ id: trek.id,
14285
+ name: trek.name,
14286
+ practice: (_a = state.practices.find(practice => practice.id === trek.practice)) === null || _a === void 0 ? void 0 : _a.pictogram,
14287
+ imgSrc: trek.attachments && trek.attachments.length > 0 && trek.attachments[0].thumbnail,
14288
+ },
14289
+ });
14290
+ }
14290
14291
  }
14291
14292
  if (!this.treksLayer) {
14292
14293
  if (trekscurrentDepartureCoordinates.length > 0 && !state.currentMapTreksBounds) {
@@ -14294,7 +14295,9 @@ const GrwMap = class {
14294
14295
  this.map.fitBounds(bounds);
14295
14296
  }
14296
14297
  else {
14297
- this.map.fitBounds(state.currentMapTreksBounds);
14298
+ if (state.currentMapTreksBounds) {
14299
+ this.map.fitBounds(state.currentMapTreksBounds);
14300
+ }
14298
14301
  }
14299
14302
  this.treksLayer = leafletSrc.geoJSON(treksFeatureCollection, {
14300
14303
  pointToLayer: (geoJsonPoint, latlng) => leafletSrc.marker(latlng, {
@@ -14330,6 +14333,9 @@ const GrwMap = class {
14330
14333
  const bounds = leafletSrc.latLngBounds(trekscurrentDepartureCoordinates.map(coordinate => [coordinate[1], coordinate[0]]));
14331
14334
  this.map.fitBounds(bounds);
14332
14335
  }
14336
+ else {
14337
+ this.map.fire('moveend');
14338
+ }
14333
14339
  this.treksLayer.clearLayers();
14334
14340
  this.treksLayer.addData(treksFeatureCollection);
14335
14341
  }
@@ -14612,7 +14618,7 @@ const GrwTrekDetail = class {
14612
14618
  this.colorPrimaryShade = '#4a0021';
14613
14619
  this.colorPrimaryTint = '#974c6e';
14614
14620
  }
14615
- componentWillLoad() {
14621
+ connectedCallback() {
14616
14622
  this.currentTrek = this.trek ? this.trek : state.currentTrek;
14617
14623
  if (this.currentTrek) {
14618
14624
  this.difficulty = state.difficulties.find(difficulty => difficulty.id === this.currentTrek.difficulty);
@@ -14647,7 +14653,9 @@ const GrwTrekDetail = class {
14647
14653
  return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-shade': this.colorPrimaryShade, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: "trek-detail-container" }, h("div", { class: "name" }, this.currentTrek.name), this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: this.currentTrek.attachments[0].thumbnail, loading: "lazy" })), h("div", { class: "sub-container" }, 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 :
14648
14654
  _b.label), h("div", { class: "icon-label duration" }, h("div", { class: "svg-icon", innerHTML: durationImage }), 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 :
14649
14655
  _e.route)), h("div", { class: "row" }, h("div", { class: "icon-label length" }, h("div", { class: "svg-icon", innerHTML: lengthImage }), formatLength(this.currentTrek.length_2d)), h("div", { class: "icon-label ascent" }, h("div", { class: "svg-icon", innerHTML: ascentImage }), 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 :
14650
- _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), 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 }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && 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", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
14656
+ _g.name)))), h("div", { class: "downloads-container" }, h("div", { class: "download-title" }, "T\u00E9l\u00E9chargements"), h("div", { class: "links-container" }, h("a", { href: `${this.currentTrek.gpx}` }, "GPX"), h("a", { href: `${this.currentTrek.kml}` }, "KML"), h("a", { href: `${this.currentTrek.pdf}` }, "PDF"))), this.themes.length > 0 && (h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label))))), 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 }), this.currentTrek.description && (h("div", { class: "description-container" }, h("div", { class: "description-title" }, "Description"), h("div", { class: "description", innerHTML: this.currentTrek.description }))), this.currentTrek.departure && (h("div", { class: "departure-container" }, h("div", { class: "departure-title" }, "D\u00E9part :\u00A0"), h("div", { innerHTML: this.currentTrek.departure }))), this.currentTrek.arrival && (h("div", { class: "arrival-container" }, h("div", { class: "arrival-title" }, "Arriv\u00E9e :\u00A0"), h("div", { innerHTML: this.currentTrek.arrival }))), this.currentTrek.altimetric_profile && (h("div", { class: "altimetric-profile-container" }, h("div", { class: "altimetric-profile-title" }, "Profil altim\u00E9trique"), h("img", { src: this.currentTrek.altimetric_profile.endsWith('.json')
14657
+ ? this.currentTrek.altimetric_profile.replace('.json', '.svg')
14658
+ : `${this.currentTrek.altimetric_profile}?format=svg` }))), this.currentTrek.access && (h("div", { class: "access-container" }, h("div", { class: "access-title" }, "Acc\u00E8s routier"), h("div", { class: "access", innerHTML: this.currentTrek.access }))), this.currentTrek.public_transport && (h("div", { class: "public-transport-container" }, h("div", { class: "public-transport-title" }, "Transport"), h("div", { class: "public-transport", innerHTML: this.currentTrek.public_transport }))), (this.currentTrek.advice || this.labels.length > 0) && (h("div", { class: "advice-container" }, h("div", { class: "advice-title" }, "Recommandations"), this.currentTrek.advice && 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", { class: "advised-parking-container" }, h("div", { class: "advised-parking-title" }, "Parking conseill\u00E9"), h("div", { class: "advised_parking", innerHTML: this.currentTrek.advised_parking }))), this.currentTrek.gear && (h("div", { class: "gear-container" }, h("div", { class: "gear-title" }, "\u00C9quipements"), h("div", { class: "gear", innerHTML: this.currentTrek.gear }))), state.currentSensitiveAreas && state.currentSensitiveAreas.length > 0 && (h("div", { class: "sensitive-areas-container" }, h("div", { class: "sensitive-areas-title" }, "Zones de sensibilit\u00E9 environnementale"), state.currentSensitiveAreas.map(sensitiveArea => (h("grw-sensitive-area-detail", { sensitiveArea: sensitiveArea }))))), state.currentInformationDesks && state.currentInformationDesks.length > 0 && (h("div", { class: "information-desks-container" }, h("div", { class: "information-desks-title" }, "Lieux de renseignement"), state.currentInformationDesks.map(informationDesk => (h("grw-information-desk-detail", { informationDesk: informationDesk }))))), (this.currentTrek.disabled_infrastructure ||
14651
14659
  (this.accessibilities && this.accessibilities.length > 0) ||
14652
14660
  this.currentTrek.accessibility_level ||
14653
14661
  this.currentTrek.accessibility_slope ||
@@ -14664,17 +14672,18 @@ const GrwTrekProvider = class {
14664
14672
  constructor(hostRef) {
14665
14673
  registerInstance(this, hostRef);
14666
14674
  this.language = 'fr';
14675
+ this.trekNetworkError = false;
14667
14676
  this.controller = new AbortController();
14668
14677
  this.signal = this.controller.signal;
14669
14678
  }
14670
- componentWillLoad() {
14679
+ connectedCallback() {
14671
14680
  state.api = this.api;
14672
14681
  const requests = [];
14673
14682
  requests.push(!state.difficulties ? fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14674
14683
  requests.push(!state.routes ? fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }) : new Response('null'));
14675
14684
  requests.push(!state.practices ? fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }) : new Response('null'));
14676
14685
  requests.push(!state.themes ? fetch(`${this.api}theme/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }) : new Response('null'));
14677
- return Promise.all([
14686
+ Promise.all([
14678
14687
  ...requests,
14679
14688
  fetch(`${this.api}sensitivearea/?language=${this.language}&published=true&trek=${this.trekId}&fields=id,geometry,name,description,contact,info_url,period,practices`, {
14680
14689
  signal: this.signal,
@@ -14689,6 +14698,7 @@ const GrwTrekProvider = class {
14689
14698
  ])
14690
14699
  .then(responses => Promise.all(responses.map(response => response.json())))
14691
14700
  .then(([difficulties, routes, practices, themes, sensitiveAreas, labels, sources, accessibilities, accessibilitiesLevel, pois, informationDesks, trek]) => {
14701
+ state.trekNetworkError = false;
14692
14702
  if (difficulties) {
14693
14703
  state.difficulties = difficulties.results;
14694
14704
  }
@@ -14713,18 +14723,22 @@ const GrwTrekProvider = class {
14713
14723
  state.currentPois = pois.results;
14714
14724
  state.currentInformationDesks = informationDesks.results;
14715
14725
  state.currentTrek = trek;
14726
+ })
14727
+ .catch(() => {
14728
+ state.trekNetworkError = true;
14716
14729
  });
14717
14730
  }
14718
14731
  disconnectedCallback() {
14719
14732
  this.controller.abort();
14720
14733
  state.currentTrek = null;
14734
+ state.trekNetworkError = false;
14721
14735
  }
14722
14736
  render() {
14723
14737
  return h(Host, null);
14724
14738
  }
14725
14739
  };
14726
14740
 
14727
- const grwTreksListCss = ":host{font-family:\"Roboto\";width:100%;height:100%;max-height:100vh;overflow-y:auto}.current-treks-length{width:100%;text-align:center;padding:32px 0px;color:var(--color-primary);font-size:24px;font-weight:bold}.current-treks-container{display:flex;flex-wrap:wrap;justify-content:space-around}grw-trek-card{margin:6px}";
14741
+ const grwTreksListCss = ":host{font-family:\"Roboto\";width:100%;height:100%;max-height:100vh;overflow-y:auto;display:flex;flex-wrap:wrap;justify-content:space-around}grw-trek-card{margin:6px}";
14728
14742
 
14729
14743
  const GrwTreksList = class {
14730
14744
  constructor(hostRef) {
@@ -14733,19 +14747,25 @@ const GrwTreksList = class {
14733
14747
  this.colorPrimary = '#6b0030';
14734
14748
  this.colorPrimaryTint = '#974c6e';
14735
14749
  this.isLargeView = false;
14736
- this.handleInfiniteScrollBind = this.handleInfiniteScroll.bind(this);
14737
14750
  this.step = 10;
14751
+ this.handleInfiniteScrollBind = this.handleInfiniteScroll.bind(this);
14738
14752
  }
14739
- componentWillLoad() {
14753
+ connectedCallback() {
14754
+ this.element.addEventListener('scroll', this.handleInfiniteScrollBind);
14755
+ if (state.currentTreks) {
14756
+ this.treksToDisplay = [...state.currentTreks.slice(0, this.step)];
14757
+ }
14740
14758
  onChange('currentTreks', () => {
14741
- this.element.addEventListener('scroll', this.handleInfiniteScrollBind);
14742
14759
  this.element.scroll({ top: 0 });
14743
- this.treksToDisplay = [...state.currentTreks.slice(0, this.step)];
14760
+ if (state.currentTreks) {
14761
+ this.treksToDisplay = [...state.currentTreks.slice(0, this.step)];
14762
+ }
14744
14763
  });
14745
14764
  onChange('treksWithinBounds', () => {
14746
- this.element.addEventListener('scroll', this.handleInfiniteScrollBind);
14747
14765
  this.element.scroll({ top: 0 });
14748
- this.treksToDisplay = [...state.treksWithinBounds.slice(0, this.step)];
14766
+ if (state.treksWithinBounds) {
14767
+ this.treksToDisplay = [...state.treksWithinBounds.slice(0, this.step)];
14768
+ }
14749
14769
  });
14750
14770
  }
14751
14771
  handleInfiniteScroll(event) {
@@ -14758,8 +14778,11 @@ const GrwTreksList = class {
14758
14778
  }
14759
14779
  }
14760
14780
  }
14781
+ disconnectedCallback() {
14782
+ this.element.removeEventListener('scroll', this.handleInfiniteScrollBind);
14783
+ }
14761
14784
  render() {
14762
- return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, h("div", { class: "current-treks-length" }, `${state.treksWithinBounds.length} résultat${state.treksWithinBounds.length > 1 ? 's' : ''}`), h("div", { class: "current-treks-container" }, this.treksToDisplay.map(trek => (h("grw-trek-card", { key: `trek-${trek.id}`, trek: trek, "is-large-view": this.isLargeView, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint }))))));
14785
+ return (h(Host, { style: { '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, this.treksToDisplay.map(trek => (h("grw-trek-card", { key: `trek-${trek.id}`, trek: trek, "is-large-view": this.isLargeView, "color-primary": this.colorPrimary, "color-primary-tint": this.colorPrimaryTint })))));
14763
14786
  }
14764
14787
  get element() { return getElement(this); }
14765
14788
  };
@@ -14772,7 +14795,7 @@ const GrwTreksProvider = class {
14772
14795
  this.controller = new AbortController();
14773
14796
  this.signal = this.controller.signal;
14774
14797
  }
14775
- componentWillLoad() {
14798
+ connectedCallback() {
14776
14799
  state.api = this.api;
14777
14800
  let treksRequest = `${this.api}trek/?language=${this.language}&published=true`;
14778
14801
  this.inBbox && (treksRequest += `&in_bbox=${this.inBbox}`);
@@ -14784,7 +14807,7 @@ const GrwTreksProvider = class {
14784
14807
  this.routes && (treksRequest += `&routes=${this.routes}`);
14785
14808
  this.practices && (treksRequest += `&practices=${this.practices}`);
14786
14809
  treksRequest += `&fields=id,name,attachments,description_teaser,difficulty,duration,ascent,length_2d,practice,themes,route,departure,departure_geom&page_size=999`;
14787
- return Promise.all([
14810
+ Promise.all([
14788
14811
  fetch(`${this.api}trek_difficulty/?language=${this.language}&fields=id,label,pictogram`, { signal: this.signal }),
14789
14812
  fetch(`${this.api}trek_route/?language=${this.language}&fields=id,route,pictogram`, { signal: this.signal }),
14790
14813
  fetch(`${this.api}trek_practice/?language=${this.language}&fields=id,name,pictogram`, { signal: this.signal }),
@@ -14793,6 +14816,7 @@ const GrwTreksProvider = class {
14793
14816
  ])
14794
14817
  .then(responses => Promise.all(responses.map(response => response.json())))
14795
14818
  .then(([difficulties, routes, practices, themes, treks]) => {
14819
+ state.treksNetworkError = false;
14796
14820
  state.difficulties = difficulties.results;
14797
14821
  state.routes = routes.results;
14798
14822
  state.practices = practices.results.map(practice => (Object.assign(Object.assign({}, practice), { selected: false })));
@@ -14806,10 +14830,12 @@ const GrwTreksProvider = class {
14806
14830
  state.treks = treks.results;
14807
14831
  state.currentTreks = treks.results;
14808
14832
  state.treksWithinBounds = treks.results;
14809
- });
14833
+ })
14834
+ .catch(() => (state.treksNetworkError = true));
14810
14835
  }
14811
14836
  disconnectedCallback() {
14812
14837
  this.controller.abort();
14838
+ state.treksNetworkError = false;
14813
14839
  }
14814
14840
  render() {
14815
14841
  return h(Host, null);
package/dist/esm/grw-information-desk-detail_3.entry.js CHANGED
@@ -1,5 +1,5 @@
1
- import { r as registerInstance, h, H as Host } from './index-192d910f.js';
2
- import { s as state } from './store-b2c76c0c.js';
1
+ import { r as registerInstance, h, H as Host } from './index-ee473772.js';
2
+ import { s as state } from './store-a5f523fd.js';
3
3
 
4
4
  const grwInformationDeskDetailCss = ":host{display:flex;flex-direction:column}:host a{color:var(--color-primary)}.information-desk-img{width:180px}.information-desk-img img{width:180px;border-radius:8px}.information-desk-sub-container{display:flex;flex-direction:column}.information-desk-name{color:var(--color-primary);font-size:24px;font-weight:bold;padding:12px 0px}.information-desk-description{font-size:16px}";
5
5