@yuuvis/app-drive 2.0.11 → 2.0.13

package/README.md

@@ -11,7 +11,7 @@ npm install @yuuvis/app-drive --save
 ```
 
 ## Enable extension
-In your `app.config.ts` add the `AppDriveExensionModule` to the providers:
+In your `app.config.ts` add the `AppDriveExtension` to the providers:
 
 ```ts
 import { AppDriveExtensionsModule } from '@yuuvis/app-drive/extensions';
@@ -20,7 +20,7 @@ import { provideDrive } from '@yuuvis/app-drive';
 export const appConfig: ApplicationConfig = {
   providers: [
     importShellExtensions([
-        AppDriveExtensionsModule
+        { id: 'io.yuuvis.app.drive.extension', extension: AppDriveExtension },
     ]),
     provideDrive()
   ]

package/fesm2022/yuuvis-app-drive.mjs

@@ -28,7 +28,7 @@ import { MatProgressBar } from '@angular/material/progress-bar';
 import { TranslateService as TranslateService$1, TranslateModule as TranslateModule$1 } from '@ngx-translate/core';
 import { ShellService } from '@yuuvis/client-shell-core';
 import { Overlay } from '@angular/cdk/overlay';
-import { ObjectPreviewComponent } from '@yuuvis/client-framework/object-preview';
+import { ObjectPreviewComponent, ObjectPreviewService } from '@yuuvis/client-framework/object-preview';
 import { ObjectSummaryDataComponent, ObjectSummaryComponent, MultiObjectSummaryComponent } from '@yuuvis/client-framework/object-summary';
 import * as i3 from '@angular/material/button';
 import { MatButtonModule, MatIconAnchor, MatIconButton } from '@angular/material/button';
@@ -1006,7 +1006,7 @@ class CopyLinkAction extends AbstractContextAction {
         const uri = `${window.location.origin}${Utils.getBaseHref(true)}/${this.#shell.appBaseRoutes[APP_ID]}/${o.isFolder ? 'files' : 'object'}/${selection[0].id}`;
         navigator.clipboard
             .writeText(uri)
-            .then(() => this.#notification.info(this.translate.instant('yuv.app.drive.action.copy-link.success')))
+            .then(() => this.#notification.success(this.translate.instant('yuv.app.drive.action.copy-link.success')))
             .catch(() => {
             //
         });
@@ -1727,16 +1727,19 @@ class DriveSearchOverlayComponent {
         });
         this.#system
             .getObjectTypeForms(sots, Situation.SEARCH)
-            .pipe(finalize$1(() => (this.#initialFormData = {})))
-            .subscribe((forms) => {
-            const ffo = {};
-            Object.keys(forms).forEach((sot) => {
-                ffo[sotQA[sot]] = {
-                    formModel: forms[sot],
-                    data: this.#initialFormData
-                };
-            });
-            this.flavorFormOptions.set(ffo);
+            // .pipe(finalize(() => (this.#initialFormData = {}))) // TODO: check if this is needed
+            .subscribe({
+            next: (forms) => {
+                const ffo = {};
+                const data = this.#initialFormData;
+                Object.keys(forms).forEach((sot) => {
+                    ffo[sotQA[sot]] = {
+                        formModel: forms[sot],
+                        data
+                    };
+                });
+                this.flavorFormOptions.set(ffo);
+            }
         });
     }
     onFormStatusChanged(formId, evt) {
@@ -1914,7 +1917,30 @@ class DriveSearchOverlayComponent {
                 }
                 default: {
                     // check for values to inject into flavor forms
-                    this.#initialFormData[f.f] = f.v1;
+                    const otField = this.#system.getObjectTypeField(f.f);
+                    let payload = null;
+                    if (otField && otField.propertyType === 'datetime') {
+                        if (!isNaN(Date.parse(f.v1)) || !isNaN(Date.parse(f.v2))) {
+                            payload = {
+                                operator: f.o,
+                                firstValue: f.v1 ? f.v1 : undefined,
+                                secondValue: f.v2 ? f.v2 : undefined
+                            };
+                        }
+                    }
+                    else if (otField && ['integer', 'decimal'].includes(otField.propertyType)) {
+                        if (!isNaN(Number(f.v1)) || !isNaN(Number(f.v2))) {
+                            payload = {
+                                operator: f.o,
+                                firstValue: f.v1 ? Number(f.v1) : undefined,
+                                secondValue: f.v2 ? Number(f.v2) : undefined
+                            };
+                        }
+                    }
+                    else {
+                        payload = f.v1;
+                    }
+                    this.#initialFormData[f.f] = payload;
                 }
             }
         });
@@ -1940,7 +1966,7 @@ class DriveSearchOverlayComponent {
         ]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DriveSearchOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: DriveSearchOverlayComponent, isStandalone: true, selector: "ymd-drive-search-overlay", viewQueries: [{ propertyName: "objectForms", predicate: ObjectFormComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<h2 matDialogTitle class=\"yuv-dialog-title\">{{ 'yuv.app.drive.search.advanced.dialog.title' | translate }}</h2>\n<mat-dialog-content class=\"yuv-dialog-content\">\n  <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"'yuv.app.drive.search.meta.splitview'\">\n    <!-- search options -->\n    <ng-template yuvSplitArea [size]=\"40\">\n      <form class=\"options\" role=\"search\" [formGroup]=\"filterForm\">\n        <!--  term and scope -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.term' | translate }}</mat-label>\n          <input matInput class=\"term\" type=\"search\" formControlName=\"term\" />\n          <mat-icon matSuffix>search</mat-icon>\n        </mat-form-field>\n\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.where' | translate }}</mat-label>\n          <mat-select formControlName=\"scope\" [disabled]=\"!filterForm.value.term\">\n            @for (food of scopeOptions(); track food) {\n              <mat-option [value]=\"food.value\">{{ food.label }}</mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n\n        <!--  types -->\n        <div class=\"options-type-list\">\n          <h2>{{ 'yuv.app.drive.search.meta.options.type' | translate }}</h2>\n          <yuv-list (itemSelect)=\"typeSelected($event)\" [selfHandleSelection]=\"true\">\n            @for (t of flavors; track t.id) {\n              <div class=\"type\" yuvListItem [ngClass]=\"{ selected: !!selectedFlavorsRec[t.id] }\">\n                <mat-pseudo-checkbox [state]=\"!!selectedFlavorsRec[t.id] ? 'checked' : 'unchecked'\"></mat-pseudo-checkbox>\n                {{ t.label }}\n              </div>\n            }\n          </yuv-list>\n        </div>\n\n        <!-- created -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.created' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"created\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- modified -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.modified' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"modified\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- content length -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.contentlength' | translate }}</mat-label>\n          <yuv-range-select-filesize formControlName=\"contentlength\"></yuv-range-select-filesize>\n        </mat-form-field>\n      </form>\n    </ng-template>\n\n    <ng-template yuvSplitArea [size]=\"60\">\n      <div class=\"query\">\n        <h1>{{ 'yuv.app.drive.search.meta.headline.query' | translate }}</h1>\n\n        <div class=\"tokens\">\n          @if (flavorForms().length === 0 && !filterForm.value.term) {\n            <p>{{ 'yuv.app.drive.search.meta.query.for-everything' | translate }}</p>\n          }\n          @for (o of flavorForms(); track o.id) {\n            <details class=\"token\">\n              <summary [ngClass]=\"{ dirty: formStates[o.id]?.dirty }\">\n                @if (o.icon && o.svgIcon) {\n                  <mat-icon [svgIcon]=\"o.icon\"></mat-icon>\n                } @else {\n                  <mat-icon>{{ o.icon }}</mat-icon>\n                }\n                {{ o.label }}\n                <mat-icon class=\"arr\">arrow_drop_down</mat-icon>\n              </summary>\n              <yuv-object-form [formOptions]=\"o.formOptions\" (statusChanged)=\"onFormStatusChanged(o.id, $event)\"></yuv-object-form>\n            </details>\n          }\n          @for (t of searchTokens; track $index) {\n            <div class=\"searchToken token\">\n              {{ t.label }}\n              <button mat-icon-button class=\"ymt-icon-button--size-s\" (click)=\"removeSearchToken(t)\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </div>\n          }\n        </div>\n      </div>\n    </ng-template>\n  </yuv-split-view>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\" class=\"yuv-dialog-actions\">\n  <button ymtButton=\"secondary\" mat-dialog-close type=\"button\" (click)=\"cancel()\">{{ 'yuv.app.drive.search.meta.button.cancel' | translate }}</button>\n  <button ymtButton=\"primary\" mat-dialog-close type=\"submit\" (click)=\"submit()\">{{ 'yuv.app.drive.search.meta.button.search' | translate }}</button>\n</mat-dialog-actions>\n", styles: [".yuv-dialog-title{border-bottom:1px solid var(--ymt-outline-variant);margin:0}.yuv-dialog-content{flex-grow:1;flex-basis:1px;max-height:inherit}.yuv-dialog-content yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);display:contents}.yuv-dialog-content form.options{padding:var(--ymt-spacing-m);display:flex;flex-flow:column}.yuv-dialog-content form.options [aria-disabled=true]{cursor:default;opacity:.5}.yuv-dialog-content form.options h2{font:var(--ymt-font-subhead);margin-top:0}.yuv-dialog-content form.options .type:hover{background-color:var(--ymt-surface-container-low)}.yuv-dialog-content form.options .yuv-form-field{cursor:pointer}.yuv-dialog-content form.options .options-type-list,.yuv-dialog-content form.options .yuv-form-field{margin:var(--ymt-spacing-xs) 0}.yuv-dialog-content form.options .options-type-list{margin-bottom:var(--ymt-spacing-3xl)}.yuv-dialog-content form.options .type{display:flex;gap:var(--ymt-spacing-m);align-items:center;padding:var(--ymt-spacing-xs);cursor:pointer}.yuv-dialog-content .query{background-color:var(--ymt-surface);height:100%;box-sizing:border-box;overflow-y:auto;padding:var(--ymt-spacing-m)}.yuv-dialog-content .query h1{font:var(--yuv-font-display);margin:.5rem 0 1rem;color:var(--ymt-text-color-subtle)}.yuv-dialog-content .query .tokens{display:flex;flex-flow:row wrap;align-items:start;gap:var(--ymt-spacing-m)}.yuv-dialog-content .query .tokens>.token{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline-variant);animation:searchTokenEnter .2s ease-in-out forwards;box-sizing:border-box;color:var(--ymt-text-color-subtle);border-radius:4px}.yuv-dialog-content .query .tokens details{width:var(--om-section-max-width);max-width:100%}.yuv-dialog-content .query .tokens details[open]{width:100%}.yuv-dialog-content .query .tokens details[open] mat-icon.arr{transform:rotate(180deg)}.yuv-dialog-content .query .tokens details summary{padding:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-3xl);cursor:pointer;display:flex;align-items:center;position:relative;font-weight:700}.yuv-dialog-content .query .tokens details summary.dirty:after{content:\"\";width:.5em;height:.5em;border-radius:50%;background-color:var(--ymt-primary);margin-inline-start:.5em;align-self:start}.yuv-dialog-content .query .tokens details summary::marker{display:none}.yuv-dialog-content .query .tokens details summary mat-icon{margin-inline-end:var(--ymt-spacing-xs)}.yuv-dialog-content .query .tokens details summary mat-icon.arr{position:absolute;inset-inline-end:0}.yuv-dialog-content .query .tokens .searchToken{padding:var(--ymt-spacing-xs);gap:var(--ymt-spacing-xs);cursor:pointer;display:flex;align-items:center;line-height:1em;font-weight:700}.yuv-dialog-actions{border-top:1px solid var(--ymt-outline-variant)}@keyframes searchTokenEnter{0%{opacity:0;transform:translateY(.5em)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule$1 }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: ObjectFormComponent, selector: "yuv-object-form", inputs: ["formOptions", "inert", "elementExtensions", "isInnerTableForm"], outputs: ["statusChanged", "onFormReady"] }, { kind: "ngmodule", type: YuvSplitViewModule }, { kind: "directive", type: i1$2.SplitAreaDirective, selector: "[yuvSplitArea]", inputs: ["size", "minSize", "maxSize", "panelClass", "visible"] }, { kind: "component", type: i1$2.SplitViewComponent, selector: "yuv-split-view", inputs: ["direction", "gutterSize", "restrictMove", "disabled", "layoutSettingsID"], outputs: ["layoutSettingsChange", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"] }, { 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.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"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "component", type: i5.ListComponent, selector: "yuv-list", inputs: ["multiselect", "selfHandleSelection", "disableSelection"], outputs: ["itemSelect", "itemFocus"] }, { kind: "directive", type: i5.ListItemDirective, selector: "[yuvListItem]", inputs: ["disabled", "active", "selected"] }, { kind: "component", type: RangeSelectDateComponent, selector: "yuv-range-select-date", inputs: ["ranges", "customRange"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: MatPseudoCheckbox, selector: "mat-pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: RangeSelectFilesizeComponent, selector: "yuv-range-select-filesize", inputs: ["ranges"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: DriveSearchOverlayComponent, isStandalone: true, selector: "ymd-drive-search-overlay", viewQueries: [{ propertyName: "objectForms", predicate: ObjectFormComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<h2 matDialogTitle class=\"yuv-dialog-title\">{{ 'yuv.app.drive.search.extended.dialog.title' | translate }}</h2>\n<mat-dialog-content class=\"yuv-dialog-content\">\n  <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"'yuv.app.drive.search.meta.splitview'\">\n    <!-- search options -->\n    <ng-template yuvSplitArea [size]=\"40\">\n      <form class=\"options\" role=\"search\" [formGroup]=\"filterForm\">\n        <!--  term and scope -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.term' | translate }}</mat-label>\n          <input matInput class=\"term\" type=\"search\" formControlName=\"term\" />\n          <mat-icon matSuffix>search</mat-icon>\n        </mat-form-field>\n\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.where' | translate }}</mat-label>\n          <mat-select formControlName=\"scope\" [disabled]=\"!filterForm.value.term\">\n            @for (food of scopeOptions(); track food) {\n              <mat-option [value]=\"food.value\">{{ food.label }}</mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n\n        <!--  types -->\n        <div class=\"options-type-list\">\n          <h2>{{ 'yuv.app.drive.search.meta.options.type' | translate }}</h2>\n          <yuv-list (itemSelect)=\"typeSelected($event)\" [selfHandleSelection]=\"true\">\n            @for (t of flavors; track t.id) {\n              <div class=\"type\" yuvListItem [ngClass]=\"{ selected: !!selectedFlavorsRec[t.id] }\">\n                <mat-pseudo-checkbox [state]=\"!!selectedFlavorsRec[t.id] ? 'checked' : 'unchecked'\"></mat-pseudo-checkbox>\n                {{ t.label }}\n              </div>\n            }\n          </yuv-list>\n        </div>\n\n        <!-- created -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.created' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"created\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- modified -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.modified' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"modified\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- content length -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.contentlength' | translate }}</mat-label>\n          <yuv-range-select-filesize formControlName=\"contentlength\"></yuv-range-select-filesize>\n        </mat-form-field>\n      </form>\n    </ng-template>\n\n    <ng-template yuvSplitArea [size]=\"60\">\n      <div class=\"query\">\n        <h1>{{ 'yuv.app.drive.search.meta.headline.query' | translate }}</h1>\n\n        <div class=\"tokens\">\n          @if (flavorForms().length === 0 && !filterForm.value.term) {\n            <p>{{ 'yuv.app.drive.search.meta.query.for-everything' | translate }}</p>\n          }\n          @for (o of flavorForms(); track o.id) {\n            <details class=\"token\">\n              <summary [ngClass]=\"{ dirty: formStates[o.id]?.dirty }\">\n                @if (o.icon && o.svgIcon) {\n                  <mat-icon [svgIcon]=\"o.icon\"></mat-icon>\n                } @else {\n                  <mat-icon>{{ o.icon }}</mat-icon>\n                }\n                {{ o.label }}\n                <mat-icon class=\"arr\">arrow_drop_down</mat-icon>\n              </summary>\n              <yuv-object-form [formOptions]=\"o.formOptions\" (statusChanged)=\"onFormStatusChanged(o.id, $event)\"></yuv-object-form>\n            </details>\n          }\n          @for (t of searchTokens; track $index) {\n            <div class=\"searchToken token\">\n              {{ t.label }}\n              <button mat-icon-button class=\"ymt-icon-button--size-s\" (click)=\"removeSearchToken(t)\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </div>\n          }\n        </div>\n      </div>\n    </ng-template>\n  </yuv-split-view>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\" class=\"yuv-dialog-actions\">\n  <button ymtButton=\"secondary\" mat-dialog-close type=\"button\" (click)=\"cancel()\">{{ 'yuv.app.drive.search.meta.button.cancel' | translate }}</button>\n  <button ymtButton=\"primary\" mat-dialog-close type=\"submit\" (click)=\"submit()\">{{ 'yuv.app.drive.search.meta.button.search' | translate }}</button>\n</mat-dialog-actions>\n", styles: [".yuv-dialog-title{border-bottom:1px solid var(--ymt-outline-variant);margin:0}.yuv-dialog-content{flex-grow:1;flex-basis:1px;max-height:inherit}.yuv-dialog-content yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);display:contents}.yuv-dialog-content form.options{padding:var(--ymt-spacing-m);display:flex;flex-flow:column}.yuv-dialog-content form.options [aria-disabled=true]{cursor:default;opacity:.5}.yuv-dialog-content form.options h2{font:var(--ymt-font-subhead);margin-top:0}.yuv-dialog-content form.options .type:hover{background-color:var(--ymt-surface-container-low)}.yuv-dialog-content form.options .yuv-form-field{cursor:pointer}.yuv-dialog-content form.options .options-type-list,.yuv-dialog-content form.options .yuv-form-field{margin:var(--ymt-spacing-xs) 0}.yuv-dialog-content form.options .options-type-list{margin-bottom:var(--ymt-spacing-3xl)}.yuv-dialog-content form.options .type{display:flex;gap:var(--ymt-spacing-m);align-items:center;padding:var(--ymt-spacing-xs);cursor:pointer}.yuv-dialog-content .query{background-color:var(--ymt-surface);height:100%;box-sizing:border-box;overflow-y:auto;padding:var(--ymt-spacing-m)}.yuv-dialog-content .query h1{font:var(--yuv-font-display);margin:.5rem 0 1rem;color:var(--ymt-text-color-subtle)}.yuv-dialog-content .query .tokens{display:flex;flex-flow:row wrap;align-items:start;gap:var(--ymt-spacing-m)}.yuv-dialog-content .query .tokens>.token{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline-variant);animation:searchTokenEnter .2s ease-in-out forwards;box-sizing:border-box;color:var(--ymt-text-color-subtle);border-radius:4px}.yuv-dialog-content .query .tokens details{width:var(--om-section-max-width);max-width:100%}.yuv-dialog-content .query .tokens details[open]{width:100%}.yuv-dialog-content .query .tokens details[open] mat-icon.arr{transform:rotate(180deg)}.yuv-dialog-content .query .tokens details summary{padding:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-3xl);cursor:pointer;display:flex;align-items:center;position:relative;font-weight:700}.yuv-dialog-content .query .tokens details summary.dirty:after{content:\"\";width:.5em;height:.5em;border-radius:50%;background-color:var(--ymt-primary);margin-inline-start:.5em;align-self:start}.yuv-dialog-content .query .tokens details summary::marker{display:none}.yuv-dialog-content .query .tokens details summary mat-icon{margin-inline-end:var(--ymt-spacing-xs)}.yuv-dialog-content .query .tokens details summary mat-icon.arr{position:absolute;inset-inline-end:0}.yuv-dialog-content .query .tokens .searchToken{padding:var(--ymt-spacing-xs);gap:var(--ymt-spacing-xs);cursor:pointer;display:flex;align-items:center;line-height:1em;font-weight:700}.yuv-dialog-actions{border-top:1px solid var(--ymt-outline-variant)}@keyframes searchTokenEnter{0%{opacity:0;transform:translateY(.5em)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: TranslateModule$1 }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: ObjectFormComponent, selector: "yuv-object-form", inputs: ["formOptions", "inert", "elementExtensions", "isInnerTableForm"], outputs: ["statusChanged", "onFormReady"] }, { kind: "ngmodule", type: YuvSplitViewModule }, { kind: "directive", type: i1$2.SplitAreaDirective, selector: "[yuvSplitArea]", inputs: ["size", "minSize", "maxSize", "panelClass", "visible"] }, { kind: "component", type: i1$2.SplitViewComponent, selector: "yuv-split-view", inputs: ["direction", "gutterSize", "restrictMove", "disabled", "layoutSettingsID"], outputs: ["layoutSettingsChange", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"] }, { 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.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"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "component", type: i5.ListComponent, selector: "yuv-list", inputs: ["multiselect", "selfHandleSelection", "disableSelection"], outputs: ["itemSelect", "itemFocus"] }, { kind: "directive", type: i5.ListItemDirective, selector: "[yuvListItem]", inputs: ["disabled", "active", "selected"] }, { kind: "component", type: RangeSelectDateComponent, selector: "yuv-range-select-date", inputs: ["ranges", "customRange"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i7.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: MatPseudoCheckbox, selector: "mat-pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: RangeSelectFilesizeComponent, selector: "yuv-range-select-filesize", inputs: ["ranges"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DriveSearchOverlayComponent, decorators: [{
             type: Component,
@@ -1964,7 +1990,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImpo
                         MatPseudoCheckbox,
                         YmtButtonDirective,
                         RangeSelectFilesizeComponent
-                    ], template: "<h2 matDialogTitle class=\"yuv-dialog-title\">{{ 'yuv.app.drive.search.advanced.dialog.title' | translate }}</h2>\n<mat-dialog-content class=\"yuv-dialog-content\">\n  <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"'yuv.app.drive.search.meta.splitview'\">\n    <!-- search options -->\n    <ng-template yuvSplitArea [size]=\"40\">\n      <form class=\"options\" role=\"search\" [formGroup]=\"filterForm\">\n        <!--  term and scope -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.term' | translate }}</mat-label>\n          <input matInput class=\"term\" type=\"search\" formControlName=\"term\" />\n          <mat-icon matSuffix>search</mat-icon>\n        </mat-form-field>\n\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.where' | translate }}</mat-label>\n          <mat-select formControlName=\"scope\" [disabled]=\"!filterForm.value.term\">\n            @for (food of scopeOptions(); track food) {\n              <mat-option [value]=\"food.value\">{{ food.label }}</mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n\n        <!--  types -->\n        <div class=\"options-type-list\">\n          <h2>{{ 'yuv.app.drive.search.meta.options.type' | translate }}</h2>\n          <yuv-list (itemSelect)=\"typeSelected($event)\" [selfHandleSelection]=\"true\">\n            @for (t of flavors; track t.id) {\n              <div class=\"type\" yuvListItem [ngClass]=\"{ selected: !!selectedFlavorsRec[t.id] }\">\n                <mat-pseudo-checkbox [state]=\"!!selectedFlavorsRec[t.id] ? 'checked' : 'unchecked'\"></mat-pseudo-checkbox>\n                {{ t.label }}\n              </div>\n            }\n          </yuv-list>\n        </div>\n\n        <!-- created -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.created' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"created\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- modified -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.modified' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"modified\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- content length -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.contentlength' | translate }}</mat-label>\n          <yuv-range-select-filesize formControlName=\"contentlength\"></yuv-range-select-filesize>\n        </mat-form-field>\n      </form>\n    </ng-template>\n\n    <ng-template yuvSplitArea [size]=\"60\">\n      <div class=\"query\">\n        <h1>{{ 'yuv.app.drive.search.meta.headline.query' | translate }}</h1>\n\n        <div class=\"tokens\">\n          @if (flavorForms().length === 0 && !filterForm.value.term) {\n            <p>{{ 'yuv.app.drive.search.meta.query.for-everything' | translate }}</p>\n          }\n          @for (o of flavorForms(); track o.id) {\n            <details class=\"token\">\n              <summary [ngClass]=\"{ dirty: formStates[o.id]?.dirty }\">\n                @if (o.icon && o.svgIcon) {\n                  <mat-icon [svgIcon]=\"o.icon\"></mat-icon>\n                } @else {\n                  <mat-icon>{{ o.icon }}</mat-icon>\n                }\n                {{ o.label }}\n                <mat-icon class=\"arr\">arrow_drop_down</mat-icon>\n              </summary>\n              <yuv-object-form [formOptions]=\"o.formOptions\" (statusChanged)=\"onFormStatusChanged(o.id, $event)\"></yuv-object-form>\n            </details>\n          }\n          @for (t of searchTokens; track $index) {\n            <div class=\"searchToken token\">\n              {{ t.label }}\n              <button mat-icon-button class=\"ymt-icon-button--size-s\" (click)=\"removeSearchToken(t)\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </div>\n          }\n        </div>\n      </div>\n    </ng-template>\n  </yuv-split-view>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\" class=\"yuv-dialog-actions\">\n  <button ymtButton=\"secondary\" mat-dialog-close type=\"button\" (click)=\"cancel()\">{{ 'yuv.app.drive.search.meta.button.cancel' | translate }}</button>\n  <button ymtButton=\"primary\" mat-dialog-close type=\"submit\" (click)=\"submit()\">{{ 'yuv.app.drive.search.meta.button.search' | translate }}</button>\n</mat-dialog-actions>\n", styles: [".yuv-dialog-title{border-bottom:1px solid var(--ymt-outline-variant);margin:0}.yuv-dialog-content{flex-grow:1;flex-basis:1px;max-height:inherit}.yuv-dialog-content yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);display:contents}.yuv-dialog-content form.options{padding:var(--ymt-spacing-m);display:flex;flex-flow:column}.yuv-dialog-content form.options [aria-disabled=true]{cursor:default;opacity:.5}.yuv-dialog-content form.options h2{font:var(--ymt-font-subhead);margin-top:0}.yuv-dialog-content form.options .type:hover{background-color:var(--ymt-surface-container-low)}.yuv-dialog-content form.options .yuv-form-field{cursor:pointer}.yuv-dialog-content form.options .options-type-list,.yuv-dialog-content form.options .yuv-form-field{margin:var(--ymt-spacing-xs) 0}.yuv-dialog-content form.options .options-type-list{margin-bottom:var(--ymt-spacing-3xl)}.yuv-dialog-content form.options .type{display:flex;gap:var(--ymt-spacing-m);align-items:center;padding:var(--ymt-spacing-xs);cursor:pointer}.yuv-dialog-content .query{background-color:var(--ymt-surface);height:100%;box-sizing:border-box;overflow-y:auto;padding:var(--ymt-spacing-m)}.yuv-dialog-content .query h1{font:var(--yuv-font-display);margin:.5rem 0 1rem;color:var(--ymt-text-color-subtle)}.yuv-dialog-content .query .tokens{display:flex;flex-flow:row wrap;align-items:start;gap:var(--ymt-spacing-m)}.yuv-dialog-content .query .tokens>.token{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline-variant);animation:searchTokenEnter .2s ease-in-out forwards;box-sizing:border-box;color:var(--ymt-text-color-subtle);border-radius:4px}.yuv-dialog-content .query .tokens details{width:var(--om-section-max-width);max-width:100%}.yuv-dialog-content .query .tokens details[open]{width:100%}.yuv-dialog-content .query .tokens details[open] mat-icon.arr{transform:rotate(180deg)}.yuv-dialog-content .query .tokens details summary{padding:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-3xl);cursor:pointer;display:flex;align-items:center;position:relative;font-weight:700}.yuv-dialog-content .query .tokens details summary.dirty:after{content:\"\";width:.5em;height:.5em;border-radius:50%;background-color:var(--ymt-primary);margin-inline-start:.5em;align-self:start}.yuv-dialog-content .query .tokens details summary::marker{display:none}.yuv-dialog-content .query .tokens details summary mat-icon{margin-inline-end:var(--ymt-spacing-xs)}.yuv-dialog-content .query .tokens details summary mat-icon.arr{position:absolute;inset-inline-end:0}.yuv-dialog-content .query .tokens .searchToken{padding:var(--ymt-spacing-xs);gap:var(--ymt-spacing-xs);cursor:pointer;display:flex;align-items:center;line-height:1em;font-weight:700}.yuv-dialog-actions{border-top:1px solid var(--ymt-outline-variant)}@keyframes searchTokenEnter{0%{opacity:0;transform:translateY(.5em)}to{opacity:1;transform:translateY(0)}}\n"] }]
+                    ], template: "<h2 matDialogTitle class=\"yuv-dialog-title\">{{ 'yuv.app.drive.search.extended.dialog.title' | translate }}</h2>\n<mat-dialog-content class=\"yuv-dialog-content\">\n  <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"'yuv.app.drive.search.meta.splitview'\">\n    <!-- search options -->\n    <ng-template yuvSplitArea [size]=\"40\">\n      <form class=\"options\" role=\"search\" [formGroup]=\"filterForm\">\n        <!--  term and scope -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.term' | translate }}</mat-label>\n          <input matInput class=\"term\" type=\"search\" formControlName=\"term\" />\n          <mat-icon matSuffix>search</mat-icon>\n        </mat-form-field>\n\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.where' | translate }}</mat-label>\n          <mat-select formControlName=\"scope\" [disabled]=\"!filterForm.value.term\">\n            @for (food of scopeOptions(); track food) {\n              <mat-option [value]=\"food.value\">{{ food.label }}</mat-option>\n            }\n          </mat-select>\n        </mat-form-field>\n\n        <!--  types -->\n        <div class=\"options-type-list\">\n          <h2>{{ 'yuv.app.drive.search.meta.options.type' | translate }}</h2>\n          <yuv-list (itemSelect)=\"typeSelected($event)\" [selfHandleSelection]=\"true\">\n            @for (t of flavors; track t.id) {\n              <div class=\"type\" yuvListItem [ngClass]=\"{ selected: !!selectedFlavorsRec[t.id] }\">\n                <mat-pseudo-checkbox [state]=\"!!selectedFlavorsRec[t.id] ? 'checked' : 'unchecked'\"></mat-pseudo-checkbox>\n                {{ t.label }}\n              </div>\n            }\n          </yuv-list>\n        </div>\n\n        <!-- created -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.created' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"created\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- modified -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.modified' | translate }}</mat-label>\n          <yuv-range-select-date formControlName=\"modified\"></yuv-range-select-date>\n        </mat-form-field>\n\n        <!-- content length -->\n        <mat-form-field class=\"yuv-form-field\">\n          <mat-label>{{ 'yuv.app.drive.search.meta.options.contentlength' | translate }}</mat-label>\n          <yuv-range-select-filesize formControlName=\"contentlength\"></yuv-range-select-filesize>\n        </mat-form-field>\n      </form>\n    </ng-template>\n\n    <ng-template yuvSplitArea [size]=\"60\">\n      <div class=\"query\">\n        <h1>{{ 'yuv.app.drive.search.meta.headline.query' | translate }}</h1>\n\n        <div class=\"tokens\">\n          @if (flavorForms().length === 0 && !filterForm.value.term) {\n            <p>{{ 'yuv.app.drive.search.meta.query.for-everything' | translate }}</p>\n          }\n          @for (o of flavorForms(); track o.id) {\n            <details class=\"token\">\n              <summary [ngClass]=\"{ dirty: formStates[o.id]?.dirty }\">\n                @if (o.icon && o.svgIcon) {\n                  <mat-icon [svgIcon]=\"o.icon\"></mat-icon>\n                } @else {\n                  <mat-icon>{{ o.icon }}</mat-icon>\n                }\n                {{ o.label }}\n                <mat-icon class=\"arr\">arrow_drop_down</mat-icon>\n              </summary>\n              <yuv-object-form [formOptions]=\"o.formOptions\" (statusChanged)=\"onFormStatusChanged(o.id, $event)\"></yuv-object-form>\n            </details>\n          }\n          @for (t of searchTokens; track $index) {\n            <div class=\"searchToken token\">\n              {{ t.label }}\n              <button mat-icon-button class=\"ymt-icon-button--size-s\" (click)=\"removeSearchToken(t)\">\n                <mat-icon>close</mat-icon>\n              </button>\n            </div>\n          }\n        </div>\n      </div>\n    </ng-template>\n  </yuv-split-view>\n</mat-dialog-content>\n<mat-dialog-actions align=\"end\" class=\"yuv-dialog-actions\">\n  <button ymtButton=\"secondary\" mat-dialog-close type=\"button\" (click)=\"cancel()\">{{ 'yuv.app.drive.search.meta.button.cancel' | translate }}</button>\n  <button ymtButton=\"primary\" mat-dialog-close type=\"submit\" (click)=\"submit()\">{{ 'yuv.app.drive.search.meta.button.search' | translate }}</button>\n</mat-dialog-actions>\n", styles: [".yuv-dialog-title{border-bottom:1px solid var(--ymt-outline-variant);margin:0}.yuv-dialog-content{flex-grow:1;flex-basis:1px;max-height:inherit}.yuv-dialog-content yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);display:contents}.yuv-dialog-content form.options{padding:var(--ymt-spacing-m);display:flex;flex-flow:column}.yuv-dialog-content form.options [aria-disabled=true]{cursor:default;opacity:.5}.yuv-dialog-content form.options h2{font:var(--ymt-font-subhead);margin-top:0}.yuv-dialog-content form.options .type:hover{background-color:var(--ymt-surface-container-low)}.yuv-dialog-content form.options .yuv-form-field{cursor:pointer}.yuv-dialog-content form.options .options-type-list,.yuv-dialog-content form.options .yuv-form-field{margin:var(--ymt-spacing-xs) 0}.yuv-dialog-content form.options .options-type-list{margin-bottom:var(--ymt-spacing-3xl)}.yuv-dialog-content form.options .type{display:flex;gap:var(--ymt-spacing-m);align-items:center;padding:var(--ymt-spacing-xs);cursor:pointer}.yuv-dialog-content .query{background-color:var(--ymt-surface);height:100%;box-sizing:border-box;overflow-y:auto;padding:var(--ymt-spacing-m)}.yuv-dialog-content .query h1{font:var(--yuv-font-display);margin:.5rem 0 1rem;color:var(--ymt-text-color-subtle)}.yuv-dialog-content .query .tokens{display:flex;flex-flow:row wrap;align-items:start;gap:var(--ymt-spacing-m)}.yuv-dialog-content .query .tokens>.token{background-color:var(--ymt-surface-container);border:1px solid var(--ymt-outline-variant);animation:searchTokenEnter .2s ease-in-out forwards;box-sizing:border-box;color:var(--ymt-text-color-subtle);border-radius:4px}.yuv-dialog-content .query .tokens details{width:var(--om-section-max-width);max-width:100%}.yuv-dialog-content .query .tokens details[open]{width:100%}.yuv-dialog-content .query .tokens details[open] mat-icon.arr{transform:rotate(180deg)}.yuv-dialog-content .query .tokens details summary{padding:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-3xl);cursor:pointer;display:flex;align-items:center;position:relative;font-weight:700}.yuv-dialog-content .query .tokens details summary.dirty:after{content:\"\";width:.5em;height:.5em;border-radius:50%;background-color:var(--ymt-primary);margin-inline-start:.5em;align-self:start}.yuv-dialog-content .query .tokens details summary::marker{display:none}.yuv-dialog-content .query .tokens details summary mat-icon{margin-inline-end:var(--ymt-spacing-xs)}.yuv-dialog-content .query .tokens details summary mat-icon.arr{position:absolute;inset-inline-end:0}.yuv-dialog-content .query .tokens .searchToken{padding:var(--ymt-spacing-xs);gap:var(--ymt-spacing-xs);cursor:pointer;display:flex;align-items:center;line-height:1em;font-weight:700}.yuv-dialog-actions{border-top:1px solid var(--ymt-outline-variant)}@keyframes searchTokenEnter{0%{opacity:0;transform:translateY(.5em)}to{opacity:1;transform:translateY(0)}}\n"] }]
         }], ctorParameters: () => [] });
 
 class DriveSearchComponent {
@@ -1995,7 +2021,7 @@ class DriveSearchComponent {
         });
         this.#oRef.afterClosed().subscribe((res) => {
             if (res) {
-                const q = res;
+                const q = res.searchQuery;
                 this.onQuerySubmit(q, !!q.filters?.length || !!q.scope);
             }
         });
