gridstack 8.1.2 → 8.2.0

package/angular/package.json

@@ -18,7 +18,7 @@
     "@angular/platform-browser": "^14.2.0",
     "@angular/platform-browser-dynamic": "^14.2.0",
     "@angular/router": "^14.2.0",
-    "gridstack": "^8.1.1",
+    "gridstack": "^8.1.2",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.11.4"

package/angular/projects/demo/src/app/app.component.ts

@@ -4,9 +4,9 @@ import { AngularSimpleComponent } from './simple';
 import { AngularNgForTestComponent } from './ngFor';
 import { AngularNgForCmdTestComponent } from './ngFor_cmd';
 
-// NOTE: local testing of file, but normal include would be 'gridstack/dist/angular'
-import { GridstackComponent, NgGridStackOptions, NgGridStackWidget, elementCB, gsCreateNgComponents, nodesCB } from '../../../../../dist/angular';
-// import { GridstackComponent, NgGridStackOptions, NgGridStackWidget, elementCB, gsCreateNgComponents, nodesCB } from 'gridstack/dist/angular';
+// NOTE: local testing of file
+// import { GridstackComponent, NgGridStackOptions, NgGridStackWidget, elementCB, gsCreateNgComponents, nodesCB } from './gridstack.component';
+import { GridstackComponent, NgGridStackOptions, NgGridStackWidget, elementCB, gsCreateNgComponents, nodesCB } from 'gridstack/dist/angular';
 
 // unique ids sets for each item for correct ngFor updating
 let ids = 1;
