@meshmakers/octo-ui 3.5.110 → 3.5.130

package/fesm2022/meshmakers-octo-ui-entity-forms.mjs

@@ -6,7 +6,7 @@ import * as i1 from 'apollo-angular';
 import { gql } from 'apollo-angular';
 import * as i1$1 from '@angular/forms';
 import { FormGroup, FormControl, ReactiveFormsModule, NG_VALUE_ACCESSOR, NG_VALIDATORS, Validators } from '@angular/forms';
-import { MM_ACTION_ICONS, EntitySelectInputComponent, CronBuilderComponent, ListViewComponent, FetchResultTyped, DataSourceBase, ConfirmationService, NotificationDisplayService, resolveListRowLabel, HAS_UNSAVED_CHANGES, UnsavedChangesGuard } from '@meshmakers/shared-ui';
+import { MM_ACTION_ICONS, EntitySelectInputComponent, CronBuilderComponent, ListViewComponent, FetchResultTyped, DataSourceBase, ConfirmationService, NotificationDisplayService, resolveListRowLabel, MmDialogActionsDirective, HAS_UNSAVED_CHANGES, UnsavedChangesGuard } from '@meshmakers/shared-ui';
 import * as i5$1 from '@progress/kendo-angular-icons';
 import { KENDO_SVGICON } from '@progress/kendo-angular-icons';
 import * as i4 from '@progress/kendo-angular-dateinputs';
@@ -4079,14 +4079,14 @@ class EntityFormRecordRowDialogComponent {
           }
         </div>
       }
-      <div class="mm-efr-actions">
+      <div class="mm-dialog-actions">
         <button kendoButton type="button" (click)="onCancel()">{{ msg().cancel }}</button>
         @if (!readOnly()) {
           <button kendoButton type="submit" themeColor="primary">{{ msg().apply }}</button>
         }
       </div>
     </form>
