@mapsindoors/map-template 1.95.1 → 1.95.2

package/dist/mi-route-instructions-maneuver.entry.js

@@ -1,82 +1,86 @@
-import { r as registerInstance, h, H as Host } from './index-7e9696f3.js';
-import { U as UnitSystem } from './unit-system.enum-eaefb53e.js';
+import { r as registerInstance, h, H as Host } from './index-BZQHyS7V.js';
+import { U as UnitSystem } from './unit-system.enum-BwPgAWqL.js';
 
-const routeInstructionsManeuverCss = ":host{display:grid;gap:24px;grid-auto-flow:column;align-items:center;grid-template-columns:24px 1fr;border-top:1px solid #e5e7eb;padding:16px}.icon{width:24px;height:24px}.description{font-size:16px;display:grid;gap:8px;height:-moz-fit-content;height:fit-content}.description__text{margin:0;font-size:16px;word-break:break-all}.description mi-distance{font-size:12px;color:#6b7280}";
+const routeInstructionsManeuverCss = () => `:host{display:grid;gap:24px;grid-auto-flow:column;align-items:center;grid-template-columns:24px 1fr;border-top:1px solid #e5e7eb;padding:16px}.icon{width:24px;height:24px}.description{font-size:16px;display:grid;gap:8px;height:-moz-fit-content;height:fit-content}.description__text{margin:0;font-size:16px;word-break:break-all}.description mi-distance{font-size:12px;color:#6b7280}`;
 
 const RouteInstructionsManeuver = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.maneuver = undefined;