@@ -2026,9 +2052,7 @@ class DriveSearchComponent {
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: DriveSearchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ymd-drive-search', standalone: true, imports: [CommonModule, TranslateModule$1, SimpleSearchComponent, ReactiveFormsModule,
-                        MatTooltipModule,
-                        MatIconButton, MatIcon], host: {
+            args: [{ selector: 'ymd-drive-search', standalone: true, imports: [CommonModule, TranslateModule$1, SimpleSearchComponent, ReactiveFormsModule, MatTooltipModule, MatIconButton, MatIcon], host: {
                         '[class.active]': 'extendedQuery()'
                     }, template: "<button mat-icon-button class=\"icon\" (click)=\"openModal($event)\" [matTooltip]=\"'yuv.app.drive.search.tooltip.extended-search' | translate\">\n  <mat-icon>tune</mat-icon>\n</button>\n\n<yuv-simple-search\n  [query]=\"query()\"\n  (queryChange)=\"onQueryChange($event)\"\n  (querySubmit)=\"onQuerySubmit($event)\"\n  (clearInput)=\"clear()\"></yuv-simple-search>\n", styles: [":host{display:flex;align-items:center;border-inline-start:1px solid var(--ymt-outline-variant);padding-inline:var(--ymt-spacing-xs) 0;gap:var(--ymt-spacing-xs)}\n"] }]
         }] });
