@geotrekce/geotrek-rando-widget 0.0.13 → 0.0.14

package/dist/collection/components/grw-sensitive-area-detail/grw-sensitive-area-detail.js

@@ -1,57 +1,52 @@
-import { Component, Host, h, Prop } from '@stencil/core';
+import { Host, h } from '@stencil/core';
 import state from 'store/store';
 export class GrwSensitiveAreaDetail {
   render() {
-    return (h(Host, null,
-      h("div", { class: "sensitive-area-title" }, this.sensitiveArea.name),
-      h("div", { class: "sensitive-area-description", innerHTML: this.sensitiveArea.description }),
-      this.sensitiveArea.practices && this.sensitiveArea.practices.length > 0 && (h("div", { class: "sensitive-area-practice-container" },
-        h("div", { class: "sensitive-area-practice-title" }, "Domaines d'activit\u00E9s concern\u00E9s :"),
-        h("div", { class: "sensitive-area-practice-values" }, this.sensitiveArea.practices.map((sensitiveAreaPractice, index) => {
-          const practice = state.practices.find(statePractice => statePractice.id === sensitiveAreaPractice);
-          if (practice) {
-            return h("div", { innerHTML: `${practice.name.toUpperCase()}${index + 1 !== this.sensitiveArea.practices.length ? ' - ' : ''}` });
-          }
-        })))),
-      this.sensitiveArea.period && this.sensitiveArea.period.length > 0 && (h("div", { class: "sensitive-area-period-container" },
-        h("div", { class: "sensitive-area-period-title" }, "P\u00E9riodes de sensibilit\u00E9"),
-        h("div", { class: "sensitive-area-period-values" }, this.sensitiveArea.period.map((month, index) => {
-          if (month) {
-            return (h("div", { innerHTML: `${new Date(0, index + 1, 0).toLocaleDateString('fr', { month: 'long' }).toUpperCase()}${this.sensitiveArea.period.slice(index + 1).find(month => month) ? ' - ' : ''}` }));
-          }
-        })))),
-      h("div", { class: "sensitive-area-contact-container" },
-        h("div", { class: "sensitive-area-contact-title" }, "Contact"),
-        h("div", { innerHTML: this.sensitiveArea.contact, class: "sensitive-area-contact-value" }))));
+    return (h(Host, null, h("div", { class: "sensitive-area-title" }, this.sensitiveArea.name), h("div", { class: "sensitive-area-description", innerHTML: this.sensitiveArea.description }), this.sensitiveArea.practices && this.sensitiveArea.practices.length > 0 && (h("div", { class: "sensitive-area-practice-container" }, h("div", { class: "sensitive-area-practice-title" }, "Domaines d'activit\u00E9s concern\u00E9s :"), h("div", { class: "sensitive-area-practice-values" }, this.sensitiveArea.practices.map((sensitiveAreaPractice, index) => {
+      const practice = state.practices.find(statePractice => statePractice.id === sensitiveAreaPractice);
+      if (practice) {
+        return h("div", { innerHTML: `${practice.name.toUpperCase()}${index + 1 !== this.sensitiveArea.practices.length ? ' - ' : ''}` });
+      }
+    })))), this.sensitiveArea.period && this.sensitiveArea.period.length > 0 && (h("div", { class: "sensitive-area-period-container" }, h("div", { class: "sensitive-area-period-title" }, "P\u00E9riodes de sensibilit\u00E9"), h("div", { class: "sensitive-area-period-values" }, this.sensitiveArea.period.map((month, index) => {
+      if (month) {
+        return (h("div", { innerHTML: `${new Date(0, index + 1, 0).toLocaleDateString('fr', { month: 'long' }).toUpperCase()}${this.sensitiveArea.period.slice(index + 1).find(month => month) ? ' - ' : ''}` }));
+      }
+    })))), h("div", { class: "sensitive-area-contact-container" }, h("div", { class: "sensitive-area-contact-title" }, "Contact"), h("div", { innerHTML: this.sensitiveArea.contact, class: "sensitive-area-contact-value" }))));
   }
   static get is() { return "grw-sensitive-area-detail"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["grw-sensitive-area-detail.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["grw-sensitive-area-detail.css"]
-  }; }
-  static get properties() { return {
-    "sensitiveArea": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "SensitiveArea",
-        "resolved": "{ id: number; geometry: Geometry; name: string; description: string; contact: string; info_url: string; period: boolean[]; practices: number[]; }",
-        "references": {
-          "SensitiveArea": {
-            "location": "import",
-            "path": "types/types"
+  static get originalStyleUrls() {
+    return {
+      "$": ["grw-sensitive-area-detail.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["grw-sensitive-area-detail.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "sensitiveArea": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "SensitiveArea",
+          "resolved": "{ id: number; geometry: Geometry; name: string; description: string; contact: string; info_url: string; period: boolean[]; practices: number[]; }",
+          "references": {
+            "SensitiveArea": {
+              "location": "import",
+              "path": "types/types"
+            }
           }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
         }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
       }
-    }
-  }; }
+    };
+  }
 }

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

