@yuuvis/client-framework 2.0.0-beta.5 → 2.0.0

package/fesm2022/yuuvis-client-framework-overflow-menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yuuvis-client-framework-overflow-menu.mjs","sources":["../../../../../libs/yuuvis/client-framework/overflow-menu/src/lib/overflow-menu.component.ts","../../../../../libs/yuuvis/client-framework/overflow-menu/src/lib/overflow-menu.component.html","../../../../../libs/yuuvis/client-framework/overflow-menu/src/lib/overflow-menu.module.ts","../../../../../libs/yuuvis/client-framework/overflow-menu/src/yuuvis-client-framework-overflow-menu.ts"],"sourcesContent":["import { AfterViewInit, Component, computed, effect, ElementRef, inject, input, OnDestroy, signal } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { OverflowMenuItem } from './overflow-menu.interface';\nimport { MatMenuModule } from '@angular/material/menu';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\ntype __MenuItem = OverflowMenuItem & { overflow: boolean };\ninterface MenuGroup {\n  id: string;\n  items: __MenuItem[];\n}\n\n/**\n * Renders items in a toolbar. If menu items provide a 'group' property they will\n * be organized in sections.\n */\n@Component({\n  selector: 'yuv-overflow-menu',\n  imports: [CommonModule, MatButtonModule, MatMenuModule, MatIconModule, MatTooltipModule],\n  templateUrl: './overflow-menu.component.html',\n  styleUrl: './overflow-menu.component.scss'\n})\nexport class OverflowMenuComponent implements AfterViewInit, OnDestroy {\n  #elRef = inject(ElementRef);\n\n  overflowIcon = input<string>('more_horiz');\n  groupLabels = input<Record<string, string>>();\n\n  /**\n   * Items of the menu\n   */\n  menuItems = input<OverflowMenuItem[]>([]);\n  #menuItemsEffect = effect(() => {\n    this.#observe(this.menuItems());\n  });\n\n  __menuGroups = computed<MenuGroup[]>(() => this.#groupItems(this.__menuItems()));\n\n  private __menuItems = computed<__MenuItem[]>(() => {\n    return this.menuItems().map((i) => ({ ...i, overflow: false }));\n  });\n\n  overflowGroups = signal<MenuGroup[]>([]);\n\n  #itemObserver: {\n    observer: IntersectionObserver | undefined;\n    observedElements: Element[];\n  } = {\n    observer: undefined,\n    observedElements: []\n  };\n\n  #initObservers() {\n    // observe tab navigation elements to show navigation controls (arrow buttons) once\n    // the first or the last tab is not visible anymore\n    this.#itemObserver.observer = new IntersectionObserver(\n      (entries) => {\n        entries.forEach((e, i) => {\n          const id = e.target.getAttribute('data-item-id');\n          const _i: __MenuItem | undefined = this.__menuItems().find((mi) => id === mi.id);\n          if (_i) _i.overflow = !e.isIntersecting;\n          const overflowTrigger = (this.#elRef.nativeElement as HTMLElement).querySelector('button.overflow-trigger');\n\n          if (overflowTrigger) {\n            !this.__menuItems().find((i) => i.overflow) ? overflowTrigger.setAttribute('inert', 'true') : overflowTrigger.removeAttribute('inert');\n          }\n          const intersecting = !e.isIntersecting;\n          if (intersecting) e.target.setAttribute('inert', 'true');\n          else e.target.removeAttribute('inert');\n        });\n\n        this.overflowGroups.set(this.#groupItems(this.__menuItems().filter((i) => i.overflow)));\n      },\n      {\n        threshold: 1,\n        root: this.#elRef.nativeElement.querySelector('.overflow-wrapper')\n      }\n    );\n  }\n\n  #observe(items: OverflowMenuItem[]) {\n    setTimeout(() => {\n      if (this.#itemObserver.observer) {\n        // cleanup existing observed elements\n        this.#itemObserver.observedElements.forEach((e) => this.#itemObserver.observer!.unobserve(e));\n        this.#itemObserver.observedElements = [];\n\n        if (items.length > 0) {\n          this.#itemObserver.observedElements = this.#elRef.nativeElement.querySelectorAll('.menu-item');\n          this.#itemObserver.observedElements.forEach((e) => this.#itemObserver.observer!.observe(e));\n        }\n      }\n    });\n  }\n\n  #groupItems(items: OverflowMenuItem[]): MenuGroup[] {\n    const g = this.#groupBy(items, 'group');\n    return Object.keys(g).map((id) => ({\n      id,\n      items: g[id]\n    }));\n  }\n\n  #groupBy(arr: any[], key: string): Record<string, any> {\n    return arr.reduce((rv, x) => {\n      (rv[x[key]] = rv[x[key]] || []).push(x);\n      return rv;\n    }, {});\n  }\n\n  ngAfterViewInit(): void {\n    this.#initObservers();\n  }\n\n  ngOnDestroy(): void {\n    if (this.#itemObserver.observer) this.#itemObserver.observer.disconnect();\n  }\n}\n","<div class=\"overflow-wrapper\">\n  @for (group of __menuGroups(); track group.id) {\n    <section>\n      @for (item of group.items; track item.id) {\n        <button mat-icon-button class=\"menu-item\" [disabled]=\"item.disabled\" [matTooltip]=\"item.label\" [attr.data-item-id]=\"item.id\" (click)=\"item.callback()\">\n          <mat-icon>{{ item.icon }}</mat-icon>\n        </button>\n      }\n    </section>\n  }\n</div>\n\n<button class=\"overflow-trigger\" inert=\"true\" mat-icon-button [matMenuTriggerFor]=\"menu\">\n  <mat-icon>{{ overflowIcon() }}</mat-icon>\n</button>\n<mat-menu #menu=\"matMenu\">\n  @let gl = groupLabels();\n  @for (g of overflowGroups(); track g.id) {\n    @if (gl && gl[g.id]) {\n      <div class=\"group\">{{ gl[g.id] }}</div>\n    }\n    @for (item of g.items; track item.id) {\n      <div class=\"menu-item\" mat-menu-item [disabled]=\"item.disabled\" (click)=\"item.callback()\">\n        <mat-icon>{{ item.icon }}</mat-icon>\n        <span> {{ item.label }} </span>\n      </div>\n    }\n  }\n</mat-menu>\n","import { NgModule } from '@angular/core';\nimport { OverflowMenuComponent } from './overflow-menu.component';\n\n@NgModule({\n  imports: [OverflowMenuComponent],\n  exports: [OverflowMenuComponent]\n})\nexport class YuvOverflowMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yuuvis-client-framework-overflow-menu.mjs","sources":["../../../../../libs/yuuvis/client-framework/overflow-menu/src/lib/overflow-menu.component.ts","../../../../../libs/yuuvis/client-framework/overflow-menu/src/lib/overflow-menu.component.html","../../../../../libs/yuuvis/client-framework/overflow-menu/src/lib/overflow-menu.module.ts","../../../../../libs/yuuvis/client-framework/overflow-menu/src/yuuvis-client-framework-overflow-menu.ts"],"sourcesContent":["import { AfterViewInit, Component, computed, effect, ElementRef, inject, input, OnDestroy, signal } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { OverflowMenuItem } from './overflow-menu.interface';\nimport { MatMenuModule } from '@angular/material/menu';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\ntype __MenuItem = OverflowMenuItem & { overflow: boolean };\ninterface MenuGroup {\n  id: string;\n  items: __MenuItem[];\n}\n\n/**\n * Renders items in a toolbar. If menu items provide a 'group' property they will\n * be organized in sections.\n */\n@Component({\n  selector: 'yuv-overflow-menu',\n  imports: [CommonModule, MatButtonModule, MatMenuModule, MatIconModule, MatTooltipModule],\n  templateUrl: './overflow-menu.component.html',\n  styleUrl: './overflow-menu.component.scss'\n})\nexport class OverflowMenuComponent implements AfterViewInit, OnDestroy {\n  #elRef = inject(ElementRef);\n\n  overflowIcon = input<string>('more_horiz');\n  groupLabels = input<Record<string, string>>();\n\n  /**\n   * Items of the menu\n   */\n  menuItems = input<OverflowMenuItem[]>([]);\n  #menuItemsEffect = effect(() => {\n    this.#observe(this.menuItems());\n  });\n\n  __menuGroups = computed<MenuGroup[]>(() => this.#groupItems(this.__menuItems()));\n\n  private __menuItems = computed<__MenuItem[]>(() => {\n    return this.menuItems().map((i) => ({ ...i, overflow: false }));\n  });\n\n  overflowGroups = signal<MenuGroup[]>([]);\n\n  #itemObserver: {\n    observer: IntersectionObserver | undefined;\n    observedElements: Element[];\n  } = {\n    observer: undefined,\n    observedElements: []\n  };\n\n  #initObservers() {\n    // observe tab navigation elements to show navigation controls (arrow buttons) once\n    // the first or the last tab is not visible anymore\n    this.#itemObserver.observer = new IntersectionObserver(\n      (entries) => {\n        entries.forEach((e, i) => {\n          const id = e.target.getAttribute('data-item-id');\n          const _i: __MenuItem | undefined = this.__menuItems().find((mi) => id === mi.id);\n          if (_i) _i.overflow = !e.isIntersecting;\n          const overflowTrigger = (this.#elRef.nativeElement as HTMLElement).querySelector('button.overflow-trigger');\n\n          if (overflowTrigger) {\n            !this.__menuItems().find((i) => i.overflow) ? overflowTrigger.setAttribute('inert', 'true') : overflowTrigger.removeAttribute('inert');\n          }\n          const intersecting = !e.isIntersecting;\n          if (intersecting) e.target.setAttribute('inert', 'true');\n          else e.target.removeAttribute('inert');\n        });\n\n        this.overflowGroups.set(this.#groupItems(this.__menuItems().filter((i) => i.overflow)));\n      },\n      {\n        threshold: 1,\n        root: this.#elRef.nativeElement.querySelector('.overflow-wrapper')\n      }\n    );\n  }\n\n  #observe(items: OverflowMenuItem[]) {\n    setTimeout(() => {\n      if (this.#itemObserver.observer) {\n        // cleanup existing observed elements\n        this.#itemObserver.observedElements.forEach((e) => this.#itemObserver.observer!.unobserve(e));\n        this.#itemObserver.observedElements = [];\n\n        if (items.length > 0) {\n          this.#itemObserver.observedElements = this.#elRef.nativeElement.querySelectorAll('.menu-item');\n          this.#itemObserver.observedElements.forEach((e) => this.#itemObserver.observer!.observe(e));\n        }\n      }\n    });\n  }\n\n  #groupItems(items: OverflowMenuItem[]): MenuGroup[] {\n    const g = this.#groupBy(items, 'group');\n    return Object.keys(g).map((id) => ({\n      id,\n      items: g[id]\n    }));\n  }\n\n  #groupBy(arr: any[], key: string): Record<string, any> {\n    return arr.reduce((rv, x) => {\n      (rv[x[key]] = rv[x[key]] || []).push(x);\n      return rv;\n    }, {});\n  }\n\n  ngAfterViewInit(): void {\n    this.#initObservers();\n  }\n\n  ngOnDestroy(): void {\n    if (this.#itemObserver.observer) this.#itemObserver.observer.disconnect();\n  }\n}\n","<div class=\"overflow-wrapper\">\n  @for (group of __menuGroups(); track group.id) {\n    <section>\n      @for (item of group.items; track item.id) {\n        <button mat-icon-button class=\"menu-item\" [disabled]=\"item.disabled\" [matTooltip]=\"item.label\" [attr.data-item-id]=\"item.id\" (click)=\"item.callback()\">\n          <mat-icon>{{ item.icon }}</mat-icon>\n        </button>\n      }\n    </section>\n  }\n</div>\n\n<button class=\"overflow-trigger\" inert=\"true\" mat-icon-button [matMenuTriggerFor]=\"menu\">\n  <mat-icon>{{ overflowIcon() }}</mat-icon>\n</button>\n<mat-menu #menu=\"matMenu\">\n  @let gl = groupLabels();\n  @for (g of overflowGroups(); track g.id) {\n    @if (gl && gl[g.id]) {\n      <div class=\"group\">{{ gl[g.id] }}</div>\n    }\n    @for (item of g.items; track item.id) {\n      <div class=\"menu-item\" mat-menu-item [disabled]=\"item.disabled\" (click)=\"item.callback()\">\n        <mat-icon>{{ item.icon }}</mat-icon>\n        <span> {{ item.label }} </span>\n      </div>\n    }\n  }\n</mat-menu>\n","import { NgModule } from '@angular/core';\nimport { OverflowMenuComponent } from './overflow-menu.component';\n\n@NgModule({\n  imports: [OverflowMenuComponent],\n  exports: [OverflowMenuComponent]\n})\nexport class YuvOverflowMenuModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/yuuvis-client-framework-pagination.mjs

@@ -35,10 +35,10 @@ class PaginationComponent {
             page: `${this.pagination().page}`
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.1", type: PaginationComponent, isStandalone: true, selector: "yuv-pagination", inputs: { pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"total\">{{ pagination().total }}</div>\n<div class=\"controls\">\n  <button [disabled]=\"pagination().page === 1\" (click)=\"pageChange.emit(1)\">\n    <yuv-icon class=\"first\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page <= 1\" (click)=\"pageChange.emit(pagination().page - 1)\">\n    <yuv-icon class=\"prev\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n\n  <form (ngSubmit)=\"onPagingFormSubmit()\" [formGroup]=\"pagingForm\">\n    <input (blur)=\"onInputBlur()\" type=\"number\" formControlName=\"page\" />\n    <div>{{ pagination().pages }}</div>\n  </form>\n\n  <button [disabled]=\"pagination().page >= pagination().pages\" (click)=\"pageChange.emit(pagination().page + 1)\">\n    <yuv-icon class=\"next\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page === pagination().pages\" (click)=\"pageChange.emit(pagination().pages)\">\n    <yuv-icon class=\"last\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n</div>\n", styles: [":host{--_paging-button-size: var(--paging-button-size, 18px);--_paging-margin: var(--paging-margin, var(--ymt-spacing-xs));--_paging-padding: var(--paging-padding, var(--ymt-spacing-2xs));--_paging-border: var(--paging-border-radius, 4px);--_paging-background: var(--paging-background, var(--ymt-surface-panel));display:flex;justify-content:space-between;align-items:center;padding:var(--_paging-padding);background-color:var(--_paging-background);border-radius:var(--_paging-border-radius)}:host .controls{display:flex;justify-content:space-between;align-items:center}:host .total{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);padding-inline:.25em;line-height:1em}:host button{padding:0;display:flex;--icon-size: var(--_paging-button-size)}:host button .first,:host button .prev{transform:rotate(180deg)}:host form{display:flex;border:1px solid var(--ymt-outline-variant);margin:0 4px;align-items:baseline}:host form>*{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);padding-inline:.25em}:host form>div{-webkit-user-select:none;user-select:none}:host form input{width:3em;line-height:1em;text-align:right;border:0;background-color:transparent;border-inline-end:1px solid var(--ymt-outline-variant)}:host form input.ng-invalid{color:var(--ymt-danger)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: YuvIconComponent, selector: "yuv-icon", inputs: ["label", "svg", "svgSrc"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.12", type: PaginationComponent, isStandalone: true, selector: "yuv-pagination", inputs: { pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"total\">{{ pagination().total }}</div>\n<div class=\"controls\">\n  <button [disabled]=\"pagination().page === 1\" (click)=\"pageChange.emit(1)\">\n    <yuv-icon class=\"first\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page <= 1\" (click)=\"pageChange.emit(pagination().page - 1)\">\n    <yuv-icon class=\"prev\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n\n  <form (ngSubmit)=\"onPagingFormSubmit()\" [formGroup]=\"pagingForm\">\n    <input (blur)=\"onInputBlur()\" type=\"number\" formControlName=\"page\" />\n    <div>{{ pagination().pages }}</div>\n  </form>\n\n  <button [disabled]=\"pagination().page >= pagination().pages\" (click)=\"pageChange.emit(pagination().page + 1)\">\n    <yuv-icon class=\"next\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page === pagination().pages\" (click)=\"pageChange.emit(pagination().pages)\">\n    <yuv-icon class=\"last\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n</div>\n", styles: [":host{--_paging-button-size: var(--paging-button-size, 18px);--_paging-margin: var(--paging-margin, var(--ymt-spacing-xs));--_paging-padding: var(--paging-padding, var(--ymt-spacing-2xs));--_paging-border: var(--paging-border-radius, 4px);--_paging-background: var(--paging-background, var(--ymt-surface-panel));display:flex;justify-content:space-between;align-items:center;padding:var(--_paging-padding);background-color:var(--_paging-background);border-radius:var(--_paging-border-radius)}:host .controls{display:flex;justify-content:space-between;align-items:center}:host .total{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);padding-inline:.25em;line-height:1em}:host button{padding:0;display:flex;--icon-size: var(--_paging-button-size)}:host button .first,:host button .prev{transform:rotate(180deg)}:host form{display:flex;border:1px solid var(--ymt-outline-variant);margin:0 4px;align-items:baseline}:host form>*{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);padding-inline:.25em}:host form>div{-webkit-user-select:none;user-select:none}:host form input{width:3em;line-height:1em;text-align:right;border:0;background-color:transparent;border-inline-end:1px solid var(--ymt-outline-variant)}:host form input.ng-invalid{color:var(--ymt-danger)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: YuvIconComponent, selector: "yuv-icon", inputs: ["label", "svg", "svgSrc"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-pagination', standalone: true, imports: [CommonModule, YuvIconComponent, ReactiveFormsModule], template: "<div class=\"total\">{{ pagination().total }}</div>\n<div class=\"controls\">\n  <button [disabled]=\"pagination().page === 1\" (click)=\"pageChange.emit(1)\">\n    <yuv-icon class=\"first\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page <= 1\" (click)=\"pageChange.emit(pagination().page - 1)\">\n    <yuv-icon class=\"prev\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n\n  <form (ngSubmit)=\"onPagingFormSubmit()\" [formGroup]=\"pagingForm\">\n    <input (blur)=\"onInputBlur()\" type=\"number\" formControlName=\"page\" />\n    <div>{{ pagination().pages }}</div>\n  </form>\n\n  <button [disabled]=\"pagination().page >= pagination().pages\" (click)=\"pageChange.emit(pagination().page + 1)\">\n    <yuv-icon class=\"next\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page === pagination().pages\" (click)=\"pageChange.emit(pagination().pages)\">\n    <yuv-icon class=\"last\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n</div>\n", styles: [":host{--_paging-button-size: var(--paging-button-size, 18px);--_paging-margin: var(--paging-margin, var(--ymt-spacing-xs));--_paging-padding: var(--paging-padding, var(--ymt-spacing-2xs));--_paging-border: var(--paging-border-radius, 4px);--_paging-background: var(--paging-background, var(--ymt-surface-panel));display:flex;justify-content:space-between;align-items:center;padding:var(--_paging-padding);background-color:var(--_paging-background);border-radius:var(--_paging-border-radius)}:host .controls{display:flex;justify-content:space-between;align-items:center}:host .total{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);padding-inline:.25em;line-height:1em}:host button{padding:0;display:flex;--icon-size: var(--_paging-button-size)}:host button .first,:host button .prev{transform:rotate(180deg)}:host form{display:flex;border:1px solid var(--ymt-outline-variant);margin:0 4px;align-items:baseline}:host form>*{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);padding-inline:.25em}:host form>div{-webkit-user-select:none;user-select:none}:host form input{width:3em;line-height:1em;text-align:right;border:0;background-color:transparent;border-inline-end:1px solid var(--ymt-outline-variant)}:host form input.ng-invalid{color:var(--ymt-danger)}\n"] }]
         }] });

