ng-configcat-publicapi-ui 4.1.3 → 4.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/_directives/input-display-normalizer.directive.mjs +3 -3
- package/esm2022/lib/_services/app-data-adapter.mjs +3 -3
- package/esm2022/lib/_services/comparison-value-list-helper.mjs +3 -3
- package/esm2022/lib/_services/form-generator.mjs +3 -3
- package/esm2022/lib/_services/messaging.service.mjs +3 -3
- package/esm2022/lib/_services/public-api.service.mjs +3 -3
- package/esm2022/lib/_services/setting-list-form-helper.mjs +3 -3
- package/esm2022/lib/_services/tracking.directive.mjs +3 -3
- package/esm2022/lib/ace-editor/ace-editor.component.mjs +3 -3
- package/esm2022/lib/authorization/authorization.component.mjs +3 -3
- package/esm2022/lib/base/base-select.component.mjs +3 -3
- package/esm2022/lib/base/base.component.mjs +3 -3
- package/esm2022/lib/configuration.mjs +3 -3
- package/esm2022/lib/dialogs/confirmation-dialog/confirmation-dialog.mjs +3 -3
- package/esm2022/lib/dialogs/delete-setting-dialog/delete-setting-dialog.component.mjs +3 -3
- package/esm2022/lib/dialogs/expand-dialog/expand-dialog.component.mjs +3 -3
- package/esm2022/lib/dialogs/info-dialog/info-dialog.mjs +3 -3
- package/esm2022/lib/dialogs/reason-dialog/reason-dialog.component.mjs +3 -3
- package/esm2022/lib/dialogs/reroute-dialog/reroute-dialog.mjs +3 -3
- package/esm2022/lib/dialogs/save-snackbar/save-snackbar.component.mjs +3 -3
- package/esm2022/lib/ng-configcat-publicapi-ui.module.mjs +4 -4
- package/esm2022/lib/selects/config-select/config-select.component.mjs +3 -3
- package/esm2022/lib/selects/environment-select/environment-select.component.mjs +3 -3
- package/esm2022/lib/selects/product-select/product-select.component.mjs +3 -3
- package/esm2022/lib/selects/setting-select/setting-select.component.mjs +3 -3
- package/esm2022/lib/setting-item/setting-item.component.mjs +3 -3
- package/esm2022/lib/setting-list/setting/rollout-percentage-items/rollout-percentage-items.component.mjs +3 -3
- package/esm2022/lib/setting-list/setting/rollout-rules/rollout-rules.component.mjs +3 -3
- package/esm2022/lib/setting-list/setting/setting.component.mjs +3 -3
- package/esm2022/lib/setting-list/setting/value/value.component.mjs +3 -3
- package/esm2022/lib/setting-list/setting-list.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/date-time-picker/date-time-picker.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/dependees-dialog/dependees-dialog.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/evaluation-formula.component.mjs +4 -4
- package/esm2022/lib/v2/feature-flag/evaluation-formula/feature-flag-value/feature-flag-value.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/popout-text-editor-dialog/popout-text-editor-dialog.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/condition-chip/condition-chip.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/conditions.component.mjs +4 -4
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/prerequisite-flag-condition/prerequisite-flag-condition.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/segment-condition/segment-condition.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/user-condition/comparator-dialog/comparator-dialog.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/user-condition/popout-list-editor-dialog/popout-list-editor-dialog.component.mjs +4 -4
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/user-condition/user-condition.component.mjs +5 -5
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/percentage-options/percentage-options.component.mjs +4 -4
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/targeting-rule.component.mjs +4 -4
- package/esm2022/lib/v2/feature-flag/feature-flag.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag/percentage-evaluation-attribute-dialog/percentage-evaluation-attribute-dialog.component.mjs +3 -3
- package/esm2022/lib/v2/feature-flag-item.component.mjs +4 -4
- package/fesm2022/ng-configcat-publicapi-ui.mjs +153 -153
- package/fesm2022/ng-configcat-publicapi-ui.mjs.map +1 -1
- package/package.json +4 -4
- package/public-api.scss +7 -7
|
@@ -158,10 +158,10 @@ export class SettingListComponent {
|
|
|
158
158
|
config: this.settingValues.config
|
|
159
159
|
});
|
|
160
160
|
}
|
|
161
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
162
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
161
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SettingListComponent, deps: [{ token: i1.SettingListFormHelper }, { token: i2.MatSnackBar }, { token: i3.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
162
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SettingListComponent, selector: "configcat-setting-list", inputs: { productId: "productId", environmentId: "environmentId", configId: "configId", dashboardBasePath: "dashboardBasePath", canDeleteSetting: "canDeleteSetting", onSave: "onSave", loadSettingValues: "loadSettingValues", loadSegments: "loadSegments", deleteSettingText: "deleteSettingText", showEnvironmentName: "showEnvironmentName" }, outputs: { loadSucceeded: "loadSucceeded", deleteSettingRequested: "deleteSettingRequested", formValuesChanged: "formValuesChanged" }, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\" *ngIf=\"!loading\">\n <div class=\"wrapper\" *ngFor=\"let settingValueFromGroup of getSettingValueFormGroups(); let i = index\">\n <setting [formGroup]=\"settingValueFromGroup\" [readOnly]=\"readOnly\" [canDeleteSetting]=\"canDeleteSetting\"\n (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" [deleteSettingText]=\"deleteSettingText\"\n [showEnvironmentName]=\"showEnvironmentName\" [segments]=\"segments\" [productId]=\"productId\" [configId]=\"configId\"\n [environmentId]=\"environmentId\" [dashboardBasePath]=\"dashboardBasePath\">\n </setting>\n </div>\n\n <div class=\"save\" *ngIf=\"!readOnly && !submitting && formGroup.dirty\">\n\n <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\n <mat-icon>backup</mat-icon> <span> Save & publish changes</span>\n </button>\n <button type=\"button\" mat-stroked-button *ngIf=\"!showRevertQuestion\" (click)=\"showRevertQuestion = true\">\n <mat-icon>history</mat-icon><span>Revert changes</span>\n </button>\n <div class=\"feedback\" *ngIf=\"formGroup.touched && formGroup.invalid && showFeedBackMessage\">\n <div class=\"error\" *ngIf=\"formGroup.errors && formGroup.errors.internalServerError\">\n <span>Something went wrong and we could not save your settings. You can try again or <a\n href=\"https://configcat.com/support\" target=\"_blank\" rel=\"noopener noreferrer\">contact us.</a></span>\n </div>\n <div class=\"error\" *ngIf=\"!formGroup.errors || !formGroup.errors.internalServerError\">\n <span>Oh no! A feature flag has invalid or missing data.</span>\n </div>\n </div>\n <div *ngIf=\"showRevertQuestion\">\n <span class=\"revert\">Revert to last saved state?</span>\n <button type=\"button\" class=\"yes\" mat-stroked-button (click)=\"handleRevertYes()\">Yes</button>\n <button type=\"button\" mat-stroked-button (click)=\"handleRevertCancel()\">No</button>\n </div>\n </div>\n</form>", styles: [".wrapper{background-color:#f3f3f3;border:1px solid rgba(0,0,0,.12);margin:1em 0}.show-hide a{cursor:pointer;font-size:.8rem}.save{position:sticky;bottom:0;min-height:38px;padding:.5rem .5rem .5rem 0;background-color:#fff;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;z-index:1000}.save .save-button{animation:shadow-pulse 1s 3}.save>*{margin-right:.6em;margin-top:.3em;margin-bottom:.3em}.save .revert{margin:0 16px;font-size:14px}.save .yes{margin:0 5px}.error{background-color:#a32b2d;color:#fff;padding:5px;font-size:.9em}.error a{color:#fff;text-decoration:underline}@media (max-width: 700px){.save{padding:.5rem 0}}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i6.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.SettingComponent, selector: "setting", inputs: ["dashboardBasePath", "productId", "environmentId", "configId", "formGroup", "readOnly", "canDeleteSetting", "deleteSettingText", "showEnvironmentName", "segments"], outputs: ["deleteSettingRequested"] }] }); }
|
|
163
163
|
}
|
|
164
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
164
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SettingListComponent, decorators: [{
|
|
165
165
|
type: Component,
|
|
166
166
|
args: [{ selector: 'configcat-setting-list', template: "<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\" *ngIf=\"!loading\">\n <div class=\"wrapper\" *ngFor=\"let settingValueFromGroup of getSettingValueFormGroups(); let i = index\">\n <setting [formGroup]=\"settingValueFromGroup\" [readOnly]=\"readOnly\" [canDeleteSetting]=\"canDeleteSetting\"\n (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" [deleteSettingText]=\"deleteSettingText\"\n [showEnvironmentName]=\"showEnvironmentName\" [segments]=\"segments\" [productId]=\"productId\" [configId]=\"configId\"\n [environmentId]=\"environmentId\" [dashboardBasePath]=\"dashboardBasePath\">\n </setting>\n </div>\n\n <div class=\"save\" *ngIf=\"!readOnly && !submitting && formGroup.dirty\">\n\n <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\n <mat-icon>backup</mat-icon> <span> Save & publish changes</span>\n </button>\n <button type=\"button\" mat-stroked-button *ngIf=\"!showRevertQuestion\" (click)=\"showRevertQuestion = true\">\n <mat-icon>history</mat-icon><span>Revert changes</span>\n </button>\n <div class=\"feedback\" *ngIf=\"formGroup.touched && formGroup.invalid && showFeedBackMessage\">\n <div class=\"error\" *ngIf=\"formGroup.errors && formGroup.errors.internalServerError\">\n <span>Something went wrong and we could not save your settings. You can try again or <a\n href=\"https://configcat.com/support\" target=\"_blank\" rel=\"noopener noreferrer\">contact us.</a></span>\n </div>\n <div class=\"error\" *ngIf=\"!formGroup.errors || !formGroup.errors.internalServerError\">\n <span>Oh no! A feature flag has invalid or missing data.</span>\n </div>\n </div>\n <div *ngIf=\"showRevertQuestion\">\n <span class=\"revert\">Revert to last saved state?</span>\n <button type=\"button\" class=\"yes\" mat-stroked-button (click)=\"handleRevertYes()\">Yes</button>\n <button type=\"button\" mat-stroked-button (click)=\"handleRevertCancel()\">No</button>\n </div>\n </div>\n</form>", styles: [".wrapper{background-color:#f3f3f3;border:1px solid rgba(0,0,0,.12);margin:1em 0}.show-hide a{cursor:pointer;font-size:.8rem}.save{position:sticky;bottom:0;min-height:38px;padding:.5rem .5rem .5rem 0;background-color:#fff;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;z-index:1000}.save .save-button{animation:shadow-pulse 1s 3}.save>*{margin-right:.6em;margin-top:.3em;margin-bottom:.3em}.save .revert{margin:0 16px;font-size:14px}.save .yes{margin:0 5px}.error{background-color:#a32b2d;color:#fff;padding:5px;font-size:.9em}.error a{color:#fff;text-decoration:underline}@media (max-width: 700px){.save{padding:.5rem 0}}\n"] }]
|
|
167
167
|
}], ctorParameters: () => [{ type: i1.SettingListFormHelper }, { type: i2.MatSnackBar }, { type: i3.MatDialog }], propDecorators: { productId: [{
|
|
@@ -85,8 +85,8 @@ export class DateTimePickerComponent {
|
|
|
85
85
|
validate() {
|
|
86
86
|
return this.formGroup.errors;
|
|
87
87
|
}
|
|
88
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
89
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
88
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DateTimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
89
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DateTimePickerComponent, selector: "app-date-time-picker", inputs: { dateTooltip: "dateTooltip", timeTooltip: "timeTooltip" }, providers: [
|
|
90
90
|
{
|
|
91
91
|
provide: NG_VALUE_ACCESSOR,
|
|
92
92
|
useExisting: forwardRef(() => DateTimePickerComponent),
|
|
@@ -100,7 +100,7 @@ export class DateTimePickerComponent {
|
|
|
100
100
|
{ provide: DateAdapter, useClass: AppDateAdapter }
|
|
101
101
|
], ngImport: i0, template: "<div class=\"outer\">\n <div class=\"component date\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" class=\"small-icon-button\">\n <input matInput [formControl]=\"formGroup.controls.dateValue\" [matDatepicker]=\"datepicker\"\n [matTooltip]=\"dateTooltip\">\n <mat-datepicker-toggle matSuffix [for]=\"datepicker\"></mat-datepicker-toggle>\n <mat-datepicker #datepicker></mat-datepicker>\n <mat-error *ngIf=\"formGroup.controls.dateValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.dateValue)}}\n </mat-error>\n </mat-form-field>\n </div>\n <div class=\"component\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <input matInput type=\"time\" [formControl]=\"formGroup.controls.timeValue\" [matTooltip]=\"timeTooltip\" />\n <mat-error *ngIf=\"formGroup.controls.timeValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.timeValue)}}\n </mat-error>\n </mat-form-field>\n </div>\n</div>", styles: [".outer{display:flex;flex-wrap:wrap}.outer .component{width:140px;margin:2px 0}.outer .component.date{margin-right:8px}.outer .component mat-form-field{width:100%;font-size:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }] }); }
|
|
102
102
|
}
|
|
103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DateTimePickerComponent, decorators: [{
|
|
104
104
|
type: Component,
|
|
105
105
|
args: [{ selector: 'app-date-time-picker', providers: [
|
|
106
106
|
{
|
|
@@ -17,10 +17,10 @@ export class DependeesDialogComponent {
|
|
|
17
17
|
this.data.productId, this.data.configId, this.data.environmentId, settingId]);
|
|
18
18
|
return this.publicApiService.getDashboardBasePath() + this.router.serializeUrl(urlTree);
|
|
19
19
|
}
|
|
20
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
21
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DependeesDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1.Router }, { token: i2.PublicApiService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
21
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DependeesDialogComponent, selector: "app-dependees-dialog", ngImport: i0, template: "<h1 mat-dialog-title>Prerequisite references</h1>\n<div mat-dialog-content>\n <p>\n <strong>{{data.name}}</strong> is the prerequisite of the following feature flags:\n </p>\n <ul *ngFor=\"let dependee of data.dependees\">\n <li><a [href]=\"getDashboardUrl(dependee.settingId)\" rel=\"noopener noreferrer\" target=\"_blank\">{{dependee.name}}\n ({{dependee.key}})</a></li>\n </ul>\n</div>\n\n<div mat-dialog-actions>\n <button type=\"button\" mat-stroked-button mat-dialog-close>Close</button>\n</div>", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i5.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i5.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i5.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i5.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }] }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DependeesDialogComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
25
|
args: [{ selector: 'app-dependees-dialog', template: "<h1 mat-dialog-title>Prerequisite references</h1>\n<div mat-dialog-content>\n <p>\n <strong>{{data.name}}</strong> is the prerequisite of the following feature flags:\n </p>\n <ul *ngFor=\"let dependee of data.dependees\">\n <li><a [href]=\"getDashboardUrl(dependee.settingId)\" rel=\"noopener noreferrer\" target=\"_blank\">{{dependee.name}}\n ({{dependee.key}})</a></li>\n </ul>\n</div>\n\n<div mat-dialog-actions>\n <button type=\"button\" mat-stroked-button mat-dialog-close>Close</button>\n</div>" }]
|
|
26
26
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
@@ -182,12 +182,12 @@ export class EvaluationFormulaComponent {
|
|
|
182
182
|
prerequisiteIds: prerequisiteIds
|
|
183
183
|
});
|
|
184
184
|
}
|
|
185
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
186
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: EvaluationFormulaComponent, selector: "app-evaluation-formula", inputs: { formGroup: "formGroup", segments: "segments", flagState: "flagState", showVariationId: "showVariationId", featureFlagLimitations: "featureFlagLimitations", canManageSegments: "canManageSegments", showPercentageEvaluationAttribute: "showPercentageEvaluationAttribute" }, outputs: { createSegmentRequested: "createSegmentRequested", manageSegmentsRequested: "manageSegmentsRequested", addSegmentConditionRequestedWithoutSegments: "addSegmentConditionRequestedWithoutSegments", changePercentageEvaluationAttributeRequested: "changePercentageEvaluationAttributeRequested", subscriptionLimitReached: "subscriptionLimitReached", prerequisiteConditionChanged: "prerequisiteConditionChanged", recalcAddButtons: "recalcAddButtons" }, ngImport: i0, template: "<div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.renderTopAddButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom left-align\">\n <div class=\"add-btn add-if\" [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\">+ IF</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n</div>\n\n<div cdkDropList (cdkDropListDropped)=\"onDrop($event)\" [cdkDropListDisabled]=\"flagState.readOnly\" [cdkDropListSortPredicate]=\"sortPredicate()\">\n <div *ngFor=\"let targetingRule of formGroup.controls.targetingRules.controls; trackBy: trackByIndex; let i = index\">\n <div class=\"targeting-rule-outer grow\" cdkDrag [cdkDragDisabled]=\"isDragDisabled(targetingRule)\"\n [cdkDragData]=\"targetingRule\">\n <div class=\"drag-handle\">\n <div *ngIf=\"!isDragDisabled(targetingRule)\" cdkDragHandle matTooltip=\"Drag here to reorder\"\n matTooltipPosition=\"above\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n </div>\n <div class=\"white-box grow\">\n <app-targeting-rule class=\"grow\" [formGroup]=\"targetingRule\" [segments]=\"segments\"\n [flagState]=\"flagState\" [targetingRuleIndex]=\"i\"\n (removedAllRules)=\"remove(i)\" [featureFlagLimitations]=\"featureFlagLimitations\"\n (subscriptionLimitReached)=\"subscriptionLimitReachedCalled()\"\n [canManageSegments]=\"canManageSegments\" (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\"\n (addSegmentConditionRequestedWithoutSegments)=\"addSegmentConditionRequestedWithoutSegments.emit()\"\n [showPercentageEvaluationAttribute]=\"showPercentageEvaluationAttribute\"\n [percentageEvaluationAttribute]=\"formGroup.controls.percentageEvaluationAttribute.value\"\n (changePercentageEvaluationAttributeRequested)=\"changePercentageEvaluationAttributeRequested.emit()\"\n (prerequisiteConditionChanged)=\"recalcPrerequisiteReferences()\"></app-targeting-rule>\n <div class=\"delete\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove targeting rule\" (click)=\"remove(i)\"\n *ngIf=\"!flagState.readOnly\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showAddRuleButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom pad-top center-shift\">\n <div class=\"add-btn add-if\" \n [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\" \n *ngIf=\"!flagState.readOnly\">+ OR</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" \n matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showOrChip\">\n <div class=\"chip-container\">\n <mat-chip-set>\n <mat-chip disabled>OR</mat-chip>\n </mat-chip-set>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.renderSeparationArea\"></div>\n </div>\n</div>\n\n<div class=\"targeting-rule-outer\">\n <div class=\"drag-handle\"></div>\n <div class=\"white-box grow side-padd vertical-center\">\n <div class=\"chip-container fixed-width\" [ngClass]=\"flagState.addButtonRenderState.hasPercentageOnlyRule ? 'fixed-width-wide' : ''\">\n <mat-chip-set matTooltipPosition=\"above\" [matTooltip]=\"getChipTooltip()\">\n <mat-chip disabled>{{getChipText()}}</mat-chip>\n </mat-chip-set>\n </div>\n <app-feature-flag-value class=\"value grow\" [flagState]=\"flagState\"\n tooltip=\"Served value\" [formGroup]=\"formGroup.controls.defaultValue\"\n [featureFlagLimitations]=\"featureFlagLimitations\"></app-feature-flag-value>\n </div>\n</div>\n\n<mat-menu #ormenu class=\"menu-long-text-or\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add rule with user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add rule with segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add rule with flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: ["html{--mdc-text-button-container-height: 28px;--mdc-filled-button-container-height: 28px;--mdc-outlined-button-container-height: 28px;--mdc-protected-button-container-height: 28px;--mat-text-button-touch-target-display: none;--mat-filled-button-touch-target-display: none;--mat-protected-button-touch-target-display: none;--mat-outlined-button-touch-target-display: none}html{--mat-icon-button-touch-target-display: none}.mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:4px}.cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}.or-chip{display:flex;justify-content:center;z-index:910;min-height:30px;margin:-11px 15px -9px 0}.or-chip .mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 24px}.or-chip .chip-container{z-index:910;align-self:center;margin-top:0}.targeting-rule-outer{display:flex;margin-right:20px}.targeting-rule-outer .drag-handle{align-self:center;cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab;min-width:16px;max-width:16px;color:gray}.targeting-rule-outer .drag-handle mat-icon{font-size:18px}.targeting-rule-outer .drag-handle:active{cursor:grabbing;cursor:-moz-grabbing;cursor:-webkit-grabbing}.targeting-rule-outer .white-box{background-color:#f2f4f8;display:flex;flex-wrap:wrap;border:1px solid #c9c9c9;padding:8px 0;position:relative}.targeting-rule-outer .white-box .delete{color:#b1b1b1;position:absolute;cursor:pointer;top:-16px;right:-16px;z-index:900}.targeting-rule-outer .white-box .delete mat-icon{font-size:20px;height:20px;width:20px;z-index:900;background-color:#f3f3f3;border-radius:50%}.targeting-rule-outer .white-box .chip-container{margin-top:4px}.targeting-rule-outer .vertical-center{align-items:center}.targeting-rule-outer .grow{flex-grow:1}.targeting-rule-outer .side-padd{padding-left:16px;padding-right:16px}.targeting-rule-outer .add-box{margin-left:16px;display:flex}.targeting-rule-outer .add-box .add-if{min-width:42px;padding:5px 2px 5px 0;justify-content:center;text-align:center;color:#8b8b8b;border:1px dashed rgb(168,168,168);background-color:#f2f4f8;border-radius:50px}.targeting-rule-outer .add-box .add-if:hover{background-color:#e5e8f0}.targeting-rule-outer .add-box .pad-left{margin-left:5px}.targeting-rule-outer .center-shift{margin-right:10px}.targeting-rule-outer .left-align{justify-content:left}.targeting-rule-outer .pad-bottom{margin-bottom:8px}.targeting-rule-outer .pad-top{margin-top:8px}\n", ".chip-container{display:flex;margin-top:2px;align-self:start}.chip-container.fixed-width{width:110px}.chip-container.fixed-width-wide{width:130px}.chip-container mat-chip-set{margin-top:2px;width:100%}.chip-container mat-chip-set mat-chip{width:100%;margin-top:0;margin-bottom:0;height:24px;font-size:12px;background-color:#d1e3fa;opacity:1}.chip-container .add-btn mat-chip{background-color:transparent;border:1px dashed #afaeae;color:#afaeae;cursor:pointer}.chip-container .enter-sign{color:#ccc;margin:6px 3px 0 8px}.chip-container .enter-sign mat-icon{font-size:16px;width:16px;height:16px}\n", ".add-btn{cursor:pointer;background-color:transparent;display:flex;font-size:10px;align-items:center;border:1px dashed rgb(168,168,168);color:#979797;border-radius:15px}.add-btn:hover{background-color:#ebebeb}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i7.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled", "tabIndex"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i7.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: i8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i8.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i9.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i9.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i9.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i10.FeatureFlagValueComponent, selector: "app-feature-flag-value", inputs: ["formGroup", "flagState", "featureFlagLimitations", "isPrerequisite", "tooltip"] }, { kind: "component", type: i11.TargetingRuleComponent, selector: "app-targeting-rule", inputs: ["formGroup", "segments", "flagState", "targetingRuleIndex", "featureFlagLimitations", "canManageSegments", "showPercentageEvaluationAttribute", "percentageEvaluationAttribute"], outputs: ["createSegmentRequested", "manageSegmentsRequested", "addSegmentConditionRequestedWithoutSegments", "removedAllRules", "subscriptionLimitReached", "changePercentageEvaluationAttributeRequested", "prerequisiteConditionChanged"] }] }); }
|
|
185
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EvaluationFormulaComponent, deps: [{ token: i1.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
186
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: EvaluationFormulaComponent, selector: "app-evaluation-formula", inputs: { formGroup: "formGroup", segments: "segments", flagState: "flagState", showVariationId: "showVariationId", featureFlagLimitations: "featureFlagLimitations", canManageSegments: "canManageSegments", showPercentageEvaluationAttribute: "showPercentageEvaluationAttribute" }, outputs: { createSegmentRequested: "createSegmentRequested", manageSegmentsRequested: "manageSegmentsRequested", addSegmentConditionRequestedWithoutSegments: "addSegmentConditionRequestedWithoutSegments", changePercentageEvaluationAttributeRequested: "changePercentageEvaluationAttributeRequested", subscriptionLimitReached: "subscriptionLimitReached", prerequisiteConditionChanged: "prerequisiteConditionChanged", recalcAddButtons: "recalcAddButtons" }, ngImport: i0, template: "<div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.renderTopAddButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom left-align\">\n <div class=\"add-btn add-if\" [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\">+ IF</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n</div>\n\n<div cdkDropList (cdkDropListDropped)=\"onDrop($event)\" [cdkDropListDisabled]=\"flagState.readOnly\" [cdkDropListSortPredicate]=\"sortPredicate()\">\n <div *ngFor=\"let targetingRule of formGroup.controls.targetingRules.controls; trackBy: trackByIndex; let i = index\">\n <div class=\"targeting-rule-outer grow\" cdkDrag [cdkDragDisabled]=\"isDragDisabled(targetingRule)\"\n [cdkDragData]=\"targetingRule\">\n <div class=\"drag-handle\">\n <div *ngIf=\"!isDragDisabled(targetingRule)\" cdkDragHandle matTooltip=\"Drag here to reorder\"\n matTooltipPosition=\"above\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n </div>\n <div class=\"white-box grow\">\n <app-targeting-rule class=\"grow\" [formGroup]=\"targetingRule\" [segments]=\"segments\"\n [flagState]=\"flagState\" [targetingRuleIndex]=\"i\"\n (removedAllRules)=\"remove(i)\" [featureFlagLimitations]=\"featureFlagLimitations\"\n (subscriptionLimitReached)=\"subscriptionLimitReachedCalled()\"\n [canManageSegments]=\"canManageSegments\" (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\"\n (addSegmentConditionRequestedWithoutSegments)=\"addSegmentConditionRequestedWithoutSegments.emit()\"\n [showPercentageEvaluationAttribute]=\"showPercentageEvaluationAttribute\"\n [percentageEvaluationAttribute]=\"formGroup.controls.percentageEvaluationAttribute.value\"\n (changePercentageEvaluationAttributeRequested)=\"changePercentageEvaluationAttributeRequested.emit()\"\n (prerequisiteConditionChanged)=\"recalcPrerequisiteReferences()\"></app-targeting-rule>\n <div class=\"delete\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove targeting rule\" (click)=\"remove(i)\"\n *ngIf=\"!flagState.readOnly\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showAddRuleButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom pad-top center-shift\">\n <div class=\"add-btn add-if\" \n [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\" \n *ngIf=\"!flagState.readOnly\">+ OR</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" \n matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showOrChip\">\n <div class=\"chip-container\">\n <mat-chip-set>\n <mat-chip disabled>OR</mat-chip>\n </mat-chip-set>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.renderSeparationArea\"></div>\n </div>\n</div>\n\n<div class=\"targeting-rule-outer\">\n <div class=\"drag-handle\"></div>\n <div class=\"white-box grow side-padd vertical-center\">\n <div class=\"chip-container fixed-width\" [ngClass]=\"flagState.addButtonRenderState.hasPercentageOnlyRule ? 'fixed-width-wide' : ''\">\n <mat-chip-set matTooltipPosition=\"above\" [matTooltip]=\"getChipTooltip()\">\n <mat-chip disabled>{{getChipText()}}</mat-chip>\n </mat-chip-set>\n </div>\n <app-feature-flag-value class=\"value grow\" [flagState]=\"flagState\"\n tooltip=\"Served value\" [formGroup]=\"formGroup.controls.defaultValue\"\n [featureFlagLimitations]=\"featureFlagLimitations\"></app-feature-flag-value>\n </div>\n</div>\n\n<mat-menu #ormenu class=\"menu-long-text-or\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add rule with user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add rule with segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add rule with flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: ["html{--mdc-text-button-container-height: 28px;--mdc-filled-button-container-height: 28px;--mdc-protected-button-container-height: 28px;--mdc-outlined-button-container-height: 28px;--mat-text-button-touch-target-display: none;--mat-filled-button-touch-target-display: none;--mat-protected-button-touch-target-display: none;--mat-outlined-button-touch-target-display: none}html{--mat-icon-button-touch-target-display: none}.mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:4px}.cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}.or-chip{display:flex;justify-content:center;z-index:910;min-height:30px;margin:-11px 15px -9px 0}.or-chip .mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 24px}.or-chip .chip-container{z-index:910;align-self:center;margin-top:0}.targeting-rule-outer{display:flex;margin-right:20px}.targeting-rule-outer .drag-handle{align-self:center;cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab;min-width:16px;max-width:16px;color:gray}.targeting-rule-outer .drag-handle mat-icon{font-size:18px}.targeting-rule-outer .drag-handle:active{cursor:grabbing;cursor:-moz-grabbing;cursor:-webkit-grabbing}.targeting-rule-outer .white-box{background-color:#f2f4f8;display:flex;flex-wrap:wrap;border:1px solid #c9c9c9;padding:8px 0;position:relative}.targeting-rule-outer .white-box .delete{color:#b1b1b1;position:absolute;cursor:pointer;top:-16px;right:-16px;z-index:900}.targeting-rule-outer .white-box .delete mat-icon{font-size:20px;height:20px;width:20px;z-index:900;background-color:#f3f3f3;border-radius:50%}.targeting-rule-outer .white-box .chip-container{margin-top:4px}.targeting-rule-outer .vertical-center{align-items:center}.targeting-rule-outer .grow{flex-grow:1}.targeting-rule-outer .side-padd{padding-left:16px;padding-right:16px}.targeting-rule-outer .add-box{margin-left:16px;display:flex}.targeting-rule-outer .add-box .add-if{min-width:42px;padding:5px 2px 5px 0;justify-content:center;text-align:center;color:#8b8b8b;border:1px dashed rgb(168,168,168);background-color:#f2f4f8;border-radius:50px}.targeting-rule-outer .add-box .add-if:hover{background-color:#e5e8f0}.targeting-rule-outer .add-box .pad-left{margin-left:5px}.targeting-rule-outer .center-shift{margin-right:10px}.targeting-rule-outer .left-align{justify-content:left}.targeting-rule-outer .pad-bottom{margin-bottom:8px}.targeting-rule-outer .pad-top{margin-top:8px}\n", ".chip-container{display:flex;margin-top:2px;align-self:start}.chip-container.fixed-width{width:110px}.chip-container.fixed-width-wide{width:130px}.chip-container mat-chip-set{margin-top:2px;width:100%}.chip-container mat-chip-set mat-chip{width:100%;margin-top:0;margin-bottom:0;height:24px;font-size:12px;background-color:#d1e3fa;opacity:1}.chip-container .add-btn mat-chip{background-color:transparent;border:1px dashed #afaeae;color:#afaeae;cursor:pointer}.chip-container .enter-sign{color:#ccc;margin:6px 3px 0 8px}.chip-container .enter-sign mat-icon{font-size:16px;width:16px;height:16px}\n", ".add-btn{cursor:pointer;background-color:transparent;display:flex;font-size:10px;align-items:center;border:1px dashed rgb(168,168,168);color:#979797;border-radius:15px}.add-btn:hover{background-color:#ebebeb}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i7.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i7.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: i8.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i8.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i9.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i9.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i9.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i10.FeatureFlagValueComponent, selector: "app-feature-flag-value", inputs: ["formGroup", "flagState", "featureFlagLimitations", "isPrerequisite", "tooltip"] }, { kind: "component", type: i11.TargetingRuleComponent, selector: "app-targeting-rule", inputs: ["formGroup", "segments", "flagState", "targetingRuleIndex", "featureFlagLimitations", "canManageSegments", "showPercentageEvaluationAttribute", "percentageEvaluationAttribute"], outputs: ["createSegmentRequested", "manageSegmentsRequested", "addSegmentConditionRequestedWithoutSegments", "removedAllRules", "subscriptionLimitReached", "changePercentageEvaluationAttributeRequested", "prerequisiteConditionChanged"] }] }); }
|
|
187
187
|
}
|
|
188
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
188
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EvaluationFormulaComponent, decorators: [{
|
|
189
189
|
type: Component,
|
|
190
|
-
args: [{ selector: 'app-evaluation-formula', template: "<div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.renderTopAddButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom left-align\">\n <div class=\"add-btn add-if\" [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\">+ IF</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n</div>\n\n<div cdkDropList (cdkDropListDropped)=\"onDrop($event)\" [cdkDropListDisabled]=\"flagState.readOnly\" [cdkDropListSortPredicate]=\"sortPredicate()\">\n <div *ngFor=\"let targetingRule of formGroup.controls.targetingRules.controls; trackBy: trackByIndex; let i = index\">\n <div class=\"targeting-rule-outer grow\" cdkDrag [cdkDragDisabled]=\"isDragDisabled(targetingRule)\"\n [cdkDragData]=\"targetingRule\">\n <div class=\"drag-handle\">\n <div *ngIf=\"!isDragDisabled(targetingRule)\" cdkDragHandle matTooltip=\"Drag here to reorder\"\n matTooltipPosition=\"above\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n </div>\n <div class=\"white-box grow\">\n <app-targeting-rule class=\"grow\" [formGroup]=\"targetingRule\" [segments]=\"segments\"\n [flagState]=\"flagState\" [targetingRuleIndex]=\"i\"\n (removedAllRules)=\"remove(i)\" [featureFlagLimitations]=\"featureFlagLimitations\"\n (subscriptionLimitReached)=\"subscriptionLimitReachedCalled()\"\n [canManageSegments]=\"canManageSegments\" (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\"\n (addSegmentConditionRequestedWithoutSegments)=\"addSegmentConditionRequestedWithoutSegments.emit()\"\n [showPercentageEvaluationAttribute]=\"showPercentageEvaluationAttribute\"\n [percentageEvaluationAttribute]=\"formGroup.controls.percentageEvaluationAttribute.value\"\n (changePercentageEvaluationAttributeRequested)=\"changePercentageEvaluationAttributeRequested.emit()\"\n (prerequisiteConditionChanged)=\"recalcPrerequisiteReferences()\"></app-targeting-rule>\n <div class=\"delete\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove targeting rule\" (click)=\"remove(i)\"\n *ngIf=\"!flagState.readOnly\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showAddRuleButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom pad-top center-shift\">\n <div class=\"add-btn add-if\" \n [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\" \n *ngIf=\"!flagState.readOnly\">+ OR</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" \n matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showOrChip\">\n <div class=\"chip-container\">\n <mat-chip-set>\n <mat-chip disabled>OR</mat-chip>\n </mat-chip-set>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.renderSeparationArea\"></div>\n </div>\n</div>\n\n<div class=\"targeting-rule-outer\">\n <div class=\"drag-handle\"></div>\n <div class=\"white-box grow side-padd vertical-center\">\n <div class=\"chip-container fixed-width\" [ngClass]=\"flagState.addButtonRenderState.hasPercentageOnlyRule ? 'fixed-width-wide' : ''\">\n <mat-chip-set matTooltipPosition=\"above\" [matTooltip]=\"getChipTooltip()\">\n <mat-chip disabled>{{getChipText()}}</mat-chip>\n </mat-chip-set>\n </div>\n <app-feature-flag-value class=\"value grow\" [flagState]=\"flagState\"\n tooltip=\"Served value\" [formGroup]=\"formGroup.controls.defaultValue\"\n [featureFlagLimitations]=\"featureFlagLimitations\"></app-feature-flag-value>\n </div>\n</div>\n\n<mat-menu #ormenu class=\"menu-long-text-or\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add rule with user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add rule with segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add rule with flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: ["html{--mdc-text-button-container-height: 28px;--mdc-filled-button-container-height: 28px;--mdc-
|
|
190
|
+
args: [{ selector: 'app-evaluation-formula', template: "<div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.renderTopAddButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom left-align\">\n <div class=\"add-btn add-if\" [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\">+ IF</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n</div>\n\n<div cdkDropList (cdkDropListDropped)=\"onDrop($event)\" [cdkDropListDisabled]=\"flagState.readOnly\" [cdkDropListSortPredicate]=\"sortPredicate()\">\n <div *ngFor=\"let targetingRule of formGroup.controls.targetingRules.controls; trackBy: trackByIndex; let i = index\">\n <div class=\"targeting-rule-outer grow\" cdkDrag [cdkDragDisabled]=\"isDragDisabled(targetingRule)\"\n [cdkDragData]=\"targetingRule\">\n <div class=\"drag-handle\">\n <div *ngIf=\"!isDragDisabled(targetingRule)\" cdkDragHandle matTooltip=\"Drag here to reorder\"\n matTooltipPosition=\"above\">\n <mat-icon>drag_indicator</mat-icon>\n </div>\n </div>\n <div class=\"white-box grow\">\n <app-targeting-rule class=\"grow\" [formGroup]=\"targetingRule\" [segments]=\"segments\"\n [flagState]=\"flagState\" [targetingRuleIndex]=\"i\"\n (removedAllRules)=\"remove(i)\" [featureFlagLimitations]=\"featureFlagLimitations\"\n (subscriptionLimitReached)=\"subscriptionLimitReachedCalled()\"\n [canManageSegments]=\"canManageSegments\" (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\"\n (addSegmentConditionRequestedWithoutSegments)=\"addSegmentConditionRequestedWithoutSegments.emit()\"\n [showPercentageEvaluationAttribute]=\"showPercentageEvaluationAttribute\"\n [percentageEvaluationAttribute]=\"formGroup.controls.percentageEvaluationAttribute.value\"\n (changePercentageEvaluationAttributeRequested)=\"changePercentageEvaluationAttributeRequested.emit()\"\n (prerequisiteConditionChanged)=\"recalcPrerequisiteReferences()\"></app-targeting-rule>\n <div class=\"delete\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove targeting rule\" (click)=\"remove(i)\"\n *ngIf=\"!flagState.readOnly\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div class=\"targeting-rule-outer\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showAddRuleButtons && !flagState.readOnly\">\n <div class=\"grow vertical-center add-box pad-bottom pad-top center-shift\">\n <div class=\"add-btn add-if\" \n [matMenuTriggerFor]=\"ormenu\" \n matTooltip=\"Add targeting rule\" \n *ngIf=\"!flagState.readOnly\">+ OR</div>\n <div class=\"add-btn add-if pad-left\" (click)=\"addPercentageOptions()\" \n matTooltip=\"Target a percentage of users\" \n *ngIf=\"!flagState.addButtonRenderState.hasPercentageOnlyRule\">+ %</div>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.showOrChip\">\n <div class=\"chip-container\">\n <mat-chip-set>\n <mat-chip disabled>OR</mat-chip>\n </mat-chip-set>\n </div>\n </div>\n <div class=\"or-chip\" *ngIf=\"flagState.addButtonRenderState.addRuleButtonTracker[i]?.renderSeparationArea\"></div>\n </div>\n</div>\n\n<div class=\"targeting-rule-outer\">\n <div class=\"drag-handle\"></div>\n <div class=\"white-box grow side-padd vertical-center\">\n <div class=\"chip-container fixed-width\" [ngClass]=\"flagState.addButtonRenderState.hasPercentageOnlyRule ? 'fixed-width-wide' : ''\">\n <mat-chip-set matTooltipPosition=\"above\" [matTooltip]=\"getChipTooltip()\">\n <mat-chip disabled>{{getChipText()}}</mat-chip>\n </mat-chip-set>\n </div>\n <app-feature-flag-value class=\"value grow\" [flagState]=\"flagState\"\n tooltip=\"Served value\" [formGroup]=\"formGroup.controls.defaultValue\"\n [featureFlagLimitations]=\"featureFlagLimitations\"></app-feature-flag-value>\n </div>\n</div>\n\n<mat-menu #ormenu class=\"menu-long-text-or\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add rule with user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add rule with segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add rule with flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: ["html{--mdc-text-button-container-height: 28px;--mdc-filled-button-container-height: 28px;--mdc-protected-button-container-height: 28px;--mdc-outlined-button-container-height: 28px;--mat-text-button-touch-target-display: none;--mat-filled-button-touch-target-display: none;--mat-protected-button-touch-target-display: none;--mat-outlined-button-touch-target-display: none}html{--mat-icon-button-touch-target-display: none}.mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:4px}.cdk-drop-list-dragging .cdk-drag{transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-animating{transition:transform .3s cubic-bezier(0,0,.2,1)}.or-chip{display:flex;justify-content:center;z-index:910;min-height:30px;margin:-11px 15px -9px 0}.or-chip .mat-mdc-chip.mat-mdc-standard-chip{--mdc-chip-container-height: 24px}.or-chip .chip-container{z-index:910;align-self:center;margin-top:0}.targeting-rule-outer{display:flex;margin-right:20px}.targeting-rule-outer .drag-handle{align-self:center;cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab;min-width:16px;max-width:16px;color:gray}.targeting-rule-outer .drag-handle mat-icon{font-size:18px}.targeting-rule-outer .drag-handle:active{cursor:grabbing;cursor:-moz-grabbing;cursor:-webkit-grabbing}.targeting-rule-outer .white-box{background-color:#f2f4f8;display:flex;flex-wrap:wrap;border:1px solid #c9c9c9;padding:8px 0;position:relative}.targeting-rule-outer .white-box .delete{color:#b1b1b1;position:absolute;cursor:pointer;top:-16px;right:-16px;z-index:900}.targeting-rule-outer .white-box .delete mat-icon{font-size:20px;height:20px;width:20px;z-index:900;background-color:#f3f3f3;border-radius:50%}.targeting-rule-outer .white-box .chip-container{margin-top:4px}.targeting-rule-outer .vertical-center{align-items:center}.targeting-rule-outer .grow{flex-grow:1}.targeting-rule-outer .side-padd{padding-left:16px;padding-right:16px}.targeting-rule-outer .add-box{margin-left:16px;display:flex}.targeting-rule-outer .add-box .add-if{min-width:42px;padding:5px 2px 5px 0;justify-content:center;text-align:center;color:#8b8b8b;border:1px dashed rgb(168,168,168);background-color:#f2f4f8;border-radius:50px}.targeting-rule-outer .add-box .add-if:hover{background-color:#e5e8f0}.targeting-rule-outer .add-box .pad-left{margin-left:5px}.targeting-rule-outer .center-shift{margin-right:10px}.targeting-rule-outer .left-align{justify-content:left}.targeting-rule-outer .pad-bottom{margin-bottom:8px}.targeting-rule-outer .pad-top{margin-top:8px}\n", ".chip-container{display:flex;margin-top:2px;align-self:start}.chip-container.fixed-width{width:110px}.chip-container.fixed-width-wide{width:130px}.chip-container mat-chip-set{margin-top:2px;width:100%}.chip-container mat-chip-set mat-chip{width:100%;margin-top:0;margin-bottom:0;height:24px;font-size:12px;background-color:#d1e3fa;opacity:1}.chip-container .add-btn mat-chip{background-color:transparent;border:1px dashed #afaeae;color:#afaeae;cursor:pointer}.chip-container .enter-sign{color:#ccc;margin:6px 3px 0 8px}.chip-container .enter-sign mat-icon{font-size:16px;width:16px;height:16px}\n", ".add-btn{cursor:pointer;background-color:transparent;display:flex;font-size:10px;align-items:center;border:1px dashed rgb(168,168,168);color:#979797;border-radius:15px}.add-btn:hover{background-color:#ebebeb}\n"] }]
|
|
191
191
|
}], ctorParameters: () => [{ type: i1.FormGenerator }], propDecorators: { formGroup: [{
|
|
192
192
|
type: Input
|
|
193
193
|
}], segments: [{
|
|
@@ -41,10 +41,10 @@ export class FeatureFlagValueComponent {
|
|
|
41
41
|
}
|
|
42
42
|
});
|
|
43
43
|
}
|
|
44
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
45
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
44
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FeatureFlagValueComponent, deps: [{ token: i1.MatDialog }, { token: i2.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
45
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FeatureFlagValueComponent, selector: "app-feature-flag-value", inputs: { formGroup: "formGroup", flagState: "flagState", featureFlagLimitations: "featureFlagLimitations", isPrerequisite: "isPrerequisite", tooltip: "tooltip" }, ngImport: i0, template: "<div class=\"targeting-rule-component smallest-form-field grow\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" *ngIf=\"formGroup.controls.stringValue\">\n <input matInput type=\"text\" [formControl]=\"formGroup.controls.stringValue\" [matTooltip]=\"tooltip\"\n placeholder=\"Add text ...\" />\n <button matSuffix class=\"expand-button\" type=\"button\" mat-icon-button matTooltip=\"Advanced editor\"\n (click)=\"expandText()\"><mat-icon>edit_note</mat-icon></button>\n <mat-error *ngIf=\"formGroup.controls.stringValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.stringValue)}}\n </mat-error>\n </mat-form-field>\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" *ngIf=\"formGroup.controls.intValue\">\n <input matInput type=\"number\" [formControl]=\"formGroup.controls.intValue\"\n digitOnly digitOnlyAllowNegatives=\"true\"\n inputDisplayNormalizer [matTooltip]=\"tooltip\" placeholder=\"Add number ...\" />\n <mat-error *ngIf=\"formGroup.controls.intValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.intValue)}}\n </mat-error>\n </mat-form-field>\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" *ngIf=\"formGroup.controls.doubleValue\">\n <input matInput type=\"number\" [formControl]=\"formGroup.controls.doubleValue\" inputDisplayNormalizer\n [matTooltip]=\"tooltip\" placeholder=\"Add number ...\" />\n <mat-error *ngIf=\"formGroup.controls.doubleValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.doubleValue)}}\n </mat-error>\n </mat-form-field>\n <div *ngIf=\"formGroup.controls.boolValue\" class=\"bool\" [class.readonly]=\"flagState.readOnly\">\n <label class=\"switch\" [matTooltip]=\"tooltip\">\n <input type=\"checkbox\" [formControl]=\"formGroup.controls.boolValue\" />\n <span class=\"slider round\"></span>\n </label>\n </div>\n</div>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", ".switch{position:relative;width:66px;height:30px;margin-left:4px;margin-top:0;margin-bottom:0}.switch input{display:none}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ff5252;-webkit-transition:.4s;transition:.4s;width:66px;height:30px}.slider:before{position:absolute;content:\"\";height:22px;width:22px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#9acd32}input:focus+.slider{box-shadow:0 0 1px #9acd32}input:checked+.slider:before{-webkit-transform:translateX(36px);-ms-transform:translateX(36px);transform:translate(36px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.slider:after{content:\"Off\";color:#fff;display:block;position:absolute;transform:translate(-14%,-50%);top:50%;left:50%;font-size:10px;font-family:Verdana,sans-serif}input:checked+.slider:after{content:\"On\";transform:translate(-91%,-50%)}\n", ":host{display:flex;flex-grow:1}.targeting-rule-component{display:flex;flex-grow:1}.targeting-rule-component .bool{flex-grow:1;align-items:flex-end;display:flex;flex-direction:column;width:66px;height:30px}.targeting-rule-component .readonly{opacity:.6}.targeting-rule-component .expand-button{--mat-icon-button-touch-target-display: none;color:#00000070;margin-right:4px;padding:0;height:24px;width:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.targeting-rule-component .expand-button .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 28px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:2px}.targeting-rule-component .expand-button mat-icon{font-size:20px;height:20px;width:20px}.targeting-rule-component .variationId{margin:0 4px 0 5px;cursor:pointer;color:#9b9b9b;display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i10.InputDisplayNormalizerDirective, selector: "input[inputDisplayNormalizer]" }] }); }
|
|
46
46
|
}
|
|
47
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
47
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FeatureFlagValueComponent, decorators: [{
|
|
48
48
|
type: Component,
|
|
49
49
|
args: [{ selector: 'app-feature-flag-value', template: "<div class=\"targeting-rule-component smallest-form-field grow\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" *ngIf=\"formGroup.controls.stringValue\">\n <input matInput type=\"text\" [formControl]=\"formGroup.controls.stringValue\" [matTooltip]=\"tooltip\"\n placeholder=\"Add text ...\" />\n <button matSuffix class=\"expand-button\" type=\"button\" mat-icon-button matTooltip=\"Advanced editor\"\n (click)=\"expandText()\"><mat-icon>edit_note</mat-icon></button>\n <mat-error *ngIf=\"formGroup.controls.stringValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.stringValue)}}\n </mat-error>\n </mat-form-field>\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" *ngIf=\"formGroup.controls.intValue\">\n <input matInput type=\"number\" [formControl]=\"formGroup.controls.intValue\"\n digitOnly digitOnlyAllowNegatives=\"true\"\n inputDisplayNormalizer [matTooltip]=\"tooltip\" placeholder=\"Add number ...\" />\n <mat-error *ngIf=\"formGroup.controls.intValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.intValue)}}\n </mat-error>\n </mat-form-field>\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\" *ngIf=\"formGroup.controls.doubleValue\">\n <input matInput type=\"number\" [formControl]=\"formGroup.controls.doubleValue\" inputDisplayNormalizer\n [matTooltip]=\"tooltip\" placeholder=\"Add number ...\" />\n <mat-error *ngIf=\"formGroup.controls.doubleValue.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.doubleValue)}}\n </mat-error>\n </mat-form-field>\n <div *ngIf=\"formGroup.controls.boolValue\" class=\"bool\" [class.readonly]=\"flagState.readOnly\">\n <label class=\"switch\" [matTooltip]=\"tooltip\">\n <input type=\"checkbox\" [formControl]=\"formGroup.controls.boolValue\" />\n <span class=\"slider round\"></span>\n </label>\n </div>\n</div>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", ".switch{position:relative;width:66px;height:30px;margin-left:4px;margin-top:0;margin-bottom:0}.switch input{display:none}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ff5252;-webkit-transition:.4s;transition:.4s;width:66px;height:30px}.slider:before{position:absolute;content:\"\";height:22px;width:22px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#9acd32}input:focus+.slider{box-shadow:0 0 1px #9acd32}input:checked+.slider:before{-webkit-transform:translateX(36px);-ms-transform:translateX(36px);transform:translate(36px)}.slider.round{border-radius:34px}.slider.round:before{border-radius:50%}.slider:after{content:\"Off\";color:#fff;display:block;position:absolute;transform:translate(-14%,-50%);top:50%;left:50%;font-size:10px;font-family:Verdana,sans-serif}input:checked+.slider:after{content:\"On\";transform:translate(-91%,-50%)}\n", ":host{display:flex;flex-grow:1}.targeting-rule-component{display:flex;flex-grow:1}.targeting-rule-component .bool{flex-grow:1;align-items:flex-end;display:flex;flex-direction:column;width:66px;height:30px}.targeting-rule-component .readonly{opacity:.6}.targeting-rule-component .expand-button{--mat-icon-button-touch-target-display: none;color:#00000070;margin-right:4px;padding:0;height:24px;width:24px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.targeting-rule-component .expand-button .mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 28px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:2px}.targeting-rule-component .expand-button mat-icon{font-size:20px;height:20px;width:20px}.targeting-rule-component .variationId{margin:0 4px 0 5px;cursor:pointer;color:#9b9b9b;display:flex;align-items:center}\n"] }]
|
|
50
50
|
}], ctorParameters: () => [{ type: i1.MatDialog }, { type: i2.FormGenerator }], propDecorators: { formGroup: [{
|
|
@@ -59,10 +59,10 @@ export class PopoutTextEditorDialogComponent {
|
|
|
59
59
|
close() {
|
|
60
60
|
this.dialogRef.close();
|
|
61
61
|
}
|
|
62
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
63
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
62
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PopoutTextEditorDialogComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
63
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PopoutTextEditorDialogComponent, selector: "app-popout-text-editor-dialog", ngImport: i0, template: "<h2 mat-dialog-title>Advanced editor</h2>\n<div mat-dialog-content class=\"container\">\n <p class=\"description\">\n {{data.description}}\n </p>\n <mat-button-toggle-group [(ngModel)]=\"format\">\n <mat-button-toggle value=\"text\">Text</mat-button-toggle>\n <mat-button-toggle value=\"json\">JSON</mat-button-toggle>\n </mat-button-toggle-group>\n\n <mat-form-field *ngIf=\"format === 'text'\" appearance=\"outline\" class=\"editor-container editor-clear\"\n subscriptSizing=\"dynamic\">\n <textarea matInput autofocus focus [formControl]=\"control\" rows=\"17\" cdkTextareaAutosize cdkAutosizeMinRows=\"17\"\n cdkAutosizeMaxRows=\"26\"></textarea>\n <mat-error *ngIf=\"control.invalid\">\n {{formHelper.getErrorMessage(control)}}\n </mat-error>\n <mat-hint *ngIf=\"data.maxValueLength && (data.maxValueLength - control.value?.length > -1)\">\n Remaining characters:\n {{data.maxValueLength - control.value?.length}}</mat-hint>\n </mat-form-field>\n\n <div class=\"editor-container\" *ngIf=\"format === 'json'\">\n <app-ace-editor [(value)]=\"jsonData\" (onChange)=\"onJsonChanged($event)\"\n [readOnly]=\"data.readOnly\"></app-ace-editor>\n <span *ngIf=\"control.invalid\" class=\"error mat-mdc-form-field-error\">\n {{formHelper.getErrorMessage(control)}}</span>\n </div>\n</div>\n<div mat-dialog-actions>\n <button *ngIf=\"!data.readOnly\" type=\"button\" mat-flat-button color=\"primary\"\n [disabled]=\"!control.touched || !control.valid\" (click)=\"set()\">Set</button>\n <button *ngIf=\"!data.readOnly\" type=\"button\" mat-stroked-button (click)=\"close()\">Cancel</button>\n <button *ngIf=\"data.readOnly\" type=\"button\" mat-stroked-button color=\"primary\" (click)=\"close()\">Close</button>\n</div>", styles: [".container{width:100%}.container .editor-container{margin:10px 0;width:100%;height:432px}.container .editor-clear{width:100%}.container .error{font-size:10px;padding:0 8px}.container .description{padding:5px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.CdkTextareaAutosize, selector: "textarea[cdkTextareaAutosize]", inputs: ["cdkAutosizeMinRows", "cdkAutosizeMaxRows", "cdkTextareaAutosize", "placeholder"], exportAs: ["cdkTextareaAutosize"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i8.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i8.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "component", type: i9.AceEditorComponent, selector: "app-ace-editor", inputs: ["value", "readOnly"], outputs: ["valueChange", "onChange"] }] }); }
|
|
64
64
|
}
|
|
65
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PopoutTextEditorDialogComponent, decorators: [{
|
|
66
66
|
type: Component,
|
|
67
67
|
args: [{ selector: 'app-popout-text-editor-dialog', template: "<h2 mat-dialog-title>Advanced editor</h2>\n<div mat-dialog-content class=\"container\">\n <p class=\"description\">\n {{data.description}}\n </p>\n <mat-button-toggle-group [(ngModel)]=\"format\">\n <mat-button-toggle value=\"text\">Text</mat-button-toggle>\n <mat-button-toggle value=\"json\">JSON</mat-button-toggle>\n </mat-button-toggle-group>\n\n <mat-form-field *ngIf=\"format === 'text'\" appearance=\"outline\" class=\"editor-container editor-clear\"\n subscriptSizing=\"dynamic\">\n <textarea matInput autofocus focus [formControl]=\"control\" rows=\"17\" cdkTextareaAutosize cdkAutosizeMinRows=\"17\"\n cdkAutosizeMaxRows=\"26\"></textarea>\n <mat-error *ngIf=\"control.invalid\">\n {{formHelper.getErrorMessage(control)}}\n </mat-error>\n <mat-hint *ngIf=\"data.maxValueLength && (data.maxValueLength - control.value?.length > -1)\">\n Remaining characters:\n {{data.maxValueLength - control.value?.length}}</mat-hint>\n </mat-form-field>\n\n <div class=\"editor-container\" *ngIf=\"format === 'json'\">\n <app-ace-editor [(value)]=\"jsonData\" (onChange)=\"onJsonChanged($event)\"\n [readOnly]=\"data.readOnly\"></app-ace-editor>\n <span *ngIf=\"control.invalid\" class=\"error mat-mdc-form-field-error\">\n {{formHelper.getErrorMessage(control)}}</span>\n </div>\n</div>\n<div mat-dialog-actions>\n <button *ngIf=\"!data.readOnly\" type=\"button\" mat-flat-button color=\"primary\"\n [disabled]=\"!control.touched || !control.valid\" (click)=\"set()\">Set</button>\n <button *ngIf=\"!data.readOnly\" type=\"button\" mat-stroked-button (click)=\"close()\">Cancel</button>\n <button *ngIf=\"data.readOnly\" type=\"button\" mat-stroked-button color=\"primary\" (click)=\"close()\">Close</button>\n</div>", styles: [".container{width:100%}.container .editor-container{margin:10px 0;width:100%;height:432px}.container .editor-clear{width:100%}.container .error{font-size:10px;padding:0 8px}.container .description{padding:5px 0}\n"] }]
|
|
68
68
|
}], ctorParameters: () => [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
|
|
@@ -11,10 +11,10 @@ export class ConditionChipComponent {
|
|
|
11
11
|
? 'IF'
|
|
12
12
|
: 'ELSE IF';
|
|
13
13
|
}
|
|
14
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
15
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
14
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ConditionChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ConditionChipComponent, selector: "app-condition-chip", inputs: { targetingRuleIndex: "targetingRuleIndex", conditionIndex: "conditionIndex" }, ngImport: i0, template: "<div class=\"chip-container fixed-width\">\n <div *ngIf=\"conditionIndex > 0\" class=\"enter-sign\"><mat-icon>subdirectory_arrow_right</mat-icon></div>\n <mat-chip-set>\n <mat-chip disabled>{{chipText}}</mat-chip>\n </mat-chip-set>\n</div>", styles: [".chip-container{display:flex;margin-top:2px;align-self:start}.chip-container.fixed-width{width:110px}.chip-container.fixed-width-wide{width:130px}.chip-container mat-chip-set{margin-top:2px;width:100%}.chip-container mat-chip-set mat-chip{width:100%;margin-top:0;margin-bottom:0;height:24px;font-size:12px;background-color:#d1e3fa;opacity:1}.chip-container .add-btn mat-chip{background-color:transparent;border:1px dashed #afaeae;color:#afaeae;cursor:pointer}.chip-container .enter-sign{color:#ccc;margin:6px 3px 0 8px}.chip-container .enter-sign mat-icon{font-size:16px;width:16px;height:16px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i3.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }] }); }
|
|
16
16
|
}
|
|
17
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ConditionChipComponent, decorators: [{
|
|
18
18
|
type: Component,
|
|
19
19
|
args: [{ selector: 'app-condition-chip', template: "<div class=\"chip-container fixed-width\">\n <div *ngIf=\"conditionIndex > 0\" class=\"enter-sign\"><mat-icon>subdirectory_arrow_right</mat-icon></div>\n <mat-chip-set>\n <mat-chip disabled>{{chipText}}</mat-chip>\n </mat-chip-set>\n</div>", styles: [".chip-container{display:flex;margin-top:2px;align-self:start}.chip-container.fixed-width{width:110px}.chip-container.fixed-width-wide{width:130px}.chip-container mat-chip-set{margin-top:2px;width:100%}.chip-container mat-chip-set mat-chip{width:100%;margin-top:0;margin-bottom:0;height:24px;font-size:12px;background-color:#d1e3fa;opacity:1}.chip-container .add-btn mat-chip{background-color:transparent;border:1px dashed #afaeae;color:#afaeae;cursor:pointer}.chip-container .enter-sign{color:#ccc;margin:6px 3px 0 8px}.chip-container .enter-sign mat-icon{font-size:16px;width:16px;height:16px}\n"] }]
|
|
20
20
|
}], propDecorators: { targetingRuleIndex: [{
|
|
@@ -71,12 +71,12 @@ export class ConditionsComponent {
|
|
|
71
71
|
}
|
|
72
72
|
return true;
|
|
73
73
|
}
|
|
74
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
75
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
74
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ConditionsComponent, deps: [{ token: i1.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
75
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ConditionsComponent, selector: "app-conditions", inputs: { formArray: "formArray", segments: "segments", flagState: "flagState", targetingRuleIndex: "targetingRuleIndex", canManageSegments: "canManageSegments", featureFlagLimitations: "featureFlagLimitations" }, outputs: { createSegmentRequested: "createSegmentRequested", manageSegmentsRequested: "manageSegmentsRequested", addSegmentConditionRequestedWithoutSegments: "addSegmentConditionRequestedWithoutSegments", lastConditionDeleted: "lastConditionDeleted", subscriptionLimitReached: "subscriptionLimitReached", prerequisiteConditionChanged: "prerequisiteConditionChanged" }, ngImport: i0, template: "<div *ngFor=\"let condition of formArray.controls; let i = index\" class=\"condition\">\n <app-user-condition class=\"grow\" *ngIf=\"condition.controls.userCondition\" [readOnly]=\"flagState.readOnly\"\n [formGroup]=\"condition.controls.userCondition\" [featureFlagLimitations]=\"featureFlagLimitations\"\n [targetingRuleIndex]=\"targetingRuleIndex\" [conditionIndex]=\"i\"></app-user-condition>\n <app-segment-condition class=\"grow\" *ngIf=\"condition.controls.segmentCondition\"\n [formGroup]=\"condition.controls.segmentCondition\" [segments]=\"segments\" [canManageSegments]=\"canManageSegments\"\n (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\" [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"i\"></app-segment-condition>\n <app-prerequisite-flag-condition class=\"grow\" *ngIf=\"condition.controls.prerequisiteFlagCondition\"\n [formGroup]=\"condition.controls.prerequisiteFlagCondition\"\n [prerequisiteSettings]=\"flagState.prerequisiteSettings\"\n (prerequisiteConditionChanged)=\"prerequisiteConditionChanged.emit()\"\n [featureFlagLimitations]=\"featureFlagLimitations\" [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"i\"></app-prerequisite-flag-condition>\n <div class=\"delete-button\" *ngIf=\"formArray.controls.length > 1 && !flagState.readOnly\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove condition\" (click)=\"remove(i)\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n</div>\n\n<div class=\"add-cond\" *ngIf=\"formArray.controls.length && !flagState.readOnly\">\n <div class=\"enter-sign\"><mat-icon>subdirectory_arrow_right</mat-icon></div>\n <div [matMenuTriggerFor]=\"andmenu\" matTooltip=\"Add AND condition\" class=\"add-btn add-and\">+ AND</div>\n</div>\n\n<mat-menu #andmenu class=\"menu-long-text-and\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", "html{--mdc-text-button-container-height: 24px;--mdc-filled-button-container-height: 24px;--mdc-protected-button-container-height: 24px;--mdc-outlined-button-container-height: 24px;--mat-text-button-touch-target-display: none;--mat-filled-button-touch-target-display: none;--mat-protected-button-touch-target-display: none;--mat-outlined-button-touch-target-display: none}html{--mat-icon-button-touch-target-display: none}.mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:4px}.condition{display:flex;flex-wrap:nowrap}.condition .grow{flex-grow:1}.add-cond{display:flex;width:100%;margin-top:4px}.add-cond .enter-sign{color:#ccc;margin:2px 3px 0 8px}.add-cond .enter-sign mat-icon{font-size:16px;width:16px;height:16px}.add-cond .add-and{min-width:65px;padding:3px 2px 2px 5px}\n", ".add-btn{cursor:pointer;background-color:transparent;display:flex;font-size:10px;align-items:center;border:1px dashed rgb(168,168,168);color:#979797;border-radius:15px}.add-btn:hover{background-color:#ebebeb}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i8.UserConditionComponent, selector: "app-user-condition", inputs: ["targetingRuleIndex", "conditionIndex", "readOnly", "featureFlagLimitations", "formGroup"] }, { kind: "component", type: i9.SegmentConditionComponent, selector: "app-segment-condition", inputs: ["targetingRuleIndex", "conditionIndex", "formGroup", "segments", "canManageSegments"], outputs: ["createSegmentRequested", "manageSegmentsRequested"] }, { kind: "component", type: i10.PrerequisiteFlagConditionComponent, selector: "app-prerequisite-flag-condition", inputs: ["targetingRuleIndex", "conditionIndex", "formGroup", "prerequisiteSettings", "featureFlagLimitations"], outputs: ["prerequisiteConditionChanged"] }] }); }
|
|
76
76
|
}
|
|
77
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ConditionsComponent, decorators: [{
|
|
78
78
|
type: Component,
|
|
79
|
-
args: [{ selector: 'app-conditions', template: "<div *ngFor=\"let condition of formArray.controls; let i = index\" class=\"condition\">\n <app-user-condition class=\"grow\" *ngIf=\"condition.controls.userCondition\" [readOnly]=\"flagState.readOnly\"\n [formGroup]=\"condition.controls.userCondition\" [featureFlagLimitations]=\"featureFlagLimitations\"\n [targetingRuleIndex]=\"targetingRuleIndex\" [conditionIndex]=\"i\"></app-user-condition>\n <app-segment-condition class=\"grow\" *ngIf=\"condition.controls.segmentCondition\"\n [formGroup]=\"condition.controls.segmentCondition\" [segments]=\"segments\" [canManageSegments]=\"canManageSegments\"\n (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\" [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"i\"></app-segment-condition>\n <app-prerequisite-flag-condition class=\"grow\" *ngIf=\"condition.controls.prerequisiteFlagCondition\"\n [formGroup]=\"condition.controls.prerequisiteFlagCondition\"\n [prerequisiteSettings]=\"flagState.prerequisiteSettings\"\n (prerequisiteConditionChanged)=\"prerequisiteConditionChanged.emit()\"\n [featureFlagLimitations]=\"featureFlagLimitations\" [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"i\"></app-prerequisite-flag-condition>\n <div class=\"delete-button\" *ngIf=\"formArray.controls.length > 1 && !flagState.readOnly\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove condition\" (click)=\"remove(i)\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n</div>\n\n<div class=\"add-cond\" *ngIf=\"formArray.controls.length && !flagState.readOnly\">\n <div class=\"enter-sign\"><mat-icon>subdirectory_arrow_right</mat-icon></div>\n <div [matMenuTriggerFor]=\"andmenu\" matTooltip=\"Add AND condition\" class=\"add-btn add-and\">+ AND</div>\n</div>\n\n<mat-menu #andmenu class=\"menu-long-text-and\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", "html{--mdc-text-button-container-height: 24px;--mdc-filled-button-container-height: 24px;--mdc-
|
|
79
|
+
args: [{ selector: 'app-conditions', template: "<div *ngFor=\"let condition of formArray.controls; let i = index\" class=\"condition\">\n <app-user-condition class=\"grow\" *ngIf=\"condition.controls.userCondition\" [readOnly]=\"flagState.readOnly\"\n [formGroup]=\"condition.controls.userCondition\" [featureFlagLimitations]=\"featureFlagLimitations\"\n [targetingRuleIndex]=\"targetingRuleIndex\" [conditionIndex]=\"i\"></app-user-condition>\n <app-segment-condition class=\"grow\" *ngIf=\"condition.controls.segmentCondition\"\n [formGroup]=\"condition.controls.segmentCondition\" [segments]=\"segments\" [canManageSegments]=\"canManageSegments\"\n (createSegmentRequested)=\"createSegmentRequested.emit()\"\n (manageSegmentsRequested)=\"manageSegmentsRequested.emit()\" [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"i\"></app-segment-condition>\n <app-prerequisite-flag-condition class=\"grow\" *ngIf=\"condition.controls.prerequisiteFlagCondition\"\n [formGroup]=\"condition.controls.prerequisiteFlagCondition\"\n [prerequisiteSettings]=\"flagState.prerequisiteSettings\"\n (prerequisiteConditionChanged)=\"prerequisiteConditionChanged.emit()\"\n [featureFlagLimitations]=\"featureFlagLimitations\" [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"i\"></app-prerequisite-flag-condition>\n <div class=\"delete-button\" *ngIf=\"formArray.controls.length > 1 && !flagState.readOnly\">\n <button type=\"button\" mat-icon-button matTooltip=\"Remove condition\" (click)=\"remove(i)\">\n <mat-icon>cancel</mat-icon>\n </button>\n </div>\n</div>\n\n<div class=\"add-cond\" *ngIf=\"formArray.controls.length && !flagState.readOnly\">\n <div class=\"enter-sign\"><mat-icon>subdirectory_arrow_right</mat-icon></div>\n <div [matMenuTriggerFor]=\"andmenu\" matTooltip=\"Add AND condition\" class=\"add-btn add-and\">+ AND</div>\n</div>\n\n<mat-menu #andmenu class=\"menu-long-text-and\">\n <a mat-menu-item (click)=\"addUserCondition()\"><mat-icon>track_changes</mat-icon>Add user condition</a>\n <a mat-menu-item (click)=\"addSegmentCondition()\"><mat-icon>pie_chart</mat-icon>Add segment condition</a>\n <div matTooltip=\"There's no other flag in the Config to select as a prerequisite.\"\n [matTooltipDisabled]=\"flagState.prerequisiteSettings.length > 0\">\n <a mat-menu-item (click)=\"addPrerequisiteFlagCondition()\" [disabled]=\"!flagState.prerequisiteSettings.length\">\n <mat-icon>account_tree</mat-icon>Add flag condition (prerequisite)\n </a>\n </div>\n</mat-menu>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", "html{--mdc-text-button-container-height: 24px;--mdc-filled-button-container-height: 24px;--mdc-protected-button-container-height: 24px;--mdc-outlined-button-container-height: 24px;--mat-text-button-touch-target-display: none;--mat-filled-button-touch-target-display: none;--mat-protected-button-touch-target-display: none;--mat-outlined-button-touch-target-display: none}html{--mat-icon-button-touch-target-display: none}.mat-mdc-icon-button.mat-mdc-button-base{--mdc-icon-button-state-layer-size: 32px;width:var(--mdc-icon-button-state-layer-size);height:var(--mdc-icon-button-state-layer-size);padding:4px}.condition{display:flex;flex-wrap:nowrap}.condition .grow{flex-grow:1}.add-cond{display:flex;width:100%;margin-top:4px}.add-cond .enter-sign{color:#ccc;margin:2px 3px 0 8px}.add-cond .enter-sign mat-icon{font-size:16px;width:16px;height:16px}.add-cond .add-and{min-width:65px;padding:3px 2px 2px 5px}\n", ".add-btn{cursor:pointer;background-color:transparent;display:flex;font-size:10px;align-items:center;border:1px dashed rgb(168,168,168);color:#979797;border-radius:15px}.add-btn:hover{background-color:#ebebeb}\n"] }]
|
|
80
80
|
}], ctorParameters: () => [{ type: i1.FormGenerator }], propDecorators: { formArray: [{
|
|
81
81
|
type: Input
|
|
82
82
|
}], segments: [{
|
|
@@ -53,10 +53,10 @@ export class PrerequisiteFlagConditionComponent {
|
|
|
53
53
|
throw new Error('Invalid SettingType');
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
57
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
56
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PrerequisiteFlagConditionComponent, deps: [{ token: i1.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
57
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PrerequisiteFlagConditionComponent, selector: "app-prerequisite-flag-condition", inputs: { targetingRuleIndex: "targetingRuleIndex", conditionIndex: "conditionIndex", formGroup: "formGroup", prerequisiteSettings: "prerequisiteSettings", featureFlagLimitations: "featureFlagLimitations" }, outputs: { prerequisiteConditionChanged: "prerequisiteConditionChanged" }, ngImport: i0, template: "<div class=\"targeting-rule-line smallest-form-field\">\n <div class=\"explanation-wrapper\">\n <app-condition-chip [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"conditionIndex\"></app-condition-chip>\n <div class=\"explanation\"><a href=\"https://configcat.com/docs/targeting/targeting-rule/flag-condition/\"\n target=\"_blank\" rel=\"noopener noreferrer\" class=\"user-link\">flag</a></div>\n </div>\n <div class=\"wrapper-group\">\n <div class=\"targeting-rule-component pad-right\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <select matNativeControl [formControl]=\"formGroup.controls.prerequisiteSettingId\"\n (change)=\"prerequisiteSettingChanged()\" matTooltip=\"Prerequisite feature flag or setting key\">\n <option [ngValue]=\"null\" disabled selected hidden *ngIf=\"prerequisiteSettings.length\">Select feature\n flag ...</option>\n <option *ngFor=\"let setting of prerequisiteSettings\" [ngValue]=\"setting.settingId\">\n {{setting.key}}\n </option>\n </select>\n <mat-error *ngIf=\"formGroup.controls.prerequisiteSettingId.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.prerequisiteSettingId)}}\n </mat-error>\n </mat-form-field>\n </div>\n <div class=\"targeting-rule-component pad-right\" *ngIf=\"prerequisiteSettingType === SettingType.Boolean\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <select matNativeControl [formControl]=\"formGroup.controls.comparator\"\n matTooltip=\"Prerequisite feature flag comparison value\">\n <option *ngFor=\"let prerequisiteComparator of booleanPrerequisiteComparators\"\n [ngValue]=\"prerequisiteComparator.value\">\n {{prerequisiteComparator.label}}\n </option>\n </select>\n <mat-error *ngIf=\"formGroup.controls.comparator.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.comparator)}}\n </mat-error>\n </mat-form-field>\n </div>\n <div class=\"targeting-rule-component pad-right\" *ngIf=\"prerequisiteSettingType !== SettingType.Boolean\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <select matNativeControl [formControl]=\"formGroup.controls.comparator\" matTooltip=\"Comparator\">\n <option *ngFor=\"let prerequisiteComparator of prerequisiteComparators\"\n [ngValue]=\"prerequisiteComparator.value\">\n {{prerequisiteComparator.label}}\n </option>\n </select>\n <mat-error *ngIf=\"formGroup.controls.comparator.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.comparator)}}\n </mat-error>\n </mat-form-field>\n </div>\n </div>\n <app-feature-flag-value class=\"wrapper-group grow\" *ngIf=\"prerequisiteSettingType !== SettingType.Boolean\"\n tooltip=\"Prerequisite feature flag comparison value\"\n [formGroup]=\"formGroup.controls.prerequisiteComparisonValue\" [isPrerequisite]=\"true\"\n [featureFlagLimitations]=\"featureFlagLimitations\"></app-feature-flag-value>\n</div>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", "select.ng-invalid{color:#00000061}select.ng-invalid option{color:#000}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i7.FeatureFlagValueComponent, selector: "app-feature-flag-value", inputs: ["formGroup", "flagState", "featureFlagLimitations", "isPrerequisite", "tooltip"] }, { kind: "component", type: i8.ConditionChipComponent, selector: "app-condition-chip", inputs: ["targetingRuleIndex", "conditionIndex"] }] }); }
|
|
58
58
|
}
|
|
59
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PrerequisiteFlagConditionComponent, decorators: [{
|
|
60
60
|
type: Component,
|
|
61
61
|
args: [{ selector: 'app-prerequisite-flag-condition', template: "<div class=\"targeting-rule-line smallest-form-field\">\n <div class=\"explanation-wrapper\">\n <app-condition-chip [targetingRuleIndex]=\"targetingRuleIndex\"\n [conditionIndex]=\"conditionIndex\"></app-condition-chip>\n <div class=\"explanation\"><a href=\"https://configcat.com/docs/targeting/targeting-rule/flag-condition/\"\n target=\"_blank\" rel=\"noopener noreferrer\" class=\"user-link\">flag</a></div>\n </div>\n <div class=\"wrapper-group\">\n <div class=\"targeting-rule-component pad-right\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <select matNativeControl [formControl]=\"formGroup.controls.prerequisiteSettingId\"\n (change)=\"prerequisiteSettingChanged()\" matTooltip=\"Prerequisite feature flag or setting key\">\n <option [ngValue]=\"null\" disabled selected hidden *ngIf=\"prerequisiteSettings.length\">Select feature\n flag ...</option>\n <option *ngFor=\"let setting of prerequisiteSettings\" [ngValue]=\"setting.settingId\">\n {{setting.key}}\n </option>\n </select>\n <mat-error *ngIf=\"formGroup.controls.prerequisiteSettingId.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.prerequisiteSettingId)}}\n </mat-error>\n </mat-form-field>\n </div>\n <div class=\"targeting-rule-component pad-right\" *ngIf=\"prerequisiteSettingType === SettingType.Boolean\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <select matNativeControl [formControl]=\"formGroup.controls.comparator\"\n matTooltip=\"Prerequisite feature flag comparison value\">\n <option *ngFor=\"let prerequisiteComparator of booleanPrerequisiteComparators\"\n [ngValue]=\"prerequisiteComparator.value\">\n {{prerequisiteComparator.label}}\n </option>\n </select>\n <mat-error *ngIf=\"formGroup.controls.comparator.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.comparator)}}\n </mat-error>\n </mat-form-field>\n </div>\n <div class=\"targeting-rule-component pad-right\" *ngIf=\"prerequisiteSettingType !== SettingType.Boolean\">\n <mat-form-field appearance=\"outline\" subscriptSizing=\"dynamic\">\n <select matNativeControl [formControl]=\"formGroup.controls.comparator\" matTooltip=\"Comparator\">\n <option *ngFor=\"let prerequisiteComparator of prerequisiteComparators\"\n [ngValue]=\"prerequisiteComparator.value\">\n {{prerequisiteComparator.label}}\n </option>\n </select>\n <mat-error *ngIf=\"formGroup.controls.comparator.invalid\">\n {{FormHelper.getErrorMessage(formGroup.controls.comparator)}}\n </mat-error>\n </mat-form-field>\n </div>\n </div>\n <app-feature-flag-value class=\"wrapper-group grow\" *ngIf=\"prerequisiteSettingType !== SettingType.Boolean\"\n tooltip=\"Prerequisite feature flag comparison value\"\n [formGroup]=\"formGroup.controls.prerequisiteComparisonValue\" [isPrerequisite]=\"true\"\n [featureFlagLimitations]=\"featureFlagLimitations\"></app-feature-flag-value>\n</div>", styles: [".targeting-rule-line{display:flex;flex-wrap:wrap;margin:2px 0}.targeting-rule-line .wrapper-group{display:flex;flex-wrap:wrap}.targeting-rule-line .wrapper-group.grow{flex-grow:1}.targeting-rule-component{margin:2px 0;width:212px}.targeting-rule-component[hidden]{display:none}.targeting-rule-component.small{width:102px}.targeting-rule-component.grow{flex-grow:1}.targeting-rule-component.pad-right{margin-right:8px}.targeting-rule-component mat-form-field{width:100%;font-size:12px}.delete-button{margin-top:4px;color:#b1b1b1}.delete-button mat-icon{font-size:18px;height:18px;width:18px}.explanation-wrapper{display:flex;margin-top:2px}.explanation-wrapper .explanation{min-width:44px;margin-top:6px;margin-right:8px}@media (max-width: 500px){.targeting-rule-component{max-width:calc(100% - 4px);width:160px}.targeting-rule-component.small{width:78px}.targeting-rule-component.pad-right{margin-right:4px}}\n", "select.ng-invalid{color:#00000061}select.ng-invalid option{color:#000}\n"] }]
|
|
62
62
|
}], ctorParameters: () => [{ type: i1.FormGenerator }], propDecorators: { targetingRuleIndex: [{
|