@provoly/dashboard 0.12.9 → 0.13.1

package/styles/components/_o-accordion.scss

@@ -9,6 +9,21 @@
     min-height: toRem(55);
     padding: toRem(15) toRem(15);
     margin-bottom: toRem(0);
+    position: relative;
+    border-bottom-style: solid;
+    border-bottom-width: toRem(1);
+
+    // Border left colored
+    &:before {
+      @include panelBorderLeftColored(var(--border-color));
+    }
+
+    &__title {
+      // On active item, remove border-bottom, replaced by border-bottom on active panel
+      &.is-active {
+        border-bottom: none;
+      }
+    }
 
     &__btn {
       display: flex;
@@ -19,6 +34,82 @@
       line-height: 18px;
       font-weight: 700;
       border: 0 solid transparent;
+      width: 100%;
+      height: 70%;
+      padding: 0;
+      text-transform: uppercase;
+      text-align: left;
+    }
+  }
+
+  &__panel {
+    position: relative;
+
+    // Border-bottom on active panel
+    &[aria-hidden='false'] {
+      border-bottom-style: solid;
+      border-bottom-width: toRem(1);
+    }
+
+    // Head (input field)
+    &__head {
+      position: relative;
+      padding: toRem(2) toRem(10) toRem(20) toRem(10);
+
+      // Border left colored
+      &:before {
+        @include panelBorderLeftColored(var(--border-color));
+      }
+
+      pry-icon {
+        position: absolute;
+        top: toRem(12);
+        left: toRem(23);
+      }
+
+      .a-form-field {
+        padding-left: toRem(40);
+      }
+    }
+
+    // Components list
+    .o-pipeline__components {
+      @extend %list-unstyled;
+      position: relative;
+      z-index: 1;
+
+      li {
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        min-height: 40px;
+        padding: 0 toRem(15);
+        border-top-width: 1px;
+        border-top-style: solid;
+        cursor: grab;
+
+        // Border left colored
+        &:before {
+          @include panelBorderLeftColored(var(--border-color));
+        }
+
+        &:hover {
+          background-color: white;
+        }
+
+        &:active {
+          cursor: grabbing;
+        }
+
+        .a-p {
+          margin-bottom: 0;
+        }
+
+        .a-icon {
+          transform: scale(2.2);
+        }
+      }
     }
   }
 }

package/styles-theme/components-theme/_o-accordion.theme.scss

@@ -0,0 +1,30 @@
+@use '../../styles/abstracts' as *;
+@use '../abstracts-theme/variables.theme' as *;
+
+/* Theme organism - Accordion */
+
+.o-accordion {
+  &__title {
+    border-bottom-color: themed($theme-map, 'color', 'primary', 300);
+
+    &__btn pry-icon {
+      color: themed($theme-map, 'color', 'accent', 600);
+    }
+  }
+
+  &__panel {
+    &[aria-hidden='false'] {
+      border-bottom-color: themed($theme-map, 'color', 'primary', 300);
+    }
+
+    .o-pipeline__components {
+      li {
+        border-top-color: themed($theme-map, 'color', 'primary', 300);
+
+        .a-icon {
+          color: themed($theme-map, 'color', 'primary', 500);
+        }
+      }
+    }
+  }
+}

package/styles-theme/components-theme/_o-pipeline.theme.scss

@@ -16,32 +16,6 @@
     border-right: 1px solid themed($theme-map, 'color', 'primary', 300);
   }
 
