@igo2/common 20.2.0 → 21.0.0-next.10

package/fesm2022/igo2-common-flexible.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, ChangeDetectorRef, viewChild, Input, Component, NgModule } from '@angular/core';
+import { inject, ElementRef, ChangeDetectorRef, viewChild, input, Input, Component, NgModule } from '@angular/core';
 import { MediaService } from '@igo2/core/media';
 
 class FlexibleComponent {
@@ -7,56 +7,14 @@ class FlexibleComponent {
     mediaService = inject(MediaService);
     cdr = inject(ChangeDetectorRef);
     static transitionTime = 250;
-    main = viewChild('flexibleMain', ...(ngDevMode ? [{ debugName: "main" }] : []));
-    get initial() {
-        return this._initial;
-    }
-    set initial(value) {
-        this._initial = value;
-    }
-    _initial = '0';
-    get collapsed() {
-        return this._collapsed;
-    }
-    set collapsed(value) {
-        this._collapsed = value;
-    }
-    _collapsed = '0';
-    get expanded() {
-        return this._expanded;
-    }
-    set expanded(value) {
-        this._expanded = value;
-    }
-    _expanded = '100%';
-    get initialMobile() {
-        return this._initialMobile;
-    }
-    set initialMobile(value) {
-        this._initialMobile = value;
-    }
-    _initialMobile = this.expanded;
-    get collapsedMobile() {
-        return this._collapsedMobile;
-    }
-    set collapsedMobile(value) {
-        this._collapsedMobile = value;
-    }
-    _collapsedMobile = this.collapsed;
-    get expandedMobile() {
-        return this._expandedMobile;
-    }
-    set expandedMobile(value) {
-        this._expandedMobile = value;
-    }
-    _expandedMobile = this.expanded;
-    get direction() {
-        return this._direction;
-    }
-    set direction(value) {
-        this._direction = value;
-    }
-    _direction = 'column';
+    main = viewChild('flexibleMain', ...(ngDevMode ? [{ debugName: "main" }] : /* istanbul ignore next */ []));
+    initial = input('0', ...(ngDevMode ? [{ debugName: "initial" }] : /* istanbul ignore next */ []));
+    collapsed = input('0', ...(ngDevMode ? [{ debugName: "collapsed" }] : /* istanbul ignore next */ []));
+    expanded = input('100%', ...(ngDevMode ? [{ debugName: "expanded" }] : /* istanbul ignore next */ []));
+    initialMobile = input('100%', ...(ngDevMode ? [{ debugName: "initialMobile" }] : /* istanbul ignore next */ []));
+    collapsedMobile = input('0', ...(ngDevMode ? [{ debugName: "collapsedMobile" }] : /* istanbul ignore next */ []));
+    expandedMobile = input('100%', ...(ngDevMode ? [{ debugName: "expandedMobile" }] : /* istanbul ignore next */ []));
+    direction = input('column', ...(ngDevMode ? [{ debugName: "direction" }] : /* istanbul ignore next */ []));
     get state() {
         return this._state;
     }
@@ -96,34 +54,24 @@ class FlexibleComponent {
     }
     setSize(size) {
         this._state = 'transition';
-        if (this.direction === 'column') {
-            this.main().nativeElement.style.height = size;
+        const el = this.main()?.nativeElement;
+        if (!el) {
+            return;
         }
-        else if (this.direction === 'row') {
-            this.main().nativeElement.style.width = size;
+        if (this.direction() === 'column') {
+            el.style.height = size;
+        }
+        else if (this.direction() === 'row') {
+            el.style.width = size;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FlexibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.19", type: FlexibleComponent, isStandalone: true, selector: "igo-flexible", inputs: { initial: "initial", collapsed: "collapsed", expanded: "expanded", initialMobile: "initialMobile", collapsedMobile: "collapsedMobile", expandedMobile: "expandedMobile", direction: "direction", state: "state" }, viewQueries: [{ propertyName: "main", first: true, predicate: ["flexibleMain"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\n  <div class=\"igo-container\">\n    <ng-content />\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\" />\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: FlexibleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.14", type: FlexibleComponent, isStandalone: true, selector: "igo-flexible", inputs: { initial: { classPropertyName: "initial", publicName: "initial", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, initialMobile: { classPropertyName: "initialMobile", publicName: "initialMobile", isSignal: true, isRequired: false, transformFunction: null }, collapsedMobile: { classPropertyName: "collapsedMobile", publicName: "collapsedMobile", isSignal: true, isRequired: false, transformFunction: null }, expandedMobile: { classPropertyName: "expandedMobile", publicName: "expandedMobile", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, state: { classPropertyName: "state", publicName: "state", isSignal: false, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "main", first: true, predicate: ["flexibleMain"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction() }}\">\n  <div class=\"igo-container\">\n    <ng-content />\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\" />\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: FlexibleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: FlexibleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'igo-flexible', standalone: true, template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\n  <div class=\"igo-container\">\n    <ng-content />\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\" />\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] }]
-        }], propDecorators: { main: [{ type: i0.ViewChild, args: ['flexibleMain', { isSignal: true }] }], initial: [{
-                type: Input
-            }], collapsed: [{
-                type: Input
-            }], expanded: [{
-                type: Input
-            }], initialMobile: [{
-                type: Input
-            }], collapsedMobile: [{
-                type: Input
-            }], expandedMobile: [{
-                type: Input
-            }], direction: [{
-                type: Input
-            }], state: [{
+            args: [{ selector: 'igo-flexible', template: "<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction() }}\">\n  <div class=\"igo-container\">\n    <ng-content />\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\" />\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%}:host.column{flex-direction:column}:host.row{flex-direction:row}:host .igo-flexible-main{flex:0 0 auto;overflow:hidden}:host .igo-flexible-main.column{transition:height .25s ease-in}:host .igo-flexible-main.row{transition:width .25s ease-in}:host .igo-flexible-fill>div{position:absolute;inset:0}:host .igo-container{height:100%;overflow:hidden;position:relative}:host ::ng-deep .igo-flexible-fill{flex:1 1 auto;overflow:hidden;position:relative}:host ::ng-deep .igo-content{height:100%;width:100%;overflow:auto}:host ::ng-deep igo-panel{height:100%}\n"] }]
+        }], propDecorators: { main: [{ type: i0.ViewChild, args: ['flexibleMain', { isSignal: true }] }], initial: [{ type: i0.Input, args: [{ isSignal: true, alias: "initial", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], expanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "expanded", required: false }] }], initialMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialMobile", required: false }] }], collapsedMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsedMobile", required: false }] }], expandedMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedMobile", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], state: [{
                 type: Input
             }] } });
 