@@ -1,5 +1,5 @@
-import { Component, Host, h, Prop, Event, State } from '@stencil/core';
-import state, { onChange } from 'store/store';
+import { Host, h } from '@stencil/core';
+import state, { onChange, reset } from 'store/store';
 import { formatDuration, formatLength, formatAscent } from 'utils/utils';
 import ascentImage from '../../assets/ascent.svg';
 import durationImage from '../../assets/duration.svg';
@@ -9,6 +9,7 @@ export class GrwTrekCard {
     this.colorPrimary = '#6b0030';
     this.colorPrimaryTint = '#974c6e';
     this.isLargeView = false;
+    this.resetStoreOnDisconnected = true;
   }
   connectedCallback() {
     this.currentTrek = this.trek ? this.trek : state.currentTrek;
@@ -17,6 +18,7 @@ export class GrwTrekCard {
       this.route = state.routes.find(route => route.id === this.currentTrek.route);
       this.practice = state.practices.find(practice => practice.id === this.currentTrek.practice);
       this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));
+      this.departureCity = state.cities.find(city => city.id === this.currentTrek.departure_city);
     }
     onChange('currentTrek', () => {
       this.currentTrek = this.trek ? this.trek : state.currentTrek;
@@ -25,145 +27,156 @@ export class GrwTrekCard {
         this.route = state.routes.find(route => route.id === this.currentTrek.route);
         this.practice = state.practices.find(practice => practice.id === this.currentTrek.practice);
         this.themes = state.themes.filter(theme => this.currentTrek.themes.includes(theme.id));
+        this.departureCity = state.cities.find(city => city.id === this.currentTrek.departure_city);
       }
     });
   }
