@provoly/dashboard 0.22.4 → 0.22.6

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

@@ -25,16 +25,45 @@
     @include typography-level(themed($theme-map, 'typography', 'panel'));
   }
 
+  .ol-control {
+    button {
+      color: themed($theme-map, 'color', 'primary', 600);
+
+      &:hover {
+        @include changeBgColor(
+          $targetBgColor: themed($theme-map, 'color', 'primary', 600),
+          $targetTextColor: themed($theme-map, 'color', 'primary', 'contrast', 50),
+          $targetBorderColor: themed($theme-map, 'color', 'primary', 600)
+        );
+      }
+    }
+  }
+
   .m-btn-group.-selection-choice, .m-btn-group.-map-selection-choice {
     border-color: themed($theme-map, 'color', 'primary', 400);
+    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);
+
+    &.-map-export {
+      &:hover {
+        @include changeBgColor(
+          $targetBgColor: themed($theme-map, 'color', 'primary', 600),
+          $targetTextColor: themed($theme-map, 'color', 'primary', 'contrast', 50),
+          $targetBorderColor: themed($theme-map, 'color', 'primary', 600)
+        );
+
+        button {
+          color: themed($theme-map, 'color', 'primary', 50);
+        }
+      }
+    }
 
     .a-btn {
-      color: #113b6e;
+      color: themed($theme-map, 'color', 'primary', 600);
       background-color: transparent;
 
       &.-selected {
         color: themed($theme-map, 'color', 'accent', 500);
-        background-color: themed($theme-map, 'color', 'primary', 'contrast', 500);
+        background-color: themed($theme-map, 'color', 'primary', 'contrast', 50);
       }
     }
   }

package/styles-theme/components-theme/_overlay.theme.scss

@@ -9,7 +9,7 @@
   background-color: themed($theme-map, 'color', 'primary', 50);
 
   &.pry-tooltip-reversed {
-    color: themed($theme-map, 'color', 'primary', 'contrast', 700);
+    color: themed($theme-map, 'color', 'primary', 'contrast', 50);
     background-color: themed($theme-map, 'color', 'graph', 01);
   }
 