@@ -137,11 +85,11 @@ class IgoFlexibleModule {
             providers: []
         };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoFlexibleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: IgoFlexibleModule, imports: [FlexibleComponent], exports: [FlexibleComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoFlexibleModule });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoFlexibleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.14", ngImport: i0, type: IgoFlexibleModule, imports: [FlexibleComponent], exports: [FlexibleComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoFlexibleModule });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: IgoFlexibleModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: IgoFlexibleModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [FlexibleComponent],

package/fesm2022/igo2-common-flexible.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"igo2-common-flexible.mjs","sources":["../../../packages/common/flexible/src/flexible.component.ts","../../../packages/common/flexible/src/flexible.component.html","../../../packages/common/flexible/src/flexible.module.ts","../../../packages/common/flexible/src/igo2-common-flexible.ts"],"sourcesContent":["import {\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  Input,\n  OnDestroy,\n  OnInit,\n  inject,\n  viewChild\n} from '@angular/core';\n\nimport { MediaService } from '@igo2/core/media';\n\nimport { Subscription } from 'rxjs';\n\nimport { FlexibleDirection, FlexibleState } from './flexible.type';\n\n@Component({\n  selector: 'igo-flexible',\n  templateUrl: './flexible.component.html',\n  styleUrls: ['./flexible.component.scss'],\n  standalone: true\n})\nexport class FlexibleComponent implements OnInit, OnDestroy {\n  private el = inject(ElementRef);\n  private mediaService = inject(MediaService);\n  private cdr = inject(ChangeDetectorRef);\n\n  static transitionTime = 250;\n\n  readonly main = viewChild<ElementRef>('flexibleMain');\n\n  @Input()\n  get initial(): string {\n    return this._initial;\n  }\n  set initial(value: string) {\n    this._initial = value;\n  }\n  private _initial = '0';\n\n  @Input()\n  get collapsed(): string {\n    return this._collapsed;\n  }\n  set collapsed(value: string) {\n    this._collapsed = value;\n  }\n  private _collapsed = '0';\n\n  @Input()\n  get expanded(): string {\n    return this._expanded;\n  }\n  set expanded(value: string) {\n    this._expanded = value;\n  }\n  private _expanded = '100%';\n\n  @Input()\n  get initialMobile(): string {\n    return this._initialMobile;\n  }\n  set initialMobile(value: string) {\n    this._initialMobile = value;\n  }\n  private _initialMobile: string = this.expanded;\n\n  @Input()\n  get collapsedMobile(): string {\n    return this._collapsedMobile;\n  }\n  set collapsedMobile(value: string) {\n    this._collapsedMobile = value;\n  }\n  private _collapsedMobile: string = this.collapsed;\n\n  @Input()\n  get expandedMobile(): string {\n    return this._expandedMobile;\n  }\n  set expandedMobile(value: string) {\n    this._expandedMobile = value;\n  }\n  private _expandedMobile: string = this.expanded;\n\n  @Input()\n  get direction(): FlexibleDirection {\n    return this._direction;\n  }\n  set direction(value: FlexibleDirection) {\n    this._direction = value;\n  }\n  private _direction: FlexibleDirection = 'column';\n\n  @Input()\n  get state(): FlexibleState {\n    return this._state;\n  }\n  set state(value: FlexibleState) {\n    const sizes = {\n      initial: this.initial,\n      collapsed: this.collapsed,\n      expanded: this.expanded\n    };\n\n    if (this.mediaService.isMobile()) {\n      Object.assign(sizes, {\n        initial: this.initialMobile,\n        collapsed: this.collapsedMobile,\n        expanded: this.expandedMobile\n      });\n    }\n\n    const size = sizes[value];\n    if (size !== undefined) {\n      this.setSize(size);\n      setTimeout(() => {\n        this._state = value;\n      }, FlexibleComponent.transitionTime);\n    }\n  }\n  private _state: FlexibleState = 'initial';\n\n  private mediaService$$: Subscription;\n\n  ngOnInit() {\n    this.el.nativeElement.className += this.direction;\n\n    // Since this component supports different sizes\n    // on mobile, force a redraw when the media changes\n    this.mediaService$$ = this.mediaService.media$.subscribe(() =>\n      this.cdr.markForCheck()\n    );\n  }\n\n  ngOnDestroy() {\n    if (this.mediaService$$) {\n      this.mediaService$$.unsubscribe();\n    }\n  }\n\n  private setSize(size: string) {\n    this._state = 'transition';\n\n    if (this.direction === 'column') {\n      this.main().nativeElement.style.height = size;\n    } else if (this.direction === 'row') {\n      this.main().nativeElement.style.width = size;\n    }\n  }\n}\n","<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction }}\">\n  <div class=\"igo-container\">\n    <ng-content />\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\" />\n    </div>\n  </div>\n</div>\n","import { ModuleWithProviders, NgModule } from '@angular/core';\n\nimport { FlexibleComponent } from './flexible.component';\n\n/**\n * @deprecated import the FlexibleComponent directly\n */\n@NgModule({\n  imports: [FlexibleComponent],\n  exports: [FlexibleComponent]\n})\nexport class IgoFlexibleModule {\n  static forRoot(): ModuleWithProviders<IgoFlexibleModule> {\n    return {\n      ngModule: IgoFlexibleModule,\n      providers: []\n    };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"igo2-common-flexible.mjs","sources":["../../../packages/common/flexible/src/flexible.component.ts","../../../packages/common/flexible/src/flexible.component.html","../../../packages/common/flexible/src/flexible.module.ts","../../../packages/common/flexible/src/igo2-common-flexible.ts"],"sourcesContent":["import {\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  Input,\n  OnDestroy,\n  OnInit,\n  inject,\n  input,\n  viewChild\n} from '@angular/core';\n\nimport { MediaService } from '@igo2/core/media';\n\nimport { Subscription } from 'rxjs';\n\nimport { FlexibleDirection, FlexibleState } from './flexible.type';\n\n@Component({\n  selector: 'igo-flexible',\n  templateUrl: './flexible.component.html',\n  styleUrls: ['./flexible.component.scss']\n})\nexport class FlexibleComponent implements OnInit, OnDestroy {\n  private el = inject(ElementRef);\n  private mediaService = inject(MediaService);\n  private cdr = inject(ChangeDetectorRef);\n\n  static transitionTime = 250;\n\n  readonly main = viewChild<ElementRef>('flexibleMain');\n\n  readonly initial = input('0');\n  readonly collapsed = input('0');\n  readonly expanded = input('100%');\n  readonly initialMobile = input('100%');\n  readonly collapsedMobile = input('0');\n  readonly expandedMobile = input('100%');\n  readonly direction = input<FlexibleDirection>('column');\n\n  @Input()\n  get state(): FlexibleState {\n    return this._state;\n  }\n  set state(value: FlexibleState) {\n    const sizes: Record<string, unknown> = {\n      initial: this.initial,\n      collapsed: this.collapsed,\n      expanded: this.expanded\n    };\n\n    if (this.mediaService.isMobile()) {\n      Object.assign(sizes, {\n        initial: this.initialMobile,\n        collapsed: this.collapsedMobile,\n        expanded: this.expandedMobile\n      });\n    }\n\n    const size = sizes[value];\n    if (size !== undefined) {\n      this.setSize(size as string);\n      setTimeout(() => {\n        this._state = value;\n      }, FlexibleComponent.transitionTime);\n    }\n  }\n  private _state: FlexibleState = 'initial';\n\n  private mediaService$$!: Subscription;\n\n  ngOnInit() {\n    this.el.nativeElement.className += this.direction;\n\n    // Since this component supports different sizes\n    // on mobile, force a redraw when the media changes\n    this.mediaService$$ = this.mediaService.media$.subscribe(() =>\n      this.cdr.markForCheck()\n    );\n  }\n\n  ngOnDestroy() {\n    if (this.mediaService$$) {\n      this.mediaService$$.unsubscribe();\n    }\n  }\n\n  private setSize(size: string) {\n    this._state = 'transition';\n\n    const el = this.main()?.nativeElement;\n    if (!el) {\n      return;\n    }\n    if (this.direction() === 'column') {\n      el.style.height = size;\n    } else if (this.direction() === 'row') {\n      el.style.width = size;\n    }\n  }\n}\n","<div #flexibleMain class=\"igo-flexible-main {{ state }} {{ direction() }}\">\n  <div class=\"igo-container\">\n    <ng-content />\n  </div>\n</div>\n<div class=\"igo-flexible-fill\">\n  <div>\n    <div class=\"igo-container\">\n      <ng-content select=\"[igoFlexibleFill]\" />\n    </div>\n  </div>\n</div>\n","import { ModuleWithProviders, NgModule } from '@angular/core';\n\nimport { FlexibleComponent } from './flexible.component';\n\n/**\n * @deprecated import the FlexibleComponent directly\n */\n@NgModule({\n  imports: [FlexibleComponent],\n  exports: [FlexibleComponent]\n})\nexport class IgoFlexibleModule {\n  static forRoot(): ModuleWithProviders<IgoFlexibleModule> {\n    return {\n      ngModule: IgoFlexibleModule,\n      providers: []\n    };\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}