@@ -2040,6 +2064,7 @@ class ManageVersionsComponent {
     constructor() {
         this.#drive = inject(DriveService);
         this.#shell = inject(ShellService);
+        this.#eventService = inject(EventService);
         this.#dialogData = inject(MAT_DIALOG_DATA);
         this.#dialogRef = inject((MatDialogRef));
         this.versionsList = this.#drive.state$.versions.versionsList;
@@ -2082,6 +2107,7 @@ class ManageVersionsComponent {
     }
     #drive;
     #shell;
+    #eventService;
     #dialogData;
     #dialogRef;
     #loadList() {
@@ -2096,10 +2122,13 @@ class ManageVersionsComponent {
     }
     setNewVersion() {
         this.#drive.setBusy(true);
-        this.#drive
-            .setNewVersion()
-            .pipe(finalize(() => this.#drive.setBusy(false)))
-            .subscribe();
+        this.#drive.setNewVersion().subscribe({
+            next: () => {
+                this.#drive.setBusy(false);
+                this.#eventService.trigger(YuvEventType.DMS_OBJECT_UPDATED);
+            },
+            error: (err) => this.#drive.setBusy(false)
+        });
     }
     ngOnInit() {
         this.#loadList().subscribe();
@@ -2108,11 +2137,11 @@ class ManageVersionsComponent {
         this.#drive.clearVersions();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: ManageVersionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: ManageVersionsComponent, isStandalone: true, selector: "ymd-manage-versions", ngImport: i0, template: "<yuv-dialog [headertitel]=\"'yuv.app.drive.versions.header.label' | translate\">\n  <main>\n    <div class=\"progress-bar-container\">\n      @if (isLoading()) {\n        <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n      }\n    </div>\n    <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"layoutSettingIdBase + 'split'\">\n      <!-- Versions -->\n      <ng-template yuvSplitArea [size]=\"60\">\n        <div class=\"version-details\">\n          <header>\n            <span>{{ dmsObject().name }}</span>\n          </header>\n          <div class=\"details\">\n            @let selected = selectedVersion();\n            @if (selected && selected.length === 1) {\n              <mat-tab-group class=\"version-tabs\">\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-preview [dmsObject]=\"selected[0]\" [version]=\"selected[0].version\"></yuv-object-preview>\n                  </ng-template>\n                </mat-tab>\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-summary-data [dmsObject]=\"selected[0]\"></yuv-object-summary-data>\n                  </ng-template>\n                </mat-tab>\n              </mat-tab-group>\n            }\n          </div>\n        </div>\n      </ng-template>\n      <!-- Details -->\n      <ng-template yuvSplitArea [size]=\"40\">\n        <div class=\"versions\">\n          <header>\n            <h2>{{ 'yuv.app.drive.versions.header.label.short' | translate }}</h2>\n            <div class=\"actions\">\n              <button mat-icon-button class=\"refresh\" (click)=\"reloadList()\"><mat-icon>refresh</mat-icon></button>\n            </div>\n          </header>\n          <ymd-versions-list\n            class=\"staggered\"\n            [attr.aria-label]=\"'yuv.app.drive.files.content.aria.label' | translate\"\n            [attr.aria-busy]=\"isLoading()\"\n            [attr.role]=\"'listbox'\"\n            [id]=\"id()\"\n          >\n          </ymd-versions-list>\n        </div>\n      </ng-template>\n    </yuv-split-view>\n  </main>\n  <footer>\n    <button ymtButton=\"secondary\" class=\"close\" (click)=\"close()\">{{ 'yuv.app.drive.action.set.new.versions.cancel' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"disabledRestore()\" (click)=\"setNewVersion()\">\n      {{ 'yuv.app.drive.action.set.new.versions.label' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{display:contents}:host .progress-bar-container{height:calc(var(--ymt-progress-bar-height) + 1px);background-color:transparent}:host yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);height:100%}:host header{display:grid;grid-template-columns:2fr max-content;grid-template-rows:1fr max-content;gap:0px 0px;grid-auto-flow:row;grid-template-areas:\"label actions\" \"title title\";padding:var(--ymt-spacing-m);align-items:center}:host .versions,:host .version-details{display:flex;flex-flow:column;height:100%}:host .version-details .details{flex:1;overflow-y:hidden}:host .version-details .details .version-tabs{height:100%}:host .version-details .details ::ng-deep .mat-mdc-tab-body-wrapper{height:100%;overflow:hidden}:host .versions header{border-bottom:1px solid var(--ymt-outline-variant);padding-top:0}:host .versions .label{grid-area:label}:host .versions .actions{grid-area:actions;display:flex;justify-content:center;align-items:center}:host .versions .actions button{padding:0}:host .versions .title{grid-area:title}:host .versions .staggered{flex:1;overflow-y:scroll}:host .versions-details{height:100%}\n"], dependencies: [{ kind: "ngmodule", type: YuvSplitViewModule }, { kind: "directive", type: i1$2.SplitAreaDirective, selector: "[yuvSplitArea]", inputs: ["size", "minSize", "maxSize", "panelClass", "visible"] }, { kind: "component", type: i1$2.SplitViewComponent, selector: "yuv-split-view", inputs: ["direction", "gutterSize", "restrictMove", "disabled", "layoutSettingsID"], outputs: ["layoutSettingsChange", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: VersionsListComponent, selector: "ymd-versions-list" }, { kind: "component", type: ObjectSummaryDataComponent, selector: "yuv-object-summary-data", inputs: ["dmsObject"] }, { kind: "component", type: ObjectPreviewComponent, selector: "yuv-object-preview", inputs: ["objectId", "dmsObject", "version"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitel"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i5$1.MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: ManageVersionsComponent, isStandalone: true, selector: "ymd-manage-versions", providers: [ObjectPreviewService], ngImport: i0, template: "<yuv-dialog [headertitel]=\"'yuv.app.drive.versions.header.label' | translate\">\n  <main>\n    <div class=\"progress-bar-container\">\n      @if (isLoading()) {\n        <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n      }\n    </div>\n    <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"layoutSettingIdBase + 'split'\">\n      <!-- Versions -->\n      <ng-template yuvSplitArea [size]=\"60\">\n        <div class=\"version-details\">\n          <header>\n            <span>{{ dmsObject().name }}</span>\n          </header>\n          <div class=\"details\">\n            @let selected = selectedVersion();\n            @if (selected && selected.length === 1) {\n              <mat-tab-group class=\"version-tabs\">\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-preview [dmsObject]=\"selected[0]\" [version]=\"selected[0].version\"></yuv-object-preview>\n                  </ng-template>\n                </mat-tab>\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-summary-data [dmsObject]=\"selected[0]\"></yuv-object-summary-data>\n                  </ng-template>\n                </mat-tab>\n              </mat-tab-group>\n            }\n          </div>\n        </div>\n      </ng-template>\n      <!-- Details -->\n      <ng-template yuvSplitArea [size]=\"40\">\n        <div class=\"versions\">\n          <header>\n            <h2>{{ 'yuv.app.drive.versions.header.label.short' | translate }}</h2>\n            <div class=\"actions\">\n              <button mat-icon-button class=\"refresh\" (click)=\"reloadList()\"><mat-icon>refresh</mat-icon></button>\n            </div>\n          </header>\n          <ymd-versions-list\n            class=\"staggered\"\n            [attr.aria-label]=\"'yuv.app.drive.files.content.aria.label' | translate\"\n            [attr.aria-busy]=\"isLoading()\"\n            [attr.role]=\"'listbox'\"\n            [id]=\"id()\"\n          >\n          </ymd-versions-list>\n        </div>\n      </ng-template>\n    </yuv-split-view>\n  </main>\n  <footer>\n    <button ymtButton=\"secondary\" class=\"close\" (click)=\"close()\">{{ 'yuv.app.drive.action.set.new.versions.cancel' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"disabledRestore()\" (click)=\"setNewVersion()\">\n      {{ 'yuv.app.drive.action.set.new.versions.label' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{display:contents}:host .progress-bar-container{height:calc(var(--ymt-progress-bar-height) + 1px);background-color:transparent}:host yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);height:100%}:host header{display:grid;grid-template-columns:2fr max-content;grid-template-rows:1fr max-content;gap:0px 0px;grid-auto-flow:row;grid-template-areas:\"label actions\" \"title title\";padding:var(--ymt-spacing-m);align-items:center}:host .versions,:host .version-details{display:flex;flex-flow:column;height:100%}:host .version-details .details{flex:1;overflow-y:hidden}:host .version-details .details .version-tabs{height:100%}:host .version-details .details ::ng-deep .mat-mdc-tab-body-wrapper{height:100%;overflow:hidden}:host .versions header{border-bottom:1px solid var(--ymt-outline-variant);padding-top:0}:host .versions .label{grid-area:label}:host .versions .actions{grid-area:actions;display:flex;justify-content:center;align-items:center}:host .versions .actions button{padding:0}:host .versions .title{grid-area:title}:host .versions .staggered{flex:1;overflow-y:scroll}:host .versions-details{height:100%}\n"], dependencies: [{ kind: "ngmodule", type: YuvSplitViewModule }, { kind: "directive", type: i1$2.SplitAreaDirective, selector: "[yuvSplitArea]", inputs: ["size", "minSize", "maxSize", "panelClass", "visible"] }, { kind: "component", type: i1$2.SplitViewComponent, selector: "yuv-split-view", inputs: ["direction", "gutterSize", "restrictMove", "disabled", "layoutSettingsID"], outputs: ["layoutSettingsChange", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: VersionsListComponent, selector: "ymd-versions-list" }, { kind: "component", type: ObjectSummaryDataComponent, selector: "yuv-object-summary-data", inputs: ["dmsObject"] }, { kind: "component", type: ObjectPreviewComponent, selector: "yuv-object-preview", inputs: ["objectId", "dmsObject", "version"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitel"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i5$1.MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: ManageVersionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ymd-manage-versions', standalone: true, imports: [...MODULES, ...COMPONENTS, ...MATERIAL, MatProgressBar], changeDetection: ChangeDetectionStrategy.OnPush, template: "<yuv-dialog [headertitel]=\"'yuv.app.drive.versions.header.label' | translate\">\n  <main>\n    <div class=\"progress-bar-container\">\n      @if (isLoading()) {\n        <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n      }\n    </div>\n    <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"layoutSettingIdBase + 'split'\">\n      <!-- Versions -->\n      <ng-template yuvSplitArea [size]=\"60\">\n        <div class=\"version-details\">\n          <header>\n            <span>{{ dmsObject().name }}</span>\n          </header>\n          <div class=\"details\">\n            @let selected = selectedVersion();\n            @if (selected && selected.length === 1) {\n              <mat-tab-group class=\"version-tabs\">\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-preview [dmsObject]=\"selected[0]\" [version]=\"selected[0].version\"></yuv-object-preview>\n                  </ng-template>\n                </mat-tab>\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-summary-data [dmsObject]=\"selected[0]\"></yuv-object-summary-data>\n                  </ng-template>\n                </mat-tab>\n              </mat-tab-group>\n            }\n          </div>\n        </div>\n      </ng-template>\n      <!-- Details -->\n      <ng-template yuvSplitArea [size]=\"40\">\n        <div class=\"versions\">\n          <header>\n            <h2>{{ 'yuv.app.drive.versions.header.label.short' | translate }}</h2>\n            <div class=\"actions\">\n              <button mat-icon-button class=\"refresh\" (click)=\"reloadList()\"><mat-icon>refresh</mat-icon></button>\n            </div>\n          </header>\n          <ymd-versions-list\n            class=\"staggered\"\n            [attr.aria-label]=\"'yuv.app.drive.files.content.aria.label' | translate\"\n            [attr.aria-busy]=\"isLoading()\"\n            [attr.role]=\"'listbox'\"\n            [id]=\"id()\"\n          >\n          </ymd-versions-list>\n        </div>\n      </ng-template>\n    </yuv-split-view>\n  </main>\n  <footer>\n    <button ymtButton=\"secondary\" class=\"close\" (click)=\"close()\">{{ 'yuv.app.drive.action.set.new.versions.cancel' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"disabledRestore()\" (click)=\"setNewVersion()\">\n      {{ 'yuv.app.drive.action.set.new.versions.label' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{display:contents}:host .progress-bar-container{height:calc(var(--ymt-progress-bar-height) + 1px);background-color:transparent}:host yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);height:100%}:host header{display:grid;grid-template-columns:2fr max-content;grid-template-rows:1fr max-content;gap:0px 0px;grid-auto-flow:row;grid-template-areas:\"label actions\" \"title title\";padding:var(--ymt-spacing-m);align-items:center}:host .versions,:host .version-details{display:flex;flex-flow:column;height:100%}:host .version-details .details{flex:1;overflow-y:hidden}:host .version-details .details .version-tabs{height:100%}:host .version-details .details ::ng-deep .mat-mdc-tab-body-wrapper{height:100%;overflow:hidden}:host .versions header{border-bottom:1px solid var(--ymt-outline-variant);padding-top:0}:host .versions .label{grid-area:label}:host .versions .actions{grid-area:actions;display:flex;justify-content:center;align-items:center}:host .versions .actions button{padding:0}:host .versions .title{grid-area:title}:host .versions .staggered{flex:1;overflow-y:scroll}:host .versions-details{height:100%}\n"] }]
+            args: [{ selector: 'ymd-manage-versions', standalone: true, imports: [...MODULES, ...COMPONENTS, ...MATERIAL, MatProgressBar], changeDetection: ChangeDetectionStrategy.OnPush, providers: [ObjectPreviewService], template: "<yuv-dialog [headertitel]=\"'yuv.app.drive.versions.header.label' | translate\">\n  <main>\n    <div class=\"progress-bar-container\">\n      @if (isLoading()) {\n        <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n      }\n    </div>\n    <yuv-split-view [gutterSize]=\"1\" [layoutSettingsID]=\"layoutSettingIdBase + 'split'\">\n      <!-- Versions -->\n      <ng-template yuvSplitArea [size]=\"60\">\n        <div class=\"version-details\">\n          <header>\n            <span>{{ dmsObject().name }}</span>\n          </header>\n          <div class=\"details\">\n            @let selected = selectedVersion();\n            @if (selected && selected.length === 1) {\n              <mat-tab-group class=\"version-tabs\">\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-preview [dmsObject]=\"selected[0]\" [version]=\"selected[0].version\"></yuv-object-preview>\n                  </ng-template>\n                </mat-tab>\n                <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n                  <ng-template matTabContent>\n                    <yuv-object-summary-data [dmsObject]=\"selected[0]\"></yuv-object-summary-data>\n                  </ng-template>\n                </mat-tab>\n              </mat-tab-group>\n            }\n          </div>\n        </div>\n      </ng-template>\n      <!-- Details -->\n      <ng-template yuvSplitArea [size]=\"40\">\n        <div class=\"versions\">\n          <header>\n            <h2>{{ 'yuv.app.drive.versions.header.label.short' | translate }}</h2>\n            <div class=\"actions\">\n              <button mat-icon-button class=\"refresh\" (click)=\"reloadList()\"><mat-icon>refresh</mat-icon></button>\n            </div>\n          </header>\n          <ymd-versions-list\n            class=\"staggered\"\n            [attr.aria-label]=\"'yuv.app.drive.files.content.aria.label' | translate\"\n            [attr.aria-busy]=\"isLoading()\"\n            [attr.role]=\"'listbox'\"\n            [id]=\"id()\"\n          >\n          </ymd-versions-list>\n        </div>\n      </ng-template>\n    </yuv-split-view>\n  </main>\n  <footer>\n    <button ymtButton=\"secondary\" class=\"close\" (click)=\"close()\">{{ 'yuv.app.drive.action.set.new.versions.cancel' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"disabledRestore()\" (click)=\"setNewVersion()\">\n      {{ 'yuv.app.drive.action.set.new.versions.label' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:contents}:host main{display:contents}:host .progress-bar-container{height:calc(var(--ymt-progress-bar-height) + 1px);background-color:transparent}:host yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);height:100%}:host header{display:grid;grid-template-columns:2fr max-content;grid-template-rows:1fr max-content;gap:0px 0px;grid-auto-flow:row;grid-template-areas:\"label actions\" \"title title\";padding:var(--ymt-spacing-m);align-items:center}:host .versions,:host .version-details{display:flex;flex-flow:column;height:100%}:host .version-details .details{flex:1;overflow-y:hidden}:host .version-details .details .version-tabs{height:100%}:host .version-details .details ::ng-deep .mat-mdc-tab-body-wrapper{height:100%;overflow:hidden}:host .versions header{border-bottom:1px solid var(--ymt-outline-variant);padding-top:0}:host .versions .label{grid-area:label}:host .versions .actions{grid-area:actions;display:flex;justify-content:center;align-items:center}:host .versions .actions button{padding:0}:host .versions .title{grid-area:title}:host .versions .staggered{flex:1;overflow-y:scroll}:host .versions-details{height:100%}\n"] }]
         }] });
 
 class ManageVersionsAction extends AbstractContextAction {
@@ -3013,7 +3042,7 @@ class ObjectPageComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: ObjectPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: ObjectPageComponent, isStandalone: true, selector: "ymd-object", host: { attributes: { "class.smallScreenLayout": "smallScreenLayout()" } }, ngImport: i0, template: "@let object = dmsObject();\n@if (object) {\n  <div\n    class=\"object\"\n    yuvContainerSize\n    [yuvFileDropZone]=\"{ label: 'yuv.app.drive.files.dropzone.content.replace.label' | translate }\"\n    [fileDropDisabled]=\"fileDropReplaceDisabled()\"\n    (fileDrop)=\"onFileDrop($event)\"\n  >\n    <ymd-ribbon [objects]=\"[object]\" [excludeActions]=\"excludeActions\" class=\"object__surface\">\n      <ng-template #primaryActions>\n        <div class=\"nav\">\n          <button mat-icon-button class=\"back\" (click)=\"openParent()\">\n            <mat-icon>arrow_back</mat-icon>\n          </button>\n          <button mat-icon-button class=\"refresh\" [matTooltip]=\"'yuv.app.drive.page.object.refresh.tooltip' | translate\" (click)=\"refresh()\">\n            <mat-icon>refresh</mat-icon>\n          </button>\n        </div>\n      </ng-template>\n      <!-- <ng-template #secondaryActions></ng-template> -->\n    </ymd-ribbon>\n\n    @let ssl = smallScreenLayout();\n    @if (ssl) {\n      <mat-tab-group class=\"object__surface\" mat-stretch-tabs=\"true\">\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n          <ng-template matTabContent>\n            @if (object && object?.content) {\n              <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n            }\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit>\n          </ng-template>\n        </mat-tab>\n      </mat-tab-group>\n    } @else {\n      <yuv-split-view [layoutSettingsID]=\"layoutSettingIdBase + 'splitview'\" [gutterSize]=\"1\" class=\"object__surface\">\n        <ng-template yuvSplitArea [size]=\"40\">\n          <section class=\"meta\">\n            <header>\n              <yuv-object-flavor disableSelection=\"true\" [dmsObject]=\"object\"></yuv-object-flavor>\n\n              @if (headerData) {\n\n                <div class=\"object-icon\"><mat-icon >{{headerData.icon}}</mat-icon></div>\n                <h1><ng-container *yuvRenderer=\"headerData.title\"></ng-container></h1>\n                <div class=\"description\"><ng-container *yuvRenderer=\"headerData.description\"></ng-container></div>\n                <div class=\"badges\">\n                  <yuv-retention-badge [dmsObject]=\"object\"></yuv-retention-badge>\n                </div>\n              }\n            </header>\n\n            <mat-tab-group>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\" >\n                <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n              </mat-tab>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n                <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit\n              ></mat-tab>\n            </mat-tab-group>\n          </section>\n        </ng-template>\n        <ng-template yuvSplitArea [size]=\"60\">\n          @if (object && object?.content) {\n            <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n          }\n        </ng-template>\n      </yuv-split-view>\n    }\n  </div>\n} @else if (errorMessage) {\n  <!-- object could not be loaded -->\n  <div class=\"error state\">\n    <yuv-icon [svg]=\"icons.error\"></yuv-icon>\n    <p>{{ errorMessage }}</p>\n  </div>\n} @else {\n  <!-- object is loading -->\n  <div class=\"loading state\">\n    <mat-progress-spinner mode=\"indeterminate\" class=\"ymt-progress-spinner--giant\"></mat-progress-spinner>\n  </div>\n}\n", styles: [":host{--button-gap: var(--ymt-spacing-2xs);display:flex;flex-flow:column;height:100%;overflow:hidden}:host mat-tab-group{overflow:hidden;height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host .state{display:flex;flex-flow:column;height:100%;align-items:center;justify-content:center;border-block-start:1px solid var(--ymt-outline-variant)}:host .error mat-icon{color:rgb(from var(--ymt-text-color) r g b/.1)}:host .error p{margin:var(--ymt-spacing-m);max-width:35ch;color:var(--ymt-text-color-subtle)}:host .state,:host .object{animation:fade-in .3s ease-in-out}:host .object{height:100%;display:flex;flex-flow:column}:host .object ymd-ribbon{background-color:var(--app-drive-header-background);border-block-end:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-s) var(--ymt-spacing-s) var(--ymt-spacing-xs) var(--ymt-spacing-s);flex:0 0 auto}:host .object ymd-ribbon .nav{display:flex;align-items:center;gap:var(--button-gap)}:host .object yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);flex:1}:host .meta{display:flex;flex-flow:column;height:100%}:host .meta header{flex:0 0 auto;display:grid;margin-block-end:var(--ymt-spacing-xl);gap:var(--ymt-spacing-xs);grid-template-columns:var(--ymt-sizing-5xl) repeat(auto-fit,minmax(0,1fr));grid-template-areas:\"flavor flavor\" \"icon title\" \". description\" \". badges\"}:host .meta header yuv-object-flavor{grid-area:flavor;border-block-end:1px solid var(--ymt-outline-variant);padding:0 var(--ymt-spacing-s);margin-block-end:var(--ymt-spacing-m);grid-column:span 5}:host .meta header .object-icon{color:var(--ymt-text-color);grid-area:icon;padding:0 var(--ymt-spacing-m);padding-block-start:var(--ymt-spacing-3xs)}:host .meta header h1{grid-area:title;margin:0;word-break:break-word;padding-inline-end:var(--ymt-spacing-l);grid-column:span 4}:host .meta header .description{grid-area:description;padding-inline-end:var(--ymt-spacing-l);font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);text-overflow:ellipsis;grid-column:2/span 3;overflow:hidden;white-space:nowrap;--yuv-renderer-display: contents}:host .meta header .badges{grid-area:badges;padding-block-start:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-l);grid-column:2/span 4;display:flex}@keyframes fade-in{0%{opacity:0}}.object__surface{background-color:var(--ymt-surface)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ObjectMetadataComponent, selector: "yuv-object-metadata", inputs: ["disableControls", "situation", "formDisabled", "dmsObject", "flavoredDmsObject"], outputs: ["indexDataSaved", "statusChanged"] }, { kind: "component", type: ObjectAuditComponent, selector: "yuv-object-audit", inputs: ["dmsObject", "skipActions", "allActions"] }, { kind: "component", type: ObjectFlavorComponent, selector: "yuv-object-flavor", inputs: ["dmsObject"], outputs: ["flavorSelect"] }, { kind: "component", type: YuvIconComponent, selector: "yuv-icon", inputs: ["label", "svg", "svgSrc"] }, { kind: "ngmodule", type: YuvSplitViewModule }, { kind: "directive", type: i1$2.SplitAreaDirective, selector: "[yuvSplitArea]", inputs: ["size", "minSize", "maxSize", "panelClass", "visible"] }, { kind: "component", type: i1$2.SplitViewComponent, selector: "yuv-split-view", inputs: ["direction", "gutterSize", "restrictMove", "disabled", "layoutSettingsID"], outputs: ["layoutSettingsChange", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"] }, { kind: "directive", type: RendererDirective, selector: "[yuvRenderer]", inputs: ["yuvRenderer"] }, { kind: "directive", type: ContainerSizeDirective, selector: "[yuvContainerSize]", outputs: ["containerHeight", "containerWidth"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: RibbonComponent, selector: "ymd-ribbon", inputs: ["busy", "enableClipboard", "objects", "excludeActions"] }, { kind: "component", type: RetentionBadgeComponent, selector: "yuv-retention-badge", inputs: ["dmsObject"] }, { kind: "component", type: ObjectPreviewComponent, selector: "yuv-object-preview", inputs: ["objectId", "dmsObject", "version"] }, { kind: "directive", type: FileDropZoneDirective, selector: "[yuvFileDropZone]", inputs: ["yuvFileDropZone", "fileDropDisabled"], outputs: ["fileDrop", "fileDropOver"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i5$1.MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2$4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.12", type: ObjectPageComponent, isStandalone: true, selector: "ymd-object", host: { attributes: { "class.smallScreenLayout": "smallScreenLayout()" } }, providers: [ObjectPreviewService], ngImport: i0, template: "@let object = dmsObject();\n@if (object) {\n  <div\n    class=\"object\"\n    yuvContainerSize\n    [yuvFileDropZone]=\"{ label: 'yuv.app.drive.files.dropzone.content.replace.label' | translate }\"\n    [fileDropDisabled]=\"fileDropReplaceDisabled()\"\n    (fileDrop)=\"onFileDrop($event)\"\n  >\n    <ymd-ribbon [objects]=\"[object]\" [excludeActions]=\"excludeActions\" class=\"object__surface\">\n      <ng-template #primaryActions>\n        <div class=\"nav\">\n          <button mat-icon-button class=\"back\" (click)=\"openParent()\">\n            <mat-icon>arrow_back</mat-icon>\n          </button>\n          <button mat-icon-button class=\"refresh\" [matTooltip]=\"'yuv.app.drive.page.object.refresh.tooltip' | translate\" (click)=\"refresh()\">\n            <mat-icon>refresh</mat-icon>\n          </button>\n        </div>\n      </ng-template>\n      <!-- <ng-template #secondaryActions></ng-template> -->\n    </ymd-ribbon>\n\n    @let ssl = smallScreenLayout();\n    @if (ssl) {\n      <mat-tab-group class=\"object__surface\" mat-stretch-tabs=\"true\">\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n          <ng-template matTabContent>\n            @if (object && object?.content) {\n              <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n            }\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit>\n          </ng-template>\n        </mat-tab>\n      </mat-tab-group>\n    } @else {\n      <yuv-split-view [layoutSettingsID]=\"layoutSettingIdBase + 'splitview'\" [gutterSize]=\"1\" class=\"object__surface\">\n        <ng-template yuvSplitArea [size]=\"40\">\n          <section class=\"meta\">\n            <header>\n              <yuv-object-flavor disableSelection=\"true\" [dmsObject]=\"object\"></yuv-object-flavor>\n\n              @if (headerData) {\n\n                <div class=\"object-icon\"><mat-icon >{{headerData.icon}}</mat-icon></div>\n                <h1><ng-container *yuvRenderer=\"headerData.title\"></ng-container></h1>\n                <div class=\"description\"><ng-container *yuvRenderer=\"headerData.description\"></ng-container></div>\n                <div class=\"badges\">\n                  <yuv-retention-badge [dmsObject]=\"object\"></yuv-retention-badge>\n                </div>\n              }\n            </header>\n\n            <mat-tab-group>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\" >\n                <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n              </mat-tab>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n                <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit\n              ></mat-tab>\n            </mat-tab-group>\n          </section>\n        </ng-template>\n        <ng-template yuvSplitArea [size]=\"60\">\n          @if (object && object?.content) {\n            <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n          }\n        </ng-template>\n      </yuv-split-view>\n    }\n  </div>\n} @else if (errorMessage) {\n  <!-- object could not be loaded -->\n  <div class=\"error state\">\n    <yuv-icon [svg]=\"icons.error\"></yuv-icon>\n    <p>{{ errorMessage }}</p>\n  </div>\n} @else {\n  <!-- object is loading -->\n  <div class=\"loading state\">\n    <mat-progress-spinner mode=\"indeterminate\" class=\"ymt-progress-spinner--giant\"></mat-progress-spinner>\n  </div>\n}\n", styles: [":host{--button-gap: var(--ymt-spacing-2xs);display:flex;flex-flow:column;height:100%;overflow:hidden}:host mat-tab-group{overflow:hidden;height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host .state{display:flex;flex-flow:column;height:100%;align-items:center;justify-content:center;border-block-start:1px solid var(--ymt-outline-variant)}:host .error mat-icon{color:rgb(from var(--ymt-text-color) r g b/.1)}:host .error p{margin:var(--ymt-spacing-m);max-width:35ch;color:var(--ymt-text-color-subtle)}:host .state,:host .object{animation:fade-in .3s ease-in-out}:host .object{height:100%;display:flex;flex-flow:column}:host .object ymd-ribbon{background-color:var(--app-drive-header-background);border-block-end:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-s) var(--ymt-spacing-s) var(--ymt-spacing-xs) var(--ymt-spacing-s);flex:0 0 auto}:host .object ymd-ribbon .nav{display:flex;align-items:center;gap:var(--button-gap)}:host .object yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);flex:1}:host .meta{display:flex;flex-flow:column;height:100%}:host .meta header{flex:0 0 auto;display:grid;margin-block-end:var(--ymt-spacing-xl);gap:var(--ymt-spacing-xs);grid-template-columns:var(--ymt-sizing-5xl) repeat(auto-fit,minmax(0,1fr));grid-template-areas:\"flavor flavor\" \"icon title\" \". description\" \". badges\"}:host .meta header yuv-object-flavor{grid-area:flavor;border-block-end:1px solid var(--ymt-outline-variant);padding:0 var(--ymt-spacing-s);margin-block-end:var(--ymt-spacing-m);grid-column:span 5}:host .meta header .object-icon{color:var(--ymt-text-color);grid-area:icon;padding:0 var(--ymt-spacing-m);padding-block-start:var(--ymt-spacing-3xs)}:host .meta header h1{grid-area:title;margin:0;word-break:break-word;padding-inline-end:var(--ymt-spacing-l);grid-column:span 4}:host .meta header .description{grid-area:description;padding-inline-end:var(--ymt-spacing-l);font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);text-overflow:ellipsis;grid-column:2/span 3;overflow:hidden;white-space:nowrap;--yuv-renderer-display: contents}:host .meta header .badges{grid-area:badges;padding-block-start:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-l);grid-column:2/span 4;display:flex}@keyframes fade-in{0%{opacity:0}}.object__surface{background-color:var(--ymt-surface)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ObjectMetadataComponent, selector: "yuv-object-metadata", inputs: ["disableControls", "situation", "formDisabled", "dmsObject", "flavoredDmsObject"], outputs: ["indexDataSaved", "statusChanged"] }, { kind: "component", type: ObjectAuditComponent, selector: "yuv-object-audit", inputs: ["dmsObject", "skipActions", "allActions"] }, { kind: "component", type: ObjectFlavorComponent, selector: "yuv-object-flavor", inputs: ["dmsObject"], outputs: ["flavorSelect"] }, { kind: "component", type: YuvIconComponent, selector: "yuv-icon", inputs: ["label", "svg", "svgSrc"] }, { kind: "ngmodule", type: YuvSplitViewModule }, { kind: "directive", type: i1$2.SplitAreaDirective, selector: "[yuvSplitArea]", inputs: ["size", "minSize", "maxSize", "panelClass", "visible"] }, { kind: "component", type: i1$2.SplitViewComponent, selector: "yuv-split-view", inputs: ["direction", "gutterSize", "restrictMove", "disabled", "layoutSettingsID"], outputs: ["layoutSettingsChange", "dragStart", "dragEnd", "gutterClick", "gutterDblClick"] }, { kind: "directive", type: RendererDirective, selector: "[yuvRenderer]", inputs: ["yuvRenderer"] }, { kind: "directive", type: ContainerSizeDirective, selector: "[yuvContainerSize]", outputs: ["containerHeight", "containerWidth"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: RibbonComponent, selector: "ymd-ribbon", inputs: ["busy", "enableClipboard", "objects", "excludeActions"] }, { kind: "component", type: RetentionBadgeComponent, selector: "yuv-retention-badge", inputs: ["dmsObject"] }, { kind: "component", type: ObjectPreviewComponent, selector: "yuv-object-preview", inputs: ["objectId", "dmsObject", "version"] }, { kind: "directive", type: FileDropZoneDirective, selector: "[yuvFileDropZone]", inputs: ["yuvFileDropZone", "fileDropDisabled"], outputs: ["fileDrop", "fileDropOver"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i5$1.MatTabContent, selector: "[matTabContent]" }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2$4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImport: i0, type: ObjectPageComponent, decorators: [{
             type: Component,
@@ -3038,7 +3067,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.12", ngImpo
                         MatProgressSpinner
                     ], host: {
                         ['class.smallScreenLayout']: 'smallScreenLayout()'
-                    }, template: "@let object = dmsObject();\n@if (object) {\n  <div\n    class=\"object\"\n    yuvContainerSize\n    [yuvFileDropZone]=\"{ label: 'yuv.app.drive.files.dropzone.content.replace.label' | translate }\"\n    [fileDropDisabled]=\"fileDropReplaceDisabled()\"\n    (fileDrop)=\"onFileDrop($event)\"\n  >\n    <ymd-ribbon [objects]=\"[object]\" [excludeActions]=\"excludeActions\" class=\"object__surface\">\n      <ng-template #primaryActions>\n        <div class=\"nav\">\n          <button mat-icon-button class=\"back\" (click)=\"openParent()\">\n            <mat-icon>arrow_back</mat-icon>\n          </button>\n          <button mat-icon-button class=\"refresh\" [matTooltip]=\"'yuv.app.drive.page.object.refresh.tooltip' | translate\" (click)=\"refresh()\">\n            <mat-icon>refresh</mat-icon>\n          </button>\n        </div>\n      </ng-template>\n      <!-- <ng-template #secondaryActions></ng-template> -->\n    </ymd-ribbon>\n\n    @let ssl = smallScreenLayout();\n    @if (ssl) {\n      <mat-tab-group class=\"object__surface\" mat-stretch-tabs=\"true\">\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n          <ng-template matTabContent>\n            @if (object && object?.content) {\n              <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n            }\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit>\n          </ng-template>\n        </mat-tab>\n      </mat-tab-group>\n    } @else {\n      <yuv-split-view [layoutSettingsID]=\"layoutSettingIdBase + 'splitview'\" [gutterSize]=\"1\" class=\"object__surface\">\n        <ng-template yuvSplitArea [size]=\"40\">\n          <section class=\"meta\">\n            <header>\n              <yuv-object-flavor disableSelection=\"true\" [dmsObject]=\"object\"></yuv-object-flavor>\n\n              @if (headerData) {\n\n                <div class=\"object-icon\"><mat-icon >{{headerData.icon}}</mat-icon></div>\n                <h1><ng-container *yuvRenderer=\"headerData.title\"></ng-container></h1>\n                <div class=\"description\"><ng-container *yuvRenderer=\"headerData.description\"></ng-container></div>\n                <div class=\"badges\">\n                  <yuv-retention-badge [dmsObject]=\"object\"></yuv-retention-badge>\n                </div>\n              }\n            </header>\n\n            <mat-tab-group>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\" >\n                <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n              </mat-tab>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n                <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit\n              ></mat-tab>\n            </mat-tab-group>\n          </section>\n        </ng-template>\n        <ng-template yuvSplitArea [size]=\"60\">\n          @if (object && object?.content) {\n            <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n          }\n        </ng-template>\n      </yuv-split-view>\n    }\n  </div>\n} @else if (errorMessage) {\n  <!-- object could not be loaded -->\n  <div class=\"error state\">\n    <yuv-icon [svg]=\"icons.error\"></yuv-icon>\n    <p>{{ errorMessage }}</p>\n  </div>\n} @else {\n  <!-- object is loading -->\n  <div class=\"loading state\">\n    <mat-progress-spinner mode=\"indeterminate\" class=\"ymt-progress-spinner--giant\"></mat-progress-spinner>\n  </div>\n}\n", styles: [":host{--button-gap: var(--ymt-spacing-2xs);display:flex;flex-flow:column;height:100%;overflow:hidden}:host mat-tab-group{overflow:hidden;height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host .state{display:flex;flex-flow:column;height:100%;align-items:center;justify-content:center;border-block-start:1px solid var(--ymt-outline-variant)}:host .error mat-icon{color:rgb(from var(--ymt-text-color) r g b/.1)}:host .error p{margin:var(--ymt-spacing-m);max-width:35ch;color:var(--ymt-text-color-subtle)}:host .state,:host .object{animation:fade-in .3s ease-in-out}:host .object{height:100%;display:flex;flex-flow:column}:host .object ymd-ribbon{background-color:var(--app-drive-header-background);border-block-end:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-s) var(--ymt-spacing-s) var(--ymt-spacing-xs) var(--ymt-spacing-s);flex:0 0 auto}:host .object ymd-ribbon .nav{display:flex;align-items:center;gap:var(--button-gap)}:host .object yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);flex:1}:host .meta{display:flex;flex-flow:column;height:100%}:host .meta header{flex:0 0 auto;display:grid;margin-block-end:var(--ymt-spacing-xl);gap:var(--ymt-spacing-xs);grid-template-columns:var(--ymt-sizing-5xl) repeat(auto-fit,minmax(0,1fr));grid-template-areas:\"flavor flavor\" \"icon title\" \". description\" \". badges\"}:host .meta header yuv-object-flavor{grid-area:flavor;border-block-end:1px solid var(--ymt-outline-variant);padding:0 var(--ymt-spacing-s);margin-block-end:var(--ymt-spacing-m);grid-column:span 5}:host .meta header .object-icon{color:var(--ymt-text-color);grid-area:icon;padding:0 var(--ymt-spacing-m);padding-block-start:var(--ymt-spacing-3xs)}:host .meta header h1{grid-area:title;margin:0;word-break:break-word;padding-inline-end:var(--ymt-spacing-l);grid-column:span 4}:host .meta header .description{grid-area:description;padding-inline-end:var(--ymt-spacing-l);font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);text-overflow:ellipsis;grid-column:2/span 3;overflow:hidden;white-space:nowrap;--yuv-renderer-display: contents}:host .meta header .badges{grid-area:badges;padding-block-start:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-l);grid-column:2/span 4;display:flex}@keyframes fade-in{0%{opacity:0}}.object__surface{background-color:var(--ymt-surface)}\n"] }]
+                    }, providers: [ObjectPreviewService], template: "@let object = dmsObject();\n@if (object) {\n  <div\n    class=\"object\"\n    yuvContainerSize\n    [yuvFileDropZone]=\"{ label: 'yuv.app.drive.files.dropzone.content.replace.label' | translate }\"\n    [fileDropDisabled]=\"fileDropReplaceDisabled()\"\n    (fileDrop)=\"onFileDrop($event)\"\n  >\n    <ymd-ribbon [objects]=\"[object]\" [excludeActions]=\"excludeActions\" class=\"object__surface\">\n      <ng-template #primaryActions>\n        <div class=\"nav\">\n          <button mat-icon-button class=\"back\" (click)=\"openParent()\">\n            <mat-icon>arrow_back</mat-icon>\n          </button>\n          <button mat-icon-button class=\"refresh\" [matTooltip]=\"'yuv.app.drive.page.object.refresh.tooltip' | translate\" (click)=\"refresh()\">\n            <mat-icon>refresh</mat-icon>\n          </button>\n        </div>\n      </ng-template>\n      <!-- <ng-template #secondaryActions></ng-template> -->\n    </ymd-ribbon>\n\n    @let ssl = smallScreenLayout();\n    @if (ssl) {\n      <mat-tab-group class=\"object__surface\" mat-stretch-tabs=\"true\">\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.content.title' | translate\">\n          <ng-template matTabContent>\n            @if (object && object?.content) {\n              <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n            }\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n          </ng-template>\n        </mat-tab>\n\n        <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n          <ng-template matTabContent>\n            <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit>\n          </ng-template>\n        </mat-tab>\n      </mat-tab-group>\n    } @else {\n      <yuv-split-view [layoutSettingsID]=\"layoutSettingIdBase + 'splitview'\" [gutterSize]=\"1\" class=\"object__surface\">\n        <ng-template yuvSplitArea [size]=\"40\">\n          <section class=\"meta\">\n            <header>\n              <yuv-object-flavor disableSelection=\"true\" [dmsObject]=\"object\"></yuv-object-flavor>\n\n              @if (headerData) {\n\n                <div class=\"object-icon\"><mat-icon >{{headerData.icon}}</mat-icon></div>\n                <h1><ng-container *yuvRenderer=\"headerData.title\"></ng-container></h1>\n                <div class=\"description\"><ng-container *yuvRenderer=\"headerData.description\"></ng-container></div>\n                <div class=\"badges\">\n                  <yuv-retention-badge [dmsObject]=\"object\"></yuv-retention-badge>\n                </div>\n              }\n            </header>\n\n            <mat-tab-group>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.indexdata.title' | translate\" >\n                <yuv-object-metadata [flavoredDmsObject]=\"flavoredDmsObject()\" (indexDataSaved)=\"onIndexdataSaved($event)\"> </yuv-object-metadata>\n              </mat-tab>\n              <mat-tab [label]=\"'yuv.app.drive.object-metadata.tabs.history.title' | translate\">\n                <yuv-object-audit [dmsObject]=\"object\"></yuv-object-audit\n              ></mat-tab>\n            </mat-tab-group>\n          </section>\n        </ng-template>\n        <ng-template yuvSplitArea [size]=\"60\">\n          @if (object && object?.content) {\n            <yuv-object-preview [dmsObject]=\"object\"></yuv-object-preview>\n          }\n        </ng-template>\n      </yuv-split-view>\n    }\n  </div>\n} @else if (errorMessage) {\n  <!-- object could not be loaded -->\n  <div class=\"error state\">\n    <yuv-icon [svg]=\"icons.error\"></yuv-icon>\n    <p>{{ errorMessage }}</p>\n  </div>\n} @else {\n  <!-- object is loading -->\n  <div class=\"loading state\">\n    <mat-progress-spinner mode=\"indeterminate\" class=\"ymt-progress-spinner--giant\"></mat-progress-spinner>\n  </div>\n}\n", styles: [":host{--button-gap: var(--ymt-spacing-2xs);display:flex;flex-flow:column;height:100%;overflow:hidden}:host mat-tab-group{overflow:hidden;height:100%}:host mat-tab-group ::ng-deep .mat-mdc-tab-body-wrapper{height:100%}:host .state{display:flex;flex-flow:column;height:100%;align-items:center;justify-content:center;border-block-start:1px solid var(--ymt-outline-variant)}:host .error mat-icon{color:rgb(from var(--ymt-text-color) r g b/.1)}:host .error p{margin:var(--ymt-spacing-m);max-width:35ch;color:var(--ymt-text-color-subtle)}:host .state,:host .object{animation:fade-in .3s ease-in-out}:host .object{height:100%;display:flex;flex-flow:column}:host .object ymd-ribbon{background-color:var(--app-drive-header-background);border-block-end:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-s) var(--ymt-spacing-s) var(--ymt-spacing-xs) var(--ymt-spacing-s);flex:0 0 auto}:host .object ymd-ribbon .nav{display:flex;align-items:center;gap:var(--button-gap)}:host .object yuv-split-view{--split-gutter-background-color: var(--ymt-outline-variant);flex:1}:host .meta{display:flex;flex-flow:column;height:100%}:host .meta header{flex:0 0 auto;display:grid;margin-block-end:var(--ymt-spacing-xl);gap:var(--ymt-spacing-xs);grid-template-columns:var(--ymt-sizing-5xl) repeat(auto-fit,minmax(0,1fr));grid-template-areas:\"flavor flavor\" \"icon title\" \". description\" \". badges\"}:host .meta header yuv-object-flavor{grid-area:flavor;border-block-end:1px solid var(--ymt-outline-variant);padding:0 var(--ymt-spacing-s);margin-block-end:var(--ymt-spacing-m);grid-column:span 5}:host .meta header .object-icon{color:var(--ymt-text-color);grid-area:icon;padding:0 var(--ymt-spacing-m);padding-block-start:var(--ymt-spacing-3xs)}:host .meta header h1{grid-area:title;margin:0;word-break:break-word;padding-inline-end:var(--ymt-spacing-l);grid-column:span 4}:host .meta header .description{grid-area:description;padding-inline-end:var(--ymt-spacing-l);font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle);text-overflow:ellipsis;grid-column:2/span 3;overflow:hidden;white-space:nowrap;--yuv-renderer-display: contents}:host .meta header .badges{grid-area:badges;padding-block-start:var(--ymt-spacing-xs);padding-inline-end:var(--ymt-spacing-l);grid-column:2/span 4;display:flex}@keyframes fade-in{0%{opacity:0}}.object__surface{background-color:var(--ymt-surface)}\n"] }]
         }], ctorParameters: () => [] });
 
 const filesResolver = (route) => {