-  `, isInline: true, styles: [":host{display:block}.mm-efr-dialog{display:flex;flex-direction:column;gap:12px;min-width:320px}.mm-efr-field{display:flex;flex-direction:column;gap:4px}.mm-efr-label{font-weight:500;color:var(--theme-text-primary, inherit)}.mm-efr-help,.mm-efr-hint{color:var(--theme-text-secondary, inherit);font-size:.85em}.mm-efr-readonly{display:flex;flex-direction:column;gap:2px;padding:4px 0}.mm-efr-readonly-value{font-family:monospace;word-break:break-all}.mm-efr-secret{display:flex;flex-direction:column;gap:4px}.mm-efr-secret-badge{align-self:flex-start;font-size:.8em;padding:0 8px;border-radius:8px;background:var(--theme-bg-subtle, rgba(127, 127, 127, .15));color:var(--theme-text-secondary, inherit)}.mm-efr-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i2.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i2$1.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "component", type: i2$1.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "component", type: i2$1.SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "onLabel", "offLabel", "checked", "disabled", "readonly", "tabindex", "size", "thumbRounded", "trackRounded", "tabIndex"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { kind: "ngmodule", type: DateInputsModule }, { kind: "component", type: i4.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "weekDaysFormat", "showOtherMonthDays", "value", "format", "twoDigitYearMax", "tabindex", "disabledDates", "popupSettings", "adaptiveTitle", "adaptiveSubtitle", "disabled", "readonly", "readOnlyInput", "cancelButton", "formatPlaceholder", "placeholder", "steps", "focusedDate", "calendarType", "animateCalendarNavigation", "weekNumber", "min", "max", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "clearButton", "autoFill", "adaptiveMode", "inputAttributes", "defaultTab", "size", "rounded", "fillMode", "headerTemplate", "footerTemplate", "footer"], outputs: ["valueChange", "open", "close", "focus", "blur", "escape"], exportAs: ["kendo-datetimepicker"] }, { kind: "ngmodule", type: DropDownsModule }, { kind: "component", type: i5.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "component", type: i5.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["showStickyHeader", "focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer", "inputAttributes"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "removeTag"], exportAs: ["kendoMultiSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, styles: [":host{display:block}.mm-efr-dialog{display:flex;flex-direction:column;gap:12px;min-width:320px}.mm-efr-field{display:flex;flex-direction:column;gap:4px}.mm-efr-label{font-weight:500;color:var(--theme-text-primary, inherit)}.mm-efr-help,.mm-efr-hint{color:var(--theme-text-secondary, inherit);font-size:.85em}.mm-efr-readonly{display:flex;flex-direction:column;gap:2px;padding:4px 0}.mm-efr-readonly-value{font-family:monospace;word-break:break-all}.mm-efr-secret{display:flex;flex-direction:column;gap:4px}.mm-efr-secret-badge{align-self:flex-start;font-size:.8em;padding:0 8px;border-radius:8px;background:var(--theme-bg-subtle, rgba(127, 127, 127, .15));color:var(--theme-text-secondary, inherit)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i2.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i2$1.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "component", type: i2$1.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoNumericTextBox"] }, { kind: "component", type: i2$1.SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "onLabel", "offLabel", "checked", "disabled", "readonly", "tabindex", "size", "thumbRounded", "trackRounded", "tabIndex"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { kind: "ngmodule", type: DateInputsModule }, { kind: "component", type: i4.DateTimePickerComponent, selector: "kendo-datetimepicker", inputs: ["focusableId", "weekDaysFormat", "showOtherMonthDays", "value", "format", "twoDigitYearMax", "tabindex", "disabledDates", "popupSettings", "adaptiveTitle", "adaptiveSubtitle", "disabled", "readonly", "readOnlyInput", "cancelButton", "formatPlaceholder", "placeholder", "steps", "focusedDate", "calendarType", "animateCalendarNavigation", "weekNumber", "min", "max", "rangeValidation", "disabledDatesValidation", "incompleteDateValidation", "autoCorrectParts", "autoSwitchParts", "autoSwitchKeys", "enableMouseWheel", "allowCaretMode", "clearButton", "autoFill", "adaptiveMode", "inputAttributes", "defaultTab", "size", "rounded", "fillMode", "headerTemplate", "footerTemplate", "footer"], outputs: ["valueChange", "open", "close", "focus", "blur", "escape"], exportAs: ["kendo-datetimepicker"] }, { kind: "ngmodule", type: DropDownsModule }, { kind: "component", type: i5.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "component", type: i5.MultiSelectComponent, selector: "kendo-multiselect", inputs: ["showStickyHeader", "focusableId", "autoClose", "loading", "data", "value", "valueField", "textField", "tabindex", "tabIndex", "size", "rounded", "fillMode", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "disabled", "itemDisabled", "checkboxes", "readonly", "filterable", "virtual", "popupSettings", "listHeight", "valuePrimitive", "clearButton", "tagMapper", "allowCustom", "valueNormalizer", "inputAttributes"], outputs: ["filterChange", "valueChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "removeTag"], exportAs: ["kendoMultiSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EntityFormRecordRowDialogComponent, decorators: [{
             type: Component,
@@ -4143,14 +4143,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImpor
           }
         </div>
       }
-      <div class="mm-efr-actions">
+      <div class="mm-dialog-actions">
         <button kendoButton type="button" (click)="onCancel()">{{ msg().cancel }}</button>
         @if (!readOnly()) {
           <button kendoButton type="submit" themeColor="primary">{{ msg().apply }}</button>
         }
       </div>
     </form>
-  `, styles: [":host{display:block}.mm-efr-dialog{display:flex;flex-direction:column;gap:12px;min-width:320px}.mm-efr-field{display:flex;flex-direction:column;gap:4px}.mm-efr-label{font-weight:500;color:var(--theme-text-primary, inherit)}.mm-efr-help,.mm-efr-hint{color:var(--theme-text-secondary, inherit);font-size:.85em}.mm-efr-readonly{display:flex;flex-direction:column;gap:2px;padding:4px 0}.mm-efr-readonly-value{font-family:monospace;word-break:break-all}.mm-efr-secret{display:flex;flex-direction:column;gap:4px}.mm-efr-secret-badge{align-self:flex-start;font-size:.8em;padding:0 8px;border-radius:8px;background:var(--theme-bg-subtle, rgba(127, 127, 127, .15));color:var(--theme-text-secondary, inherit)}.mm-efr-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}\n"] }]
+  `, styles: [":host{display:block}.mm-efr-dialog{display:flex;flex-direction:column;gap:12px;min-width:320px}.mm-efr-field{display:flex;flex-direction:column;gap:4px}.mm-efr-label{font-weight:500;color:var(--theme-text-primary, inherit)}.mm-efr-help,.mm-efr-hint{color:var(--theme-text-secondary, inherit);font-size:.85em}.mm-efr-readonly{display:flex;flex-direction:column;gap:2px;padding:4px 0}.mm-efr-readonly-value{font-family:monospace;word-break:break-all}.mm-efr-secret{display:flex;flex-direction:column;gap:4px}.mm-efr-secret-badge{align-self:flex-start;font-size:.8em;padding:0 8px;border-radius:8px;background:var(--theme-bg-subtle, rgba(127, 127, 127, .15));color:var(--theme-text-secondary, inherit)}\n"] }]
         }], propDecorators: { record: [{ type: i0.Input, args: [{ isSignal: true, alias: "record", required: false }] }], row: [{ type: i0.Input, args: [{ isSignal: true, alias: "row", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], secretWritesDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "secretWritesDisabled", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }] } });
 
 /** Number of columns derived from the record metadata when the form lists none. */
@@ -7866,11 +7866,11 @@ class EntityPageComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EntityPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: EntityPageComponent, isStandalone: true, selector: "mm-entity-page", inputs: { formKey: { classPropertyName: "formKey", publicName: "formKey", isSignal: true, isRequired: false, transformFunction: null }, ckTypeId: { classPropertyName: "ckTypeId", publicName: "ckTypeId", isSignal: true, isRequired: false, transformFunction: null }, rtId: { classPropertyName: "rtId", publicName: "rtId", isSignal: true, isRequired: false, transformFunction: null }, canWrite: { classPropertyName: "canWrite", publicName: "canWrite", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, routerNavigation: { classPropertyName: "routerNavigation", publicName: "routerNavigation", isSignal: true, isRequired: false, transformFunction: null }, actionBarPosition: { classPropertyName: "actionBarPosition", publicName: "actionBarPosition", isSignal: true, isRequired: false, transformFunction: null }, labelResolver: { classPropertyName: "labelResolver", publicName: "labelResolver", isSignal: true, isRequired: false, transformFunction: null }, defaultSort: { classPropertyName: "defaultSort", publicName: "defaultSort", isSignal: true, isRequired: false, transformFunction: null }, initialValues: { classPropertyName: "initialValues", publicName: "initialValues", isSignal: true, isRequired: false, transformFunction: null }, beforeSave: { classPropertyName: "beforeSave", publicName: "beforeSave", isSignal: true, isRequired: false, transformFunction: null }, listToolbarActions: { classPropertyName: "listToolbarActions", publicName: "listToolbarActions", isSignal: true, isRequired: false, transformFunction: null }, listRowActions: { classPropertyName: "listRowActions", publicName: "listRowActions", isSignal: true, isRequired: false, transformFunction: null }, listRowMenuActions: { classPropertyName: "listRowMenuActions", publicName: "listRowMenuActions", isSignal: true, isRequired: false, transformFunction: null }, editMode: { classPropertyName: "editMode", publicName: "editMode", isSignal: true, isRequired: false, transformFunction: null }, listRowClass: { classPropertyName: "listRowClass", publicName: "listRowClass", isSignal: true, isRequired: false, transformFunction: null }, listBooleanDisplay: { classPropertyName: "listBooleanDisplay", publicName: "listBooleanDisplay", isSignal: true, isRequired: false, transformFunction: null }, listRowLabelField: { classPropertyName: "listRowLabelField", publicName: "listRowLabelField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { navigate: "navigate", saved: "saved", deleted: "deleted" }, providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: EntityPageComponent }], queries: [{ propertyName: "pageActions", first: true, predicate: EntityPageActionsDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "form", first: true, predicate: ["entityForm"], descendants: true, isSignal: true }, { propertyName: "list", first: true, predicate: ["entityList"], descendants: true, isSignal: true }, { propertyName: "listElement", first: true, predicate: ["entityList"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<div class=\"mm-entity-page\">\n  @switch (view()) {\n    @case ('loading') {\n      <div class=\"mm-entity-page__state\">{{ msgs().loading }}</div>\n    }\n\n    @case ('error') {\n      <div class=\"mm-entity-page__state mm-entity-page__state--error\" role=\"alert\">\n        <p>{{ errorMessage() }}</p>\n        @if (baseModel() && !isSingleton()) {\n          <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" (click)=\"onBack()\">{{ msgs().back }}</button>\n        }\n      </div>\n    }\n\n    @case ('list') {\n      @if (baseModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ listTitle() }}</h2>\n            @if (localizedBase()?.description; as description) {\n              <p class=\"mm-entity-page__description\">{{ description }}</p>\n            }\n          </div>\n          @if (pageActions() || canCreateFromList()) {\n            <div class=\"mm-entity-page__header-actions\">\n              @if (pageActions(); as actions) {\n                <div class=\"mm-entity-page__actions\" data-entity-page-host-actions>\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n                </div>\n              }\n              <!-- The page's one solid primary action (AB#6211, action guideline \u00A79). -->\n              @if (canCreateFromList()) {\n                <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"addIcon\"\n                        data-entity-page-create (click)=\"onCreateFromHeader()\">{{ createLabel() }}</button>\n              }\n            </div>\n          }\n        </header>\n        <mm-entity-list\n          #entityList\n          class=\"mm-entity-page__list\"\n          [model]=\"model\"\n          [canWrite]=\"effectiveCanWrite()\"\n          [messages]=\"msgs()\"\n          [showTypeColumn]=\"showTypeColumn()\"\n          [defaultSort]=\"effectiveDefaultSort()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [showCreateAction]=\"false\"\n          [openAction]=\"effectiveListOpenAction()\"\n          [toolbarActions]=\"listToolbarActions()\"\n          [rowActions]=\"listRowActions()\"\n          [rowMenuActions]=\"listRowMenuActions()\"\n          [rowClass]=\"effectiveListRowClass()\"\n          [booleanDisplay]=\"effectiveListBooleanDisplay()\"\n          [rowLabelField]=\"effectiveRowLabelField()\"\n          (createRequested)=\"onCreateRequested($event)\"\n          (openRequested)=\"onOpenRequested($event)\"\n        />\n\n        <!-- Dialog mode (editMode 'dialog', AB#5623): create / edit over the list, actions in the\n             dialog's bottom bar (Cancel left of the primary Save, as in the record row dialog). -->\n        @if (dialogOpen()) {\n          @if (formModel(); as formModelInDialog) {\n            <kendo-dialog\n              class=\"mm-entity-page__dialog\"\n              data-entity-page-dialog\n              [title]=\"title()\"\n              [width]=\"760\"\n              [maxWidth]=\"'95vw'\"\n              [maxHeight]=\"'90vh'\"\n              (close)=\"onDialogCancel()\"\n            >\n              <kendo-dialog-messages [closeTitle]=\"msgs().close\" />\n              <div class=\"mm-entity-page__dialog-body\">\n                @if (mode() === 'view') {\n                  <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n                }\n                <mm-entity-form\n                  #entityForm\n                  class=\"mm-entity-page__form\"\n                  [model]=\"formModelInDialog\"\n                  [mode]=\"mode()\"\n                  [state]=\"state()\"\n                  [readOnly]=\"readOnly()\"\n                  [messages]=\"msgs()\"\n                  [records]=\"records()\"\n                  [labelResolver]=\"effectiveLabelResolver()\"\n                  [initialValues]=\"createInitialValues()\"\n                />\n              </div>\n              <kendo-dialog-actions layout=\"end\">\n                @if (pageActions(); as actions) {\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: dialogActionsContext()\" />\n                }\n                <button kendoButton type=\"button\" data-entity-page-dialog-cancel (click)=\"onDialogCancel()\">\n                  {{ mode() === 'view' ? msgs().close : msgs().cancel }}\n                </button>\n                @if (canDeleteEntity()) {\n                  <button kendoButton type=\"button\" fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                    {{ msgs().delete }}\n                  </button>\n                }\n                @if (mode() !== 'view') {\n                  <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"saveIcon\"\n                          [disabled]=\"saving() || !!saveBlockedReason()\" [attr.title]=\"saveBlockedReason()\"\n                          data-entity-page-save (click)=\"onSave()\">\n                    {{ msgs().save }}\n                  </button>\n                }\n              </kendo-dialog-actions>\n            </kendo-dialog>\n          }\n        }\n      }\n    }\n\n    @case ('form') {\n      @if (formModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ title() }}</h2>\n            @if (mode() !== 'create' && entityRtId()) {\n              <mm-entity-id-info\n                [rtId]=\"entityRtId()!\"\n                [rtCkTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [ckTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [buttonText]=\"msgs().copyId\"\n                [tooltip]=\"msgs().copyIdTooltip\"\n                [copiedMessage]=\"msgs().copiedId\"\n                [copyFailedMessage]=\"msgs().copyFailed\"\n              />\n            }\n          </div>\n          @if (effectiveActionBarPosition() === 'top') {\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          }\n        </header>\n        @if (mode() === 'view') {\n          <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n        }\n        @if (mode() === 'create' && singletonWellKnownName()) {\n          <p class=\"mm-entity-page__notice\">{{ msgs().singletonCreateHint }}</p>\n        }\n        <mm-entity-form\n          #entityForm\n          class=\"mm-entity-page__form\"\n          [model]=\"model\"\n          [mode]=\"mode()\"\n          [state]=\"state()\"\n          [readOnly]=\"readOnly()\"\n          [messages]=\"msgs()\"\n          [records]=\"records()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [initialValues]=\"createInitialValues()\"\n        />\n        @if (effectiveActionBarPosition() === 'bottom') {\n          <footer class=\"mm-entity-page__footer\" data-entity-page-footer>\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          </footer>\n        }\n\n        <ng-template #formActions>\n          <div class=\"mm-entity-page__actions\">\n            @if (pageActions(); as actions) {\n              <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n            }\n            @if (!isSingleton()) {\n              <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" data-entity-page-back (click)=\"onBack()\">\n                {{ mode() === 'view' ? msgs().back : msgs().cancel }}\n              </button>\n            }\n            @if (canDeleteEntity()) {\n              <button kendoButton fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                {{ msgs().delete }}\n              </button>\n            }\n            @if (mode() !== 'view') {\n              <button kendoButton themeColor=\"primary\" [svgIcon]=\"saveIcon\" [disabled]=\"saving() || !!saveBlockedReason()\"\n                      [attr.title]=\"saveBlockedReason()\" data-entity-page-save (click)=\"onSave()\">\n                {{ msgs().save }}\n              </button>\n            }\n          </div>\n        </ng-template>\n      }\n    }\n  }\n</div>\n", styles: [":host{display:block;height:100%;min-height:0}.mm-entity-page{display:flex;flex-direction:column;gap:12px;height:100%;min-height:0;padding:16px;box-sizing:border-box;color:var(--theme-text-primary, inherit)}.mm-entity-page__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px}.mm-entity-page__titles{display:flex;flex-direction:column;gap:4px;min-width:0}.mm-entity-page__title{margin:0;font-size:1.25rem;font-weight:600;overflow-wrap:anywhere}.mm-entity-page__description,.mm-entity-page__notice{margin:0;color:var(--theme-text-secondary, inherit);opacity:.85}.mm-entity-page__actions,.mm-entity-page__header-actions{display:flex;flex-wrap:wrap;gap:8px}.mm-entity-page__list{flex:1 1 auto;min-height:300px}.mm-entity-page__form{flex:1 1 auto;min-height:0;overflow:auto}.mm-entity-page__state{padding:24px 0;color:var(--theme-text-secondary, inherit)}.mm-entity-page__state--error{color:var(--theme-status-error, inherit)}.mm-entity-page__footer{display:flex;justify-content:flex-end;flex-shrink:0;padding-top:12px;border-top:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .12))}.mm-entity-page__dialog-body{display:flex;flex-direction:column;gap:12px}\n"], dependencies: [{ kind: "component", type: EntityListComponent, selector: "mm-entity-list", inputs: ["model", "canWrite", "messages", "listStateKey", "showTypeColumn", "defaultSort", "labelResolver", "toolbarActions", "showCreateAction", "openAction", "rowActions", "rowMenuActions", "rowClass", "booleanDisplay", "rowLabelField"], outputs: ["createRequested", "openRequested", "deleted"] }, { kind: "component", type: EntityFormComponent, selector: "mm-entity-form", inputs: ["model", "mode", "state", "readOnly", "messages", "records", "labelResolver", "initialValues", "beforeSave"], outputs: ["changeSetChange", "validChange", "dirtyChange"] }, { kind: "component", type: EntityIdInfoComponent, selector: "mm-entity-id-info", inputs: ["rtId", "rtCkTypeId", "ckTypeId", "buttonText", "tooltip", "copiedMessage", "copyFailedMessage"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$3.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "closable", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "component", type: i1$3.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "directive", type: i1$3.CustomMessagesComponent, selector: "kendo-dialog-messages, kendo-window-messages" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: EntityPageComponent, isStandalone: true, selector: "mm-entity-page", inputs: { formKey: { classPropertyName: "formKey", publicName: "formKey", isSignal: true, isRequired: false, transformFunction: null }, ckTypeId: { classPropertyName: "ckTypeId", publicName: "ckTypeId", isSignal: true, isRequired: false, transformFunction: null }, rtId: { classPropertyName: "rtId", publicName: "rtId", isSignal: true, isRequired: false, transformFunction: null }, canWrite: { classPropertyName: "canWrite", publicName: "canWrite", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, routerNavigation: { classPropertyName: "routerNavigation", publicName: "routerNavigation", isSignal: true, isRequired: false, transformFunction: null }, actionBarPosition: { classPropertyName: "actionBarPosition", publicName: "actionBarPosition", isSignal: true, isRequired: false, transformFunction: null }, labelResolver: { classPropertyName: "labelResolver", publicName: "labelResolver", isSignal: true, isRequired: false, transformFunction: null }, defaultSort: { classPropertyName: "defaultSort", publicName: "defaultSort", isSignal: true, isRequired: false, transformFunction: null }, initialValues: { classPropertyName: "initialValues", publicName: "initialValues", isSignal: true, isRequired: false, transformFunction: null }, beforeSave: { classPropertyName: "beforeSave", publicName: "beforeSave", isSignal: true, isRequired: false, transformFunction: null }, listToolbarActions: { classPropertyName: "listToolbarActions", publicName: "listToolbarActions", isSignal: true, isRequired: false, transformFunction: null }, listRowActions: { classPropertyName: "listRowActions", publicName: "listRowActions", isSignal: true, isRequired: false, transformFunction: null }, listRowMenuActions: { classPropertyName: "listRowMenuActions", publicName: "listRowMenuActions", isSignal: true, isRequired: false, transformFunction: null }, editMode: { classPropertyName: "editMode", publicName: "editMode", isSignal: true, isRequired: false, transformFunction: null }, listRowClass: { classPropertyName: "listRowClass", publicName: "listRowClass", isSignal: true, isRequired: false, transformFunction: null }, listBooleanDisplay: { classPropertyName: "listBooleanDisplay", publicName: "listBooleanDisplay", isSignal: true, isRequired: false, transformFunction: null }, listRowLabelField: { classPropertyName: "listRowLabelField", publicName: "listRowLabelField", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { navigate: "navigate", saved: "saved", deleted: "deleted" }, providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: EntityPageComponent }], queries: [{ propertyName: "pageActions", first: true, predicate: EntityPageActionsDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "form", first: true, predicate: ["entityForm"], descendants: true, isSignal: true }, { propertyName: "list", first: true, predicate: ["entityList"], descendants: true, isSignal: true }, { propertyName: "listElement", first: true, predicate: ["entityList"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "<div class=\"mm-entity-page\">\n  @switch (view()) {\n    @case ('loading') {\n      <div class=\"mm-entity-page__state\">{{ msgs().loading }}</div>\n    }\n\n    @case ('error') {\n      <div class=\"mm-entity-page__state mm-entity-page__state--error\" role=\"alert\">\n        <p>{{ errorMessage() }}</p>\n        @if (baseModel() && !isSingleton()) {\n          <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" (click)=\"onBack()\">{{ msgs().back }}</button>\n        }\n      </div>\n    }\n\n    @case ('list') {\n      @if (baseModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ listTitle() }}</h2>\n            @if (localizedBase()?.description; as description) {\n              <p class=\"mm-entity-page__description\">{{ description }}</p>\n            }\n          </div>\n          @if (pageActions() || canCreateFromList()) {\n            <div class=\"mm-entity-page__header-actions\">\n              @if (pageActions(); as actions) {\n                <div class=\"mm-entity-page__actions\" data-entity-page-host-actions>\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n                </div>\n              }\n              <!-- The page's one solid primary action (AB#6211, action guideline \u00A79). -->\n              @if (canCreateFromList()) {\n                <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"addIcon\"\n                        data-entity-page-create (click)=\"onCreateFromHeader()\">{{ createLabel() }}</button>\n              }\n            </div>\n          }\n        </header>\n        <mm-entity-list\n          #entityList\n          class=\"mm-entity-page__list\"\n          [model]=\"model\"\n          [canWrite]=\"effectiveCanWrite()\"\n          [messages]=\"msgs()\"\n          [showTypeColumn]=\"showTypeColumn()\"\n          [defaultSort]=\"effectiveDefaultSort()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [showCreateAction]=\"false\"\n          [openAction]=\"effectiveListOpenAction()\"\n          [toolbarActions]=\"listToolbarActions()\"\n          [rowActions]=\"listRowActions()\"\n          [rowMenuActions]=\"listRowMenuActions()\"\n          [rowClass]=\"effectiveListRowClass()\"\n          [booleanDisplay]=\"effectiveListBooleanDisplay()\"\n          [rowLabelField]=\"effectiveRowLabelField()\"\n          (createRequested)=\"onCreateRequested($event)\"\n          (openRequested)=\"onOpenRequested($event)\"\n        />\n\n        <!-- Dialog mode (editMode 'dialog', AB#5623): create / edit over the list, actions in the\n             dialog's bottom bar (Cancel left of the primary Save, as in the record row dialog). -->\n        @if (dialogOpen()) {\n          @if (formModel(); as formModelInDialog) {\n            <kendo-dialog\n              class=\"mm-entity-page__dialog\"\n              data-entity-page-dialog\n              [title]=\"title()\"\n              [width]=\"760\"\n              [maxWidth]=\"'95vw'\"\n              [maxHeight]=\"'90vh'\"\n              (close)=\"onDialogCancel()\"\n            >\n              <kendo-dialog-messages [closeTitle]=\"msgs().close\" />\n              <div class=\"mm-entity-page__dialog-body\">\n                @if (mode() === 'view') {\n                  <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n                }\n                <mm-entity-form\n                  #entityForm\n                  class=\"mm-entity-page__form\"\n                  [model]=\"formModelInDialog\"\n                  [mode]=\"mode()\"\n                  [state]=\"state()\"\n                  [readOnly]=\"readOnly()\"\n                  [messages]=\"msgs()\"\n                  [records]=\"records()\"\n                  [labelResolver]=\"effectiveLabelResolver()\"\n                  [initialValues]=\"createInitialValues()\"\n                />\n              </div>\n              <kendo-dialog-actions>\n                @if (pageActions(); as actions) {\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: dialogActionsContext()\" />\n                }\n                <button kendoButton type=\"button\" data-entity-page-dialog-cancel (click)=\"onDialogCancel()\">\n                  {{ mode() === 'view' ? msgs().close : msgs().cancel }}\n                </button>\n                @if (canDeleteEntity()) {\n                  <button kendoButton type=\"button\" fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                    {{ msgs().delete }}\n                  </button>\n                }\n                @if (mode() !== 'view') {\n                  <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"saveIcon\"\n                          [disabled]=\"saving() || !!saveBlockedReason()\" [attr.title]=\"saveBlockedReason()\"\n                          data-entity-page-save (click)=\"onSave()\">\n                    {{ msgs().save }}\n                  </button>\n                }\n              </kendo-dialog-actions>\n            </kendo-dialog>\n          }\n        }\n      }\n    }\n\n    @case ('form') {\n      @if (formModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ title() }}</h2>\n            @if (mode() !== 'create' && entityRtId()) {\n              <mm-entity-id-info\n                [rtId]=\"entityRtId()!\"\n                [rtCkTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [ckTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [buttonText]=\"msgs().copyId\"\n                [tooltip]=\"msgs().copyIdTooltip\"\n                [copiedMessage]=\"msgs().copiedId\"\n                [copyFailedMessage]=\"msgs().copyFailed\"\n              />\n            }\n          </div>\n          @if (effectiveActionBarPosition() === 'top') {\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          }\n        </header>\n        @if (mode() === 'view') {\n          <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n        }\n        @if (mode() === 'create' && singletonWellKnownName()) {\n          <p class=\"mm-entity-page__notice\">{{ msgs().singletonCreateHint }}</p>\n        }\n        <mm-entity-form\n          #entityForm\n          class=\"mm-entity-page__form\"\n          [model]=\"model\"\n          [mode]=\"mode()\"\n          [state]=\"state()\"\n          [readOnly]=\"readOnly()\"\n          [messages]=\"msgs()\"\n          [records]=\"records()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [initialValues]=\"createInitialValues()\"\n        />\n        @if (effectiveActionBarPosition() === 'bottom') {\n          <footer class=\"mm-entity-page__footer\" data-entity-page-footer>\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          </footer>\n        }\n\n        <ng-template #formActions>\n          <div class=\"mm-entity-page__actions\">\n            @if (pageActions(); as actions) {\n              <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n            }\n            @if (!isSingleton()) {\n              <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" data-entity-page-back (click)=\"onBack()\">\n                {{ mode() === 'view' ? msgs().back : msgs().cancel }}\n              </button>\n            }\n            @if (canDeleteEntity()) {\n              <button kendoButton fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                {{ msgs().delete }}\n              </button>\n            }\n            @if (mode() !== 'view') {\n              <button kendoButton themeColor=\"primary\" [svgIcon]=\"saveIcon\" [disabled]=\"saving() || !!saveBlockedReason()\"\n                      [attr.title]=\"saveBlockedReason()\" data-entity-page-save (click)=\"onSave()\">\n                {{ msgs().save }}\n              </button>\n            }\n          </div>\n        </ng-template>\n      }\n    }\n  }\n</div>\n", styles: [":host{display:block;height:100%;min-height:0}.mm-entity-page{display:flex;flex-direction:column;gap:12px;height:100%;min-height:0;padding:16px;box-sizing:border-box;color:var(--theme-text-primary, inherit)}.mm-entity-page__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px}.mm-entity-page__titles{display:flex;flex-direction:column;gap:4px;min-width:0}.mm-entity-page__title{margin:0;font-size:1.25rem;font-weight:600;overflow-wrap:anywhere}.mm-entity-page__description,.mm-entity-page__notice{margin:0;color:var(--theme-text-secondary, inherit);opacity:.85}.mm-entity-page__actions,.mm-entity-page__header-actions{display:flex;flex-wrap:wrap;gap:8px}.mm-entity-page__list{flex:1 1 auto;min-height:300px}.mm-entity-page__form{flex:1 1 auto;min-height:0;overflow:auto}.mm-entity-page__state{padding:24px 0;color:var(--theme-text-secondary, inherit)}.mm-entity-page__state--error{color:var(--theme-status-error, inherit)}.mm-entity-page__footer{display:flex;justify-content:flex-end;flex-shrink:0;padding-top:12px;border-top:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .12))}.mm-entity-page__dialog-body{display:flex;flex-direction:column;gap:12px}\n"], dependencies: [{ kind: "directive", type: MmDialogActionsDirective, selector: "kendo-dialog-actions" }, { kind: "component", type: EntityListComponent, selector: "mm-entity-list", inputs: ["model", "canWrite", "messages", "listStateKey", "showTypeColumn", "defaultSort", "labelResolver", "toolbarActions", "showCreateAction", "openAction", "rowActions", "rowMenuActions", "rowClass", "booleanDisplay", "rowLabelField"], outputs: ["createRequested", "openRequested", "deleted"] }, { kind: "component", type: EntityFormComponent, selector: "mm-entity-form", inputs: ["model", "mode", "state", "readOnly", "messages", "records", "labelResolver", "initialValues", "beforeSave"], outputs: ["changeSetChange", "validChange", "dirtyChange"] }, { kind: "component", type: EntityIdInfoComponent, selector: "mm-entity-id-info", inputs: ["rtId", "rtCkTypeId", "ckTypeId", "buttonText", "tooltip", "copiedMessage", "copyFailedMessage"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$3.DialogComponent, selector: "kendo-dialog", inputs: ["actions", "actionsLayout", "autoFocusedElement", "closable", "title", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "animation"], outputs: ["action", "close"], exportAs: ["kendoDialog"] }, { kind: "component", type: i1$3.DialogActionsComponent, selector: "kendo-dialog-actions", inputs: ["actions", "layout"], outputs: ["action"] }, { kind: "directive", type: i1$3.CustomMessagesComponent, selector: "kendo-dialog-messages, kendo-window-messages" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EntityPageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'mm-entity-page', standalone: true, imports: [EntityListComponent, EntityFormComponent, EntityIdInfoComponent, ButtonComponent, NgTemplateOutlet, KENDO_DIALOG], providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: EntityPageComponent }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mm-entity-page\">\n  @switch (view()) {\n    @case ('loading') {\n      <div class=\"mm-entity-page__state\">{{ msgs().loading }}</div>\n    }\n\n    @case ('error') {\n      <div class=\"mm-entity-page__state mm-entity-page__state--error\" role=\"alert\">\n        <p>{{ errorMessage() }}</p>\n        @if (baseModel() && !isSingleton()) {\n          <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" (click)=\"onBack()\">{{ msgs().back }}</button>\n        }\n      </div>\n    }\n\n    @case ('list') {\n      @if (baseModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ listTitle() }}</h2>\n            @if (localizedBase()?.description; as description) {\n              <p class=\"mm-entity-page__description\">{{ description }}</p>\n            }\n          </div>\n          @if (pageActions() || canCreateFromList()) {\n            <div class=\"mm-entity-page__header-actions\">\n              @if (pageActions(); as actions) {\n                <div class=\"mm-entity-page__actions\" data-entity-page-host-actions>\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n                </div>\n              }\n              <!-- The page's one solid primary action (AB#6211, action guideline \u00A79). -->\n              @if (canCreateFromList()) {\n                <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"addIcon\"\n                        data-entity-page-create (click)=\"onCreateFromHeader()\">{{ createLabel() }}</button>\n              }\n            </div>\n          }\n        </header>\n        <mm-entity-list\n          #entityList\n          class=\"mm-entity-page__list\"\n          [model]=\"model\"\n          [canWrite]=\"effectiveCanWrite()\"\n          [messages]=\"msgs()\"\n          [showTypeColumn]=\"showTypeColumn()\"\n          [defaultSort]=\"effectiveDefaultSort()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [showCreateAction]=\"false\"\n          [openAction]=\"effectiveListOpenAction()\"\n          [toolbarActions]=\"listToolbarActions()\"\n          [rowActions]=\"listRowActions()\"\n          [rowMenuActions]=\"listRowMenuActions()\"\n          [rowClass]=\"effectiveListRowClass()\"\n          [booleanDisplay]=\"effectiveListBooleanDisplay()\"\n          [rowLabelField]=\"effectiveRowLabelField()\"\n          (createRequested)=\"onCreateRequested($event)\"\n          (openRequested)=\"onOpenRequested($event)\"\n        />\n\n        <!-- Dialog mode (editMode 'dialog', AB#5623): create / edit over the list, actions in the\n             dialog's bottom bar (Cancel left of the primary Save, as in the record row dialog). -->\n        @if (dialogOpen()) {\n          @if (formModel(); as formModelInDialog) {\n            <kendo-dialog\n              class=\"mm-entity-page__dialog\"\n              data-entity-page-dialog\n              [title]=\"title()\"\n              [width]=\"760\"\n              [maxWidth]=\"'95vw'\"\n              [maxHeight]=\"'90vh'\"\n              (close)=\"onDialogCancel()\"\n            >\n              <kendo-dialog-messages [closeTitle]=\"msgs().close\" />\n              <div class=\"mm-entity-page__dialog-body\">\n                @if (mode() === 'view') {\n                  <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n                }\n                <mm-entity-form\n                  #entityForm\n                  class=\"mm-entity-page__form\"\n                  [model]=\"formModelInDialog\"\n                  [mode]=\"mode()\"\n                  [state]=\"state()\"\n                  [readOnly]=\"readOnly()\"\n                  [messages]=\"msgs()\"\n                  [records]=\"records()\"\n                  [labelResolver]=\"effectiveLabelResolver()\"\n                  [initialValues]=\"createInitialValues()\"\n                />\n              </div>\n              <kendo-dialog-actions layout=\"end\">\n                @if (pageActions(); as actions) {\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: dialogActionsContext()\" />\n                }\n                <button kendoButton type=\"button\" data-entity-page-dialog-cancel (click)=\"onDialogCancel()\">\n                  {{ mode() === 'view' ? msgs().close : msgs().cancel }}\n                </button>\n                @if (canDeleteEntity()) {\n                  <button kendoButton type=\"button\" fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                    {{ msgs().delete }}\n                  </button>\n                }\n                @if (mode() !== 'view') {\n                  <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"saveIcon\"\n                          [disabled]=\"saving() || !!saveBlockedReason()\" [attr.title]=\"saveBlockedReason()\"\n                          data-entity-page-save (click)=\"onSave()\">\n                    {{ msgs().save }}\n                  </button>\n                }\n              </kendo-dialog-actions>\n            </kendo-dialog>\n          }\n        }\n      }\n    }\n\n    @case ('form') {\n      @if (formModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ title() }}</h2>\n            @if (mode() !== 'create' && entityRtId()) {\n              <mm-entity-id-info\n                [rtId]=\"entityRtId()!\"\n                [rtCkTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [ckTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [buttonText]=\"msgs().copyId\"\n                [tooltip]=\"msgs().copyIdTooltip\"\n                [copiedMessage]=\"msgs().copiedId\"\n                [copyFailedMessage]=\"msgs().copyFailed\"\n              />\n            }\n          </div>\n          @if (effectiveActionBarPosition() === 'top') {\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          }\n        </header>\n        @if (mode() === 'view') {\n          <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n        }\n        @if (mode() === 'create' && singletonWellKnownName()) {\n          <p class=\"mm-entity-page__notice\">{{ msgs().singletonCreateHint }}</p>\n        }\n        <mm-entity-form\n          #entityForm\n          class=\"mm-entity-page__form\"\n          [model]=\"model\"\n          [mode]=\"mode()\"\n          [state]=\"state()\"\n          [readOnly]=\"readOnly()\"\n          [messages]=\"msgs()\"\n          [records]=\"records()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [initialValues]=\"createInitialValues()\"\n        />\n        @if (effectiveActionBarPosition() === 'bottom') {\n          <footer class=\"mm-entity-page__footer\" data-entity-page-footer>\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          </footer>\n        }\n\n        <ng-template #formActions>\n          <div class=\"mm-entity-page__actions\">\n            @if (pageActions(); as actions) {\n              <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n            }\n            @if (!isSingleton()) {\n              <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" data-entity-page-back (click)=\"onBack()\">\n                {{ mode() === 'view' ? msgs().back : msgs().cancel }}\n              </button>\n            }\n            @if (canDeleteEntity()) {\n              <button kendoButton fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                {{ msgs().delete }}\n              </button>\n            }\n            @if (mode() !== 'view') {\n              <button kendoButton themeColor=\"primary\" [svgIcon]=\"saveIcon\" [disabled]=\"saving() || !!saveBlockedReason()\"\n                      [attr.title]=\"saveBlockedReason()\" data-entity-page-save (click)=\"onSave()\">\n                {{ msgs().save }}\n              </button>\n            }\n          </div>\n        </ng-template>\n      }\n    }\n  }\n</div>\n", styles: [":host{display:block;height:100%;min-height:0}.mm-entity-page{display:flex;flex-direction:column;gap:12px;height:100%;min-height:0;padding:16px;box-sizing:border-box;color:var(--theme-text-primary, inherit)}.mm-entity-page__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px}.mm-entity-page__titles{display:flex;flex-direction:column;gap:4px;min-width:0}.mm-entity-page__title{margin:0;font-size:1.25rem;font-weight:600;overflow-wrap:anywhere}.mm-entity-page__description,.mm-entity-page__notice{margin:0;color:var(--theme-text-secondary, inherit);opacity:.85}.mm-entity-page__actions,.mm-entity-page__header-actions{display:flex;flex-wrap:wrap;gap:8px}.mm-entity-page__list{flex:1 1 auto;min-height:300px}.mm-entity-page__form{flex:1 1 auto;min-height:0;overflow:auto}.mm-entity-page__state{padding:24px 0;color:var(--theme-text-secondary, inherit)}.mm-entity-page__state--error{color:var(--theme-status-error, inherit)}.mm-entity-page__footer{display:flex;justify-content:flex-end;flex-shrink:0;padding-top:12px;border-top:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .12))}.mm-entity-page__dialog-body{display:flex;flex-direction:column;gap:12px}\n"] }]
+            args: [{ selector: 'mm-entity-page', standalone: true, imports: [MmDialogActionsDirective, EntityListComponent, EntityFormComponent, EntityIdInfoComponent, ButtonComponent, NgTemplateOutlet, KENDO_DIALOG], providers: [{ provide: HAS_UNSAVED_CHANGES, useExisting: EntityPageComponent }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mm-entity-page\">\n  @switch (view()) {\n    @case ('loading') {\n      <div class=\"mm-entity-page__state\">{{ msgs().loading }}</div>\n    }\n\n    @case ('error') {\n      <div class=\"mm-entity-page__state mm-entity-page__state--error\" role=\"alert\">\n        <p>{{ errorMessage() }}</p>\n        @if (baseModel() && !isSingleton()) {\n          <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" (click)=\"onBack()\">{{ msgs().back }}</button>\n        }\n      </div>\n    }\n\n    @case ('list') {\n      @if (baseModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ listTitle() }}</h2>\n            @if (localizedBase()?.description; as description) {\n              <p class=\"mm-entity-page__description\">{{ description }}</p>\n            }\n          </div>\n          @if (pageActions() || canCreateFromList()) {\n            <div class=\"mm-entity-page__header-actions\">\n              @if (pageActions(); as actions) {\n                <div class=\"mm-entity-page__actions\" data-entity-page-host-actions>\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n                </div>\n              }\n              <!-- The page's one solid primary action (AB#6211, action guideline \u00A79). -->\n              @if (canCreateFromList()) {\n                <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"addIcon\"\n                        data-entity-page-create (click)=\"onCreateFromHeader()\">{{ createLabel() }}</button>\n              }\n            </div>\n          }\n        </header>\n        <mm-entity-list\n          #entityList\n          class=\"mm-entity-page__list\"\n          [model]=\"model\"\n          [canWrite]=\"effectiveCanWrite()\"\n          [messages]=\"msgs()\"\n          [showTypeColumn]=\"showTypeColumn()\"\n          [defaultSort]=\"effectiveDefaultSort()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [showCreateAction]=\"false\"\n          [openAction]=\"effectiveListOpenAction()\"\n          [toolbarActions]=\"listToolbarActions()\"\n          [rowActions]=\"listRowActions()\"\n          [rowMenuActions]=\"listRowMenuActions()\"\n          [rowClass]=\"effectiveListRowClass()\"\n          [booleanDisplay]=\"effectiveListBooleanDisplay()\"\n          [rowLabelField]=\"effectiveRowLabelField()\"\n          (createRequested)=\"onCreateRequested($event)\"\n          (openRequested)=\"onOpenRequested($event)\"\n        />\n\n        <!-- Dialog mode (editMode 'dialog', AB#5623): create / edit over the list, actions in the\n             dialog's bottom bar (Cancel left of the primary Save, as in the record row dialog). -->\n        @if (dialogOpen()) {\n          @if (formModel(); as formModelInDialog) {\n            <kendo-dialog\n              class=\"mm-entity-page__dialog\"\n              data-entity-page-dialog\n              [title]=\"title()\"\n              [width]=\"760\"\n              [maxWidth]=\"'95vw'\"\n              [maxHeight]=\"'90vh'\"\n              (close)=\"onDialogCancel()\"\n            >\n              <kendo-dialog-messages [closeTitle]=\"msgs().close\" />\n              <div class=\"mm-entity-page__dialog-body\">\n                @if (mode() === 'view') {\n                  <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n                }\n                <mm-entity-form\n                  #entityForm\n                  class=\"mm-entity-page__form\"\n                  [model]=\"formModelInDialog\"\n                  [mode]=\"mode()\"\n                  [state]=\"state()\"\n                  [readOnly]=\"readOnly()\"\n                  [messages]=\"msgs()\"\n                  [records]=\"records()\"\n                  [labelResolver]=\"effectiveLabelResolver()\"\n                  [initialValues]=\"createInitialValues()\"\n                />\n              </div>\n              <kendo-dialog-actions>\n                @if (pageActions(); as actions) {\n                  <ng-container *ngTemplateOutlet=\"actions.templateRef; context: dialogActionsContext()\" />\n                }\n                <button kendoButton type=\"button\" data-entity-page-dialog-cancel (click)=\"onDialogCancel()\">\n                  {{ mode() === 'view' ? msgs().close : msgs().cancel }}\n                </button>\n                @if (canDeleteEntity()) {\n                  <button kendoButton type=\"button\" fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                    {{ msgs().delete }}\n                  </button>\n                }\n                @if (mode() !== 'view') {\n                  <button kendoButton type=\"button\" themeColor=\"primary\" [svgIcon]=\"saveIcon\"\n                          [disabled]=\"saving() || !!saveBlockedReason()\" [attr.title]=\"saveBlockedReason()\"\n                          data-entity-page-save (click)=\"onSave()\">\n                    {{ msgs().save }}\n                  </button>\n                }\n              </kendo-dialog-actions>\n            </kendo-dialog>\n          }\n        }\n      }\n    }\n\n    @case ('form') {\n      @if (formModel(); as model) {\n        <header class=\"mm-entity-page__header\">\n          <div class=\"mm-entity-page__titles\">\n            <h2 class=\"mm-entity-page__title\">{{ title() }}</h2>\n            @if (mode() !== 'create' && entityRtId()) {\n              <mm-entity-id-info\n                [rtId]=\"entityRtId()!\"\n                [rtCkTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [ckTypeId]=\"entityCkTypeId() ?? model.rtCkTypeId\"\n                [buttonText]=\"msgs().copyId\"\n                [tooltip]=\"msgs().copyIdTooltip\"\n                [copiedMessage]=\"msgs().copiedId\"\n                [copyFailedMessage]=\"msgs().copyFailed\"\n              />\n            }\n          </div>\n          @if (effectiveActionBarPosition() === 'top') {\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          }\n        </header>\n        @if (mode() === 'view') {\n          <p class=\"mm-entity-page__notice\">{{ msgs().readOnlyNotice }}</p>\n        }\n        @if (mode() === 'create' && singletonWellKnownName()) {\n          <p class=\"mm-entity-page__notice\">{{ msgs().singletonCreateHint }}</p>\n        }\n        <mm-entity-form\n          #entityForm\n          class=\"mm-entity-page__form\"\n          [model]=\"model\"\n          [mode]=\"mode()\"\n          [state]=\"state()\"\n          [readOnly]=\"readOnly()\"\n          [messages]=\"msgs()\"\n          [records]=\"records()\"\n          [labelResolver]=\"effectiveLabelResolver()\"\n          [initialValues]=\"createInitialValues()\"\n        />\n        @if (effectiveActionBarPosition() === 'bottom') {\n          <footer class=\"mm-entity-page__footer\" data-entity-page-footer>\n            <ng-container *ngTemplateOutlet=\"formActions\" />\n          </footer>\n        }\n\n        <ng-template #formActions>\n          <div class=\"mm-entity-page__actions\">\n            @if (pageActions(); as actions) {\n              <ng-container *ngTemplateOutlet=\"actions.templateRef; context: actionsContext()\" />\n            }\n            @if (!isSingleton()) {\n              <button kendoButton fillMode=\"flat\" [svgIcon]=\"backIcon\" data-entity-page-back (click)=\"onBack()\">\n                {{ mode() === 'view' ? msgs().back : msgs().cancel }}\n              </button>\n            }\n            @if (canDeleteEntity()) {\n              <button kendoButton fillMode=\"outline\" themeColor=\"error\" [svgIcon]=\"deleteIcon\" (click)=\"onDelete()\">\n                {{ msgs().delete }}\n              </button>\n            }\n            @if (mode() !== 'view') {\n              <button kendoButton themeColor=\"primary\" [svgIcon]=\"saveIcon\" [disabled]=\"saving() || !!saveBlockedReason()\"\n                      [attr.title]=\"saveBlockedReason()\" data-entity-page-save (click)=\"onSave()\">\n                {{ msgs().save }}\n              </button>\n            }\n          </div>\n        </ng-template>\n      }\n    }\n  }\n</div>\n", styles: [":host{display:block;height:100%;min-height:0}.mm-entity-page{display:flex;flex-direction:column;gap:12px;height:100%;min-height:0;padding:16px;box-sizing:border-box;color:var(--theme-text-primary, inherit)}.mm-entity-page__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px}.mm-entity-page__titles{display:flex;flex-direction:column;gap:4px;min-width:0}.mm-entity-page__title{margin:0;font-size:1.25rem;font-weight:600;overflow-wrap:anywhere}.mm-entity-page__description,.mm-entity-page__notice{margin:0;color:var(--theme-text-secondary, inherit);opacity:.85}.mm-entity-page__actions,.mm-entity-page__header-actions{display:flex;flex-wrap:wrap;gap:8px}.mm-entity-page__list{flex:1 1 auto;min-height:300px}.mm-entity-page__form{flex:1 1 auto;min-height:0;overflow:auto}.mm-entity-page__state{padding:24px 0;color:var(--theme-text-secondary, inherit)}.mm-entity-page__state--error{color:var(--theme-status-error, inherit)}.mm-entity-page__footer{display:flex;justify-content:flex-end;flex-shrink:0;padding-top:12px;border-top:1px solid var(--theme-border-subtle, rgba(0, 0, 0, .12))}.mm-entity-page__dialog-body{display:flex;flex-direction:column;gap:12px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { formKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "formKey", required: false }] }], ckTypeId: [{ type: i0.Input, args: [{ isSignal: true, alias: "ckTypeId", required: false }] }], rtId: [{ type: i0.Input, args: [{ isSignal: true, alias: "rtId", required: false }] }], canWrite: [{ type: i0.Input, args: [{ isSignal: true, alias: "canWrite", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], routerNavigation: [{ type: i0.Input, args: [{ isSignal: true, alias: "routerNavigation", required: false }] }], actionBarPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionBarPosition", required: false }] }], labelResolver: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelResolver", required: false }] }], defaultSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultSort", required: false }] }], initialValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialValues", required: false }] }], beforeSave: [{ type: i0.Input, args: [{ isSignal: true, alias: "beforeSave", required: false }] }], listToolbarActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "listToolbarActions", required: false }] }], listRowActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "listRowActions", required: false }] }], listRowMenuActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "listRowMenuActions", required: false }] }], editMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "editMode", required: false }] }], listRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "listRowClass", required: false }] }], listBooleanDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "listBooleanDisplay", required: false }] }], listRowLabelField: [{ type: i0.Input, args: [{ isSignal: true, alias: "listRowLabelField", required: false }] }], navigate: [{ type: i0.Output, args: ["navigate"] }], saved: [{ type: i0.Output, args: ["saved"] }], deleted: [{ type: i0.Output, args: ["deleted"] }], form: [{ type: i0.ViewChild, args: ['entityForm', { isSignal: true }] }], list: [{ type: i0.ViewChild, args: ['entityList', { isSignal: true }] }], listElement: [{ type: i0.ViewChild, args: ['entityList', { ...{ read: ElementRef }, isSignal: true }] }], pageActions: [{ type: i0.ContentChild, args: [i0.forwardRef(() => EntityPageActionsDirective), { isSignal: true }] }] } });
 /** The focused element (the dialog's trigger), or `null` outside a browser. */
 function activeElement() {