-  .o-accordion {
-    &__title {
-      border-bottom-color: themed($theme-map, 'color', 'primary', 300);
-
-      &__btn pry-icon {
-        color: themed($theme-map, 'color', 'accent', 600);
-      }
-    }
-
-    &__panel {
-      &[aria-hidden='false'] {
-        border-bottom-color: themed($theme-map, 'color', 'primary', 300);
-      }
-
-      .o-pipeline__components {
-        li {
-          border-top-color: themed($theme-map, 'color', 'primary', 300);
-
-          .a-icon {
-            color: themed($theme-map, 'color', 'primary', 500);
-          }
-        }
-      }
-    }
-  }
-
   .o-pipeline-editor__properties {
     border-left: 1px solid themed($theme-map, 'color', 'primary', 300);
 

package/styles-theme/main-theme.scss

@@ -34,6 +34,7 @@
 @use 'components-theme/m-pry-search-select-attribute.theme' as *;
 
 /* Organisms */
+@use 'components-theme/o-accordion.theme' as *;
 @use 'components-theme/o-card.theme' as *;
 @use 'components-theme/o-catalog.theme' as *;
 @use 'components-theme/o-dashboard.theme' as *;

package/widgets/widget-map/component/widget-map.component.d.ts

@@ -2,24 +2,23 @@ import { Overlay as cdkOverlay } from '@angular/cdk/overlay';
 import { AfterViewInit, ComponentRef, ElementRef, Injector, TemplateRef, ViewContainerRef } from '@angular/core';
 import { Store } from '@ngrx/store';
 import { BaseTooltipComponent, BaseWidgetMapLayerOptions, Class, DataWidgetComponent, Field, GeocodingService, MapFeatureLayerOptions, MapGeoServerLayerOptions, MapRasterTileLayerOptions, MapVectorTileLayerOptions, MapWidgetBubbleLayerOptions, MapWidgetHeatMapLayerOptions, MapWidgetLayerOptions, MapWidgetMarkerLayerOptions, MapWidgetOptions, MapWMSLayerLayerOptions, MapWMTSLayerLayerOptions, PryI18nService, PrySnackbarService, SymbolService, TooltipFactoryService } from '@provoly/dashboard';
-import { Map, MapBrowserEvent, Overlay } from 'ol';
-import LayerSwitcher from 'ol-layerswitcher';
+import { Map } from 'ol';
 import { Geometry } from 'ol/geom';
 import BaseLayer from 'ol/layer/Base';
 import VectorLayer from 'ol/layer/Vector';
+import VectorTileLayer from 'ol/layer/VectorTile';
 import { Pixel } from 'ol/pixel';
 import VectorSource from 'ol/source/Vector';
 import { Style } from 'ol/style';
 import { BehaviorSubject, Observable } from 'rxjs';
-import { SelectionInteraction } from '../interaction/selection-interaction.class';
-import { SearchBarControl } from '../search-bar/search-bar.control';
+import { InteractionManager } from '../interaction/interaction-manager.class';
 import { WidgetMapLayerService } from './widget-map-layer.service';
 import * as i0 from "@angular/core";
 export declare class WidgetMapComponent extends DataWidgetComponent implements AfterViewInit {
     private snackBar;
-    private translateService;
+    translateService: PryI18nService;
     private tooltipFactoryService;
-    private geocodingService;
+    geocodingService: GeocodingService;
     private overlay;
     private viewContainerRef;
     private symbolService;
@@ -39,13 +38,9 @@ export declare class WidgetMapComponent extends DataWidgetComponent implements A
     selectedIds$: Observable<string[]>;
     bottomLeft$: Observable<string>;
     layers$: Observable<BaseLayer[]>;
-    selectionInteraction: SelectionInteraction;
     map: Map;
-    map$: Observable<Map>;
     additionalLayers$: BehaviorSubject<VectorLayer<VectorSource<Geometry>>[]>;
     private overlayRef?;
-    searchBarControl?: SearchBarControl;
-    layerSwitchControl?: LayerSwitcher;
     styles$: Observable<{
         identifier: string;
         label: string;
@@ -61,7 +56,7 @@ export declare class WidgetMapComponent extends DataWidgetComponent implements A
     height$: Observable<number>;
     actions$: BehaviorSubject<("click" | "lasso" | "rectangle" | "zoom" | "move" | "export" | "upload")[]>;
     private wmsFeatures$;
-    private classicFeatures$;
+    classicFeatures$: BehaviorSubject<any>;
     geoServerLayerDescriptions$: Observable<MapGeoServerLayerOptions[]>;
     legendTabOpen: boolean;
     legendTab: number;
@@ -78,10 +73,12 @@ export declare class WidgetMapComponent extends DataWidgetComponent implements A
         } | undefined;
         center?: number[] | undefined;
     }>;
-    interactionPopupOverlay?: Overlay;
-    interactionPopupListener?: (event: MapBrowserEvent<MouseEvent>) => void;
-    interactionPopupMode?: 'singleclick' | 'pointermove';
+    fitOption$: Observable<boolean>;
+    mapStyle$: Observable<string>;
+    interactionManager: InteractionManager;
+    mapStyleLayer$: Observable<VectorTileLayer[]>;
     constructor(store: Store<any>, snackBar: PrySnackbarService, translateService: PryI18nService, tooltipFactoryService: TooltipFactoryService, geocodingService: GeocodingService, overlay: cdkOverlay, viewContainerRef: ViewContainerRef, symbolService: SymbolService, injector: Injector, widgetMapLayerService: WidgetMapLayerService, el: ElementRef);
+    initInteractionManager(): InteractionManager;
     ngAfterViewInit(): void;
     initResultSet$(): Observable<import("@provoly/dashboard").ResultSet>;
     generateTooltip(value: {
@@ -90,16 +87,13 @@ export declare class WidgetMapComponent extends DataWidgetComponent implements A
         values: any;
     }): Promise<ComponentRef<BaseTooltipComponent> | null>;
     setDefaultLayerTitle(layer: MapWidgetLayerOptions, idx: number): void;
-    fitMapForObjects(options: MapWidgetOptions, selectedIds?: string[]): void;
-    private addOverlayOnInteraction;
-    private addContextMenuInteraction;
+    fitMapForObjects(fit: boolean, selectedIds?: string[]): void;
     private getAttributesForDrawing;
     private getIntensityAttribute;
     private getLocationAttribute;
     changeStyle($event: any): void;
     changeFit($event: boolean): void;
     changeAttributions($event: boolean): void;
-    changeTooltipMode($event: 'hover' | 'click'): void;
     addLayer(): void;
     changeLayerType($event: any, i: number): void;
     changeTitle($event: any, layer: MapWidgetLayerOptions): void;
@@ -119,20 +113,15 @@ export declare class WidgetMapComponent extends DataWidgetComponent implements A
     export(type: string): void;
     toImage(): Promise<string>;
     import(event: Event | DragEvent): void;
-    private addDropInteraction;
     changeClustered(layer: MapWidgetMarkerLayerOptions, $event: boolean): void;
     changeClusterDistance(layer: MapWidgetMarkerLayerOptions, $event: Event): void;
-    private addScaleControl;
-    private addSearchBarControl;
-    private addLayerSwitcher;
     hideAddress(): void;
-    private addUpdateZoomAndCenter;
     changeOpacity(layer: MapWidgetLayerOptions, $event: string): void;
     displayExportType($event: MouseEvent): void;
     hideExportType(): void;
     getWMSLayers(): import("ol/layer/Layer").default<import("ol/source/Source").default, import("ol/renderer/Layer").default<any>>[];
     isLayerRendered(layer: any): boolean;
-    private getFeatureFromServer;
+    getFeatureFromServer(wmsLayers: any[], pixel: Pixel): void;
     changeWmsClass($event: any, layer: MapWMSLayerLayerOptions): void;
     toggleLegend(index: number): void;
     toggleLegendWindow(): void;

package/widgets/widget-map/interaction/interaction-manager.class.d.ts

@@ -0,0 +1,27 @@
+import { MapBrowserEvent, Overlay } from 'ol';
+import LayerSwitcher from 'ol-layerswitcher';
+import { ScaleLine } from 'ol/control';
+import { WidgetMapComponent } from '../component/widget-map.component';
+import { SearchBarControl } from '../search-bar/search-bar.control';
+import { SelectionInteraction } from './selection-interaction.class';
+export declare class InteractionManager {
+    interactionPopupOverlay?: Overlay;
+    private component;
+    searchBarControl?: SearchBarControl;
+    layerSwitchControl?: LayerSwitcher;
+    scaleControl?: ScaleLine;
+    selectionInteraction: SelectionInteraction;
+    init(component: WidgetMapComponent): this;
+    listeners: {
+        contextMenu: (e: MouseEvent) => void;
+        drop: (e: DragEvent) => void;
+        popup: (event: MapBrowserEvent<MouseEvent>) => void;
+    };
+    private addContextMenuInteraction;
+    private addDropInteraction;
+    private addOverlayOnInteraction;
+    private addScaleControl;
+    private addSearchBarControl;
+    private addLayerSwitcher;
+    private addUpdateZoomAndCenter;
+}

package/widgets/widget-map/public-api.d.ts

@@ -3,4 +3,6 @@ export * from './component/widget-map.component';
 export * from './component/widget-map-layer.service';
 export * from './pipe/widget-map-geometry-fields-for.pipe';
 export * from './pipe/widget-map-legend-url.pipe';
+export * from './interaction/interaction-manager.class';
+export * from './interaction/selection-interaction.class';
 export * from './utils/widget-map.utils';