@@ -25,7 +25,7 @@ export class AppComponent implements OnInit {
   @ViewChild('textArea', {static: true}) textEl?: ElementRef<HTMLTextAreaElement>;
 
   // which sample to show
-  public show = 6;
+  public show = 5;
 
   /** sample grid options and items to load... */
   public items: GridStackWidget[] = [
@@ -38,9 +38,9 @@ export class AppComponent implements OnInit {
     float: true,
     minRow: 1,
   }
-  public gridOptionsFull: GridStackOptions = {
+  public gridOptionsFull: NgGridStackOptions = {
     ...this.gridOptions,
-    children: this.items,
+    children: [{x:0, y:0, selector:'app-a'}, {x:1, y:0, selector:'app-b'}, {x:2, y:0, content:'plain html'}],
   }
 
   // nested grid options
@@ -50,7 +50,7 @@ export class AppComponent implements OnInit {
     acceptWidgets: true, // will accept .grid-stack-item by default
     margin: 5,
   };
-  private sub1: NgGridStackWidget[] = [ {x:0, y:0, type:'app-a'}, {x:1, y:0, type:'app-b'}, {x:2, y:0, type:'app-c'}, {x:3, y:0}, {x:0, y:1}, {x:1, y:1}];
+  private sub1: NgGridStackWidget[] = [ {x:0, y:0, selector:'app-a'}, {x:1, y:0, selector:'app-b'}, {x:2, y:0, selector:'app-c'}, {x:3, y:0}, {x:0, y:1}, {x:1, y:1}];
   private sub2: NgGridStackWidget[] = [ {x:0, y:0}, {x:0, y:1, w:2}];
   private subChildren: NgGridStackWidget[] = [
     {x:0, y:0, content: 'regular item'},
@@ -71,7 +71,7 @@ export class AppComponent implements OnInit {
   constructor() {
     // give them content and unique id to make sure we track them during changes below...
     [...this.items, ...this.subChildren, ...this.sub1, ...this.sub2].forEach((w: NgGridStackWidget) => {
-      if (!w.type && !w.subGridOpts) w.content = `item ${ids}`;
+      if (!w.selector && !w.subGridOpts) w.content = `item ${ids}`;
       w.id = String(ids++);
     });
   }

package/angular/projects/demo/src/app/app.module.ts

@@ -7,9 +7,10 @@ import { AngularNgForCmdTestComponent } from './ngFor_cmd';
 import { AngularSimpleComponent } from './simple';
 import { AComponent, BComponent, CComponent } from './dummy.component';
 
-// local copy but user would use 'gridstack/dist/angular'
-import { GridstackModule, GridstackComponent } from '../../../../../dist/angular';
-// import { GridstackModule, GridstackComponent } from 'gridstack/dist/angular';
+// local testing
+// import { GridstackModule } from './gridstack.module';
+// import { GridstackComponent } from './gridstack.component';
+import { GridstackModule, GridstackComponent } from 'gridstack/dist/angular';
 
 @NgModule({
   imports: [

package/angular/projects/demo/src/app/dummy.component.ts

@@ -1,29 +1,35 @@
 /**
- * gridstack.component.ts 8.1.2
+ * gridstack.component.ts 8.2.0
  * Copyright (c) 2022 Alain Dumesny - see GridStack root license
  */
 
 // dummy testing component that will be grid items content
 
-import { Component } from '@angular/core';
+import { Component, OnDestroy, Input } from '@angular/core';
+import { BaseWidget, NgCompInputs } from 'gridstack/dist/angular';
 
 @Component({
   selector: 'app-a',
-  template: 'Comp A',
+  template: 'Comp A {{text}}',
 })
-export class AComponent {
+export class AComponent extends BaseWidget implements OnDestroy {
+  @Input() text: string = 'foo'; // test custom input data
+  public override serialize(): NgCompInputs | undefined  { return this.text ? {text: this.text} : undefined; }
+  ngOnDestroy() {
+    console.log('Comp A destroyed'); // test to make sure cleanup happens
+  }
 }
 
 @Component({
   selector: 'app-b',
   template: 'Comp B',
 })
-export class BComponent {
+export class BComponent extends BaseWidget {
 }
 
 @Component({
   selector: 'app-c',
   template: 'Comp C',
 })
-export class CComponent {
+export class CComponent extends BaseWidget {
 }

package/angular/projects/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gridstack-angular",
-  "version": "8.1.2",
+  "version": "8.2.0",
   "peerDependencies": {
     "@angular/common": "^14.2.0",
     "@angular/core": "^14.2.0"

package/angular/projects/lib/src/lib/base-widget.ts

@@ -0,0 +1,28 @@
+/**
+ * gridstack-item.component.ts 8.2.0
+ * Copyright (c) 2022 Alain Dumesny - see GridStack root license
+ */
+
+/**
+ * Base interface that all widgets need to implement in order for GridstackItemComponent to correctly save/load/delete/..
+ */
+
+import { Injectable } from '@angular/core';
+import { NgCompInputs, NgGridStackWidget } from './gridstack.component';
+
+ @Injectable()
+ export abstract class BaseWidget {
+  /**
+   * REDEFINE to return an object representing the data needed to re-create yourself, other than `selector` already handled.
+   * This should map directly to the @Input() fields of this objects on create, so a simple apply can be used on read
+   */
+  public serialize(): NgCompInputs | undefined  { return; }
+
+  /**
+   * REDEFINE this if your widget needs to read from saved data and transform it to create itself - you do this for
+   * things that are not mapped directly into @Input() fields for example.
+   */
+  public deserialize(w: NgGridStackWidget)  {
+    if (w.input)  Object.assign(this, w.input);
+  }
+ }

package/angular/projects/lib/src/lib/gridstack-item.component.ts

@@ -1,10 +1,11 @@
 /**
- * gridstack-item.component.ts 8.1.2
+ * gridstack-item.component.ts 8.2.0
  * Copyright (c) 2022 Alain Dumesny - see GridStack root license
  */
 
-import { Component, ElementRef, Input, ViewChild, ViewContainerRef, OnDestroy } from '@angular/core';
+import { Component, ElementRef, Input, ViewChild, ViewContainerRef, OnDestroy, ComponentRef } from '@angular/core';
 import { GridItemHTMLElement, GridStackNode } from 'gridstack';
+import { BaseWidget } from './base-widget';
 
 /** store element to Ng Class pointer back */
 export interface GridItemCompHTMLElement extends GridItemHTMLElement {
@@ -35,6 +36,12 @@ export class GridstackItemComponent implements OnDestroy {
   /** container to append items dynamically */
   @ViewChild('container', { read: ViewContainerRef, static: true}) public container?: ViewContainerRef;
 
+  /** ComponentRef of ourself - used by dynamic object to correctly get removed */
+  public ref: ComponentRef<GridstackItemComponent> | undefined;
+
+  /** child component so we can save/restore additional data to be saved along */
+  public childWidget: BaseWidget | undefined;
+
   /** list of options for creating/updating this item */
   @Input() public set options(val: GridStackNode) {
     if (this.el.gridstackNode?.grid) {
@@ -65,6 +72,7 @@ export class GridstackItemComponent implements OnDestroy {
   }
 
   public ngOnDestroy(): void {
+    delete this.ref;
     delete this.el._gridItemComp;
   }
 }

package/angular/projects/lib/src/lib/gridstack.component.ts

@@ -1,15 +1,16 @@
 /**
- * gridstack.component.ts 8.1.2
+ * gridstack.component.ts 8.2.0
  * Copyright (c) 2022 Alain Dumesny - see GridStack root license
  */
 
 import { AfterContentInit, Component, ContentChildren, ElementRef, EventEmitter, Input,
-  OnDestroy, OnInit, Output, QueryList, Type, ViewChild, ViewContainerRef, reflectComponentType } from '@angular/core';
+  OnDestroy, OnInit, Output, QueryList, Type, ViewChild, ViewContainerRef, reflectComponentType, ComponentRef } from '@angular/core';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 import { GridHTMLElement, GridItemHTMLElement, GridStack, GridStackNode, GridStackOptions, GridStackWidget } from 'gridstack';
 
 import { GridItemCompHTMLElement, GridstackItemComponent } from './gridstack-item.component';
+import { BaseWidget } from './base-widget';
 
 /** events handlers emitters signature for different events */
 export type eventCB = {event: Event};
@@ -17,12 +18,15 @@ export type elementCB = {event: Event, el: GridItemHTMLElement};
 export type nodesCB = {event: Event, nodes: GridStackNode[]};
 export type droppedCB = {event: Event, previousNode: GridStackNode, newNode: GridStackNode};
 
+export type NgCompInputs = {[key: string]: any};
+
 /** extends to store Ng Component selector, instead/inAddition to content */
 export interface NgGridStackWidget extends GridStackWidget {
-  type?: string; // component type to create as content
+  selector?: string; // component type to create as content
+  input?: NgCompInputs; // serialized data for the component input fields
 }
 export interface NgGridStackNode extends GridStackNode {
-  type?: string; // component type to create as content
+  selector?: string; // component type to create as content
 }
 export interface NgGridStackOptions extends GridStackOptions {
   children?: NgGridStackWidget[];
@@ -96,6 +100,9 @@ export class GridstackComponent implements OnInit, AfterContentInit, OnDestroy {
   /** return the GridStack class */
   public get grid(): GridStack | undefined { return this._grid; }
 
+  /** ComponentRef of ourself - used by dynamic object to correctly get removed */
+  public ref: ComponentRef<GridstackComponent> | undefined;
+
   /**
    * stores the selector -> Type mapping, so we can create items dynamically from a string.
    * Unfortunately Ng doesn't provide public access to that mapping.
@@ -107,8 +114,7 @@ export class GridstackComponent implements OnInit, AfterContentInit, OnDestroy {
   }
   /** return the ng Component selector */
   public static getSelector(type: Type<Object>): string {
-    const mirror = reflectComponentType(type)!;
-    return mirror.selector;
+    return reflectComponentType(type)!.selector;
   }
 
   private _options?: GridStackOptions;
@@ -145,6 +151,7 @@ export class GridstackComponent implements OnInit, AfterContentInit, OnDestroy {
   }
 
   public ngOnDestroy(): void {
+    delete this.ref;
     this.ngUnsubscribe.next();
     this.ngUnsubscribe.complete();
     this.grid?.destroy();
@@ -197,44 +204,84 @@ export class GridstackComponent implements OnInit, AfterContentInit, OnDestroy {
 /**
  * can be used when a new item needs to be created, which we do as a Angular component, or deleted (skip)
  **/
-export function gsCreateNgComponents(host: GridCompHTMLElement | HTMLElement, w: NgGridStackWidget | GridStackOptions, add: boolean, isGrid: boolean): HTMLElement | undefined {
-  // only care about creating ng components here...
-  if (!add || !host) return;
-
-  // create the component dynamically - see https://angular.io/docs/ts/latest/cookbook/dynamic-component-loader.html
-  if (isGrid) {
-    let grid: GridstackComponent | undefined;
-    const gridItemComp = (host.parentElement as GridItemCompHTMLElement)?._gridItemComp;
-    if (gridItemComp) {
-      grid = gridItemComp.container?.createComponent(GridstackComponent)?.instance;
-    } else {
+export function gsCreateNgComponents(host: GridCompHTMLElement | HTMLElement, w: NgGridStackWidget | GridStackNode, add: boolean, isGrid: boolean): HTMLElement | undefined {
+  if (add) {
+    //
+    // create the component dynamically - see https://angular.io/docs/ts/latest/cookbook/dynamic-component-loader.html
+    //
+    if (!host) return;
+    if (isGrid) {
+      const container = (host.parentElement as GridItemCompHTMLElement)?._gridItemComp?.container;
       // TODO: figure out how to create ng component inside regular Div. need to access app injectors...
-      // const hostElement: Element = host;
-      // const environmentInjector: EnvironmentInjector;
-      // grid = createComponent(GridstackComponent, {environmentInjector, hostElement})?.instance;
+      // if (!container) {
+      //   const hostElement: Element = host;
+      //   const environmentInjector: EnvironmentInjector;
+      //   grid = createComponent(GridstackComponent, {environmentInjector, hostElement})?.instance;
+      // }
+      const gridRef = container?.createComponent(GridstackComponent);
+      const grid = gridRef?.instance;
+      if (!grid) return;
+      grid.ref = gridRef;
+      grid.options = w as GridStackOptions;
+      return grid.el;
+    } else {
+      const gridComp = (host as GridCompHTMLElement)._gridComp;
+      const gridItemRef = gridComp?.container?.createComponent(GridstackItemComponent);
+      const gridItem = gridItemRef?.instance;
+      if (!gridItem) return;
+      gridItem.ref = gridItemRef
+
+      // IFF we're not a subGrid, define what type of component to create as child, OR you can do it GridstackItemComponent template, but this is more generic
+      const selector = (w as NgGridStackWidget).selector;
+      const type = selector ? GridstackComponent.selectorToType[selector] : undefined;
+      if (!w.subGridOpts && type) {
+        const childWidget = gridItem.container?.createComponent(type)?.instance as BaseWidget;
+        if (typeof childWidget?.serialize === 'function' && typeof childWidget?.deserialize === 'function') {
+          // proper BaseWidget subclass, save it and load additional data
+          gridItem.childWidget = childWidget;
+          childWidget.deserialize(w);
+        }
+      }
+
+      return gridItem.el;
     }
-    if (grid) grid.options = w as GridStackOptions;
-    return grid?.el;
   } else {
-    const gridComp = (host as GridCompHTMLElement)._gridComp;
-    const gridItem = gridComp?.container?.createComponent(GridstackItemComponent)?.instance;
-
-    // IFF we're not a subGrid, define what type of component to create as child, OR you can do it GridstackItemComponent template, but this is more generic
-    const selector = (w as NgGridStackWidget).type;
-    const type = selector ? GridstackComponent.selectorToType[selector] : undefined;
-    if (!w.subGridOpts && type) {
-      gridItem?.container?.createComponent(type);
+    //
+    // REMOVE - have to call ComponentRef:destroy() for dynamic objects to correctly remove themselves
+    // Note: this will destroy all children dynamic components as well: gridItem -> childWidget
+    //
+    const n = w as GridStackNode;
+    if (isGrid) {
+      const grid = (n.el as GridCompHTMLElement)?._gridComp;
+      if (grid?.ref) grid.ref.destroy();
+      else grid?.ngOnDestroy();
+    } else {
+      const gridItem = (n.el as GridItemCompHTMLElement)?._gridItemComp;
+      if (gridItem?.ref) gridItem.ref.destroy();
+      else gridItem?.ngOnDestroy();
     }
-
-    return gridItem?.el;
   }
+  return;
 }
 
 /**
- * can be used when saving the grid - make sure we save the content from the field (not HTML as we get ng markups)
- * and can put the extra info of type, otherwise content
+ * called for each item in the grid - check if additional information needs to be saved.
+ * Note: since this is options minus gridstack private members using Utils.removeInternalForSave(),
+ * this typically doesn't need to do anything. However your custom Component @Input() are now supported
+ * using BaseWidget.serialize()
  */
 export function gsSaveAdditionalNgInfo(n: NgGridStackNode, w: NgGridStackWidget) {
-  if (n.type) w.type = n.type;
-  else if (n.content) w.content = n.content;
+  const gridItem = (n.el as GridItemCompHTMLElement)?._gridItemComp;
+  if (gridItem) {
+    const input = gridItem.childWidget?.serialize();
+    if (input) {
+      w.input = input;
+    }
+    return;
+  }
+  // else check if Grid
+  const grid = (n.el as GridCompHTMLElement)?._gridComp;
+  if (grid) {
+    //.... save any custom data
+  }
 }

package/angular/projects/lib/src/lib/gridstack.module.ts

@@ -1,5 +1,5 @@
 /**
- * gridstack.component.ts 8.1.2
+ * gridstack.component.ts 8.2.0
  * Copyright (c) 2022 Alain Dumesny - see GridStack root license
  */
 

package/angular/projects/lib/src/public-api.ts

@@ -4,4 +4,5 @@
 
 export * from './lib/gridstack-item.component';
 export * from './lib/gridstack.component';
+export * from './lib/base-widget';
 export * from './lib/gridstack.module';

package/dist/angular/esm2020/lib/base-widget.mjs

@@ -0,0 +1,30 @@
+/**
+ * gridstack-item.component.ts 8.2.0
+ * Copyright (c) 2022 Alain Dumesny - see GridStack root license
+ */
+/**
+ * Base interface that all widgets need to implement in order for GridstackItemComponent to correctly save/load/delete/..
+ */
+import { Injectable } from '@angular/core';
+import * as i0 from "@angular/core";
+export class BaseWidget {
+    /**
+     * REDEFINE to return an object representing the data needed to re-create yourself, other than `selector` already handled.
+     * This should map directly to the @Input() fields of this objects on create, so a simple apply can be used on read
+     */
+    serialize() { return; }
+    /**
+     * REDEFINE this if your widget needs to read from saved data and transform it to create itself - you do this for
+     * things that are not mapped directly into @Input() fields for example.
+     */
+    deserialize(w) {
+        if (w.input)
+            Object.assign(this, w.input);
+    }
+}
+BaseWidget.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BaseWidget, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+BaseWidget.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BaseWidget });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BaseWidget, decorators: [{
+            type: Injectable
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFzZS13aWRnZXQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9hbmd1bGFyL3Byb2plY3RzL2xpYi9zcmMvbGliL2Jhc2Utd2lkZ2V0LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7R0FHRztBQUVIOztHQUVHO0FBRUgsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFJMUMsTUFBTSxPQUFnQixVQUFVO0lBQy9COzs7T0FHRztJQUNJLFNBQVMsS0FBZ0MsT0FBTyxDQUFDLENBQUM7SUFFekQ7OztPQUdHO0lBQ0ksV0FBVyxDQUFDLENBQW9CO1FBQ3JDLElBQUksQ0FBQyxDQUFDLEtBQUs7WUFBRyxNQUFNLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDN0MsQ0FBQzs7dUdBYm9CLFVBQVU7MkdBQVYsVUFBVTsyRkFBVixVQUFVO2tCQUQvQixVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXHJcbiAqIGdyaWRzdGFjay1pdGVtLmNvbXBvbmVudC50cyA4LjIuMFxyXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjIgQWxhaW4gRHVtZXNueSAtIHNlZSBHcmlkU3RhY2sgcm9vdCBsaWNlbnNlXHJcbiAqL1xyXG5cclxuLyoqXHJcbiAqIEJhc2UgaW50ZXJmYWNlIHRoYXQgYWxsIHdpZGdldHMgbmVlZCB0byBpbXBsZW1lbnQgaW4gb3JkZXIgZm9yIEdyaWRzdGFja0l0ZW1Db21wb25lbnQgdG8gY29ycmVjdGx5IHNhdmUvbG9hZC9kZWxldGUvLi5cclxuICovXHJcblxyXG5pbXBvcnQgeyBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE5nQ29tcElucHV0cywgTmdHcmlkU3RhY2tXaWRnZXQgfSBmcm9tICcuL2dyaWRzdGFjay5jb21wb25lbnQnO1xyXG5cclxuIEBJbmplY3RhYmxlKClcclxuIGV4cG9ydCBhYnN0cmFjdCBjbGFzcyBCYXNlV2lkZ2V0IHtcclxuICAvKipcclxuICAgKiBSRURFRklORSB0byByZXR1cm4gYW4gb2JqZWN0IHJlcHJlc2VudGluZyB0aGUgZGF0YSBuZWVkZWQgdG8gcmUtY3JlYXRlIHlvdXJzZWxmLCBvdGhlciB0aGFuIGBzZWxlY3RvcmAgYWxyZWFkeSBoYW5kbGVkLlxyXG4gICAqIFRoaXMgc2hvdWxkIG1hcCBkaXJlY3RseSB0byB0aGUgQElucHV0KCkgZmllbGRzIG9mIHRoaXMgb2JqZWN0cyBvbiBjcmVhdGUsIHNvIGEgc2ltcGxlIGFwcGx5IGNhbiBiZSB1c2VkIG9uIHJlYWRcclxuICAgKi9cclxuICBwdWJsaWMgc2VyaWFsaXplKCk6IE5nQ29tcElucHV0cyB8IHVuZGVmaW5lZCAgeyByZXR1cm47IH1cclxuXHJcbiAgLyoqXHJcbiAgICogUkVERUZJTkUgdGhpcyBpZiB5b3VyIHdpZGdldCBuZWVkcyB0byByZWFkIGZyb20gc2F2ZWQgZGF0YSBhbmQgdHJhbnNmb3JtIGl0IHRvIGNyZWF0ZSBpdHNlbGYgLSB5b3UgZG8gdGhpcyBmb3JcclxuICAgKiB0aGluZ3MgdGhhdCBhcmUgbm90IG1hcHBlZCBkaXJlY3RseSBpbnRvIEBJbnB1dCgpIGZpZWxkcyBmb3IgZXhhbXBsZS5cclxuICAgKi9cclxuICBwdWJsaWMgZGVzZXJpYWxpemUodzogTmdHcmlkU3RhY2tXaWRnZXQpICB7XHJcbiAgICBpZiAody5pbnB1dCkgIE9iamVjdC5hc3NpZ24odGhpcywgdy5pbnB1dCk7XHJcbiAgfVxyXG4gfVxyXG4iXX0=

package/dist/angular/esm2020/lib/gridstack-item.component.mjs

@@ -1,5 +1,5 @@
 /**
- * gridstack-item.component.ts 8.1.2
+ * gridstack-item.component.ts 8.2.0
  * Copyright (c) 2022 Alain Dumesny - see GridStack root license
  */
 import { Component, Input, ViewChild, ViewContainerRef } from '@angular/core';
@@ -34,6 +34,7 @@ export class GridstackItemComponent {
         delete this._options;
     }
     ngOnDestroy() {
+        delete this.ref;
         delete this.el._gridItemComp;
     }
 }
@@ -64,4 +65,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
             }], options: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZHN0YWNrLWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vYW5ndWxhci9wcm9qZWN0cy9saWIvc3JjL2xpYi9ncmlkc3RhY2staXRlbS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7OztHQUdHO0FBRUgsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixFQUFhLE1BQU0sZUFBZSxDQUFDOztBQVFyRzs7R0FFRztBQWlCSCxNQUFNLE9BQU8sc0JBQXNCO0lBOEJqQyxZQUE2QixVQUEyQztRQUEzQyxlQUFVLEdBQVYsVUFBVSxDQUFpQztRQUN0RSxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUM7SUFDL0IsQ0FBQztJQTNCRCxzREFBc0Q7SUFDdEQsSUFBb0IsT0FBTyxDQUFDLEdBQWtCO1FBQzVDLElBQUksSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLEVBQUUsSUFBSSxFQUFFO1lBQy9CLGlDQUFpQztZQUNqQyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxFQUFFLEVBQUUsR0FBRyxDQUFDLENBQUM7U0FDakQ7YUFBTTtZQUNMLDJGQUEyRjtZQUMzRixJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUMsR0FBRyxHQUFHLEVBQUUsRUFBRSxFQUFFLElBQUksQ0FBQyxFQUFFLEVBQUMsQ0FBQztTQUN2QztJQUNILENBQUM7SUFDRCxvRkFBb0Y7SUFDcEYsSUFBVyxPQUFPO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLElBQUksSUFBSSxDQUFDLFFBQVEsSUFBSSxFQUFDLEVBQUUsRUFBRSxJQUFJLENBQUMsRUFBRSxFQUFDLENBQUM7SUFDakUsQ0FBQztJQUlELDJFQUEyRTtJQUMzRSxJQUFXLEVBQUUsS0FBOEIsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUM7SUFFbEYsc0RBQXNEO0lBQy9DLFlBQVk7UUFDakIsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDO0lBQ3ZCLENBQUM7SUFNTSxXQUFXO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUM7SUFDL0IsQ0FBQzs7bUhBcENVLHNCQUFzQjt1R0FBdEIsc0JBQXNCLHlLQUdELGdCQUFnQiwyQ0FqQnRDOzs7Ozs7OztXQVFEOzJGQU1FLHNCQUFzQjtrQkFoQmxDLFNBQVM7K0JBQ0UsZ0JBQWdCLFlBQ2hCOzs7Ozs7OztXQVFEO2lHQVMrRCxTQUFTO3NCQUFoRixTQUFTO3VCQUFDLFdBQVcsRUFBRSxFQUFFLElBQUksRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFDO2dCQUczQyxPQUFPO3NCQUExQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBncmlkc3RhY2staXRlbS5jb21wb25lbnQudHMgOC4xLjJcbiAqIENvcHlyaWdodCAoYykgMjAyMiBBbGFpbiBEdW1lc255IC0gc2VlIEdyaWRTdGFjayByb290IGxpY2Vuc2VcbiAqL1xuXG5pbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIElucHV0LCBWaWV3Q2hpbGQsIFZpZXdDb250YWluZXJSZWYsIE9uRGVzdHJveSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgR3JpZEl0ZW1IVE1MRWxlbWVudCwgR3JpZFN0YWNrTm9kZSB9IGZyb20gJ2dyaWRzdGFjayc7XG5cbi8qKiBzdG9yZSBlbGVtZW50IHRvIE5nIENsYXNzIHBvaW50ZXIgYmFjayAqL1xuZXhwb3J0IGludGVyZmFjZSBHcmlkSXRlbUNvbXBIVE1MRWxlbWVudCBleHRlbmRzIEdyaWRJdGVtSFRNTEVsZW1lbnQge1xuICBfZ3JpZEl0ZW1Db21wPzogR3JpZHN0YWNrSXRlbUNvbXBvbmVudDtcbn1cblxuLyoqXG4gKiBIVE1MIENvbXBvbmVudCBXcmFwcGVyIGZvciBncmlkc3RhY2sgaXRlbXMsIGluIGNvbWJpbmF0aW9uIHdpdGggR3JpZHN0YWNrQ29tcG9uZW50IGZvciBwYXJlbnQgZ3JpZFxuICovXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdncmlkc3RhY2staXRlbScsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdiBjbGFzcz1cImdyaWQtc3RhY2staXRlbS1jb250ZW50XCI+XG4gICAgICA8IS0tIHdoZXJlIGR5bmFtaWMgaXRlbXMgZ28gYmFzZWQgb24gY29tcG9uZW50IHR5cGVzLCBvciBzdWItZ3JpZHMsIGV0Yy4uLikgLS0+XG4gICAgICA8bmctdGVtcGxhdGUgI2NvbnRhaW5lcj48L25nLXRlbXBsYXRlPlxuICAgICAgPCEtLSBhbnkgc3RhdGljIChkZWZpbmVkIGluIGRvbSkgY29udGVudCBnb2VzIGhlcmUgLS0+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgICA8IS0tIGZhbGxiYWNrIEhUTUwgY29udGVudCBmcm9tIEdyaWRTdGFja1dpZGdldCBjb250ZW50IGZpZWxkIGlmIHVzZWQgaW5zdGVhZCAtLT5cbiAgICAgIHt7b3B0aW9ucy5jb250ZW50fX1cbiAgICA8L2Rpdj5gLFxuICBzdHlsZXM6IFtgXG4gICAgOmhvc3QgeyBkaXNwbGF5OiBibG9jazsgfVxuICBgXSxcbiAgLy8gY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsIC8vIElGRiB5b3Ugd2FudCB0byBvcHRpbWl6ZSBhbmQgY29udHJvbCB3aGVuIENoYW5nZURldGVjdGlvbiBuZWVkcyB0byBoYXBwZW4uLi5cbn0pXG5leHBvcnQgY2xhc3MgR3JpZHN0YWNrSXRlbUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uRGVzdHJveSB7XG5cbiAgLyoqIGNvbnRhaW5lciB0byBhcHBlbmQgaXRlbXMgZHluYW1pY2FsbHkgKi9cbiAgQFZpZXdDaGlsZCgnY29udGFpbmVyJywgeyByZWFkOiBWaWV3Q29udGFpbmVyUmVmLCBzdGF0aWM6IHRydWV9KSBwdWJsaWMgY29udGFpbmVyPzogVmlld0NvbnRhaW5lclJlZjtcblxuICAvKiogbGlzdCBvZiBvcHRpb25zIGZvciBjcmVhdGluZy91cGRhdGluZyB0aGlzIGl0ZW0gKi9cbiAgQElucHV0KCkgcHVibGljIHNldCBvcHRpb25zKHZhbDogR3JpZFN0YWNrTm9kZSkge1xuICAgIGlmICh0aGlzLmVsLmdyaWRzdGFja05vZGU/LmdyaWQpIHtcbiAgICAgIC8vIGFscmVhZHkgYnVpbHQsIGRvIGFuIHVwZGF0ZS4uLlxuICAgICAgdGhpcy5lbC5ncmlkc3RhY2tOb2RlLmdyaWQudXBkYXRlKHRoaXMuZWwsIHZhbCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIC8vIHN0b3JlIG91ciBjdXN0b20gZWxlbWVudCBpbiBvcHRpb25zIHNvIHdlIGNhbiB1cGRhdGUgaXQgYW5kIG5vdCByZS1jcmVhdGUgYSBnZW5lcmljIGRpdiFcbiAgICAgIHRoaXMuX29wdGlvbnMgPSB7Li4udmFsLCBlbDogdGhpcy5lbH07XG4gICAgfVxuICB9XG4gIC8qKiByZXR1cm4gdGhlIGxhdGVzdCBncmlkIG9wdGlvbnMgKGZyb20gR1Mgb25jZSBidWlsdCwgb3RoZXJ3aXNlIGluaXRpYWwgdmFsdWVzKSAqL1xuICBwdWJsaWMgZ2V0IG9wdGlvbnMoKTogR3JpZFN0YWNrTm9kZSB7XG4gICAgcmV0dXJuIHRoaXMuZWwuZ3JpZHN0YWNrTm9kZSB8fCB0aGlzLl9vcHRpb25zIHx8IHtlbDogdGhpcy5lbH07XG4gIH1cblxuICBwcml2YXRlIF9vcHRpb25zPzogR3JpZFN0YWNrTm9kZTtcblxuICAvKiogcmV0dXJuIHRoZSBuYXRpdmUgZWxlbWVudCB0aGF0IGNvbnRhaW5zIGdyaWQgc3BlY2lmaWMgZmllbGRzIGFzIHdlbGwgKi9cbiAgcHVibGljIGdldCBlbCgpOiBHcmlkSXRlbUNvbXBIVE1MRWxlbWVudCB7IHJldHVybiB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDsgfVxuXG4gIC8qKiBjbGVhcnMgdGhlIGluaXRpYWwgb3B0aW9ucyBub3cgdGhhdCB3ZSd2ZSBidWlsdCAqL1xuICBwdWJsaWMgY2xlYXJPcHRpb25zKCkge1xuICAgIGRlbGV0ZSB0aGlzLl9vcHRpb25zO1xuICB9XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSByZWFkb25seSBlbGVtZW50UmVmOiBFbGVtZW50UmVmPEdyaWRJdGVtSFRNTEVsZW1lbnQ+KSB7XG4gICAgdGhpcy5lbC5fZ3JpZEl0ZW1Db21wID0gdGhpcztcbiAgfVxuXG4gIHB1YmxpYyBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBkZWxldGUgdGhpcy5lbC5fZ3JpZEl0ZW1Db21wO1xuICB9XG59XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JpZHN0YWNrLWl0ZW0uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vYW5ndWxhci9wcm9qZWN0cy9saWIvc3JjL2xpYi9ncmlkc3RhY2staXRlbS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7OztHQUdHO0FBRUgsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQUUsU0FBUyxFQUFFLGdCQUFnQixFQUEyQixNQUFNLGVBQWUsQ0FBQzs7QUFTbkg7O0dBRUc7QUFpQkgsTUFBTSxPQUFPLHNCQUFzQjtJQW9DakMsWUFBNkIsVUFBMkM7UUFBM0MsZUFBVSxHQUFWLFVBQVUsQ0FBaUM7UUFDdEUsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDO0lBQy9CLENBQUM7SUEzQkQsc0RBQXNEO0lBQ3RELElBQW9CLE9BQU8sQ0FBQyxHQUFrQjtRQUM1QyxJQUFJLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxFQUFFLElBQUksRUFBRTtZQUMvQixpQ0FBaUM7WUFDakMsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsRUFBRSxFQUFFLEdBQUcsQ0FBQyxDQUFDO1NBQ2pEO2FBQU07WUFDTCwyRkFBMkY7WUFDM0YsSUFBSSxDQUFDLFFBQVEsR0FBRyxFQUFDLEdBQUcsR0FBRyxFQUFFLEVBQUUsRUFBRSxJQUFJLENBQUMsRUFBRSxFQUFDLENBQUM7U0FDdkM7SUFDSCxDQUFDO0lBQ0Qsb0ZBQW9GO0lBQ3BGLElBQVcsT0FBTztRQUNoQixPQUFPLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxJQUFJLElBQUksQ0FBQyxRQUFRLElBQUksRUFBQyxFQUFFLEVBQUUsSUFBSSxDQUFDLEVBQUUsRUFBQyxDQUFDO0lBQ2pFLENBQUM7SUFJRCwyRUFBMkU7SUFDM0UsSUFBVyxFQUFFLEtBQThCLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDO0lBRWxGLHNEQUFzRDtJQUMvQyxZQUFZO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUN2QixDQUFDO0lBTU0sV0FBVztRQUNoQixPQUFPLElBQUksQ0FBQyxHQUFHLENBQUM7UUFDaEIsT0FBTyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQztJQUMvQixDQUFDOzttSEEzQ1Usc0JBQXNCO3VHQUF0QixzQkFBc0IseUtBR0QsZ0JBQWdCLDJDQWpCdEM7Ozs7Ozs7O1dBUUQ7MkZBTUUsc0JBQXNCO2tCQWhCbEMsU0FBUzsrQkFDRSxnQkFBZ0IsWUFDaEI7Ozs7Ozs7O1dBUUQ7aUdBUytELFNBQVM7c0JBQWhGLFNBQVM7dUJBQUMsV0FBVyxFQUFFLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUM7Z0JBUzNDLE9BQU87c0JBQTFCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIGdyaWRzdGFjay1pdGVtLmNvbXBvbmVudC50cyA4LjIuMFxuICogQ29weXJpZ2h0IChjKSAyMDIyIEFsYWluIER1bWVzbnkgLSBzZWUgR3JpZFN0YWNrIHJvb3QgbGljZW5zZVxuICovXG5cbmltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgSW5wdXQsIFZpZXdDaGlsZCwgVmlld0NvbnRhaW5lclJlZiwgT25EZXN0cm95LCBDb21wb25lbnRSZWYgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEdyaWRJdGVtSFRNTEVsZW1lbnQsIEdyaWRTdGFja05vZGUgfSBmcm9tICdncmlkc3RhY2snO1xuaW1wb3J0IHsgQmFzZVdpZGdldCB9IGZyb20gJy4vYmFzZS13aWRnZXQnO1xuXG4vKiogc3RvcmUgZWxlbWVudCB0byBOZyBDbGFzcyBwb2ludGVyIGJhY2sgKi9cbmV4cG9ydCBpbnRlcmZhY2UgR3JpZEl0ZW1Db21wSFRNTEVsZW1lbnQgZXh0ZW5kcyBHcmlkSXRlbUhUTUxFbGVtZW50IHtcbiAgX2dyaWRJdGVtQ29tcD86IEdyaWRzdGFja0l0ZW1Db21wb25lbnQ7XG59XG5cbi8qKlxuICogSFRNTCBDb21wb25lbnQgV3JhcHBlciBmb3IgZ3JpZHN0YWNrIGl0ZW1zLCBpbiBjb21iaW5hdGlvbiB3aXRoIEdyaWRzdGFja0NvbXBvbmVudCBmb3IgcGFyZW50IGdyaWRcbiAqL1xuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnZ3JpZHN0YWNrLWl0ZW0nLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXYgY2xhc3M9XCJncmlkLXN0YWNrLWl0ZW0tY29udGVudFwiPlxuICAgICAgPCEtLSB3aGVyZSBkeW5hbWljIGl0ZW1zIGdvIGJhc2VkIG9uIGNvbXBvbmVudCB0eXBlcywgb3Igc3ViLWdyaWRzLCBldGMuLi4pIC0tPlxuICAgICAgPG5nLXRlbXBsYXRlICNjb250YWluZXI+PC9uZy10ZW1wbGF0ZT5cbiAgICAgIDwhLS0gYW55IHN0YXRpYyAoZGVmaW5lZCBpbiBkb20pIGNvbnRlbnQgZ29lcyBoZXJlIC0tPlxuICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgICAgPCEtLSBmYWxsYmFjayBIVE1MIGNvbnRlbnQgZnJvbSBHcmlkU3RhY2tXaWRnZXQgY29udGVudCBmaWVsZCBpZiB1c2VkIGluc3RlYWQgLS0+XG4gICAgICB7e29wdGlvbnMuY29udGVudH19XG4gICAgPC9kaXY+YCxcbiAgc3R5bGVzOiBbYFxuICAgIDpob3N0IHsgZGlzcGxheTogYmxvY2s7IH1cbiAgYF0sXG4gIC8vIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLCAvLyBJRkYgeW91IHdhbnQgdG8gb3B0aW1pemUgYW5kIGNvbnRyb2wgd2hlbiBDaGFuZ2VEZXRlY3Rpb24gbmVlZHMgdG8gaGFwcGVuLi4uXG59KVxuZXhwb3J0IGNsYXNzIEdyaWRzdGFja0l0ZW1Db21wb25lbnQgaW1wbGVtZW50cyBPbkRlc3Ryb3kge1xuXG4gIC8qKiBjb250YWluZXIgdG8gYXBwZW5kIGl0ZW1zIGR5bmFtaWNhbGx5ICovXG4gIEBWaWV3Q2hpbGQoJ2NvbnRhaW5lcicsIHsgcmVhZDogVmlld0NvbnRhaW5lclJlZiwgc3RhdGljOiB0cnVlfSkgcHVibGljIGNvbnRhaW5lcj86IFZpZXdDb250YWluZXJSZWY7XG5cbiAgLyoqIENvbXBvbmVudFJlZiBvZiBvdXJzZWxmIC0gdXNlZCBieSBkeW5hbWljIG9iamVjdCB0byBjb3JyZWN0bHkgZ2V0IHJlbW92ZWQgKi9cbiAgcHVibGljIHJlZjogQ29tcG9uZW50UmVmPEdyaWRzdGFja0l0ZW1Db21wb25lbnQ+IHwgdW5kZWZpbmVkO1xuXG4gIC8qKiBjaGlsZCBjb21wb25lbnQgc28gd2UgY2FuIHNhdmUvcmVzdG9yZSBhZGRpdGlvbmFsIGRhdGEgdG8gYmUgc2F2ZWQgYWxvbmcgKi9cbiAgcHVibGljIGNoaWxkV2lkZ2V0OiBCYXNlV2lkZ2V0IHwgdW5kZWZpbmVkO1xuXG4gIC8qKiBsaXN0IG9mIG9wdGlvbnMgZm9yIGNyZWF0aW5nL3VwZGF0aW5nIHRoaXMgaXRlbSAqL1xuICBASW5wdXQoKSBwdWJsaWMgc2V0IG9wdGlvbnModmFsOiBHcmlkU3RhY2tOb2RlKSB7XG4gICAgaWYgKHRoaXMuZWwuZ3JpZHN0YWNrTm9kZT8uZ3JpZCkge1xuICAgICAgLy8gYWxyZWFkeSBidWlsdCwgZG8gYW4gdXBkYXRlLi4uXG4gICAgICB0aGlzLmVsLmdyaWRzdGFja05vZGUuZ3JpZC51cGRhdGUodGhpcy5lbCwgdmFsKTtcbiAgICB9IGVsc2Uge1xuICAgICAgLy8gc3RvcmUgb3VyIGN1c3RvbSBlbGVtZW50IGluIG9wdGlvbnMgc28gd2UgY2FuIHVwZGF0ZSBpdCBhbmQgbm90IHJlLWNyZWF0ZSBhIGdlbmVyaWMgZGl2IVxuICAgICAgdGhpcy5fb3B0aW9ucyA9IHsuLi52YWwsIGVsOiB0aGlzLmVsfTtcbiAgICB9XG4gIH1cbiAgLyoqIHJldHVybiB0aGUgbGF0ZXN0IGdyaWQgb3B0aW9ucyAoZnJvbSBHUyBvbmNlIGJ1aWx0LCBvdGhlcndpc2UgaW5pdGlhbCB2YWx1ZXMpICovXG4gIHB1YmxpYyBnZXQgb3B0aW9ucygpOiBHcmlkU3RhY2tOb2RlIHtcbiAgICByZXR1cm4gdGhpcy5lbC5ncmlkc3RhY2tOb2RlIHx8IHRoaXMuX29wdGlvbnMgfHwge2VsOiB0aGlzLmVsfTtcbiAgfVxuXG4gIHByaXZhdGUgX29wdGlvbnM/OiBHcmlkU3RhY2tOb2RlO1xuXG4gIC8qKiByZXR1cm4gdGhlIG5hdGl2ZSBlbGVtZW50IHRoYXQgY29udGFpbnMgZ3JpZCBzcGVjaWZpYyBmaWVsZHMgYXMgd2VsbCAqL1xuICBwdWJsaWMgZ2V0IGVsKCk6IEdyaWRJdGVtQ29tcEhUTUxFbGVtZW50IHsgcmV0dXJuIHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50OyB9XG5cbiAgLyoqIGNsZWFycyB0aGUgaW5pdGlhbCBvcHRpb25zIG5vdyB0aGF0IHdlJ3ZlIGJ1aWx0ICovXG4gIHB1YmxpYyBjbGVhck9wdGlvbnMoKSB7XG4gICAgZGVsZXRlIHRoaXMuX29wdGlvbnM7XG4gIH1cblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJlYWRvbmx5IGVsZW1lbnRSZWY6IEVsZW1lbnRSZWY8R3JpZEl0ZW1IVE1MRWxlbWVudD4pIHtcbiAgICB0aGlzLmVsLl9ncmlkSXRlbUNvbXAgPSB0aGlzO1xuICB9XG5cbiAgcHVibGljIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIGRlbGV0ZSB0aGlzLnJlZjtcbiAgICBkZWxldGUgdGhpcy5lbC5fZ3JpZEl0ZW1Db21wO1xuICB9XG59XG4iXX0=