fix(layers): add missing inputs

Closes #318

Author: jeremy-eychenne

projects/ngx-openlayers/src/lib/layers/layer.component.ts

@@ -4,9 +4,12 @@ import RenderEvent from 'ol/render/Event';
 import { MapComponent } from '../map.component';
 import { LayerGroupComponent } from './layergroup.component';
 import BaseObject from 'ol/Object';
+import Map from 'ol/Map';
 
 @Directive()
 export abstract class LayerComponent implements OnInit, OnChanges, OnDestroy {
+  @Input()
+  className: string;
   @Input()
   opacity: number;
   @Input()
@@ -19,6 +22,16 @@ export abstract class LayerComponent implements OnInit, OnChanges, OnDestroy {
   minResolution: number;
   @Input()
   maxResolution: number;
+  @Input()
+  minZoom: number;
+  @Input()
+  maxZoom: number;
+  @Input()
+  map: Map;
+  @Input()
+  properties: {
+    [x: string]: unknown;
+  };
 
   @Input()
   prerender: (evt: RenderEvent) => void;

projects/ngx-openlayers/src/lib/layers/layergroup.component.ts

@@ -3,11 +3,13 @@ import { Group } from 'ol/layer';
 import { MapComponent } from '../map.component';
 import { Extent } from 'ol/extent';
 import BaseObject from 'ol/Object';
+import BaseLayer from 'ol/layer/Base';
+import Collection from 'ol/Collection';
 
 @Component({
-    selector: 'aol-layer-group',
-    template: ` <ng-content></ng-content> `,
-    standalone: true,
+  selector: 'aol-layer-group',
+  template: ` <ng-content></ng-content> `,
+  standalone: true,
 })
 export class LayerGroupComponent implements OnInit, OnDestroy, OnChanges {
   @Input()
@@ -22,6 +24,16 @@ export class LayerGroupComponent implements OnInit, OnDestroy, OnChanges {
   minResolution: number;
   @Input()
   maxResolution: number;
+  @Input()
+  minZoom: number;
+  @Input()
+  maxZoom: number;
+  @Input()
+  layers: BaseLayer[] | Collection<BaseLayer>;
+  @Input()
+  properties: {
+    [x: string]: unknown;
+  };
 
   public instance: Group;
   componentType = 'layer';

projects/ngx-openlayers/src/lib/layers/layerimage.component.ts

@@ -1,30 +1,16 @@
-import { Component, Input, OnChanges, OnInit, Optional, SimpleChanges } from '@angular/core';
-import { Extent } from 'ol/extent';
+import { Component, OnChanges, OnInit, Optional, SimpleChanges } from '@angular/core';
 import { Image } from 'ol/layer';
 import ImageSource from 'ol/source/Image';
 import { MapComponent } from '../map.component';
 import { LayerComponent } from './layer.component';
 import { LayerGroupComponent } from './layergroup.component';
 
 @Component({
-    selector: 'aol-layer-image',
-    template: ` <ng-content></ng-content> `,
-    standalone: true,
+  selector: 'aol-layer-image',
+  template: ` <ng-content></ng-content> `,
+  standalone: true,
 })
 export class LayerImageComponent extends LayerComponent implements OnInit, OnChanges {
-  @Input()
-  opacity: number;
-  @Input()
-  visible: boolean;
-  @Input()
-  extent: Extent;
-  @Input()
-  minResolution: number;
-  @Input()
-  maxResolution: number;
-  @Input()
-  zIndex: number;
-
   source: ImageSource;
 
   constructor(map: MapComponent, @Optional() group?: LayerGroupComponent) {

projects/ngx-openlayers/src/lib/layers/layertile.component.ts

@@ -4,17 +4,22 @@ import TileSource from 'ol/source/Tile';
 import { MapComponent } from '../map.component';
 import { LayerComponent } from './layer.component';
 import { LayerGroupComponent } from './layergroup.component';
+import { BackgroundColor } from 'ol/layer/Base';
 
 @Component({
-    selector: 'aol-layer-tile',
-    template: ` <ng-content></ng-content> `,
-    standalone: true,
+  selector: 'aol-layer-tile',
+  template: ` <ng-content></ng-content> `,
+  standalone: true,
 })
 export class LayerTileComponent extends LayerComponent implements OnInit, OnDestroy, OnChanges {
   @Input()
   preload: number;
   @Input()
+  background: BackgroundColor;
+  @Input()
   useInterimTilesOnError: boolean;
+  @Input()
+  cacheSize: number;
 
   source: TileSource;
 

projects/ngx-openlayers/src/lib/layers/layervector.component.ts

@@ -6,6 +6,8 @@ import { StyleFunction } from 'ol/style/Style';
 import { MapComponent } from '../map.component';
 import { LayerComponent } from './layer.component';
 import { LayerGroupComponent } from './layergroup.component';
+import { OrderFunction } from 'ol/render';
+import { BackgroundColor } from 'ol/layer/Base';
 
 @Component({
     selector: 'aol-layer-vector',
@@ -15,15 +17,18 @@ import { LayerGroupComponent } from './layergroup.component';
 export class LayerVectorComponent extends LayerComponent implements OnInit, OnDestroy, OnChanges {
   @Input()
   renderBuffer: number;
-
   @Input()
   style: Style | Style[] | StyleFunction;
-
   @Input()
   updateWhileAnimating: boolean;
-
   @Input()
   updateWhileInteracting: boolean;
+  @Input()
+  renderOrder: OrderFunction;
+  @Input()
+  declutter: string | number | boolean;
+  @Input()
+  background: BackgroundColor;
 
   source: VectorSource;
 

projects/ngx-openlayers/src/lib/layers/layervectortile.component.ts

@@ -1,34 +1,42 @@
 import { Component, Input, OnChanges, OnInit, Optional, SimpleChanges } from '@angular/core';
-import { Feature } from 'ol';
 import { VectorTile } from 'ol/layer';
 import { Style } from 'ol/style';
 import { StyleFunction } from 'ol/style/Style';
 import { MapComponent } from '../map.component';
 import { LayerComponent } from './layer.component';
 import { LayerGroupComponent } from './layergroup.component';
 import { VectorTileRenderType } from 'ol/layer/VectorTile';
+import { OrderFunction } from 'ol/render';
+import { BackgroundColor } from 'ol/layer/Base';
 
 @Component({
-    selector: 'aol-layer-vectortile',
-    template: ` <ng-content></ng-content> `,
-    standalone: true,
+  selector: 'aol-layer-vectortile',
+  template: ` <ng-content></ng-content> `,
+  standalone: true,
 })
 export class LayerVectorTileComponent extends LayerComponent implements OnInit, OnChanges {
+  @Input()
+  renderOrder: OrderFunction;
   @Input()
   renderBuffer: number;
   @Input()
   renderMode: VectorTileRenderType;
-  /* not marked as optional in the typings */
-  @Input()
-  renderOrder: (feature1: Feature, feature2: Feature) => number;
   @Input()
   style: Style | Style[] | StyleFunction;
   @Input()
   updateWhileAnimating: boolean;
   @Input()
   updateWhileInteracting: boolean;
   @Input()
-  visible: boolean;
+  declutter: string | number | boolean;
+  @Input()
+  background: BackgroundColor;
+  @Input()
+  preload: number;
+  @Input()
+  useInterimTilesOnError: boolean;
+  @Input()
+  cacheSize: number;
 
   constructor(map: MapComponent, @Optional() group?: LayerGroupComponent) {
     super(group || map);