-    this.maneuverData = undefined;
-    this.translations = undefined;
-    this.translationsData = undefined;
-    this.unit = UnitSystem.Metric;
-  }
-  parseManeuverProp() {
-    this.maneuverData = JSON.parse(this.maneuver);
-  }
-  parseTranslationsProp() {
-    this.translationsData = JSON.parse(this.translations);
-  }
-  componentWillLoad() {
-    this.parseManeuverProp();
-    this.parseTranslationsProp();
-  }
-  /**
-   * Get maneuver name.
-   *
-   * @returns {string}
-   */
-  getManeuverName(maneuver) {
-    if (maneuver.includes('straight'))
-      return 'straight';
-    if (maneuver.includes('sharp right'))
-      return 'sharp-right';
-    if (maneuver.includes('sharp left'))
-      return 'sharp-left';
-    if (maneuver.includes('slight right'))
-      return 'slight-right';
-    if (maneuver.includes('slight left'))
-      return 'slight-left';
-    if (maneuver.includes('right'))
-      return 'right';
-    if (maneuver.includes('left'))
-      return 'left';
-    if (maneuver.includes('uturn'))
-      return 'u-turn';
-    if (maneuver.includes('depart'))
-      return 'straight';
-  }
-  render() {
-    return (this.maneuverData && this.translationsData ? this.renderManeuver() : null);
-  }
-  /**
-   * Render step.
-   *
-   * @returns {JSX.Element}
-   */
-  renderManeuver() {
-    const maneuverStrings = {
-      'straight': this.translationsData.continueStraightAhead,
-      'left': `${this.translationsData.goLeft} ${this.translationsData.andContinue}`,
-      'sharp-left': `${this.translationsData.goSharpLeft} ${this.translationsData.andContinue}`,
-      'slight-left': `${this.translationsData.goSlightLeft} ${this.translationsData.andContinue}`,
-      'right': `${this.translationsData.goRight} ${this.translationsData.andContinue}`,
-      'sharp-right': `${this.translationsData.goSharpRight} ${this.translationsData.andContinue}`,
-      'slight-right': `${this.translationsData.goSlightRight} ${this.translationsData.andContinue}`,
-      'u-turn': `${this.translationsData.turnAround} ${this.translationsData.andContinue}`, // 'Turn around and continue'
-    };
-    const maneuver = this.getManeuverName(this.maneuverData.maneuver.toLowerCase());
-    const iconName = `arrow-${maneuver}`;
-    // Check if the instructions property has a value otherwise fallback to maneuver property
-    const translatedManeuver = this.maneuverData.instructions ? this.maneuverData.instructions : maneuverStrings[maneuver];
-    return (h(Host, null, h("div", { class: "icon" }, maneuver ? h("mi-icon", { part: "maneuver-icon", "icon-name": iconName }) : null), h("div", { class: "description" }, h("div", { class: "description__text" }, translatedManeuver), h("mi-distance", { part: "maneuver-description-distance", meters: this.maneuverData.distance.value, unit: this.unit }))));
-  }
-  static get watchers() { return {
-    "maneuver": ["parseManeuverProp"],
-    "translations": ["parseTranslationsProp"]
-  }; }
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * Set imperial or metric as default unit system.
+         * @type {UnitSystem} 'imperial' or 'metric'
+         */
+        this.unit = UnitSystem.Metric;
+    }
+    parseManeuverProp() {
+        this.maneuverData = JSON.parse(this.maneuver);
+    }
+    parseTranslationsProp() {
+        this.translationsData = JSON.parse(this.translations);
+    }
+    componentWillLoad() {
+        this.parseManeuverProp();
+        this.parseTranslationsProp();
+    }
+    /**
+     * Get maneuver name.
+     *
+     * @returns {string}
+     */
+    getManeuverName(maneuver) {
+        if (maneuver.includes('straight'))
+            return 'straight';
+        if (maneuver.includes('sharp right'))
+            return 'sharp-right';
+        if (maneuver.includes('sharp left'))
+            return 'sharp-left';
+        if (maneuver.includes('slight right'))
+            return 'slight-right';
+        if (maneuver.includes('slight left'))
+            return 'slight-left';
+        if (maneuver.includes('right'))
+            return 'right';
+        if (maneuver.includes('left'))
+            return 'left';
+        if (maneuver.includes('uturn'))
+            return 'u-turn';
+        if (maneuver.includes('depart'))
+            return 'straight';
+    }
+    render() {
+        return (this.maneuverData && this.translationsData ? this.renderManeuver() : null);
+    }
+    /**
+     * Render step.
+     *
+     * @returns {JSX.Element}
+     */
+    renderManeuver() {
+        const maneuverStrings = {
+            'straight': this.translationsData.continueStraightAhead, // 'Continue straight ahead',
+            'left': `${this.translationsData.goLeft} ${this.translationsData.andContinue}`, // 'Go left and continue',
+            'sharp-left': `${this.translationsData.goSharpLeft} ${this.translationsData.andContinue}`, // 'Go sharp left and continue',
+            'slight-left': `${this.translationsData.goSlightLeft} ${this.translationsData.andContinue}`, // 'Go slight left and continue',
+            'right': `${this.translationsData.goRight} ${this.translationsData.andContinue}`, // 'Go right and continue',
+            'sharp-right': `${this.translationsData.goSharpRight} ${this.translationsData.andContinue}`, // 'Go sharp right and continue',
+            'slight-right': `${this.translationsData.goSlightRight} ${this.translationsData.andContinue}`, // 'Go slight right and continue',
+            'u-turn': `${this.translationsData.turnAround} ${this.translationsData.andContinue}`, // 'Turn around and continue'
+        };
+        const maneuver = this.getManeuverName(this.maneuverData.maneuver.toLowerCase());
+        const iconName = `arrow-${maneuver}`;
+        // Check if the instructions property has a value otherwise fallback to maneuver property
+        const translatedManeuver = this.maneuverData.instructions ? this.maneuverData.instructions : maneuverStrings[maneuver];
+        return (h(Host, null, h("div", { class: "icon" }, maneuver ? h("mi-icon", { part: "maneuver-icon", "icon-name": iconName }) : null), h("div", { class: "description" }, h("div", { class: "description__text" }, translatedManeuver), h("mi-distance", { part: "maneuver-description-distance", meters: this.maneuverData.distance.value, unit: this.unit }))));
+    }
+    static get watchers() { return {
+        "maneuver": [{
+                "parseManeuverProp": 0
+            }],
+        "translations": [{
+                "parseTranslationsProp": 0
+            }]
+    }; }
 };
-RouteInstructionsManeuver.style = routeInstructionsManeuverCss;
+RouteInstructionsManeuver.style = routeInstructionsManeuverCss();
 
 export { RouteInstructionsManeuver as mi_route_instructions_maneuver };