@yuuvis/client-framework 3.17.0 → 3.18.0

package/fesm2022/yuuvis-client-framework-tile-list.mjs

@@ -1795,7 +1795,7 @@ class TileConfigComponent {
         return true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: TileConfigComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: TileConfigComponent, isStandalone: true, selector: "yuv-tile-config", inputs: { bucket: { classPropertyName: "bucket", publicName: "bucket", isSignal: true, isRequired: false, transformFunction: null }, bucketLabel: { classPropertyName: "bucketLabel", publicName: "bucketLabel", isSignal: true, isRequired: false, transformFunction: null }, configTypes: { classPropertyName: "configTypes", publicName: "configTypes", isSignal: true, isRequired: false, transformFunction: null }, configFlavors: { classPropertyName: "configFlavors", publicName: "configFlavors", isSignal: true, isRequired: false, transformFunction: null }, excludeProperties: { classPropertyName: "excludeProperties", publicName: "excludeProperties", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save", canceled: "canceled" }, ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.tile-config.title' | translate: { bucket: bucketLabel() }\">\n  <main class=\"tile-config\">\n    <section class=\"picker\">\n      <mat-form-field>\n        <mat-select [panelWidth]=\"null\" [(ngModel)]=\"selectedType\" (ngModelChange)=\"typeSelected($event)\">\n          @for (t of types() || []; track t.id; let i = $index) {\n            <mat-option [value]=\"t.data\">{{ getTypeLabel(t.id) }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n      @if (selectedType) {\n        <button ymtButton=\"secondary\" (click)=\"resetConfig()\">{{ 'yuv.tile-config.button.reset' | translate }}</button>\n      }\n    </section>\n\n    <section class=\"details\">\n      @if (selectedType) {\n        <div class=\"dummy-preview\">\n          <yuv-tile-config-tile\n            [disableIconSlot]=\"true\"\n            [objectConfig]=\"objectConfig!\"\n            [bucket]=\"bucket()\"\n            (slotSelect)=\"slotSelect($event)\"\n          />\n        </div>\n        @if (titleMissing) {\n          <section class=\"config-error\">\n            {{ 'yuv.tile-config.error.title-required' | translate }} ({{ titleMissingTypeLabels }})\n          </section>\n        }\n\n        <main>\n          @if (selectedSlot === 'icon') {\n            <h3>{{ 'yuv.tile-config.slot.icon.headline' | translate }}</h3>\n            <yuv-icon-select [objectType]=\"selectedType\" (iconSelect)=\"iconSelected($event)\" />\n          } @else if (selectedSlot === 'badges') {\n            <h3>{{ 'yuv.tile-config.slot.badges.headline' | translate }}</h3>\n            <yuv-tile-badge-select\n              [selectedBadgeIds]=\"getSelectedBadges()\"\n              [bucket]=\"bucket()\"\n              (badgeSelect)=\"badgeSelected($event)\"\n            />\n          } @else if (!selectedSlot) {\n          } @else if (selectedSlot === 'actions') {\n            <h3>{{ 'yuv.tile-config.slot.action.headline' | translate }}</h3>\n            <yuv-tile-action-select\n              [objectType]=\"selectedType\"\n              [selectedActionIds]=\"getSelectedActions()\"\n              (actionSelect)=\"actionSelected($event)\"\n            />\n          } @else {\n            <h3>{{ 'yuv.tile-config.slot.property.headline' | translate }}</h3>\n            <yuv-tile-property-select\n              [objectType]=\"selectedType\"\n              [excludeProperties]=\"excludeProperties()\"\n              [selectedProperty]=\"getConfigProperty(selectedSlot)\"\n              [allowRemove]=\"selectedSlot !== 'title'\"\n              (propertySelect)=\"propertySelected(selectedSlot, $event)\"\n            />\n          }\n        </main>\n      } @else {\n        <div class=\"placeholder empty\"></div>\n      }\n    </section>\n  </main>\n\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancelConfig()\">{{ 'yuv.tile-config.button.close' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"!configChanged || titleMissing\" (click)=\"saveConfig()\">\n      {{ 'yuv.tile-config.button.save' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:flex;height:100%;flex-flow:column}:host main.tile-config{height:100%;display:contents}:host .picker{display:flex;justify-content:space-between;gap:var(--ymt-spacing-m);align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m)}:host .details{flex:1;display:flex;flex-flow:column;box-sizing:border-box;overflow:hidden}:host .details header{flex:0 0 auto;display:flex;align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m);gap:var(--ymt-spacing-m)}:host .details header h2{flex:1;overflow:hidden;text-overflow:ellipsis;margin:0}:host .details .dummy-preview{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-surface-panel);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .dummy-preview yuv-tile-config-tile{max-width:500px;margin:auto;border-radius:var(--ymt-corner-m);border:1px solid var(--ymt-outline);background-color:var(--ymt-surface-container)}:host .details main{flex:1;overflow-y:auto;padding:var(--ymt-spacing-m)}:host .details main h3{margin:0;padding-block-end:var(--ymt-spacing-m);font:var(--ymt-font-subhead)}:host .details .config-error{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .placeholder.empty{height:100%;display:grid;place-content:center;color:var(--ymt-text-color-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TileConfigTileComponent, selector: "yuv-tile-config-tile", inputs: ["disableIconSlot", "disableBadgesSlot", "bucket", "objectConfig"], outputs: ["slotSelect"] }, { kind: "component", type: IconSelectComponent, selector: "yuv-icon-select", inputs: ["objectType"], outputs: ["iconSelect"] }, { kind: "component", type: PropertySelectComponent, selector: "yuv-tile-property-select", inputs: ["objectType", "excludeProperties", "selectedProperty", "allowRemove"], outputs: ["propertySelect"] }, { kind: "component", type: ActionSelectComponent, selector: "yuv-tile-action-select", inputs: ["objectType", "selectedActionIds"], outputs: ["actionSelect"] }, { kind: "component", type: BadgeSelectComponent, selector: "yuv-tile-badge-select", inputs: ["selectedBadgeIds", "bucket"], outputs: ["badgeSelect"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i2$1.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: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: TileConfigComponent, isStandalone: true, selector: "yuv-tile-config", inputs: { bucket: { classPropertyName: "bucket", publicName: "bucket", isSignal: true, isRequired: false, transformFunction: null }, bucketLabel: { classPropertyName: "bucketLabel", publicName: "bucketLabel", isSignal: true, isRequired: false, transformFunction: null }, configTypes: { classPropertyName: "configTypes", publicName: "configTypes", isSignal: true, isRequired: false, transformFunction: null }, configFlavors: { classPropertyName: "configFlavors", publicName: "configFlavors", isSignal: true, isRequired: false, transformFunction: null }, excludeProperties: { classPropertyName: "excludeProperties", publicName: "excludeProperties", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save", canceled: "canceled" }, ngImport: i0, template: "<yuv-dialog [headertitle]=\"'yuv.tile-config.title' | translate: { bucket: bucketLabel() }\">\n  <main class=\"tile-config\">\n    <section class=\"picker\">\n      <mat-form-field>\n        <mat-select [panelWidth]=\"null\" [(ngModel)]=\"selectedType\" (ngModelChange)=\"typeSelected($event)\">\n          @for (t of types() || []; track t.id; let i = $index) {\n            <mat-option [value]=\"t.data\">{{ getTypeLabel(t.id) }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n      @if (selectedType) {\n        <button ymtButton=\"secondary\" (click)=\"resetConfig()\">{{ 'yuv.tile-config.button.reset' | translate }}</button>\n      }\n    </section>\n\n    <section class=\"details\">\n      @if (selectedType) {\n        <div class=\"dummy-preview\">\n          <yuv-tile-config-tile\n            [disableIconSlot]=\"true\"\n            [objectConfig]=\"objectConfig!\"\n            [bucket]=\"bucket()\"\n            (slotSelect)=\"slotSelect($event)\"\n          />\n        </div>\n        @if (titleMissing) {\n          <section class=\"config-error\">\n            {{ 'yuv.tile-config.error.title-required' | translate }} ({{ titleMissingTypeLabels }})\n          </section>\n        }\n\n        <main>\n          @if (selectedSlot === 'icon') {\n            <h3>{{ 'yuv.tile-config.slot.icon.headline' | translate }}</h3>\n            <yuv-icon-select [objectType]=\"selectedType\" (iconSelect)=\"iconSelected($event)\" />\n          } @else if (selectedSlot === 'badges') {\n            <h3>{{ 'yuv.tile-config.slot.badges.headline' | translate }}</h3>\n            <yuv-tile-badge-select\n              [objectType]=\"selectedType\"\n              [selectedBadgeIds]=\"getSelectedBadges()\"\n              [bucket]=\"bucket()\"\n              (badgeSelect)=\"badgeSelected($event)\"\n            />\n          } @else if (!selectedSlot) {\n          } @else if (selectedSlot === 'actions') {\n            <h3>{{ 'yuv.tile-config.slot.action.headline' | translate }}</h3>\n            <yuv-tile-action-select\n              [objectType]=\"selectedType\"\n              [selectedActionIds]=\"getSelectedActions()\"\n              (actionSelect)=\"actionSelected($event)\"\n            />\n          } @else {\n            <h3>{{ 'yuv.tile-config.slot.property.headline' | translate }}</h3>\n            <yuv-tile-property-select\n              [objectType]=\"selectedType\"\n              [excludeProperties]=\"excludeProperties()\"\n              [selectedProperty]=\"getConfigProperty(selectedSlot)\"\n              [allowRemove]=\"selectedSlot !== 'title'\"\n              (propertySelect)=\"propertySelected(selectedSlot, $event)\"\n            />\n          }\n        </main>\n      } @else {\n        <div class=\"placeholder empty\"></div>\n      }\n    </section>\n  </main>\n\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancelConfig()\">{{ 'yuv.tile-config.button.close' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"!configChanged || titleMissing\" (click)=\"saveConfig()\">\n      {{ 'yuv.tile-config.button.save' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:flex;height:100%;flex-flow:column}:host main.tile-config{height:100%;display:contents}:host .picker{display:flex;justify-content:space-between;gap:var(--ymt-spacing-m);align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m)}:host .details{flex:1;display:flex;flex-flow:column;box-sizing:border-box;overflow:hidden}:host .details header{flex:0 0 auto;display:flex;align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m);gap:var(--ymt-spacing-m)}:host .details header h2{flex:1;overflow:hidden;text-overflow:ellipsis;margin:0}:host .details .dummy-preview{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-surface-panel);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .dummy-preview yuv-tile-config-tile{max-width:500px;margin:auto;border-radius:var(--ymt-corner-m);border:1px solid var(--ymt-outline);background-color:var(--ymt-surface-container)}:host .details main{flex:1;overflow-y:auto;padding:var(--ymt-spacing-m)}:host .details main h3{margin:0;padding-block-end:var(--ymt-spacing-m);font:var(--ymt-font-subhead)}:host .details .config-error{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .placeholder.empty{height:100%;display:grid;place-content:center;color:var(--ymt-text-color-subtle)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TileConfigTileComponent, selector: "yuv-tile-config-tile", inputs: ["disableIconSlot", "disableBadgesSlot", "bucket", "objectConfig"], outputs: ["slotSelect"] }, { kind: "component", type: IconSelectComponent, selector: "yuv-icon-select", inputs: ["objectType"], outputs: ["iconSelect"] }, { kind: "component", type: PropertySelectComponent, selector: "yuv-tile-property-select", inputs: ["objectType", "excludeProperties", "selectedProperty", "allowRemove"], outputs: ["propertySelect"] }, { kind: "component", type: ActionSelectComponent, selector: "yuv-tile-action-select", inputs: ["objectType", "selectedActionIds"], outputs: ["actionSelect"] }, { kind: "component", type: BadgeSelectComponent, selector: "yuv-tile-badge-select", inputs: ["selectedBadgeIds", "bucket", "objectType"], outputs: ["badgeSelect"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i2$1.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: i2$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: TileConfigComponent, decorators: [{
             type: Component,
@@ -1815,7 +1815,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
                         DialogComponent,
                         MatFormFieldModule,
                         YmtButtonDirective
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<yuv-dialog [headertitle]=\"'yuv.tile-config.title' | translate: { bucket: bucketLabel() }\">\n  <main class=\"tile-config\">\n    <section class=\"picker\">\n      <mat-form-field>\n        <mat-select [panelWidth]=\"null\" [(ngModel)]=\"selectedType\" (ngModelChange)=\"typeSelected($event)\">\n          @for (t of types() || []; track t.id; let i = $index) {\n            <mat-option [value]=\"t.data\">{{ getTypeLabel(t.id) }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n      @if (selectedType) {\n        <button ymtButton=\"secondary\" (click)=\"resetConfig()\">{{ 'yuv.tile-config.button.reset' | translate }}</button>\n      }\n    </section>\n\n    <section class=\"details\">\n      @if (selectedType) {\n        <div class=\"dummy-preview\">\n          <yuv-tile-config-tile\n            [disableIconSlot]=\"true\"\n            [objectConfig]=\"objectConfig!\"\n            [bucket]=\"bucket()\"\n            (slotSelect)=\"slotSelect($event)\"\n          />\n        </div>\n        @if (titleMissing) {\n          <section class=\"config-error\">\n            {{ 'yuv.tile-config.error.title-required' | translate }} ({{ titleMissingTypeLabels }})\n          </section>\n        }\n\n        <main>\n          @if (selectedSlot === 'icon') {\n            <h3>{{ 'yuv.tile-config.slot.icon.headline' | translate }}</h3>\n            <yuv-icon-select [objectType]=\"selectedType\" (iconSelect)=\"iconSelected($event)\" />\n          } @else if (selectedSlot === 'badges') {\n            <h3>{{ 'yuv.tile-config.slot.badges.headline' | translate }}</h3>\n            <yuv-tile-badge-select\n              [selectedBadgeIds]=\"getSelectedBadges()\"\n              [bucket]=\"bucket()\"\n              (badgeSelect)=\"badgeSelected($event)\"\n            />\n          } @else if (!selectedSlot) {\n          } @else if (selectedSlot === 'actions') {\n            <h3>{{ 'yuv.tile-config.slot.action.headline' | translate }}</h3>\n            <yuv-tile-action-select\n              [objectType]=\"selectedType\"\n              [selectedActionIds]=\"getSelectedActions()\"\n              (actionSelect)=\"actionSelected($event)\"\n            />\n          } @else {\n            <h3>{{ 'yuv.tile-config.slot.property.headline' | translate }}</h3>\n            <yuv-tile-property-select\n              [objectType]=\"selectedType\"\n              [excludeProperties]=\"excludeProperties()\"\n              [selectedProperty]=\"getConfigProperty(selectedSlot)\"\n              [allowRemove]=\"selectedSlot !== 'title'\"\n              (propertySelect)=\"propertySelected(selectedSlot, $event)\"\n            />\n          }\n        </main>\n      } @else {\n        <div class=\"placeholder empty\"></div>\n      }\n    </section>\n  </main>\n\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancelConfig()\">{{ 'yuv.tile-config.button.close' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"!configChanged || titleMissing\" (click)=\"saveConfig()\">\n      {{ 'yuv.tile-config.button.save' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:flex;height:100%;flex-flow:column}:host main.tile-config{height:100%;display:contents}:host .picker{display:flex;justify-content:space-between;gap:var(--ymt-spacing-m);align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m)}:host .details{flex:1;display:flex;flex-flow:column;box-sizing:border-box;overflow:hidden}:host .details header{flex:0 0 auto;display:flex;align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m);gap:var(--ymt-spacing-m)}:host .details header h2{flex:1;overflow:hidden;text-overflow:ellipsis;margin:0}:host .details .dummy-preview{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-surface-panel);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .dummy-preview yuv-tile-config-tile{max-width:500px;margin:auto;border-radius:var(--ymt-corner-m);border:1px solid var(--ymt-outline);background-color:var(--ymt-surface-container)}:host .details main{flex:1;overflow-y:auto;padding:var(--ymt-spacing-m)}:host .details main h3{margin:0;padding-block-end:var(--ymt-spacing-m);font:var(--ymt-font-subhead)}:host .details .config-error{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .placeholder.empty{height:100%;display:grid;place-content:center;color:var(--ymt-text-color-subtle)}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<yuv-dialog [headertitle]=\"'yuv.tile-config.title' | translate: { bucket: bucketLabel() }\">\n  <main class=\"tile-config\">\n    <section class=\"picker\">\n      <mat-form-field>\n        <mat-select [panelWidth]=\"null\" [(ngModel)]=\"selectedType\" (ngModelChange)=\"typeSelected($event)\">\n          @for (t of types() || []; track t.id; let i = $index) {\n            <mat-option [value]=\"t.data\">{{ getTypeLabel(t.id) }}</mat-option>\n          }\n        </mat-select>\n      </mat-form-field>\n      @if (selectedType) {\n        <button ymtButton=\"secondary\" (click)=\"resetConfig()\">{{ 'yuv.tile-config.button.reset' | translate }}</button>\n      }\n    </section>\n\n    <section class=\"details\">\n      @if (selectedType) {\n        <div class=\"dummy-preview\">\n          <yuv-tile-config-tile\n            [disableIconSlot]=\"true\"\n            [objectConfig]=\"objectConfig!\"\n            [bucket]=\"bucket()\"\n            (slotSelect)=\"slotSelect($event)\"\n          />\n        </div>\n        @if (titleMissing) {\n          <section class=\"config-error\">\n            {{ 'yuv.tile-config.error.title-required' | translate }} ({{ titleMissingTypeLabels }})\n          </section>\n        }\n\n        <main>\n          @if (selectedSlot === 'icon') {\n            <h3>{{ 'yuv.tile-config.slot.icon.headline' | translate }}</h3>\n            <yuv-icon-select [objectType]=\"selectedType\" (iconSelect)=\"iconSelected($event)\" />\n          } @else if (selectedSlot === 'badges') {\n            <h3>{{ 'yuv.tile-config.slot.badges.headline' | translate }}</h3>\n            <yuv-tile-badge-select\n              [objectType]=\"selectedType\"\n              [selectedBadgeIds]=\"getSelectedBadges()\"\n              [bucket]=\"bucket()\"\n              (badgeSelect)=\"badgeSelected($event)\"\n            />\n          } @else if (!selectedSlot) {\n          } @else if (selectedSlot === 'actions') {\n            <h3>{{ 'yuv.tile-config.slot.action.headline' | translate }}</h3>\n            <yuv-tile-action-select\n              [objectType]=\"selectedType\"\n              [selectedActionIds]=\"getSelectedActions()\"\n              (actionSelect)=\"actionSelected($event)\"\n            />\n          } @else {\n            <h3>{{ 'yuv.tile-config.slot.property.headline' | translate }}</h3>\n            <yuv-tile-property-select\n              [objectType]=\"selectedType\"\n              [excludeProperties]=\"excludeProperties()\"\n              [selectedProperty]=\"getConfigProperty(selectedSlot)\"\n              [allowRemove]=\"selectedSlot !== 'title'\"\n              (propertySelect)=\"propertySelected(selectedSlot, $event)\"\n            />\n          }\n        </main>\n      } @else {\n        <div class=\"placeholder empty\"></div>\n      }\n    </section>\n  </main>\n\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancelConfig()\">{{ 'yuv.tile-config.button.close' | translate }}</button>\n    <button ymtButton=\"primary\" [disabled]=\"!configChanged || titleMissing\" (click)=\"saveConfig()\">\n      {{ 'yuv.tile-config.button.save' | translate }}\n    </button>\n  </footer>\n</yuv-dialog>\n", styles: [":host{display:flex;height:100%;flex-flow:column}:host main.tile-config{height:100%;display:contents}:host .picker{display:flex;justify-content:space-between;gap:var(--ymt-spacing-m);align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m)}:host .details{flex:1;display:flex;flex-flow:column;box-sizing:border-box;overflow:hidden}:host .details header{flex:0 0 auto;display:flex;align-items:center;border-bottom:1px solid var(--ymt-outline-variant);padding:var(--ymt-spacing-m);gap:var(--ymt-spacing-m)}:host .details header h2{flex:1;overflow:hidden;text-overflow:ellipsis;margin:0}:host .details .dummy-preview{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-surface-panel);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .dummy-preview yuv-tile-config-tile{max-width:500px;margin:auto;border-radius:var(--ymt-corner-m);border:1px solid var(--ymt-outline);background-color:var(--ymt-surface-container)}:host .details main{flex:1;overflow-y:auto;padding:var(--ymt-spacing-m)}:host .details main h3{margin:0;padding-block-end:var(--ymt-spacing-m);font:var(--ymt-font-subhead)}:host .details .config-error{flex:0 0 auto;padding:var(--ymt-spacing-m);background-color:var(--ymt-danger-container);color:var(--ymt-on-danger-container);border-bottom:1px solid var(--ymt-outline-variant)}:host .details .placeholder.empty{height:100%;display:grid;place-content:center;color:var(--ymt-text-color-subtle)}\n"] }]
         }], propDecorators: { bucket: [{ type: i0.Input, args: [{ isSignal: true, alias: "bucket", required: false }] }], bucketLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "bucketLabel", required: false }] }], configTypes: [{ type: i0.Input, args: [{ isSignal: true, alias: "configTypes", required: false }] }], configFlavors: [{ type: i0.Input, args: [{ isSignal: true, alias: "configFlavors", required: false }] }], excludeProperties: [{ type: i0.Input, args: [{ isSignal: true, alias: "excludeProperties", required: false }] }], save: [{ type: i0.Output, args: ["save"] }], canceled: [{ type: i0.Output, args: ["canceled"] }] } });
 
 class TileConfigTriggerComponent {