package/fesm2022/yuuvis-client-framework-pagination.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yuuvis-client-framework-pagination.mjs","sources":["../../../../../libs/yuuvis/client-framework/pagination/src/lib/pagination.component.ts","../../../../../libs/yuuvis/client-framework/pagination/src/lib/pagination.component.html","../../../../../libs/yuuvis/client-framework/pagination/src/yuuvis-client-framework-pagination.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, effect, inject, input, output } from '@angular/core';\nimport { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';\nimport { YUV_ICONS, YuvIconComponent } from '@yuuvis/client-framework/icons';\nimport { Pagination } from './pagination.interface';\n\n@Component({\n  selector: 'yuv-pagination',\n  standalone: true,\n  imports: [CommonModule, YuvIconComponent, ReactiveFormsModule],\n  templateUrl: './pagination.component.html',\n  styleUrl: './pagination.component.scss'\n})\nexport class PaginationComponent {\n  #fb = inject(FormBuilder);\n  pagination = input.required<Pagination>();\n  #paginationEffect = effect(() => {\n    const pageCtrl = this.pagingForm.get('page');\n    if (pageCtrl) {\n      pageCtrl.setValue(`${this.pagination().page}`);\n      pageCtrl.setValidators([Validators.required, Validators.pattern('[0-9]+'), Validators.min(1), Validators.max(this.pagination().pages)]);\n    }\n  });\n\n  pageChange = output<number>();\n  pagingForm = this.#fb.group({ page: [''] });\n  readonly icons = {\n    arrowNext: YUV_ICONS.arrowNext,\n    arrowLast: YUV_ICONS.arrowLast\n  };\n\n  onPagingFormSubmit() {\n    if (this.pagingForm.valid && this.pagingForm.value.page) {\n      this.pageChange.emit(parseInt(this.pagingForm.value.page));\n    }\n  }\n\n  onInputBlur() {\n    this.pagingForm.patchValue({\n      page: `${this.pagination().page}`\n    });\n  }\n}\n","<div class=\"total\">{{ pagination().total }}</div>\n<div class=\"controls\">\n  <button [disabled]=\"pagination().page === 1\" (click)=\"pageChange.emit(1)\">\n    <yuv-icon class=\"first\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page <= 1\" (click)=\"pageChange.emit(pagination().page - 1)\">\n    <yuv-icon class=\"prev\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n\n  <form (ngSubmit)=\"onPagingFormSubmit()\" [formGroup]=\"pagingForm\">\n    <input (blur)=\"onInputBlur()\" type=\"number\" formControlName=\"page\" />\n    <div>{{ pagination().pages }}</div>\n  </form>\n\n  <button [disabled]=\"pagination().page >= pagination().pages\" (click)=\"pageChange.emit(pagination().page + 1)\">\n    <yuv-icon class=\"next\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page === pagination().pages\" (click)=\"pageChange.emit(pagination().pages)\">\n    <yuv-icon class=\"last\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yuuvis-client-framework-pagination.mjs","sources":["../../../../../libs/yuuvis/client-framework/pagination/src/lib/pagination.component.ts","../../../../../libs/yuuvis/client-framework/pagination/src/lib/pagination.component.html","../../../../../libs/yuuvis/client-framework/pagination/src/yuuvis-client-framework-pagination.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, effect, inject, input, output } from '@angular/core';\nimport { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';\nimport { YUV_ICONS, YuvIconComponent } from '@yuuvis/client-framework/icons';\nimport { Pagination } from './pagination.interface';\n\n@Component({\n  selector: 'yuv-pagination',\n  standalone: true,\n  imports: [CommonModule, YuvIconComponent, ReactiveFormsModule],\n  templateUrl: './pagination.component.html',\n  styleUrl: './pagination.component.scss'\n})\nexport class PaginationComponent {\n  #fb = inject(FormBuilder);\n  pagination = input.required<Pagination>();\n  #paginationEffect = effect(() => {\n    const pageCtrl = this.pagingForm.get('page');\n    if (pageCtrl) {\n      pageCtrl.setValue(`${this.pagination().page}`);\n      pageCtrl.setValidators([Validators.required, Validators.pattern('[0-9]+'), Validators.min(1), Validators.max(this.pagination().pages)]);\n    }\n  });\n\n  pageChange = output<number>();\n  pagingForm = this.#fb.group({ page: [''] });\n  readonly icons = {\n    arrowNext: YUV_ICONS.arrowNext,\n    arrowLast: YUV_ICONS.arrowLast\n  };\n\n  onPagingFormSubmit() {\n    if (this.pagingForm.valid && this.pagingForm.value.page) {\n      this.pageChange.emit(parseInt(this.pagingForm.value.page));\n    }\n  }\n\n  onInputBlur() {\n    this.pagingForm.patchValue({\n      page: `${this.pagination().page}`\n    });\n  }\n}\n","<div class=\"total\">{{ pagination().total }}</div>\n<div class=\"controls\">\n  <button [disabled]=\"pagination().page === 1\" (click)=\"pageChange.emit(1)\">\n    <yuv-icon class=\"first\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page <= 1\" (click)=\"pageChange.emit(pagination().page - 1)\">\n    <yuv-icon class=\"prev\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n\n  <form (ngSubmit)=\"onPagingFormSubmit()\" [formGroup]=\"pagingForm\">\n    <input (blur)=\"onInputBlur()\" type=\"number\" formControlName=\"page\" />\n    <div>{{ pagination().pages }}</div>\n  </form>\n\n  <button [disabled]=\"pagination().page >= pagination().pages\" (click)=\"pageChange.emit(pagination().page + 1)\">\n    <yuv-icon class=\"next\" [svg]=\"icons.arrowNext\"></yuv-icon>\n  </button>\n  <button [disabled]=\"pagination().page === pagination().pages\" (click)=\"pageChange.emit(pagination().pages)\">\n    <yuv-icon class=\"last\" [svg]=\"icons.arrowLast\"></yuv-icon>\n  </button>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/yuuvis-client-framework-panel.mjs

@@ -6,10 +6,10 @@ import { MatTooltipModule } from '@angular/material/tooltip';
 import { YuvIconComponent } from '@yuuvis/client-framework/icons';
 
 class PanelComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: PanelComponent, isStandalone: true, selector: "yuv-panel", inputs: { icon: "icon", title: "title", description: "description" }, ngImport: i0, template: "<header>\n  <div class=\"icon\">\n    @if (icon) {\n      @if (icon.src) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svgSrc]=\"icon.src\"></yuv-icon>\n      } @else if (icon.svg) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svg]=\"icon.svg\"></yuv-icon>\n      }\n    }\n  </div>\n  <div class=\"title\">{{ title }}</div>\n  <div class=\"description\">{{ description }}</div>\n  <div class=\"actions\"><ng-content class=\"actions\" select=\".actions\"></ng-content></div>\n  <div class=\"status\"><ng-content class=\"status\" select=\".status\"></ng-content></div>\n</header>\n<main>\n  <ng-content class=\"content\" select=\".content\"></ng-content>\n</main>\n", styles: [":host{display:flex;flex-flow:column}:host header{flex:0 0 auto;display:grid;padding:var(--ymt-spacing-m);grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon title\" \"icon description\";gap:var(--ymt-spacing-m)}:host header .icon{grid-area:icon}:host header .title{grid-area:title;font:var(--ymt-font-title-small);display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host header .description{grid-area:description;font:var(--ymt-font-subhead);display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host main{flex:1;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: YuvIconComponent, selector: "yuv-icon", inputs: ["label", "svg", "svgSrc"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: PanelComponent, isStandalone: true, selector: "yuv-panel", inputs: { icon: "icon", title: "title", description: "description" }, ngImport: i0, template: "<header>\n  <div class=\"icon\">\n    @if (icon) {\n      @if (icon.src) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svgSrc]=\"icon.src\"></yuv-icon>\n      } @else if (icon.svg) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svg]=\"icon.svg\"></yuv-icon>\n      }\n    }\n  </div>\n  <div class=\"title\">{{ title }}</div>\n  <div class=\"description\">{{ description }}</div>\n  <div class=\"actions\"><ng-content class=\"actions\" select=\".actions\"></ng-content></div>\n  <div class=\"status\"><ng-content class=\"status\" select=\".status\"></ng-content></div>\n</header>\n<main>\n  <ng-content class=\"content\" select=\".content\"></ng-content>\n</main>\n", styles: [":host{display:flex;flex-flow:column}:host header{flex:0 0 auto;display:grid;padding:var(--ymt-spacing-m);grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon title\" \"icon description\";gap:var(--ymt-spacing-m)}:host header .icon{grid-area:icon}:host header .title{grid-area:title;font:var(--ymt-font-title-small);display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host header .description{grid-area:description;font:var(--ymt-font-subhead);display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host main{flex:1;overflow-y:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: YuvIconComponent, selector: "yuv-icon", inputs: ["label", "svg", "svgSrc"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: PanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-panel', standalone: true, imports: [CommonModule, YuvIconComponent, MatTooltipModule], template: "<header>\n  <div class=\"icon\">\n    @if (icon) {\n      @if (icon.src) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svgSrc]=\"icon.src\"></yuv-icon>\n      } @else if (icon.svg) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svg]=\"icon.svg\"></yuv-icon>\n      }\n    }\n  </div>\n  <div class=\"title\">{{ title }}</div>\n  <div class=\"description\">{{ description }}</div>\n  <div class=\"actions\"><ng-content class=\"actions\" select=\".actions\"></ng-content></div>\n  <div class=\"status\"><ng-content class=\"status\" select=\".status\"></ng-content></div>\n</header>\n<main>\n  <ng-content class=\"content\" select=\".content\"></ng-content>\n</main>\n", styles: [":host{display:flex;flex-flow:column}:host header{flex:0 0 auto;display:grid;padding:var(--ymt-spacing-m);grid-template-rows:auto auto;grid-template-columns:auto 1fr;grid-template-areas:\"icon title\" \"icon description\";gap:var(--ymt-spacing-m)}:host header .icon{grid-area:icon}:host header .title{grid-area:title;font:var(--ymt-font-title-small);display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host header .description{grid-area:description;font:var(--ymt-font-subhead);display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host main{flex:1;overflow-y:auto}\n"] }]
         }], propDecorators: { icon: [{

package/fesm2022/yuuvis-client-framework-panel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yuuvis-client-framework-panel.mjs","sources":["../../../../../libs/yuuvis/client-framework/panel/src/lib/panel.component.ts","../../../../../libs/yuuvis/client-framework/panel/src/lib/panel.component.html","../../../../../libs/yuuvis/client-framework/panel/src/yuuvis-client-framework-panel.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { YuvIconComponent } from '@yuuvis/client-framework/icons';\n\n@Component({\n  selector: 'yuv-panel',\n  standalone: true,\n  imports: [CommonModule, YuvIconComponent, MatTooltipModule],\n  templateUrl: './panel.component.html',\n  styleUrls: ['./panel.component.scss']\n})\nexport class PanelComponent {\n  @Input() icon?: {\n    src?: string, \n    svg?: string, \n    title?: string\n  };\n  @Input() title?: string;\n  @Input() description?: string;\n\n\n}\n","<header>\n  <div class=\"icon\">\n    @if (icon) {\n      @if (icon.src) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svgSrc]=\"icon.src\"></yuv-icon>\n      } @else if (icon.svg) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svg]=\"icon.svg\"></yuv-icon>\n      }\n    }\n  </div>\n  <div class=\"title\">{{ title }}</div>\n  <div class=\"description\">{{ description }}</div>\n  <div class=\"actions\"><ng-content class=\"actions\" select=\".actions\"></ng-content></div>\n  <div class=\"status\"><ng-content class=\"status\" select=\".status\"></ng-content></div>\n</header>\n<main>\n  <ng-content class=\"content\" select=\".content\"></ng-content>\n</main>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAYa,cAAc,CAAA;8GAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,cAAc,2ICZ3B,kqBAkBA,EAAA,MAAA,EAAA,CAAA,8mBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDVY,YAAY,EAAE,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,wFAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FAI/C,cAAc,EAAA,UAAA,EAAA,CAAA;kBAP1B,SAAS;+BACE,WAAW,EAAA,UAAA,EACT,IAAI,EACP,OAAA,EAAA,CAAC,YAAY,EAAE,gBAAgB,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,kqBAAA,EAAA,MAAA,EAAA,CAAA,8mBAAA,CAAA,EAAA;8BAKlD,IAAI,EAAA,CAAA;sBAAZ;gBAKQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,WAAW,EAAA,CAAA;sBAAnB;;;AEnBH;;AAEG;;;;"}
+{"version":3,"file":"yuuvis-client-framework-panel.mjs","sources":["../../../../../libs/yuuvis/client-framework/panel/src/lib/panel.component.ts","../../../../../libs/yuuvis/client-framework/panel/src/lib/panel.component.html","../../../../../libs/yuuvis/client-framework/panel/src/yuuvis-client-framework-panel.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { YuvIconComponent } from '@yuuvis/client-framework/icons';\n\n@Component({\n  selector: 'yuv-panel',\n  standalone: true,\n  imports: [CommonModule, YuvIconComponent, MatTooltipModule],\n  templateUrl: './panel.component.html',\n  styleUrls: ['./panel.component.scss']\n})\nexport class PanelComponent {\n  @Input() icon?: {\n    src?: string, \n    svg?: string, \n    title?: string\n  };\n  @Input() title?: string;\n  @Input() description?: string;\n\n\n}\n","<header>\n  <div class=\"icon\">\n    @if (icon) {\n      @if (icon.src) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svgSrc]=\"icon.src\"></yuv-icon>\n      } @else if (icon.svg) {\n        <yuv-icon [matTooltip]=\"icon.title\" [svg]=\"icon.svg\"></yuv-icon>\n      }\n    }\n  </div>\n  <div class=\"title\">{{ title }}</div>\n  <div class=\"description\">{{ description }}</div>\n  <div class=\"actions\"><ng-content class=\"actions\" select=\".actions\"></ng-content></div>\n  <div class=\"status\"><ng-content class=\"status\" select=\".status\"></ng-content></div>\n</header>\n<main>\n  <ng-content class=\"content\" select=\".content\"></ng-content>\n</main>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;MAYa,cAAc,CAAA;+GAAd,cAAc,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAd,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,cAAc,2ICZ3B,kqBAkBA,EAAA,MAAA,EAAA,CAAA,8mBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDVY,YAAY,EAAE,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,gBAAgB,wFAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FAI/C,cAAc,EAAA,UAAA,EAAA,CAAA;kBAP1B,SAAS;+BACE,WAAW,EAAA,UAAA,EACT,IAAI,EACP,OAAA,EAAA,CAAC,YAAY,EAAE,gBAAgB,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,kqBAAA,EAAA,MAAA,EAAA,CAAA,8mBAAA,CAAA,EAAA;8BAKlD,IAAI,EAAA,CAAA;sBAAZ;gBAKQ,KAAK,EAAA,CAAA;sBAAb;gBACQ,WAAW,EAAA,CAAA;sBAAnB;;;AEnBH;;AAEG;;;;"}

package/fesm2022/yuuvis-client-framework-popout.mjs

@@ -178,10 +178,10 @@ class PopoutComponent {
         this.#observer?.disconnect();
         this._close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PopoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.1", type: PopoutComponent, isStandalone: true, selector: "yuv-popout", inputs: { triggerPosition: { classPropertyName: "triggerPosition", publicName: "triggerPosition", isSignal: true, isRequired: false, transformFunction: null }, triggerIcon: { classPropertyName: "triggerIcon", publicName: "triggerIcon", isSignal: true, isRequired: false, transformFunction: null }, triggerTooltip: { classPropertyName: "triggerTooltip", publicName: "triggerTooltip", isSignal: true, isRequired: false, transformFunction: null }, popoutWindowConfig: { classPropertyName: "popoutWindowConfig", publicName: "popoutWindowConfig", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { popOut: "popOut", popIn: "popIn" }, host: { attributes: { "attr.data-pos": "triggerPosition()" }, listeners: { "window:beforeunload": "beforeunloadHandler()" } }, viewQueries: [{ propertyName: "innerWrapper", first: true, predicate: ["innerWrapper"], descendants: true, isSignal: true }, { propertyName: "popoutWrapper", first: true, predicate: ["popoutWrapper"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #popoutWrapper class=\"popoutWrapper\" [ngClass]=\"{disabled: disabled()}\" \n[attr.data-pos]=\"triggerPosition()\">\n    <button mat-icon-button type=\"button\" class=\"trigger\" (click)=\"pop($event)\" \n    [matTooltip]=\"triggerTooltip()\"\n    [ngClass]=\"{poppedOut: isPoppedOut}\">\n      <mat-icon>{{triggerIcon()}}</mat-icon>\n    </button>\n    <div #innerWrapper class=\"innerWrapper\">\n      <ng-content></ng-content>\n    </div>\n  </div>", styles: ["div.popoutWrapper{--trigger-size: 20px;--trigger-margin-block: var(--ymt-spacing-xs);--trigger-margin-inline: var(--ymt-spacing-xs);--trigger-color: white;--trigger-background-color: black;position:relative;min-height:calc(var(--trigger-size) + var(--trigger-margin-block))}div.popoutWrapper[data-pos=tr]>button.trigger{inset-block-end:unset;inset-block-start:var(--trigger-margin-block);inset-inline-start:unset;inset-inline-end:var(--trigger-margin-inline)}div.popoutWrapper[data-pos=tl]>button.trigger{inset-block-end:unset;inset-block-start:var(--trigger-margin-block);inset-inline-end:unset;inset-inline-start:var(--trigger-margin-inline)}div.popoutWrapper[data-pos=bl]>button.trigger{inset-block-start:unset;inset-block-end:var(--trigger-margin-block);inset-inline-end:unset;inset-inline-start:var(--trigger-margin-inline)}div.popoutWrapper[data-pos=br]>button.trigger{inset-block-start:unset;inset-block-end:var(--trigger-margin-block);inset-inline-start:unset;inset-inline-end:var(--trigger-margin-inline)}div.popoutWrapper.disabled>button.trigger{display:none;pointer-events:none}div.popoutWrapper>button.trigger{width:var(--trigger-size);height:var(--trigger-size);padding:0;background-color:var(--trigger-background-color);color:var(--trigger-color);position:absolute}div.popoutWrapper>button.trigger.poppedOut{transform:rotate(180deg)}div.popoutWrapper div.innerWrapper{flex:1;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: PopoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.12", type: PopoutComponent, isStandalone: true, selector: "yuv-popout", inputs: { triggerPosition: { classPropertyName: "triggerPosition", publicName: "triggerPosition", isSignal: true, isRequired: false, transformFunction: null }, triggerIcon: { classPropertyName: "triggerIcon", publicName: "triggerIcon", isSignal: true, isRequired: false, transformFunction: null }, triggerTooltip: { classPropertyName: "triggerTooltip", publicName: "triggerTooltip", isSignal: true, isRequired: false, transformFunction: null }, popoutWindowConfig: { classPropertyName: "popoutWindowConfig", publicName: "popoutWindowConfig", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { popOut: "popOut", popIn: "popIn" }, host: { attributes: { "attr.data-pos": "triggerPosition()" }, listeners: { "window:beforeunload": "beforeunloadHandler()" } }, viewQueries: [{ propertyName: "innerWrapper", first: true, predicate: ["innerWrapper"], descendants: true, isSignal: true }, { propertyName: "popoutWrapper", first: true, predicate: ["popoutWrapper"], descendants: true, isSignal: true }], ngImport: i0, template: "<div #popoutWrapper class=\"popoutWrapper\" [ngClass]=\"{disabled: disabled()}\" \n[attr.data-pos]=\"triggerPosition()\">\n    <button mat-icon-button type=\"button\" class=\"trigger\" (click)=\"pop($event)\" \n    [matTooltip]=\"triggerTooltip()\"\n    [ngClass]=\"{poppedOut: isPoppedOut}\">\n      <mat-icon>{{triggerIcon()}}</mat-icon>\n    </button>\n    <div #innerWrapper class=\"innerWrapper\">\n      <ng-content></ng-content>\n    </div>\n  </div>", styles: ["div.popoutWrapper{--trigger-size: 20px;--trigger-margin-block: var(--ymt-spacing-xs);--trigger-margin-inline: var(--ymt-spacing-xs);--trigger-color: white;--trigger-background-color: black;position:relative;min-height:calc(var(--trigger-size) + var(--trigger-margin-block))}div.popoutWrapper[data-pos=tr]>button.trigger{inset-block-end:unset;inset-block-start:var(--trigger-margin-block);inset-inline-start:unset;inset-inline-end:var(--trigger-margin-inline)}div.popoutWrapper[data-pos=tl]>button.trigger{inset-block-end:unset;inset-block-start:var(--trigger-margin-block);inset-inline-end:unset;inset-inline-start:var(--trigger-margin-inline)}div.popoutWrapper[data-pos=bl]>button.trigger{inset-block-start:unset;inset-block-end:var(--trigger-margin-block);inset-inline-end:unset;inset-inline-start:var(--trigger-margin-inline)}div.popoutWrapper[data-pos=br]>button.trigger{inset-block-start:unset;inset-block-end:var(--trigger-margin-block);inset-inline-start:unset;inset-inline-end:var(--trigger-margin-inline)}div.popoutWrapper.disabled>button.trigger{display:none;pointer-events:none}div.popoutWrapper>button.trigger{width:var(--trigger-size);height:var(--trigger-size);padding:0;background-color:var(--trigger-background-color);color:var(--trigger-color);position:absolute}div.popoutWrapper>button.trigger.poppedOut{transform:rotate(180deg)}div.popoutWrapper div.innerWrapper{flex:1;overflow:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PopoutComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: PopoutComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-popout', imports: [CommonModule, MatButtonModule, MatIconModule, MatTooltipModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         ['attr.data-pos']: 'triggerPosition()'
@@ -192,11 +192,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
             }] } });
 
 class YuvPopoutModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: YuvPopoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: YuvPopoutModule, imports: [PopoutComponent], exports: [PopoutComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: YuvPopoutModule, imports: [PopoutComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: YuvPopoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.12", ngImport: i0, type: YuvPopoutModule, imports: [PopoutComponent], exports: [PopoutComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: YuvPopoutModule, imports: [PopoutComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: YuvPopoutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: YuvPopoutModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [PopoutComponent],

package/fesm2022/yuuvis-client-framework-popout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"yuuvis-client-framework-popout.mjs","sources":["../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.interface.ts","../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.component.ts","../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.component.html","../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.module.ts","../../../../../libs/yuuvis/client-framework/popout/src/yuuvis-client-framework-popout.ts"],"sourcesContent":["export enum PopoutTriggerPosition {\n  TOP_LEFT = 'tl',\n  TOP_RIGHT = 'tr',\n  BOTTOM_LEFT = 'bl',\n  BOTTOM_RIGHT = 'br',\n}\n\nexport interface PopoutWindowConfig {\n  // title of the window opened by popout\n  title?: string;\n  position?: {\n    // 'top' position in px\n    blockStart?: number;\n    // 'left' position in px\n    inlineStart?: number;\n  };\n  // set the size of the poped out window\n  // If no size is set the window will resize to\n  // the size of the rendered content (if measurable)\n  size?: {\n    // width in px\n    width?: number;\n    // height in px\n    height?: number;\n  };\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, inject, input, OnDestroy, output, Renderer2, viewChild } from '@angular/core';\nimport { PopoutTriggerPosition, PopoutWindowConfig } from './popout.interface';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n// based upon: https://github.com/GIimmer/angular-opinionated-popout-window\n\n/**\n * Component that enables the wrapped content to be 'popped out' as new window.\n * It will place a button (icon) to trigger popout on top of the wrapped content. You\n * can place this trigger element setting the 'triggerPosition' input.\n *\n * Providing a 'popoutWindowConfig' will also enable you to influence the appearance of\n * the spawned window.\n *\n */\n@Component({\n  selector: 'yuv-popout',\n  imports: [CommonModule, MatButtonModule, MatIconModule, MatTooltipModule],\n  templateUrl: './popout.component.html',\n  styleUrl: './popout.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    ['attr.data-pos']: 'triggerPosition()'\n  }\n})\nexport class PopoutComponent implements OnDestroy {\n  #renderer2 = inject(Renderer2);\n  #cd = inject(ChangeDetectorRef);\n\n  @HostListener('window:beforeunload') beforeunloadHandler(): void {\n    this._close();\n  }\n\n  innerWrapper = viewChild.required<ElementRef>('innerWrapper');\n  popoutWrapper = viewChild.required<ElementRef>('popoutWrapper');\n\n  /**\n   * Where the popout trigger should be located on the component\n   */\n  triggerPosition = input<PopoutTriggerPosition>(PopoutTriggerPosition.TOP_RIGHT);\n  /**\n   * Icon to be redered inside the trigger\n   */\n  triggerIcon = input<string>('open_in_new');\n  /**\n   * Tooltip text for the trigger button\n   */\n  triggerTooltip = input<string>();\n\n  /**\n   * configuration of the popped out window\n   */\n  popoutWindowConfig = input<PopoutWindowConfig>();\n  /**\n   * Whether or not to disable the undock feature\n   */\n  disabled = input<boolean>();\n\n  /**\n   * Emitted when the child component is popped out\n   */\n  popOut = output<boolean>();\n  /**\n   * Emitted when the child component is popped in again\n   */\n  popIn = output<boolean>();\n\n  #popoutWindow?: Window | null;\n  #observer?: MutationObserver;\n\n\n\n  get isPoppedOut() {\n    return !!this.#popoutWindow;\n  }\n\n  pop(e: MouseEvent) {\n    if (this.isPoppedOut) this._popIn();\n    else this._popOut(e);\n  }\n\n  private _popIn(): void {\n    this.#renderer2.appendChild(this.popoutWrapper().nativeElement, this.innerWrapper().nativeElement);\n    this._close();\n    this.#cd.detectChanges();\n  }\n\n  private _popOut(event?: MouseEvent): void {\n    if (!this.#popoutWindow) {\n      this.#popoutWindow = this._createPopoutWindow(event);\n\n      if (!this.#popoutWindow) {\n        // The window wasn't allowed to open\n        // This is likely caused by built-in popup blockers.\n        alert('Could not open new window. This is likely caused by built-in popup blockers.');\n        return;\n      }\n      this._cloneStylesToPopoutWindow();\n      this._observeFutureStyleChanges();\n\n      this.#renderer2.appendChild(this.#popoutWindow.document.body, this.innerWrapper().nativeElement);\n      this.#popoutWindow.addEventListener('unload', () => this._popIn());\n      this.#cd.detectChanges();\n      this.popOut.emit(true);\n    } else {\n      this.#popoutWindow.focus();\n    }\n  }\n\n  private _createPopoutWindow(mouseEvent?: MouseEvent): Window | null {\n    const elmRect = this.innerWrapper().nativeElement.getBoundingClientRect();\n    const [winLeft, winTop] = this._getWindowPositioning(elmRect, mouseEvent);\n    const pwc = this.popoutWindowConfig();\n    const winWidth = pwc?.size?.width ? pwc.size.width : elmRect.width;\n    const winHeight = pwc?.size?.height ? pwc.size.height : elmRect.height + 1;\n\n    const win = window.open(\n      '',\n      `popoutWindow${Date.now()}`,\n      ` popup,\n        width=${winWidth},\n        height=${winHeight},\n        left=${winLeft},\n        top=${winTop}`\n    );\n    if (win) {\n      win.document.title = this.popoutWindowConfig()?.title || window.document.title;\n      win.document.body.style.margin = '0';\n    }\n    return win;\n  }\n\n  private _getWindowPositioning(elmRect: DOMRect, mouseEvent?: MouseEvent) {\n    let winTop, winLeft;\n\n    const pwc = this.popoutWindowConfig()?.position;\n    if (pwc) {\n      winTop = pwc.blockStart || winTop;\n      winLeft = pwc.inlineStart || winLeft;\n    } else {\n      const navHeight = window.outerHeight - window.innerHeight;\n      const navWidth = (window.outerWidth - window.innerWidth) / 2;\n\n      winTop = window.screenY + navHeight + elmRect.top - 60;\n      winLeft = window.screenX + navWidth + elmRect.left;\n\n      // Position window titleBar under mouse\n      if (mouseEvent) {\n        winTop = mouseEvent.clientY + navHeight - 7;\n        winLeft += 120;\n      }\n    }\n    return [winLeft, winTop];\n  }\n\n  private _close(): void {\n    if (this.#popoutWindow) {\n      this.#popoutWindow.close();\n      this.#popoutWindow = null;\n      this.popIn.emit(true);\n    }\n  }\n\n  private _cloneStylesToPopoutWindow() {\n    if (window.navigator.userAgent.indexOf('Firefox') === -1) {\n      document.fonts.forEach((node) => {\n        (this.#popoutWindow!.document as any).fonts.add(node);\n      });\n    }\n    document.head.querySelectorAll('link[rel=\"stylesheet\"]').forEach((node) => {\n      this.#popoutWindow!.document.head.insertAdjacentHTML(\n        'beforeend',\n        `<link rel=\"stylesheet\" type=\"${(node as HTMLLinkElement).type}\" href=\"${(node as HTMLLinkElement).href}\">`\n      );\n    });\n    document.head.querySelectorAll('style').forEach((node) => {\n      this.#popoutWindow!.document.head.appendChild(node.cloneNode(true));\n    });\n  }\n\n  private _observeFutureStyleChanges() {\n    const headEle = document.querySelector('head');\n    this.#observer?.disconnect();\n    this.#observer = new MutationObserver((mutations) => {\n      mutations.forEach((mutation) => {\n        mutation.addedNodes.forEach((node) => {\n          if (node.nodeName === 'STYLE') {\n            this.#popoutWindow!.document.head.appendChild(node.cloneNode(true));\n          }\n        });\n      });\n    });\n    this.#observer.observe(headEle!, { childList: true });\n  }\n\n  ngOnDestroy(): void {\n    this.#observer?.disconnect();\n    this._close();\n  }\n}\n","<div #popoutWrapper class=\"popoutWrapper\" [ngClass]=\"{disabled: disabled()}\" \n[attr.data-pos]=\"triggerPosition()\">\n    <button mat-icon-button type=\"button\" class=\"trigger\" (click)=\"pop($event)\" \n    [matTooltip]=\"triggerTooltip()\"\n    [ngClass]=\"{poppedOut: isPoppedOut}\">\n      <mat-icon>{{triggerIcon()}}</mat-icon>\n    </button>\n    <div #innerWrapper class=\"innerWrapper\">\n      <ng-content></ng-content>\n    </div>\n  </div>","import { NgModule } from '@angular/core';\nimport { PopoutComponent } from './popout.component';\n\n@NgModule({\n  imports: [PopoutComponent],\n  exports: [PopoutComponent]\n})\nexport class YuvPopoutModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yuuvis-client-framework-popout.mjs","sources":["../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.interface.ts","../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.component.ts","../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.component.html","../../../../../libs/yuuvis/client-framework/popout/src/lib/popout.module.ts","../../../../../libs/yuuvis/client-framework/popout/src/yuuvis-client-framework-popout.ts"],"sourcesContent":["export enum PopoutTriggerPosition {\n  TOP_LEFT = 'tl',\n  TOP_RIGHT = 'tr',\n  BOTTOM_LEFT = 'bl',\n  BOTTOM_RIGHT = 'br',\n}\n\nexport interface PopoutWindowConfig {\n  // title of the window opened by popout\n  title?: string;\n  position?: {\n    // 'top' position in px\n    blockStart?: number;\n    // 'left' position in px\n    inlineStart?: number;\n  };\n  // set the size of the poped out window\n  // If no size is set the window will resize to\n  // the size of the rendered content (if measurable)\n  size?: {\n    // width in px\n    width?: number;\n    // height in px\n    height?: number;\n  };\n}\n","import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, inject, input, OnDestroy, output, Renderer2, viewChild } from '@angular/core';\nimport { PopoutTriggerPosition, PopoutWindowConfig } from './popout.interface';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n// based upon: https://github.com/GIimmer/angular-opinionated-popout-window\n\n/**\n * Component that enables the wrapped content to be 'popped out' as new window.\n * It will place a button (icon) to trigger popout on top of the wrapped content. You\n * can place this trigger element setting the 'triggerPosition' input.\n *\n * Providing a 'popoutWindowConfig' will also enable you to influence the appearance of\n * the spawned window.\n *\n */\n@Component({\n  selector: 'yuv-popout',\n  imports: [CommonModule, MatButtonModule, MatIconModule, MatTooltipModule],\n  templateUrl: './popout.component.html',\n  styleUrl: './popout.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    ['attr.data-pos']: 'triggerPosition()'\n  }\n})\nexport class PopoutComponent implements OnDestroy {\n  #renderer2 = inject(Renderer2);\n  #cd = inject(ChangeDetectorRef);\n\n  @HostListener('window:beforeunload') beforeunloadHandler(): void {\n    this._close();\n  }\n\n  innerWrapper = viewChild.required<ElementRef>('innerWrapper');\n  popoutWrapper = viewChild.required<ElementRef>('popoutWrapper');\n\n  /**\n   * Where the popout trigger should be located on the component\n   */\n  triggerPosition = input<PopoutTriggerPosition>(PopoutTriggerPosition.TOP_RIGHT);\n  /**\n   * Icon to be redered inside the trigger\n   */\n  triggerIcon = input<string>('open_in_new');\n  /**\n   * Tooltip text for the trigger button\n   */\n  triggerTooltip = input<string>();\n\n  /**\n   * configuration of the popped out window\n   */\n  popoutWindowConfig = input<PopoutWindowConfig>();\n  /**\n   * Whether or not to disable the undock feature\n   */\n  disabled = input<boolean>();\n\n  /**\n   * Emitted when the child component is popped out\n   */\n  popOut = output<boolean>();\n  /**\n   * Emitted when the child component is popped in again\n   */\n  popIn = output<boolean>();\n\n  #popoutWindow?: Window | null;\n  #observer?: MutationObserver;\n\n\n\n  get isPoppedOut() {\n    return !!this.#popoutWindow;\n  }\n\n  pop(e: MouseEvent) {\n    if (this.isPoppedOut) this._popIn();\n    else this._popOut(e);\n  }\n\n  private _popIn(): void {\n    this.#renderer2.appendChild(this.popoutWrapper().nativeElement, this.innerWrapper().nativeElement);\n    this._close();\n    this.#cd.detectChanges();\n  }\n\n  private _popOut(event?: MouseEvent): void {\n    if (!this.#popoutWindow) {\n      this.#popoutWindow = this._createPopoutWindow(event);\n\n      if (!this.#popoutWindow) {\n        // The window wasn't allowed to open\n        // This is likely caused by built-in popup blockers.\n        alert('Could not open new window. This is likely caused by built-in popup blockers.');\n        return;\n      }\n      this._cloneStylesToPopoutWindow();\n      this._observeFutureStyleChanges();\n\n      this.#renderer2.appendChild(this.#popoutWindow.document.body, this.innerWrapper().nativeElement);\n      this.#popoutWindow.addEventListener('unload', () => this._popIn());\n      this.#cd.detectChanges();\n      this.popOut.emit(true);\n    } else {\n      this.#popoutWindow.focus();\n    }\n  }\n\n  private _createPopoutWindow(mouseEvent?: MouseEvent): Window | null {\n    const elmRect = this.innerWrapper().nativeElement.getBoundingClientRect();\n    const [winLeft, winTop] = this._getWindowPositioning(elmRect, mouseEvent);\n    const pwc = this.popoutWindowConfig();\n    const winWidth = pwc?.size?.width ? pwc.size.width : elmRect.width;\n    const winHeight = pwc?.size?.height ? pwc.size.height : elmRect.height + 1;\n\n    const win = window.open(\n      '',\n      `popoutWindow${Date.now()}`,\n      ` popup,\n        width=${winWidth},\n        height=${winHeight},\n        left=${winLeft},\n        top=${winTop}`\n    );\n    if (win) {\n      win.document.title = this.popoutWindowConfig()?.title || window.document.title;\n      win.document.body.style.margin = '0';\n    }\n    return win;\n  }\n\n  private _getWindowPositioning(elmRect: DOMRect, mouseEvent?: MouseEvent) {\n    let winTop, winLeft;\n\n    const pwc = this.popoutWindowConfig()?.position;\n    if (pwc) {\n      winTop = pwc.blockStart || winTop;\n      winLeft = pwc.inlineStart || winLeft;\n    } else {\n      const navHeight = window.outerHeight - window.innerHeight;\n      const navWidth = (window.outerWidth - window.innerWidth) / 2;\n\n      winTop = window.screenY + navHeight + elmRect.top - 60;\n      winLeft = window.screenX + navWidth + elmRect.left;\n\n      // Position window titleBar under mouse\n      if (mouseEvent) {\n        winTop = mouseEvent.clientY + navHeight - 7;\n        winLeft += 120;\n      }\n    }\n    return [winLeft, winTop];\n  }\n\n  private _close(): void {\n    if (this.#popoutWindow) {\n      this.#popoutWindow.close();\n      this.#popoutWindow = null;\n      this.popIn.emit(true);\n    }\n  }\n\n  private _cloneStylesToPopoutWindow() {\n    if (window.navigator.userAgent.indexOf('Firefox') === -1) {\n      document.fonts.forEach((node) => {\n        (this.#popoutWindow!.document as any).fonts.add(node);\n      });\n    }\n    document.head.querySelectorAll('link[rel=\"stylesheet\"]').forEach((node) => {\n      this.#popoutWindow!.document.head.insertAdjacentHTML(\n        'beforeend',\n        `<link rel=\"stylesheet\" type=\"${(node as HTMLLinkElement).type}\" href=\"${(node as HTMLLinkElement).href}\">`\n      );\n    });\n    document.head.querySelectorAll('style').forEach((node) => {\n      this.#popoutWindow!.document.head.appendChild(node.cloneNode(true));\n    });\n  }\n\n  private _observeFutureStyleChanges() {\n    const headEle = document.querySelector('head');\n    this.#observer?.disconnect();\n    this.#observer = new MutationObserver((mutations) => {\n      mutations.forEach((mutation) => {\n        mutation.addedNodes.forEach((node) => {\n          if (node.nodeName === 'STYLE') {\n            this.#popoutWindow!.document.head.appendChild(node.cloneNode(true));\n          }\n        });\n      });\n    });\n    this.#observer.observe(headEle!, { childList: true });\n  }\n\n  ngOnDestroy(): void {\n    this.#observer?.disconnect();\n    this._close();\n  }\n}\n","<div #popoutWrapper class=\"popoutWrapper\" [ngClass]=\"{disabled: disabled()}\" \n[attr.data-pos]=\"triggerPosition()\">\n    <button mat-icon-button type=\"button\" class=\"trigger\" (click)=\"pop($event)\" \n    [matTooltip]=\"triggerTooltip()\"\n    [ngClass]=\"{poppedOut: isPoppedOut}\">\n      <mat-icon>{{triggerIcon()}}</mat-icon>\n    </button>\n    <div #innerWrapper class=\"innerWrapper\">\n      <ng-content></ng-content>\n    </div>\n  </div>","import { NgModule } from '@angular/core';\nimport { PopoutComponent } from './popout.component';\n\n@NgModule({\n  imports: [PopoutComponent],\n  exports: [PopoutComponent]\n})\nexport class YuvPopoutModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/yuuvis-client-framework-renderer.mjs

@@ -19,10 +19,10 @@ class AbstractRendererComponent {
     getProperty() {
         return this.#system.system?.allFields[this.propertyName()];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AbstractRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.1", type: AbstractRendererComponent, isStandalone: true, selector: "yuv-abstract-renderer", inputs: { propertyName: { classPropertyName: "propertyName", publicName: "propertyName", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, meta: { classPropertyName: "meta", publicName: "meta", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: AbstractRendererComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.12", type: AbstractRendererComponent, isStandalone: true, selector: "yuv-abstract-renderer", inputs: { propertyName: { classPropertyName: "propertyName", publicName: "propertyName", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, meta: { classPropertyName: "meta", publicName: "meta", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AbstractRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: AbstractRendererComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'yuv-abstract-renderer',
@@ -32,19 +32,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
         }] });
 
 class DateTimeRendererComponent extends AbstractRendererComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DateTimeRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: DateTimeRendererComponent, isStandalone: true, selector: "yuv-datetime-renderer", usesInheritance: true, ngImport: i0, template: '{{(value() || undefined) | localeDate}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"], dependencies: [{ kind: "pipe", type: LocaleDatePipe, name: "localeDate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DateTimeRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: DateTimeRendererComponent, isStandalone: true, selector: "yuv-datetime-renderer", usesInheritance: true, ngImport: i0, template: '{{(value() || undefined) | localeDate}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"], dependencies: [{ kind: "pipe", type: LocaleDatePipe, name: "localeDate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DateTimeRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DateTimeRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-datetime-renderer', standalone: true, imports: [LocaleDatePipe], template: '{{(value() || undefined) | localeDate}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
         }] });
 
 class DecimalRendererComponent extends AbstractRendererComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DecimalRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: DecimalRendererComponent, isStandalone: true, selector: "yuv-decimal-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DecimalRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: DecimalRendererComponent, isStandalone: true, selector: "yuv-decimal-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DecimalRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DecimalRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-decimal-renderer', standalone: true, template: '{{value()}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
         }] });
