src/app/features/map/components/leaflet/leaflet-map.component.html

<!-------------------------------------------------------------------------------
 * Copyright (c) 2020 Contributors to the Eclipse Foundation
 *
 * See the NOTICE file(s) distributed with this work for additional
 * information regarding copyright ownership.
 *
 * This program and the accompanying materials are made available under the
 * terms of the Eclipse Public License 2.0 which is available at
 * http://www.eclipse.org/legal/epl-2.0
 *
 * SPDX-License-Identifier: EPL-2.0
 -------------------------------------------------------------------------------->

<div class="map">
  <div #appLeaflet="appLeaflet"
       (appClick)="appClick.emit($event )"
       (appPopupClose)="appPopupClose.emit($event)"
       (appLatLngZoomChange)="appCenterChange.emit($event)"
       [appCenter]="appCenter | stringToLatLngZoom"
       [appDisabled]="appDisabled"
       appLeaflet
       class="map--leaflet">

    <ng-content></ng-content>

  </div>

  <div class="map--search">
    <input #inputElement
           (keydown.enter)="search(inputElement.value);"
           [placeholder]="'search.placeHolder' | translate"
           class="openk-input map--search--input"/>

    <button (click)="search(inputElement.value);"
            *ngIf="(appIsLoading$ | async) !== true"
            class="openk-button openk-info map--search--btn">
      <mat-icon class="map--search--icon">search</mat-icon>
    </button>

    <app-progress-spinner *ngIf="(appIsLoading$ | async) === true" class="progress-spinner">
    </app-progress-spinner>
  </div>

  <app-action-button
    (appClick)="appOpenGis.emit(appLeaflet.getBounds())"
    [appIcon]="'my_location'"
    class="map--button openk-info">
    {{'shared.map.openGIS' | translate}}
  </app-action-button>
</div>

<label *ngIf="appSubCaption" class="sub-caption">
  {{appSubCaption}}
</label>