@@ -21,10 +21,10 @@
 
 .pry-overlay-container {
   color: themed($theme-map, 'color', 'graph', 01);
-  background-color: themed($theme-map, 'color', 'primary', 'contrast', 700);
+  background-color: themed($theme-map, 'color', 'primary', 'contrast', 50);
 
   &.pry-overlay-reversed {
-    color: themed($theme-map, 'color', 'primary', 'contrast', 700);
+    color: themed($theme-map, 'color', 'primary', 'contrast', 50);
     background-color: themed($theme-map, 'color', 'graph', 01);
   }
 

package/styles-theme/layout-theme/_o-base-layout.theme.scss

@@ -6,19 +6,20 @@
 .o-base-layout {
   &__title {
     border-right: 1px themed($theme-map, 'color', 'primary', 400) solid;
+    border-bottom: 1px themed($theme-map, 'color', 'primary', 400) solid;
 
     .a-btn {
-      color: themed($theme-map, 'color', 'primary', 'contrast', 600);
+      color: themed($theme-map, 'color', 'primary', 'contrast', 50);
     }
   }
 
   &__menu {
     border-right: 1px themed($theme-map, 'color', 'primary', 400) solid;
-    color: themed($theme-map, 'color', 'primary', 'contrast', 600);
+    color: themed($theme-map, 'color', 'primary', 'contrast', 50);
   }
 
   &__toolbox {
     border-bottom-color: themed($theme-map, 'color', 'primary', 300);
-    color: themed($theme-map, 'color', 'primary', 'contrast', 100);
+    color: themed($theme-map, 'color', 'primary', 'contrast', 50);
   }
 }

package/styles-theme/layout-theme/_o-manifest-layout.theme.scss

@@ -6,7 +6,13 @@
 .o-manifest-layout {
   &__toolbox {
     border-bottom-color: themed($theme-map, 'color', 'primary', 300);
-    color: themed($theme-map, 'color', 'primary', 'contrast', 100);
+    color: themed($theme-map, 'color', 'primary', 'contrast', 50);
+
+    &__search {
+      .a-icon {
+        color: themed($theme-map, 'color', 'primary', 600);
+      }
+    }
   }
 
   .o-card-manifest {
@@ -22,7 +28,7 @@
       }
     }
 
-    .m-btn-group .a-btn {
+    .m-btn-group .search-icon {
       color: themed($theme-map, 'color', 'primary', 400);
 
       &:hover {

package/styles-theme/libs-theme/_reset-lib-ol.theme.scss

@@ -6,30 +6,39 @@
 .ol-control button {
   border-color: themed($theme-map, 'color', 'primary', 400);
   background-color: themed($theme-map, 'color', 'grey', 50);
+  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);
 }
 
 .ol-zoom {
   .ol-zoom-in,
   .ol-zoom-out {
-    color: themed($theme-map, 'color', 'primary', 500);
+    font-family: Arial, sans-serif;
+    font-weight: 300;
+    font-size: toRem(24);
+    color: themed($theme-map, 'color', 'primary', 600);
     background-color: themed($theme-map, 'color', 'grey', 50);
 
     &:hover,
     &:focus {
-      background-color: themed($theme-map, 'color', 'grey', 200);
+      @include changeBgColor(
+        $targetBgColor: themed($theme-map, 'color', 'primary', 600),
+        $targetTextColor: themed($theme-map, 'color', 'primary', 'contrast', 50),
+        $targetBorderColor: themed($theme-map, 'color', 'primary', 600)
+      )
     }
   }
 }
 
 .ol-searchbar button,
 .layer-switcher button {
+  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);
   border-color: themed($theme-map, 'color', 'primary', 400) !important;
   background-color: themed($theme-map, 'color', 'grey', 50) !important;
 }
 
 .ol-control button:hover,
 .ol-control button:focus {
-  background-color: themed($theme-map, 'color', 'grey', 200) !important;
+  background-color: themed($theme-map, 'color', 'grey', 200);
 }
 
 .ol-searchbar,

package/styles-theme/main-theme.scss

@@ -4,8 +4,10 @@
 @use 'components-theme/a-badge.theme' as *;
 @use 'components-theme/a-btn.theme' as *;
 @use 'components-theme/a-checkbox.theme' as *;
-@use 'components-theme/a-icon.theme' as *;
+@use 'components-theme/a-chip.theme' as *;
+@use 'components-theme/a-expandable-value.theme' as *;
 @use 'components-theme/a-form-field.theme' as *;
+@use 'components-theme/a-icon.theme' as *;
 @use 'components-theme/a-label.theme' as *;
 @use 'components-theme/a-link.theme' as *;
 @use 'components-theme/a-page-loader.theme' as *;
@@ -14,7 +16,6 @@
 @use 'components-theme/a-table.theme' as *;
 @use 'components-theme/a-toggle.theme' as *;
 @use 'components-theme/a-tooltip.theme' as *;
-@use 'components-theme/a-expandable-value.theme' as *;
 
 
 /* Atoms lib */
@@ -25,15 +26,17 @@
 @use 'components-theme/m-choose-widget.theme' as *;
 @use 'components-theme/m-context-menu.theme' as *;
 @use 'components-theme/m-filter.theme' as *;
+@use 'components-theme/m-form-radio-group.theme' as *;
+@use 'components-theme/m-info-icon.theme' as *;
 @use 'components-theme/m-metadata-tag.theme' as *;
 @use 'components-theme/m-minus-plus.theme' as *;
 @use 'components-theme/m-nav-links.theme' as *;
 @use 'components-theme/m-notifications.theme' as *;
+@use 'components-theme/m-pry-search-select-attribute.theme' as *;
 @use 'components-theme/m-snackbar.theme' as *;
 @use 'components-theme/m-time-picker.theme' as *;
 @use 'components-theme/m-toolbox.theme' as *;
 @use 'components-theme/m-tooltip.theme' as *;
-@use 'components-theme/m-pry-search-select-attribute.theme' as *;
 
 /* Organisms */
 @use 'components-theme/o-accordion.theme' as *;
@@ -41,7 +44,6 @@
 @use 'components-theme/o-catalog.theme' as *;
 @use 'components-theme/o-dashboard.theme' as *;
 @use 'components-theme/o-date-picker.theme' as *;
-@use 'components-theme/o-datasources.theme' as *;
 @use 'components-theme/o-draggable-menu.theme' as *;
 @use 'components-theme/o-modal.theme' as *;
 @use 'components-theme/o-multi-class-condition.theme' as *;

package/toolbox/components/automate-refresh/automate-refresh.component.d.ts

@@ -1,12 +1,14 @@
 import { Overlay, OverlayRef } from '@angular/cdk/overlay';
 import { OnInit, TemplateRef, ViewContainerRef } from '@angular/core';
 import { Store } from '@ngrx/store';
+import { WidgetFactoryService } from '@provoly/dashboard';
 import { Observable } from 'rxjs';
 import { ToolboxActionComponent } from '../toolbox-action/toolbox-action.component';
 import * as i0 from "@angular/core";
 export declare class AutomateRefreshComponent extends ToolboxActionComponent implements OnInit {
     private overlay;
     private viewContainerRef;
+    private widgetFactoryService;
     datasourceList: TemplateRef<any>;
     refreshRateList: TemplateRef<any>;
     refreshRates: number[];
@@ -18,7 +20,7 @@ export declare class AutomateRefreshComponent extends ToolboxActionComponent imp
     allRefreshRate$: Observable<number>;
     private overlayRefDatasourceList?;
     private overlayRefRefreshList?;
-    constructor(store: Store, overlay: Overlay, viewContainerRef: ViewContainerRef);
+    constructor(store: Store, overlay: Overlay, viewContainerRef: ViewContainerRef, widgetFactoryService: WidgetFactoryService);
     ngOnInit(): void;
     toggleDatasourceList(): void;
     hide(overlayRef: OverlayRef | undefined): void;

package/toolbox/components/filter-settings/filter-settings.component.d.ts

@@ -2,7 +2,7 @@ import { CdkDragDrop } from '@angular/cdk/drag-drop';
 import { Overlay, OverlayRef } from '@angular/cdk/overlay';
 import { Injector, TemplateRef, ViewContainerRef } from '@angular/core';
 import { Store } from '@ngrx/store';
-import { Class, DataSource, FieldType, Filter, FilterFactoryService, GlobalManifest } from '@provoly/dashboard';
+import { Class, DataSource, FieldType, Filter, FilterFactoryService, GlobalManifest, PryI18nService } from '@provoly/dashboard';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { ToolboxActionComponent } from '../toolbox-action/toolbox-action.component';
 import * as i0 from "@angular/core";
@@ -23,6 +23,7 @@ export declare class PryFilterSettingsComponent extends ToolboxActionComponent {
     private viewContainerRef;
     private filterFactoryService;
     private injector;
+    private i18nService;
     label: boolean;
     templateSettings: TemplateRef<any>;
     overlayRefSettings?: OverlayRef;
@@ -56,7 +57,7 @@ export declare class PryFilterSettingsComponent extends ToolboxActionComponent {
     }[]>;
     selectedAttribute$: BehaviorSubject<string[]>;
     container: ViewContainerRef;
-    constructor(store: Store, overlay: Overlay, viewContainerRef: ViewContainerRef, filterFactoryService: FilterFactoryService, injector: Injector);
+    constructor(store: Store, overlay: Overlay, viewContainerRef: ViewContainerRef, filterFactoryService: FilterFactoryService, injector: Injector, i18nService: PryI18nService);
     getDatasourceClass(dataSource: DataSource, classes: Class[]): Class | undefined;
     isValidAttributeForComponentType(componentType: string, attribute: Attribute): boolean;
     drop(event: CdkDragDrop<Filter[]>): void;

package/toolbox/components/refresh-datasets/refresh-datasets.component.d.ts

@@ -1,13 +1,14 @@
 import { Store } from '@ngrx/store';
-import { GlobalManifest } from '@provoly/dashboard';
+import { GlobalManifest, WidgetFactoryService } from '@provoly/dashboard';
 import { Observable } from 'rxjs';
 import { ToolboxActionComponent } from '../toolbox-action/toolbox-action.component';
 import * as i0 from "@angular/core";
 export declare class RefreshDatasetsComponent extends ToolboxActionComponent {
+    private widgetFactoryService;
     manifest$: Observable<GlobalManifest>;
     manifest?: GlobalManifest;
     datasetCount: number;
-    constructor(store: Store);
+    constructor(store: Store, widgetFactoryService: WidgetFactoryService);
     refresh(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<RefreshDatasetsComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<RefreshDatasetsComponent, "pry-refresh-datasets", never, {}, {}, never, never, false, never>;

package/toolbox/components/toolbox.component.d.ts

@@ -3,6 +3,7 @@ import { Store } from '@ngrx/store';
 import { DisplayOptions, PryBaseAccess } from '@provoly/dashboard';
 import { BehaviorSubject, Observable } from 'rxjs';
 import { ToolboxAction } from '../toolbox.model';
+import { ConnectedPosition } from '@angular/cdk/overlay';
 import * as i0 from "@angular/core";
 export declare class ToolboxComponent implements OnInit {
     private role;
@@ -12,6 +13,7 @@ export declare class ToolboxComponent implements OnInit {
         order: number;
     }[]>;
     displayLabels: boolean;
+    dropdownPosition: ConnectedPosition[];
     isManualMode$: Observable<boolean>;
     allActions$: Observable<ToolboxAction[]>;
     mainActions$: Observable<ToolboxAction[]>;
@@ -32,5 +34,5 @@ export declare class ToolboxComponent implements OnInit {
     closeDropdown($event: Event | void): void;
     getOrder(actionName: string): number | undefined;
     static ɵfac: i0.ɵɵFactoryDeclaration<ToolboxComponent, [null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToolboxComponent, "pry-toolbox", never, { "displayLabels": { "alias": "displayLabels"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "dropdownActions": { "alias": "dropdownActions"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToolboxComponent, "pry-toolbox", never, { "displayLabels": { "alias": "displayLabels"; "required": false; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "dropdownActions": { "alias": "dropdownActions"; "required": false; }; }, {}, never, never, false, never>;
 }

package/toolbox/style/_o-filter-settings.scss

@@ -12,10 +12,6 @@
   padding: toRem(30) toRem(40);
 }
 
-.backdrop {
-  background-color: rgba(0, 0, 0, 0.3);
-}
-
 .o-filters {
   width: 100%;
 

package/toolbox/style/_o-toolbox.scss

@@ -6,31 +6,7 @@
   &__list {
     display: flex;
     flex-direction: column;
-
-    &__item {
-      .a-btn {
-        border: none;
-        color: #40b688;
-        font-weight: 500;
-        margin-bottom: toRem(-5);
-      }
-
-      .a-btn:disabled {
-        color: #40b688;
-        opacity: 0.5;
-      }
-
-      .a-btn::before {
-        content: '\2192';
-        font-size: toRem(20);
-        padding-bottom: toRem(10);
-      }
-
-      pry-toolbox-action-instanciator {
-        .a-tooltip[data-tooltip][data-tooltip-position=bottom]::after {
-          top: calc(100% - 10px);
-        }
-      }
-    }
+    padding: toRem(4) 0;
+    align-items: flex-end;
   }
 }

package/widgets/widget-aggregated-chart/style/_o-widget-chart.scss

@@ -18,6 +18,9 @@
 
   div.vega-embed {
     display: block;
+    position: absolute;
+    height: 100%;
+    width: 100%;
   }
 
   div.vega-embed.has-actions {

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

@@ -48,7 +48,6 @@ export declare class WidgetGraphComponent extends DataWidgetComponent implements
     relationTypes: RelationType[];
     move$: Subject<MouseEvent>;
     mode: 'move' | 'rectangle';
-    bottomLeft$: Observable<string>;
     offset: number[];
     additionnalOffset: [number, number];
     layouts: {

package/widgets/widget-graph/style/_o-widget-graph.scss

@@ -3,6 +3,20 @@
 /* Organism - widget graph */
 /* Extends o-widget */
 
+.o-widget {
+  &--graph {
+    &__canvas {
+      position: absolute;
+      height: 100%;
+      width: 100%;
+    }
+  }
+
+  .m-btn-group.-selection-choice {
+    transform: translate(10px, 10px);
+  }
+}
+
 .a-tooltip {
   &--move {
     &[data-tooltip]:not([data-tooltip-position])::after {

package/widgets/widget-map/pipe/widget-map-legend-url.pipe.d.ts

@@ -9,7 +9,7 @@ export declare class WidgetMapLegendUrlPipe implements PipeTransform {
             [p: string]: GetCapabilitiesResponse | null;
         } | undefined | null;
     }]): string;
-    returnStyleForLayer(style: ChildNode): any;
+    returnStyleForLayer(style: ChildNode): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<WidgetMapLegendUrlPipe, never>;
     static ɵpipe: i0.ɵɵPipeDeclaration<WidgetMapLegendUrlPipe, "legendUrl", false>;
 }

package/widgets/widget-map/style/{_o-layer-legend.scss → _m-layer-legend.scss}

@@ -1,4 +1,4 @@
-@use '../../../styles/abstracts/index' as *;
+@use '../../../styles/abstracts' as *;
 
 .m-map-layer-action {
   display: flex;
@@ -6,6 +6,10 @@
   z-index: 2;
   right: toRem(8);
 
+  button {
+    border-radius: 8px;
+  }
+
   &.ol-control {
     border: none;
     background-color: transparent;
@@ -21,11 +25,6 @@
     height: toRem(30);
   }
 
-  button {
-    background-color: #fafafa !important;
-    color: #113b6e;
-  }
-
   &__title {
     display: flex;
     flex-direction: row;
@@ -41,7 +40,7 @@
   &__container {
     color: #113b6e;
     background-color: white;
-    border-radius: toRem(2);
+    border-radius: toRem(8);
     padding: toRem(5) toRem(8);
 
     .a-h4 {
@@ -90,7 +89,7 @@
   position: absolute;
   z-index: 1;
   background-color: white;
-  border-radius: toRem(5);
+  border-radius: toRem(8);
   padding: toRem(5);
 
   &.-left {

package/widgets/widget-map/style/_o-widget-map.scss

@@ -41,7 +41,7 @@
   right: unset;
   border-width: toRem(1);
   border-style: solid;
-  border-radius: toRem(7);
+  border-radius: toRem(8);
 
   button {
     background-size: 30px;
@@ -57,7 +57,7 @@
 .ol-attribution, .ol-zoom {
   top: toRem(5);
   bottom: unset;
-  border-radius: toRem(6);
+  border-radius: toRem(8);
   padding: 0;
   border: none;
   background: white;

package/styles/components/_a-chips.scss

@@ -1,15 +0,0 @@
-@use '../abstracts' as *;
-
-.a-chips {
-  border-radius: toRem(20);
-  height: toRem(14);
-  line-height: toRem(10);
-  font-size: toRem(10);
-  padding: toRem(3);
-
-  &.-md {
-    height: toRem(18);
-    line-height: toRem(14);
-    font-size: toRem(14);
-  }
-}

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

@@ -1,41 +0,0 @@
-@use '../../styles/abstracts' as *;
-@use '../abstracts-theme' as *;
-
-/**
-  Theme organism- Datas sources
- */
-
-.o-datasources {
-  &__list {
-    &--selected {
-      .a-btn--icon-text {
-        color: themed($theme-map, 'color', 'primary', 600);
-        background-color: themed($theme-map, 'color', 'accent', 'contrast', 600);
-        box-shadow: themed($theme-map, 'decoration', 'shadow', 'default');
-        font-size: toRem(14);
-        font-weight: 500;
-
-        pry-icon {
-          background-color: themed($theme-map, 'color', 'accent', 600);
-          color: themed($theme-map, 'color', 'accent', 'contrast', 600);
-          border-radius: 50%;
-        }
-      }
-    }
-  }
-
-  &__card,
-  .o-pry-card {
-    @extend %card-with-hover;
-
-    &.-selected {
-      color: themed($theme-map, 'color', 'accent', 'contrast', 600);
-      background-color: themed($theme-map, 'color', 'accent', 600);
-
-      .a-btn.a-btn--primary {
-        color: themed($theme-map, 'color', 'accent', 600);
-        background-color: themed($theme-map, 'color', 'accent', 'contrast', 600);
-      }
-    }
-  }
-}