@masterteam/governance 0.0.10 → 0.0.12

package/fesm2022/masterteam-governance.mjs

@@ -636,6 +636,16 @@ const GOVERNANCE_RULE_RECIPE_DEFINITIONS = [
         ruleTypeKeys: ['PropertyValueEquals', 'FieldValue'],
         labelKey: 'wizard.recipes.property-value.label',
     },
+    {
+        key: 'property-has-value',
+        ruleTypeKeys: ['PropertyHasValue'],
+        labelKey: 'wizard.recipes.property-has-value.label',
+    },
+    {
+        key: 'mandatory-gate-items-completed',
+        ruleTypeKeys: ['PhaseGateMandatoryItemsCompleted'],
+        labelKey: 'wizard.recipes.mandatory-gate-items-completed.label',
+    },
 ];
 const GOVERNANCE_APPLIES_TO_OPTIONS = [
     {
@@ -668,6 +678,14 @@ const GOVERNANCE_ACTION_OPTIONS = [
         value: 'delete',
         labelKey: 'wizard.actions.delete',
     },
+    {
+        value: 'manage-phase-gate',
+        labelKey: 'wizard.actions.manage-phase-gate',
+    },
+    {
+        value: 'move-phase-gate',
+        labelKey: 'wizard.actions.move-phase-gate',
+    },
 ];
 const GOVERNANCE_OPERATOR_OPTIONS = [
     {
@@ -761,7 +779,6 @@ function mapAppliesToToTargetScope(appliesTo) {
         case 'level':
             return 'Level';
         case 'phase-gate':
-            return 'PhaseGate';
         case 'any-module':
         case 'specific-module':
         default:
@@ -771,24 +788,29 @@ function mapAppliesToToTargetScope(appliesTo) {
 function mapActionToOperationKey(actionKey) {
     switch (actionKey) {
         case 'update':
+        case 'manage-phase-gate':
             return 'Update';
         case 'delete':
             return 'Delete';
+        case 'move-phase-gate':
+            return 'MovePhaseGate';
         case 'create':
         default:
             return 'Create';
     }
 }
-function mapOperationKeyToAction(operationKey) {
+function mapOperationKeyToAction(operationKey, isPhaseGateTarget = false) {
     switch (String(operationKey ?? '')
         .trim()
         .toLowerCase()) {
         case 'create':
-            return 'create';
+            return isPhaseGateTarget ? null : 'create';
         case 'update':
-            return 'update';
+            return isPhaseGateTarget ? 'manage-phase-gate' : 'update';
         case 'delete':
-            return 'delete';
+            return isPhaseGateTarget ? null : 'delete';
+        case 'movephasegate':
+            return isPhaseGateTarget ? 'move-phase-gate' : null;
         default:
             return null;
     }
@@ -907,6 +929,14 @@ function buildRecipeConfiguration(formValue) {
                 ? { propertyKey, operator, expectedValue }
                 : undefined;
         }
+        case 'property-has-value': {
+            const propertyKey = toNullableString(formValue.propertyKey);
+            return propertyKey ? { propertyKey } : undefined;
+        }
+        case 'mandatory-gate-items-completed': {
+            const phaseGateSchemaId = toNullableNumber(formValue.phaseGateSchemaId);
+            return phaseGateSchemaId !== null ? { phaseGateSchemaId } : {};
+        }
         default:
             return undefined;
     }
@@ -923,9 +953,11 @@ function buildCreatePayload(formValue, ruleType) {
         errorMessage,
         ruleType: ruleTypeKey,
         targetScope: mapAppliesToToTargetScope(formValue.appliesTo),
-        targetModuleKey: formValue.appliesTo === 'specific-module'
-            ? (toNullableString(formValue.selectedModuleKey) ?? undefined)
-            : undefined,
+        targetModuleKey: formValue.appliesTo === 'phase-gate'
+            ? 'PhaseGate'
+            : formValue.appliesTo === 'specific-module'
+                ? (toNullableString(formValue.selectedModuleKey) ?? undefined)
+                : undefined,
         targetOperationKey: formValue.actionKey !== null
             ? mapActionToOperationKey(formValue.actionKey)
             : undefined,
@@ -946,7 +978,7 @@ function mapRuleToWizardFormValue(rule) {
         return null;
     }
     const appliesTo = resolveAppliesTo(rule, recipeKey);
-    const actionKey = mapOperationKeyToAction(rule.targetOperationKey);
+    const actionKey = mapOperationKeyToAction(rule.targetOperationKey, isPhaseGateTarget(rule));
     if (!actionKey) {
         return null;
     }
@@ -1006,21 +1038,41 @@ function mapRuleToWizardFormValue(rule) {
         formValue.blockedModuleKey = null;
         formValue.countedModuleKey = null;
     }
+    if (recipeKey === 'property-has-value') {
+        formValue.requiredModuleKey = null;
+        formValue.blockedModuleKey = null;
+        formValue.countedModuleKey = null;
+        formValue.expectedValue = '';
+    }
+    if (recipeKey === 'mandatory-gate-items-completed') {
+        formValue.requiredModuleKey = null;
+        formValue.blockedModuleKey = null;
+        formValue.countedModuleKey = null;
+        formValue.propertyKey = null;
+        formValue.expectedValue = '';
+    }
     return formValue;
 }
-function resolveAppliesTo(rule, recipeKey) {
+function isPhaseGateTarget(rule) {
+    const scope = String(rule.targetScope ?? '')
+        .trim()
+        .toLowerCase();
+    const targetModuleKey = String(rule.targetModuleKey ?? '')
+        .trim()
+        .toLowerCase();
+    return scope === 'phasegate' || targetModuleKey === 'phasegate';
+}
+function resolveAppliesTo(rule, _recipeKey) {
     const scope = String(rule.targetScope ?? '').trim();
-    const targetModuleKey = String(rule.targetModuleKey ?? '').trim();
     if (scope === 'Level') {
         return 'level';
     }
-    if (scope === 'PhaseGate' ||
-        ((recipeKey === 'phase-gate-completed' ||
-            recipeKey === 'phase-gate-module-required') &&
-            targetModuleKey.toLowerCase() === 'phasegate')) {
+    if (isPhaseGateTarget(rule)) {
         return 'phase-gate';
     }
-    return targetModuleKey ? 'specific-module' : 'any-module';
+    return String(rule.targetModuleKey ?? '').trim()
+        ? 'specific-module'
+        : 'any-module';
 }
 function mapRuleToLegacyFormValue(rule) {
     const formData = {
@@ -1376,6 +1428,11 @@ function buildWizardFormConfig({ translate, isEdit, recipeKey, appliesToOptions,
                                 value: 'phase-gate-module-required',
                                 action: 'show',
                             },
+                            {
+                                key: 'recipeKey',
+                                value: 'mandatory-gate-items-completed',
+                                action: 'show',
+                            },
                         ],
                     }),
                     new SelectFieldConfig({
@@ -1430,6 +1487,11 @@ function buildWizardFormConfig({ translate, isEdit, recipeKey, appliesToOptions,
                                 value: 'property-value',
                                 action: 'show',
                             },
+                            {
+                                key: 'recipeKey',
+                                value: 'property-has-value',
+                                action: 'show',
+                            },
                         ],
                     }),
                     new SelectFieldConfig({
@@ -1844,6 +1906,20 @@ function resolveRecipeSummary({ value, moduleOptions, requestSchemaOptions, prop
                 expectedValue: value.expectedValue || '',
             }).trim();
         }
+        case 'property-has-value': {
+            const propertyLabel = findOptionLabel(propertyOptions, value.propertyKey) ??
+                value.propertyKey ??
+                translate('wizard.summary.fallbacks.property');
+            return translate('wizard.summary.property-has-value', {
+                property: propertyLabel,
+            });
+        }
+        case 'mandatory-gate-items-completed': {
+            const phaseGateLabel = findOptionLabel(phaseGateOptions, value.phaseGateSchemaId);
+            return translate('wizard.summary.mandatory-gate-items-completed', {
+                phaseGate: phaseGateLabel ?? translate('wizard.summary.fallbacks.phase-gate'),
+            });
+        }
         default:
             return translate('wizard.summary-empty');
     }
@@ -1873,7 +1949,8 @@ function mapWizardFormValueToState(value) {
         phaseGateCompletedSchemaId: value.recipeKey === 'phase-gate-completed'
             ? value.phaseGateSchemaId
             : null,
-        phaseGateOptionalSchemaId: value.recipeKey === 'phase-gate-module-required'
+        phaseGateOptionalSchemaId: value.recipeKey === 'phase-gate-module-required' ||
+            value.recipeKey === 'mandatory-gate-items-completed'
             ? value.phaseGateSchemaId
             : null,
     };
@@ -1975,6 +2052,10 @@ function resolveRecipeDefinitionKeyForRuleType(ruleType) {
         case 'PropertyValueEquals':
         case 'FieldValue':
             return 'property-value';
+        case 'PropertyHasValue':
+            return 'property-has-value';
+        case 'PhaseGateMandatoryItemsCompleted':
+            return 'mandatory-gate-items-completed';
         default:
             return null;
     }
@@ -2134,7 +2215,12 @@ class GovernanceRuleForm {
         name: this.translate(option.labelKey),
     })), ...(ngDevMode ? [{ debugName: "appliesToCardOptions" }] : []));
     availableActionOptions = computed(() => {
-        return GOVERNANCE_ACTION_OPTIONS.filter((option) => hasCompatibleRecipe(this.ruleTypes(), this.wizardValue().appliesTo, option.value));
+        const appliesTo = this.wizardValue().appliesTo;
+        const allowedActions = appliesTo === 'phase-gate'
+            ? ['manage-phase-gate', 'move-phase-gate']
+            : ['create', 'update', 'delete'];
+        return GOVERNANCE_ACTION_OPTIONS.filter((option) => allowedActions.includes(option.value) &&
+            hasCompatibleRecipe(this.ruleTypes(), appliesTo, option.value));
     }, ...(ngDevMode ? [{ debugName: "availableActionOptions" }] : []));
     actionCardOptions = computed(() => this.availableActionOptions().map((option) => ({
         id: option.value,
@@ -2248,6 +2334,10 @@ class GovernanceRuleForm {
                 { label: this.translateOperationLabel('Create'), value: 'Create' },
                 { label: this.translateOperationLabel('Update'), value: 'Update' },
                 { label: this.translateOperationLabel('Delete'), value: 'Delete' },
+                {
+                    label: this.translateOperationLabel('MovePhaseGate'),
+                    value: 'MovePhaseGate',
+                },
             ];
         }
         return [
@@ -2323,16 +2413,14 @@ class GovernanceRuleForm {
         effect(() => {
             const recipeKey = this.wizardValue().recipeKey;
             const appliesTo = this.wizardValue().appliesTo;
-            const targetModuleKey = appliesTo === 'specific-module'
-                ? (this.wizardValue().selectedModuleKey ?? undefined)
-                : undefined;
-            const targetScope = appliesTo === 'level'
-                ? 'Level'
-                : appliesTo === 'phase-gate'
-                    ? 'PhaseGate'
-                    : 'Module';
+            const targetModuleKey = appliesTo === 'phase-gate'
+                ? 'PhaseGate'
+                : appliesTo === 'specific-module'
+                    ? (this.wizardValue().selectedModuleKey ?? undefined)
+                    : undefined;
+            const targetScope = mapAppliesToToTargetScope(appliesTo);
             const needsRequestSchemas = recipeKey === 'no-active-request';
-            const needsProperties = recipeKey === 'property-value';
+            const needsProperties = recipeKey === 'property-value' || recipeKey === 'property-has-value';
             if (!needsRequestSchemas && !needsProperties) {
                 this.clearReferenceData();
                 return;
@@ -2428,6 +2516,8 @@ class GovernanceRuleForm {
                 return this.translate('update');
             case 'Delete':
                 return this.translate('delete');
+            case 'MovePhaseGate':
+                return this.translate('wizard.actions.move-phase-gate');
             default:
                 return operation;
         }
@@ -2499,7 +2589,7 @@ class GovernanceRuleForm {
         }));
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: GovernanceRuleForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: GovernanceRuleForm, isStandalone: true, selector: "mt-governance-rule-form", inputs: { ruleForEdit: { classPropertyName: "ruleForEdit", publicName: "ruleForEdit", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block h-full" }, viewQueries: [{ propertyName: "dynamicFormRef", first: true, predicate: DynamicForm, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\n  <div\n    [class]=\"\n      'governance-rule-form-content flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto p-4 sm:p-5 ' +\n      modal.contentClass\n    \"\n  >\n    @if (isInitializing()) {\n      <div class=\"space-y-4\">\n        <p-skeleton height=\"4rem\" />\n        <p-skeleton height=\"12rem\" />\n        <p-skeleton height=\"12rem\" />\n      </div>\n    } @else if (useLegacyEditor()) {\n      <section class=\"rounded-2xl border border-amber-200 bg-amber-50/70 p-4\">\n        <p class=\"m-0 text-sm font-semibold text-slate-900\">\n          {{ t(\"wizard.legacy-title\") }}\n        </p>\n        <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\n          {{ t(\"wizard.legacy-description\") }}\n        </p>\n      </section>\n\n      <mt-dynamic-form\n        [formConfig]=\"legacyFormConfig()\"\n        [formControl]=\"legacyFormControl\"\n      />\n    } @else {\n      @if (noRecipesAvailable()) {\n        <section\n          class=\"rounded-2xl border border-orange-200 bg-orange-50/80 p-4\"\n        >\n          <p class=\"m-0 text-sm font-semibold text-slate-900\">\n            {{ t(\"wizard.no-recipes-title\") }}\n          </p>\n          <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\n            {{ t(\"wizard.no-recipes-description\") }}\n          </p>\n        </section>\n      }\n\n      <mt-dynamic-form\n        [formConfig]=\"wizardFormConfig()\"\n        [formControl]=\"wizardFormControl\"\n      />\n\n      @if (hasReviewSummary()) {\n        <section class=\"flex flex-col gap-2\">\n          <p\n            class=\"m-0 text-xs font-semibold uppercase tracking-[0.18em] text-slate-500\"\n          >\n            {{ t(\"wizard.summary-title\") }}\n          </p>\n          <p-message\n            severity=\"warn\"\n            styleClass=\"w-full\"\n            [text]=\"reviewSummary()\"\n          />\n        </section>\n      }\n    }\n  </div>\n\r\n  <div\r\n    [class]=\"\r\n      'governance-rule-form-footer ' +\r\n      modal.footerClass +\r\n      ' flex-col gap-2 sm:flex-row sm:items-center sm:justify-end'\r\n    \"\r\n  >\r\n    <mt-button\r\n      severity=\"secondary\"\r\n      [label]=\"'cancel' | transloco\"\r\n      (click)=\"ref.close()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n\r\n    <mt-button\r\n      [label]=\"ruleForEdit() ? t('update') : t('create')\"\r\n      [loading]=\"isAddingRule() || isUpdatingRule()\"\r\n      [disabled]=\"isAddingRule() || isUpdatingRule()\"\r\n      (click)=\"onSubmit()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n  </div>\r\n</ng-container>\r\n", styles: [":host{display:block;min-height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig", "forcedHiddenFieldKeys", "preserveForcedHiddenValues", "visibleSectionKeys"], outputs: ["runtimeMessagesChange"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant", "motionOptions"], outputs: ["onClose"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: GovernanceRuleForm, isStandalone: true, selector: "mt-governance-rule-form", inputs: { ruleForEdit: { classPropertyName: "ruleForEdit", publicName: "ruleForEdit", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "block h-full" }, viewQueries: [{ propertyName: "dynamicFormRef", first: true, predicate: DynamicForm, descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\r\n  <div\r\n    [class]=\"\r\n      'governance-rule-form-content flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto p-4 sm:p-5 ' +\r\n      modal.contentClass\r\n    \"\r\n  >\r\n    @if (isInitializing()) {\r\n      <div class=\"space-y-4\">\r\n        <p-skeleton height=\"4rem\" />\r\n        <p-skeleton height=\"12rem\" />\r\n        <p-skeleton height=\"12rem\" />\r\n      </div>\r\n    } @else if (useLegacyEditor()) {\r\n      <section class=\"rounded-2xl border border-amber-200 bg-amber-50/70 p-4\">\r\n        <p class=\"m-0 text-sm font-semibold text-slate-900\">\r\n          {{ t(\"wizard.legacy-title\") }}\r\n        </p>\r\n        <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\r\n          {{ t(\"wizard.legacy-description\") }}\r\n        </p>\r\n      </section>\r\n\r\n      <mt-dynamic-form\r\n        [formConfig]=\"legacyFormConfig()\"\r\n        [formControl]=\"legacyFormControl\"\r\n      />\r\n    } @else {\r\n      @if (noRecipesAvailable()) {\r\n        <section\r\n          class=\"rounded-2xl border border-orange-200 bg-orange-50/80 p-4\"\r\n        >\r\n          <p class=\"m-0 text-sm font-semibold text-slate-900\">\r\n            {{ t(\"wizard.no-recipes-title\") }}\r\n          </p>\r\n          <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\r\n            {{ t(\"wizard.no-recipes-description\") }}\r\n          </p>\r\n        </section>\r\n      }\r\n\r\n      <mt-dynamic-form\r\n        [formConfig]=\"wizardFormConfig()\"\r\n        [formControl]=\"wizardFormControl\"\r\n      />\r\n\r\n      @if (hasReviewSummary()) {\r\n        <section class=\"flex flex-col gap-2\">\r\n          <p\r\n            class=\"m-0 text-xs font-semibold uppercase tracking-[0.18em] text-slate-500\"\r\n          >\r\n            {{ t(\"wizard.summary-title\") }}\r\n          </p>\r\n          <p-message\r\n            severity=\"warn\"\r\n            styleClass=\"w-full\"\r\n            [text]=\"reviewSummary()\"\r\n          />\r\n        </section>\r\n      }\r\n    }\r\n  </div>\r\n\r\n  <div\r\n    [class]=\"\r\n      'governance-rule-form-footer ' +\r\n      modal.footerClass +\r\n      ' flex-col gap-2 sm:flex-row sm:items-center sm:justify-end'\r\n    \"\r\n  >\r\n    <mt-button\r\n      severity=\"secondary\"\r\n      [label]=\"'cancel' | transloco\"\r\n      (click)=\"ref.close()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n\r\n    <mt-button\r\n      [label]=\"ruleForEdit() ? t('update') : t('create')\"\r\n      [loading]=\"isAddingRule() || isUpdatingRule()\"\r\n      [disabled]=\"isAddingRule() || isUpdatingRule()\"\r\n      (click)=\"onSubmit()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n  </div>\r\n</ng-container>\r\n", styles: [":host{display:block;min-height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: Button, selector: "mt-button", inputs: ["icon", "label", "tooltip", "class", "type", "styleClass", "severity", "badge", "variant", "badgeSeverity", "size", "iconPos", "autofocus", "fluid", "raised", "rounded", "text", "plain", "outlined", "link", "disabled", "loading", "pInputs"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DynamicForm, selector: "mt-dynamic-form", inputs: ["formConfig", "forcedHiddenFieldKeys", "preserveForcedHiddenValues", "visibleSectionKeys"], outputs: ["runtimeMessagesChange"] }, { kind: "component", type: Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant", "motionOptions"], outputs: ["onClose"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: GovernanceRuleForm, decorators: [{
             type: Component,
@@ -2514,7 +2604,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
                         TranslocoPipe,
                     ], host: {
                         class: 'block h-full',
-                    }, template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\n  <div\n    [class]=\"\n      'governance-rule-form-content flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto p-4 sm:p-5 ' +\n      modal.contentClass\n    \"\n  >\n    @if (isInitializing()) {\n      <div class=\"space-y-4\">\n        <p-skeleton height=\"4rem\" />\n        <p-skeleton height=\"12rem\" />\n        <p-skeleton height=\"12rem\" />\n      </div>\n    } @else if (useLegacyEditor()) {\n      <section class=\"rounded-2xl border border-amber-200 bg-amber-50/70 p-4\">\n        <p class=\"m-0 text-sm font-semibold text-slate-900\">\n          {{ t(\"wizard.legacy-title\") }}\n        </p>\n        <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\n          {{ t(\"wizard.legacy-description\") }}\n        </p>\n      </section>\n\n      <mt-dynamic-form\n        [formConfig]=\"legacyFormConfig()\"\n        [formControl]=\"legacyFormControl\"\n      />\n    } @else {\n      @if (noRecipesAvailable()) {\n        <section\n          class=\"rounded-2xl border border-orange-200 bg-orange-50/80 p-4\"\n        >\n          <p class=\"m-0 text-sm font-semibold text-slate-900\">\n            {{ t(\"wizard.no-recipes-title\") }}\n          </p>\n          <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\n            {{ t(\"wizard.no-recipes-description\") }}\n          </p>\n        </section>\n      }\n\n      <mt-dynamic-form\n        [formConfig]=\"wizardFormConfig()\"\n        [formControl]=\"wizardFormControl\"\n      />\n\n      @if (hasReviewSummary()) {\n        <section class=\"flex flex-col gap-2\">\n          <p\n            class=\"m-0 text-xs font-semibold uppercase tracking-[0.18em] text-slate-500\"\n          >\n            {{ t(\"wizard.summary-title\") }}\n          </p>\n          <p-message\n            severity=\"warn\"\n            styleClass=\"w-full\"\n            [text]=\"reviewSummary()\"\n          />\n        </section>\n      }\n    }\n  </div>\n\r\n  <div\r\n    [class]=\"\r\n      'governance-rule-form-footer ' +\r\n      modal.footerClass +\r\n      ' flex-col gap-2 sm:flex-row sm:items-center sm:justify-end'\r\n    \"\r\n  >\r\n    <mt-button\r\n      severity=\"secondary\"\r\n      [label]=\"'cancel' | transloco\"\r\n      (click)=\"ref.close()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n\r\n    <mt-button\r\n      [label]=\"ruleForEdit() ? t('update') : t('create')\"\r\n      [loading]=\"isAddingRule() || isUpdatingRule()\"\r\n      [disabled]=\"isAddingRule() || isUpdatingRule()\"\r\n      (click)=\"onSubmit()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n  </div>\r\n</ng-container>\r\n", styles: [":host{display:block;min-height:100%}\n"] }]
+                    }, template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\r\n  <div\r\n    [class]=\"\r\n      'governance-rule-form-content flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto p-4 sm:p-5 ' +\r\n      modal.contentClass\r\n    \"\r\n  >\r\n    @if (isInitializing()) {\r\n      <div class=\"space-y-4\">\r\n        <p-skeleton height=\"4rem\" />\r\n        <p-skeleton height=\"12rem\" />\r\n        <p-skeleton height=\"12rem\" />\r\n      </div>\r\n    } @else if (useLegacyEditor()) {\r\n      <section class=\"rounded-2xl border border-amber-200 bg-amber-50/70 p-4\">\r\n        <p class=\"m-0 text-sm font-semibold text-slate-900\">\r\n          {{ t(\"wizard.legacy-title\") }}\r\n        </p>\r\n        <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\r\n          {{ t(\"wizard.legacy-description\") }}\r\n        </p>\r\n      </section>\r\n\r\n      <mt-dynamic-form\r\n        [formConfig]=\"legacyFormConfig()\"\r\n        [formControl]=\"legacyFormControl\"\r\n      />\r\n    } @else {\r\n      @if (noRecipesAvailable()) {\r\n        <section\r\n          class=\"rounded-2xl border border-orange-200 bg-orange-50/80 p-4\"\r\n        >\r\n          <p class=\"m-0 text-sm font-semibold text-slate-900\">\r\n            {{ t(\"wizard.no-recipes-title\") }}\r\n          </p>\r\n          <p class=\"mt-1 mb-0 text-sm leading-6 text-slate-600\">\r\n            {{ t(\"wizard.no-recipes-description\") }}\r\n          </p>\r\n        </section>\r\n      }\r\n\r\n      <mt-dynamic-form\r\n        [formConfig]=\"wizardFormConfig()\"\r\n        [formControl]=\"wizardFormControl\"\r\n      />\r\n\r\n      @if (hasReviewSummary()) {\r\n        <section class=\"flex flex-col gap-2\">\r\n          <p\r\n            class=\"m-0 text-xs font-semibold uppercase tracking-[0.18em] text-slate-500\"\r\n          >\r\n            {{ t(\"wizard.summary-title\") }}\r\n          </p>\r\n          <p-message\r\n            severity=\"warn\"\r\n            styleClass=\"w-full\"\r\n            [text]=\"reviewSummary()\"\r\n          />\r\n        </section>\r\n      }\r\n    }\r\n  </div>\r\n\r\n  <div\r\n    [class]=\"\r\n      'governance-rule-form-footer ' +\r\n      modal.footerClass +\r\n      ' flex-col gap-2 sm:flex-row sm:items-center sm:justify-end'\r\n    \"\r\n  >\r\n    <mt-button\r\n      severity=\"secondary\"\r\n      [label]=\"'cancel' | transloco\"\r\n      (click)=\"ref.close()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n\r\n    <mt-button\r\n      [label]=\"ruleForEdit() ? t('update') : t('create')\"\r\n      [loading]=\"isAddingRule() || isUpdatingRule()\"\r\n      [disabled]=\"isAddingRule() || isUpdatingRule()\"\r\n      (click)=\"onSubmit()\"\r\n      styleClass=\"w-full sm:w-auto\"\r\n    />\r\n  </div>\r\n</ng-container>\r\n", styles: [":host{display:block;min-height:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { ruleForEdit: [{ type: i0.Input, args: [{ isSignal: true, alias: "ruleForEdit", required: false }] }], dynamicFormRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => DynamicForm), { isSignal: true }] }] } });
 
 class GovernanceRulesList {
@@ -2523,6 +2613,7 @@ class GovernanceRulesList {
     // ============================================================================
     typeCol = viewChild.required('typeCol');
     scopeCol = viewChild.required('scopeCol');
+    whenCol = viewChild.required('whenCol');
     priorityCol = viewChild.required('priorityCol');
     // ============================================================================
     // Services
@@ -2530,6 +2621,7 @@ class GovernanceRulesList {
     facade = inject(GovernanceFacade);
     modal = inject(ModalService);
     translocoService = inject(TranslocoService);
+    ruleTypes = this.facade.ruleTypes;
     // ============================================================================
     // Breadcrumb
     // ============================================================================
@@ -2565,6 +2657,25 @@ class GovernanceRulesList {
                 return all;
         }
     }, ...(ngDevMode ? [{ debugName: "rules" }] : []));
+    ruleTypeOptions = computed(() => {
+        const ruleTypes = this.ruleTypes();
+        if (ruleTypes.length > 0) {
+            return ruleTypes
+                .map((ruleType) => this.readRuleTypeKey(ruleType))
+                .filter((key, index, items) => !!key && items.indexOf(key) === index)
+                .map((key) => ({
+                label: this.getRuleTypeLabel(key),
+                value: key,
+            }));
+        }
+        return this.rules()
+            .map((rule) => rule.ruleTypeKey)
+            .filter((key, index, items) => !!key && items.indexOf(key) === index)
+            .map((key) => ({
+            label: this.getRuleTypeLabel(key),
+            value: key,
+        }));
+    }, ...(ngDevMode ? [{ debugName: "ruleTypeOptions" }] : []));
     // ============================================================================
     // Tabs
     // ============================================================================
@@ -2653,37 +2764,20 @@ class GovernanceRulesList {
             filterConfig: {
                 type: 'select',
                 label: this.translocoService.translate('governance.rule-type'),
-                options: this.getRuleTypeOptions(),
+                options: this.ruleTypeOptions(),
             },
         },
         {
             key: 'targetScope',
-            label: this.translocoService.translate('governance.scope'),
+            label: this.translocoService.translate('governance.applies-to'),
             type: 'custom',
             customCellTpl: this.scopeCol(),
-            filterConfig: {
-                type: 'select',
-                label: this.translocoService.translate('governance.scope'),
-                options: [
-                    {
-                        label: this.translocoService.translate('governance.scope-level'),
-                        value: 'Level',
-                    },
-                    {
-                        label: this.translocoService.translate('governance.scope-module'),
-                        value: 'Module',
-                    },
-                    {
-                        label: this.translocoService.translate('governance.scope-phase-gate'),
-                        value: 'PhaseGate',
-                    },
-                ],
-            },
         },
         {
-            key: 'targetModuleKey',
-            label: this.translocoService.translate('governance.target-module'),
-            type: 'text',
+            key: 'targetOperationKey',
+            label: this.translocoService.translate('governance.when'),
+            type: 'custom',
+            customCellTpl: this.whenCol(),
         },
         {
             key: 'isActive',
@@ -2712,6 +2806,11 @@ class GovernanceRulesList {
     allRules = this.facade.rules;
     activeRules = this.facade.activeRules;
     inactiveRules = this.facade.inactiveRules;
+    ngOnInit() {
+        if (!this.ruleTypes().length) {
+            this.facade.getRuleTypes();
+        }
+    }
     ngOnDestroy() {
         this.facade.resetState();
     }
@@ -2736,65 +2835,82 @@ class GovernanceRulesList {
             this.facade.toggleRuleActive(event.row.id);
         }
     }
-    getRuleTypeOptions() {
-        return [
-            {
-                label: this.translocoService.translate('governance.rule-types.ModuleExists'),
-                value: 'ModuleExists',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.ModuleDoesNotExist'),
-                value: 'ModuleDoesNotExist',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.ModuleMaxCount'),
-                value: 'ModuleMaxCount',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.ModuleMinCount'),
-                value: 'ModuleMinCount',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.FieldRequired'),
-                value: 'FieldRequired',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.FieldValue'),
-                value: 'FieldValue',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.PhaseGateModuleRequired'),
-                value: 'PhaseGateModuleRequired',
-            },
-            {
-                label: this.translocoService.translate('governance.rule-types.NoActiveRequest'),
-                value: 'NoActiveRequest',
-            },
-        ];
+    getRuleTypeLabel(ruleTypeKey) {
+        return this.translocoService.translate(`governance.rule-types.${ruleTypeKey}`);
     }
     getRuleTypeChipClass(ruleTypeKey) {
         const classes = {
             ModuleExists: 'bg-blue-100 text-blue-700',
+            ModuleNotExists: 'bg-red-100 text-red-700',
             ModuleDoesNotExist: 'bg-red-100 text-red-700',
             ModuleMaxCount: 'bg-amber-100 text-amber-700',
             ModuleMinCount: 'bg-orange-100 text-orange-700',
             FieldRequired: 'bg-purple-100 text-purple-700',
             FieldValue: 'bg-indigo-100 text-indigo-700',
+            PropertyValueEquals: 'bg-indigo-100 text-indigo-700',
+            PropertyHasValue: 'bg-cyan-100 text-cyan-700',
+            PhaseGateCompleted: 'bg-emerald-100 text-emerald-700',
             PhaseGateModuleRequired: 'bg-green-100 text-green-700',
+            PhaseGateMandatoryItemsCompleted: 'bg-teal-100 text-teal-700',
             NoActiveRequest: 'bg-rose-100 text-rose-700',
         };
         return classes[ruleTypeKey] ?? 'bg-slate-100 text-slate-700';
     }
-    getScopeIcon(scope) {
-        const icons = {
-            Level: 'general.layers-three-01',
-            Module: 'general.cube-01',
-            PhaseGate: 'general.flag-01',
-        };
-        return icons[scope] ?? 'general.file-02';
+    getAppliesToLabel(rule) {
+        if (this.isPhaseGateRule(rule)) {
+            return this.translocoService.translate('governance.wizard.applies-to.phase-gate.label');
+        }
+        if (rule.targetScope === 'Level') {
+            return this.translocoService.translate('governance.wizard.applies-to.level.label');
+        }
+        if (rule.targetModuleKey) {
+            return this.translocoService.translate('governance.wizard.applies-to.specific-module.label');
+        }
+        return this.translocoService.translate('governance.wizard.applies-to.any-module.label');
+    }
+    getAppliesToIcon(rule) {
+        if (this.isPhaseGateRule(rule)) {
+            return 'general.flag-01';
+        }
+        if (rule.targetScope === 'Level') {
+            return 'general.layers-three-01';
+        }
+        return 'general.cube-01';
+    }
+    getWhenLabel(rule) {
+        if (this.isPhaseGateRule(rule)) {
+            switch (rule.targetOperationKey) {
+                case 'Update':
+                    return this.translocoService.translate('governance.wizard.actions.manage-phase-gate');
+                case 'MovePhaseGate':
+                    return this.translocoService.translate('governance.wizard.actions.move-phase-gate');
+                default:
+                    break;
+            }
+        }
+        switch (rule.targetOperationKey) {
+            case 'Create':
+                return this.translocoService.translate('governance.create');
+            case 'Update':
+                return this.translocoService.translate('governance.update');
+            case 'Delete':
+                return this.translocoService.translate('governance.delete');
+            case 'MovePhaseGate':
+                return this.translocoService.translate('governance.wizard.actions.move-phase-gate');
+            default:
+                return (rule.targetOperationKey ||
+                    this.translocoService.translate('governance.all'));
+        }
+    }
+    isPhaseGateRule(rule) {
+        return (rule.targetScope === 'PhaseGate' ||
+            String(rule.targetModuleKey ?? '').toLowerCase() === 'phasegate');
+    }
+    readRuleTypeKey(ruleType) {
+        return String(ruleType.key ?? ruleType.type ?? '').trim();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: GovernanceRulesList, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: GovernanceRulesList, isStandalone: true, selector: "mt-governance-rules-list", viewQueries: [{ propertyName: "typeCol", first: true, predicate: ["typeCol"], descendants: true, isSignal: true }, { propertyName: "scopeCol", first: true, predicate: ["scopeCol"], descendants: true, isSignal: true }, { propertyName: "priorityCol", first: true, predicate: ["priorityCol"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\r\n  <div class=\"space-y-4\">\r\n    <!-- Rule Type Column Template -->\r\n    <ng-template #typeCol let-row>\r\n      <mt-chip\r\n        [label]=\"row.ruleTypeKey\"\r\n        [styleClass]=\"getRuleTypeChipClass(row.ruleTypeKey)\"\r\n      />\r\n    </ng-template>\r\n\r\n    <!-- Scope Column Template -->\r\n    <ng-template #scopeCol let-row>\r\n      <div class=\"flex items-center gap-2\">\r\n        <mt-icon\r\n          class=\"text-lg\"\r\n          [icon]=\"getScopeIcon(row.targetScope)\"\r\n        ></mt-icon>\r\n        <span>{{ row.targetScope }}</span>\r\n        @if (row.targetModuleKey) {\r\n          <span class=\"text-slate-500\">\u2192 {{ row.targetModuleKey }}</span>\r\n        }\r\n      </div>\r\n    </ng-template>\r\n\r\n    <!-- Priority Column Template -->\r\n    <ng-template #priorityCol let-row>\r\n      <div\r\n        class=\"flex items-center justify-center w-8 h-8 rounded-full bg-slate-100 text-slate-700 font-semibold text-sm\"\r\n      >\r\n        {{ row.priority }}\r\n      </div>\r\n    </ng-template>\r\n\r\n    <!-- Table -->\r\n    <mt-table\r\n      [tabs]=\"tabs()\"\r\n      [(activeTab)]=\"activeTab\"\r\n      [data]=\"rules()\"\r\n      [columns]=\"tableColumns()\"\r\n      [actions]=\"tableActions()\"\r\n      [rowActions]=\"rowActions()\"\r\n      [generalSearch]=\"true\"\r\n      [showFilters]=\"true\"\r\n      [loading]=\"loading()\"\r\n      (cellChange)=\"onCellChange($event)\"\r\n    >\r\n    </mt-table>\r\n  </div>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["filters", "data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "clickableRows", "generalSearch", "lazyLocalSearch", "showFilters", "loading", "updating", "lazy", "lazyLocalSort", "lazyTotalRecords", "reorderableColumns", "reorderableRows", "dataKey", "exportable", "exportFilename", "actionShape", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "pageSize", "currentPage", "first", "filterTerm"], outputs: ["selectionChange", "cellChange", "lazyLoad", "columnReorder", "rowReorder", "rowClick", "filtersChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "component", type: Chip, selector: "mt-chip", inputs: ["label", "icon", "image", "removable", "removeIcon", "styleClass"], outputs: ["onRemove", "onImageError"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.3", type: GovernanceRulesList, isStandalone: true, selector: "mt-governance-rules-list", viewQueries: [{ propertyName: "typeCol", first: true, predicate: ["typeCol"], descendants: true, isSignal: true }, { propertyName: "scopeCol", first: true, predicate: ["scopeCol"], descendants: true, isSignal: true }, { propertyName: "whenCol", first: true, predicate: ["whenCol"], descendants: true, isSignal: true }, { propertyName: "priorityCol", first: true, predicate: ["priorityCol"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\n  <div class=\"space-y-4\">\n    <ng-template #typeCol let-row>\n      <mt-chip\n        [label]=\"getRuleTypeLabel(row.ruleTypeKey)\"\n        [styleClass]=\"getRuleTypeChipClass(row.ruleTypeKey)\"\n      />\n    </ng-template>\n\n    <ng-template #scopeCol let-row>\n      <div class=\"flex items-center gap-2\">\n        <mt-icon class=\"text-lg\" [icon]=\"getAppliesToIcon(row)\"></mt-icon>\n        <span>{{ getAppliesToLabel(row) }}</span>\n        @if (\n          row.targetModuleKey &&\n          getAppliesToLabel(row) !== t(\"wizard.applies-to.phase-gate.label\")\n        ) {\n          <span class=\"text-slate-500\">&rarr; {{ row.targetModuleKey }}</span>\n        }\n      </div>\n    </ng-template>\n\n    <ng-template #whenCol let-row>\n      <span>{{ getWhenLabel(row) }}</span>\n    </ng-template>\n\n    <ng-template #priorityCol let-row>\n      <div\n        class=\"flex items-center justify-center w-8 h-8 rounded-full bg-slate-100 text-slate-700 font-semibold text-sm\"\n      >\n        {{ row.priority }}\n      </div>\n    </ng-template>\n\n    <mt-table\n      [tabs]=\"tabs()\"\n      [(activeTab)]=\"activeTab\"\n      [data]=\"rules()\"\n      [columns]=\"tableColumns()\"\n      [actions]=\"tableActions()\"\n      [rowActions]=\"rowActions()\"\n      [generalSearch]=\"true\"\n      [showFilters]=\"true\"\n      [loading]=\"loading()\"\n      (cellChange)=\"onCellChange($event)\"\n    >\n    </mt-table>\n  </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: Table, selector: "mt-table", inputs: ["filters", "data", "columns", "rowActions", "size", "showGridlines", "stripedRows", "selectableRows", "clickableRows", "generalSearch", "lazyLocalSearch", "showFilters", "loading", "updating", "lazy", "lazyLocalSort", "lazyTotalRecords", "reorderableColumns", "reorderableRows", "dataKey", "exportable", "exportFilename", "actionShape", "tabs", "tabsOptionLabel", "tabsOptionValue", "activeTab", "actions", "paginatorPosition", "pageSize", "currentPage", "first", "filterTerm"], outputs: ["selectionChange", "cellChange", "lazyLoad", "columnReorder", "rowReorder", "rowClick", "filtersChange", "activeTabChange", "onTabChange", "pageSizeChange", "currentPageChange", "firstChange", "filterTermChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: Icon, selector: "mt-icon", inputs: ["icon"] }, { kind: "component", type: Chip, selector: "mt-chip", inputs: ["label", "icon", "image", "removable", "removeIcon", "styleClass"], outputs: ["onRemove", "onImageError"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImport: i0, type: GovernanceRulesList, decorators: [{
             type: Component,
@@ -2805,8 +2921,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.3", ngImpor
                         TranslocoDirective,
                         Icon,
                         Chip,
-                    ], template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\r\n  <div class=\"space-y-4\">\r\n    <!-- Rule Type Column Template -->\r\n    <ng-template #typeCol let-row>\r\n      <mt-chip\r\n        [label]=\"row.ruleTypeKey\"\r\n        [styleClass]=\"getRuleTypeChipClass(row.ruleTypeKey)\"\r\n      />\r\n    </ng-template>\r\n\r\n    <!-- Scope Column Template -->\r\n    <ng-template #scopeCol let-row>\r\n      <div class=\"flex items-center gap-2\">\r\n        <mt-icon\r\n          class=\"text-lg\"\r\n          [icon]=\"getScopeIcon(row.targetScope)\"\r\n        ></mt-icon>\r\n        <span>{{ row.targetScope }}</span>\r\n        @if (row.targetModuleKey) {\r\n          <span class=\"text-slate-500\">\u2192 {{ row.targetModuleKey }}</span>\r\n        }\r\n      </div>\r\n    </ng-template>\r\n\r\n    <!-- Priority Column Template -->\r\n    <ng-template #priorityCol let-row>\r\n      <div\r\n        class=\"flex items-center justify-center w-8 h-8 rounded-full bg-slate-100 text-slate-700 font-semibold text-sm\"\r\n      >\r\n        {{ row.priority }}\r\n      </div>\r\n    </ng-template>\r\n\r\n    <!-- Table -->\r\n    <mt-table\r\n      [tabs]=\"tabs()\"\r\n      [(activeTab)]=\"activeTab\"\r\n      [data]=\"rules()\"\r\n      [columns]=\"tableColumns()\"\r\n      [actions]=\"tableActions()\"\r\n      [rowActions]=\"rowActions()\"\r\n      [generalSearch]=\"true\"\r\n      [showFilters]=\"true\"\r\n      [loading]=\"loading()\"\r\n      (cellChange)=\"onCellChange($event)\"\r\n    >\r\n    </mt-table>\r\n  </div>\r\n</ng-container>\r\n" }]
-        }], propDecorators: { typeCol: [{ type: i0.ViewChild, args: ['typeCol', { isSignal: true }] }], scopeCol: [{ type: i0.ViewChild, args: ['scopeCol', { isSignal: true }] }], priorityCol: [{ type: i0.ViewChild, args: ['priorityCol', { isSignal: true }] }] } });
+                    ], template: "<ng-container *transloco=\"let t; prefix: 'governance'\">\n  <div class=\"space-y-4\">\n    <ng-template #typeCol let-row>\n      <mt-chip\n        [label]=\"getRuleTypeLabel(row.ruleTypeKey)\"\n        [styleClass]=\"getRuleTypeChipClass(row.ruleTypeKey)\"\n      />\n    </ng-template>\n\n    <ng-template #scopeCol let-row>\n      <div class=\"flex items-center gap-2\">\n        <mt-icon class=\"text-lg\" [icon]=\"getAppliesToIcon(row)\"></mt-icon>\n        <span>{{ getAppliesToLabel(row) }}</span>\n        @if (\n          row.targetModuleKey &&\n          getAppliesToLabel(row) !== t(\"wizard.applies-to.phase-gate.label\")\n        ) {\n          <span class=\"text-slate-500\">&rarr; {{ row.targetModuleKey }}</span>\n        }\n      </div>\n    </ng-template>\n\n    <ng-template #whenCol let-row>\n      <span>{{ getWhenLabel(row) }}</span>\n    </ng-template>\n\n    <ng-template #priorityCol let-row>\n      <div\n        class=\"flex items-center justify-center w-8 h-8 rounded-full bg-slate-100 text-slate-700 font-semibold text-sm\"\n      >\n        {{ row.priority }}\n      </div>\n    </ng-template>\n\n    <mt-table\n      [tabs]=\"tabs()\"\n      [(activeTab)]=\"activeTab\"\n      [data]=\"rules()\"\n      [columns]=\"tableColumns()\"\n      [actions]=\"tableActions()\"\n      [rowActions]=\"rowActions()\"\n      [generalSearch]=\"true\"\n      [showFilters]=\"true\"\n      [loading]=\"loading()\"\n      (cellChange)=\"onCellChange($event)\"\n    >\n    </mt-table>\n  </div>\n</ng-container>\n" }]
+        }], propDecorators: { typeCol: [{ type: i0.ViewChild, args: ['typeCol', { isSignal: true }] }], scopeCol: [{ type: i0.ViewChild, args: ['scopeCol', { isSignal: true }] }], whenCol: [{ type: i0.ViewChild, args: ['whenCol', { isSignal: true }] }], priorityCol: [{ type: i0.ViewChild, args: ['priorityCol', { isSignal: true }] }] } });
 
 /**
  * Generated bundle index. Do not edit.