+  disconnectedCallback() {
+    if (this.resetStoreOnDisconnected) {
+      reset();
+    }
+  }
   render() {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
-    return (h(Host, { onClick: () => this.trekCardPress.emit(this.currentTrek.id), style: { 'width': this.isLargeView ? '100%' : 'auto', '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: this.isLargeView ? 'trek-card-large-view-container' : 'trek-card-container' },
-      this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: `${this.currentTrek.attachments[0].thumbnail}`, loading: "lazy" })),
-      h("div", { class: "sub-container" },
-        h("div", { class: "departure" }, (_a = this.currentTrek) === null || _a === void 0 ? void 0 : _a.departure),
-        h("div", { class: "name" }, (_b = this.currentTrek) === null || _b === void 0 ? void 0 : _b.name),
-        h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label)))),
-        h("div", { class: "icons-labels-container" },
-          h("div", { class: "row" },
-            h("div", { class: "icon-label difficulty" },
-              ((_c = this.difficulty) === null || _c === void 0 ? void 0 : _c.pictogram) && h("img", { src: this.difficulty.pictogram }), (_d = this.difficulty) === null || _d === void 0 ? void 0 :
-              _d.label),
-            h("div", { class: "icon-label duration" },
-              h("div", { class: "svg-icon", innerHTML: durationImage }),
-              formatDuration(this.currentTrek.duration))),
-          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: "row" },
-            h("div", { class: "icon-label route" },
-              ((_e = this.route) === null || _e === void 0 ? void 0 : _e.pictogram) && h("img", { src: this.route.pictogram }), (_f = this.route) === null || _f === void 0 ? void 0 :
-              _f.route),
-            h("div", { class: "icon-label practice" },
-              ((_g = this.practice) === null || _g === void 0 ? void 0 : _g.pictogram) && h("img", { src: this.practice.pictogram }), (_h = this.practice) === null || _h === void 0 ? void 0 :
-              _h.name))))))));
+    var _a, _b, _c, _d, _e, _f, _g;
+    return (h(Host, { onClick: () => this.trekCardPress.emit(this.currentTrek.id), style: { 'width': this.isLargeView ? '100%' : 'auto', '--color-primary': this.colorPrimary, '--color-primary-tint': this.colorPrimaryTint } }, this.currentTrek && (h("div", { class: this.isLargeView ? 'trek-card-large-view-container' : 'trek-card-container' }, this.currentTrek.attachments && this.currentTrek.attachments[0] && this.currentTrek.attachments[0].thumbnail && (h("img", { class: "image", src: `${this.currentTrek.attachments[0].thumbnail}`, loading: "lazy" })), h("div", { class: "sub-container" }, this.departureCity && h("div", { class: "departure" }, this.departureCity.name), h("div", { class: "name" }, (_a = this.currentTrek) === null || _a === void 0 ? void 0 : _a.name), h("div", { class: "themes-container" }, this.themes.map(theme => (h("div", { class: "theme" }, theme.label)))), h("div", { class: "icons-labels-container" }, h("div", { class: "row" }, h("div", { class: "icon-label difficulty" }, ((_b = this.difficulty) === null || _b === void 0 ? void 0 : _b.pictogram) && h("img", { src: this.difficulty.pictogram }), (_c = this.difficulty) === null || _c === void 0 ? void 0 :
+      _c.label), h("div", { class: "icon-label duration" }, h("div", { class: "svg-icon", innerHTML: durationImage }), formatDuration(this.currentTrek.duration))), 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: "row" }, h("div", { class: "icon-label route" }, ((_d = this.route) === null || _d === void 0 ? void 0 : _d.pictogram) && h("img", { src: this.route.pictogram }), (_e = this.route) === null || _e === void 0 ? void 0 :
+      _e.route), h("div", { class: "icon-label practice" }, ((_f = this.practice) === null || _f === void 0 ? void 0 : _f.pictogram) && h("img", { src: this.practice.pictogram }), (_g = this.practice) === null || _g === void 0 ? void 0 :
+      _g.name))))))));
   }
   static get is() { return "grw-trek-card"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["grw-trek-card.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["grw-trek-card.css"]
-  }; }
-  static get properties() { return {
-    "trek": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Trek",
-        "resolved": "{ id: number; name: string; attachments: Attachments; description?: string; description_teaser: string; difficulty: number; route: number; practice: number; themes: number[]; duration: number; length_2d: number; ascent: number; departure: string; arrival?: string; altimetric_profile?: string; geometry?: LineString; departure_geom?: Position; gpx?: string; kml?: string; pdf?: string; parking_location?: Position; ambiance?: string; access?: string; public_transport?: string; advice?: string; advised_parking?: string; gear?: string; labels?: number[]; points_reference?: MultiPoint; source?: number[]; structure?: number; disabled_infrastructure?: string; accessibilities?: number[]; accessibility_level?: number; accessibility_slope?: string; accessibility_width?: string; accessibility_signage?: string; accessibility_covering?: string; accessibility_exposure?: string; accessibility_advice?: string; }",
-        "references": {
-          "Trek": {
-            "location": "import",
-            "path": "types/types"
+  static get originalStyleUrls() {
+    return {
+      "$": ["grw-trek-card.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["grw-trek-card.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "trek": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "Trek",
+          "resolved": "{ id: number; name: string; attachments: Attachments; description?: string; description_teaser: string; difficulty: number; route: number; practice: number; themes: number[]; duration: number; length_2d: number; ascent: number; departure: string; departure_city: string; arrival?: string; altimetric_profile?: string; geometry?: LineString; departure_geom?: Position; gpx?: string; kml?: string; pdf?: string; parking_location?: Position; ambiance?: string; access?: string; public_transport?: string; advice?: string; advised_parking?: string; gear?: string; labels?: number[]; points_reference?: MultiPoint; source?: number[]; structure?: number; disabled_infrastructure?: string; accessibilities?: number[]; accessibility_level?: number; accessibility_slope?: string; accessibility_width?: string; accessibility_signage?: string; accessibility_covering?: string; accessibility_exposure?: string; accessibility_advice?: string; }",
+          "references": {
+            "Trek": {
+              "location": "import",
+              "path": "types/types"
+            }
           }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
         }
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    },
-    "colorPrimary": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "color-primary",
-      "reflect": false,
-      "defaultValue": "'#6b0030'"
-    },
-    "colorPrimaryTint": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "colorPrimary": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "color-primary",
+        "reflect": false,
+        "defaultValue": "'#6b0030'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "colorPrimaryTint": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "color-primary-tint",
+        "reflect": false,
+        "defaultValue": "'#974c6e'"
       },
-      "attribute": "color-primary-tint",
-      "reflect": false,
-      "defaultValue": "'#974c6e'"
-    },
-    "isLargeView": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "isLargeView": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-large-view",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "is-large-view",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "currentTrek": {},
-    "difficulty": {},
-    "route": {},
-    "practice": {},
-    "themes": {}
-  }; }
-  static get events() { return [{
-      "method": "trekCardPress",
-      "name": "trekCardPress",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
+      "resetStoreOnDisconnected": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "reset-store-on-disconnected",
+        "reflect": false,
+        "defaultValue": "true"
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "currentTrek": {},
+      "difficulty": {},
+      "route": {},
+      "practice": {},
+      "themes": {},
+      "departureCity": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "trekCardPress",
+        "name": "trekCardPress",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        }
+      }];
+  }
 }