@@ -65,10 +65,10 @@ class FileSizeRendererComponent extends AbstractRendererComponent {
             return n;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FileSizeRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FileSizeRendererComponent, isStandalone: true, selector: "yuv-string-renderer", usesInheritance: true, ngImport: i0, template: '{{parsedValue() | fileSize}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"], dependencies: [{ kind: "pipe", type: FileSizePipe, name: "fileSize" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: FileSizeRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: FileSizeRendererComponent, isStandalone: true, selector: "yuv-string-renderer", usesInheritance: true, ngImport: i0, template: '{{parsedValue() | fileSize}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"], dependencies: [{ kind: "pipe", type: FileSizePipe, name: "fileSize" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FileSizeRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: FileSizeRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-string-renderer', imports: [FileSizePipe], standalone: true, template: '{{parsedValue() | fileSize}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
         }] });
@@ -89,8 +89,8 @@ class IconRendererComponent extends AbstractRendererComponent {
     #iconRegistry;
     #sanitizer;
     #registerIconsEffect;
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IconRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: IconRendererComponent, isStandalone: true, selector: "yuv-icon-renderer", usesInheritance: true, ngImport: i0, template: ` @let icon = value();
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: IconRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: IconRendererComponent, isStandalone: true, selector: "yuv-icon-renderer", usesInheritance: true, ngImport: i0, template: ` @let icon = value();
     @if (propertyName() !== 'custom') {
       <yuv-object-type-icon [objectTypeId]="icon || ''"></yuv-object-type-icon>
     } @else if (icon !== null) {
@@ -102,7 +102,7 @@ class IconRendererComponent extends AbstractRendererComponent {
       }
     }`, isInline: true, styles: [":host{display:flex;align-items:center;justify-content:center;padding:var(--tile-slot-padding)}:host yuv-icon,:host yuv-object-type-icon{--icon-size: var(--icon-renderer-icon-size);width:var(--icon-size);height:var(--icon-size)}\n"], dependencies: [{ kind: "component", type: ObjectTypeIconComponent, selector: "yuv-object-type-icon", inputs: ["objectTypeId"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IconRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: IconRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-icon-renderer', standalone: true, imports: [ObjectTypeIconComponent, MatIcon], template: ` @let icon = value();
     @if (propertyName() !== 'custom') {
@@ -118,10 +118,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
         }] });
 
 class IntegerRendererComponent extends AbstractRendererComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IntegerRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: IntegerRendererComponent, isStandalone: true, selector: "yuv-integer-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: IntegerRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: IntegerRendererComponent, isStandalone: true, selector: "yuv-integer-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: IntegerRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: IntegerRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-integer-renderer', standalone: true, template: '{{value()}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
         }] });
@@ -134,28 +134,28 @@ class OrganizationRendererComponent extends AbstractRendererComponent {
             return (m ? m['title'] : this.value() || '');
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: OrganizationRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: OrganizationRendererComponent, isStandalone: true, selector: "yuv-organization-renderer", usesInheritance: true, ngImport: i0, template: '{{resolvedValue()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: OrganizationRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: OrganizationRendererComponent, isStandalone: true, selector: "yuv-organization-renderer", usesInheritance: true, ngImport: i0, template: '{{resolvedValue()}}', isInline: true, styles: [":host{padding:var(--tile-slot-padding);display:var(--yuv-renderer-display, inline-block)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: OrganizationRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: OrganizationRendererComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'yuv-organization-renderer', imports: [], standalone: true, template: '{{resolvedValue()}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
+            args: [{ selector: 'yuv-organization-renderer', imports: [], standalone: true, template: '{{resolvedValue()}}', styles: [":host{padding:var(--tile-slot-padding);display:var(--yuv-renderer-display, inline-block)}\n"] }]
         }] });
 
 class StringRendererComponent extends AbstractRendererComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: StringRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: StringRendererComponent, isStandalone: true, selector: "yuv-string-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: StringRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: StringRendererComponent, isStandalone: true, selector: "yuv-string-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: StringRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: StringRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-string-renderer', standalone: true, template: '{{value()}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
         }] });
 
 class UnknownRendererComponent extends AbstractRendererComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: UnknownRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: UnknownRendererComponent, isStandalone: true, selector: "yuv-unknown-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: UnknownRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.12", type: UnknownRendererComponent, isStandalone: true, selector: "yuv-unknown-renderer", usesInheritance: true, ngImport: i0, template: '{{value()}}', isInline: true, styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: UnknownRendererComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: UnknownRendererComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-unknown-renderer', standalone: true, imports: [], template: '{{value()}}', styles: [":host{display:inline-block;padding:var(--tile-slot-padding)}\n"] }]
         }] });
@@ -222,10 +222,10 @@ class RendererService {
         typeName && k.push(typeName);
         return k.join('-');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RendererService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RendererService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: RendererService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: RendererService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RendererService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: RendererService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -270,10 +270,10 @@ class RendererDirective {
     _alreadyRendered(i) {
         return !!this._rendererInput && JSON.stringify(this._rendererInput) === JSON.stringify(i);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RendererDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.1", type: RendererDirective, isStandalone: true, selector: "[yuvRenderer]", inputs: { yuvRenderer: { classPropertyName: "yuvRenderer", publicName: "yuvRenderer", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: RendererDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.12", type: RendererDirective, isStandalone: true, selector: "[yuvRenderer]", inputs: { yuvRenderer: { classPropertyName: "yuvRenderer", publicName: "yuvRenderer", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RendererDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: RendererDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[yuvRenderer]',