ng-configcat-publicapi-ui 4.0.0 → 4.0.2
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/form-helper.mjs +63 -7
- 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/bootstrap.mjs +2 -1
- 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 +28 -0
- package/esm2022/lib/dialogs/save-snackbar/save-snackbar.component.mjs +3 -3
- package/esm2022/lib/ng-configcat-publicapi-ui.module.mjs +10 -7
- 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 +5 -5
- 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 +5 -5
- 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 +5 -5
- 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 +4 -4
- package/esm2022/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/user-condition/comparator-dialog/comparator-dialog.component.mjs +32 -32
- 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 +5 -5
- 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 +8 -8
- 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 +19 -8
- package/fesm2022/ng-configcat-publicapi-ui.mjs +288 -199
- package/fesm2022/ng-configcat-publicapi-ui.mjs.map +1 -1
- package/lib/_services/form-helper.d.ts +3 -2
- package/lib/bootstrap.d.ts +1 -0
- package/lib/dialogs/reroute-dialog/reroute-dialog.d.ts +20 -0
- package/lib/ng-configcat-publicapi-ui.module.d.ts +27 -26
- package/lib/v2/feature-flag/evaluation-formula/targeting-rule/conditions/user-condition/user-condition.component.d.ts +1 -1
- package/lib/v2/feature-flag/feature-flag.component.d.ts +2 -2
- package/package.json +1 -1
- package/public-api.scss +4 -6
|
@@ -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: "17.1
|
|
186
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", 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-mdc-button .mat-mdc-button-touch-target,.mat-mdc-raised-button .mat-mdc-button-touch-target,.mat-mdc-unelevated-button .mat-mdc-button-touch-target,.mat-mdc-outlined-button .mat-mdc-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}.mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target{display:none}.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: "17.3.1", ngImport: i0, type: EvaluationFormulaComponent, deps: [{ token: i1.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
186
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", 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"] }] }); }
|
|
187
187
|
}
|
|
188
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1
|
|
188
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", 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-outlined-button-container-height: 28px;--mdc-protected-button-container-height: 28px
|
|
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-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"] }]
|
|
191
191
|
}], ctorParameters: () => [{ type: i1.FormGenerator }], propDecorators: { formGroup: [{
|
|
192
192
|
type: Input
|
|
193
193
|
}], segments: [{
|
|
@@ -41,12 +41,12 @@ export class FeatureFlagValueComponent {
|
|
|
41
41
|
}
|
|
42
42
|
});
|
|
43
43
|
}
|
|
44
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1
|
|
45
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1
|
|
44
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", 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: "17.3.1", 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: "17.1
|
|
47
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: FeatureFlagValueComponent, decorators: [{
|
|
48
48
|
type: Component,
|
|
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
|
|
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: [{
|
|
51
51
|
type: Input
|
|
52
52
|
}], flagState: [{
|
|
@@ -58,4 +58,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
58
58
|
}], tooltip: [{
|
|
59
59
|
type: Input
|
|
60
60
|
}] } });
|
|
61
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
61
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmVhdHVyZS1mbGFnLXZhbHVlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWNvbmZpZ2NhdC1wdWJsaWNhcGktdWkvc3JjL2xpYi92Mi9mZWF0dXJlLWZsYWcvZXZhbHVhdGlvbi1mb3JtdWxhL2ZlYXR1cmUtZmxhZy12YWx1ZS9mZWF0dXJlLWZsYWctdmFsdWUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctY29uZmlnY2F0LXB1YmxpY2FwaS11aS9zcmMvbGliL3YyL2ZlYXR1cmUtZmxhZy9ldmFsdWF0aW9uLWZvcm11bGEvZmVhdHVyZS1mbGFnLXZhbHVlL2ZlYXR1cmUtZmxhZy12YWx1ZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUdqRCxPQUFPLEVBQ0wsVUFBVSxFQUFhLFdBQVcsRUFFbkMsTUFBTSx1QkFBdUIsQ0FBQztBQUMvQixPQUFPLEVBQUUsK0JBQStCLEVBQThCLE1BQU0sa0VBQWtFLENBQUM7Ozs7Ozs7Ozs7OztBQVcvSSxNQUFNLE9BQU8seUJBQXlCO0lBU3BDLFlBQW9CLE1BQWlCLEVBQzNCLGFBQTRCO1FBRGxCLFdBQU0sR0FBTixNQUFNLENBQVc7UUFDM0Isa0JBQWEsR0FBYixhQUFhLENBQWU7UUFON0IsbUJBQWMsR0FBRyxLQUFLLENBQUM7UUFHaEMsZUFBVSxHQUFHLFVBQVUsQ0FBQztJQUl4QixDQUFDO0lBRUQsVUFBVTtRQUNSLE1BQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLCtCQUErQixFQUFFO1lBQ2xFLEtBQUssRUFBRSxPQUFPO1lBQ2QsSUFBSSxFQUE4QjtnQkFDaEMsS0FBSyxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxLQUFLO2dCQUNoRCxRQUFRLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLFFBQVE7Z0JBQ3RELFVBQVUsRUFBRSxJQUFJLENBQUMsYUFBYSxDQUFDLDJCQUEyQixDQUFDLFdBQVcsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLHNCQUFzQixDQUFDO2dCQUMzRyxjQUFjLEVBQUUsSUFBSSxDQUFDLHNCQUFzQixDQUFDLHdCQUF3QixJQUFJLE1BQU07Z0JBQzlFLFdBQVcsRUFBRSxJQUFJLENBQUMsY0FBYztvQkFDOUIsQ0FBQyxDQUFDLDJJQUEySTtvQkFDN0ksQ0FBQyxDQUFDLG1IQUFtSDthQUN4SDtTQUNGLENBQUMsQ0FBQztRQUVILFNBQVMsQ0FBQyxXQUFXLEVBQUUsQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLEVBQUU7WUFDdkMsSUFBSSxJQUFJLEVBQUUsQ0FBQztnQkFDVCxJQUFJLENBQUMsU0FBUyxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztnQkFDekQsSUFBSSxDQUFDLFNBQVMsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLHNCQUFzQixFQUFFLENBQUM7Z0JBQzdELElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxhQUFhLEVBQUUsQ0FBQztnQkFDcEQsSUFBSSxDQUFDLFNBQVMsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDO1lBQ3BELENBQUM7UUFDSCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7OEdBbkNVLHlCQUF5QjtrR0FBekIseUJBQXlCLGtPQ2xCdEMsc2lFQStCTTs7MkZEYk8seUJBQXlCO2tCQVRyQyxTQUFTOytCQUNFLHdCQUF3QjswR0FTekIsU0FBUztzQkFBakIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLHNCQUFzQjtzQkFBOUIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEZvcm1Hcm91cCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IE1hdERpYWxvZyB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2RpYWxvZyc7XG5pbXBvcnQge1xuICBGb3JtSGVscGVyLCBWYWx1ZUZvcm0sIFNldHRpbmdUeXBlLFxuICBJRmVhdHVyZUZsYWdMaW1pdGF0aW9ucywgRm9ybUdlbmVyYXRvciwgSUZsYWdTdGF0ZVxufSBmcm9tICcuLi8uLi8uLi8uLi9ib290c3RyYXAnO1xuaW1wb3J0IHsgUG9wb3V0VGV4dEVkaXRvckRpYWxvZ0NvbXBvbmVudCwgUG9wb3V0VGV4dEVkaXRvckRpYWxvZ0RhdGEgfSBmcm9tICcuLi9wb3BvdXQtdGV4dC1lZGl0b3ItZGlhbG9nL3BvcG91dC10ZXh0LWVkaXRvci1kaWFsb2cuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXBwLWZlYXR1cmUtZmxhZy12YWx1ZScsXG4gIHRlbXBsYXRlVXJsOiAnLi9mZWF0dXJlLWZsYWctdmFsdWUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFtcbiAgICAnLi4vY29tcG9uZW50cy5zY3NzJyxcbiAgICAnLi4vLi4vc2xpZGVyLnNjc3MnLFxuICAgICcuL2ZlYXR1cmUtZmxhZy12YWx1ZS5jb21wb25lbnQuc2NzcydcbiAgXVxufSlcbmV4cG9ydCBjbGFzcyBGZWF0dXJlRmxhZ1ZhbHVlQ29tcG9uZW50IHtcbiAgQElucHV0KCkgZm9ybUdyb3VwOiBGb3JtR3JvdXA8VmFsdWVGb3JtPjtcbiAgQElucHV0KCkgZmxhZ1N0YXRlOiBJRmxhZ1N0YXRlO1xuICBASW5wdXQoKSBmZWF0dXJlRmxhZ0xpbWl0YXRpb25zOiBJRmVhdHVyZUZsYWdMaW1pdGF0aW9ucztcbiAgQElucHV0KCkgaXNQcmVyZXF1aXNpdGUgPSBmYWxzZTtcbiAgQElucHV0KCkgdG9vbHRpcDogc3RyaW5nO1xuXG4gIEZvcm1IZWxwZXIgPSBGb3JtSGVscGVyO1xuXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZGlhbG9nOiBNYXREaWFsb2csXG4gICAgcHJpdmF0ZSBmb3JtR2VuZXJhdG9yOiBGb3JtR2VuZXJhdG9yKSB7XG4gIH1cblxuICBleHBhbmRUZXh0KCkge1xuICAgIGNvbnN0IGRpYWxvZ1JlZiA9IHRoaXMuZGlhbG9nLm9wZW4oUG9wb3V0VGV4dEVkaXRvckRpYWxvZ0NvbXBvbmVudCwge1xuICAgICAgd2lkdGg6ICc4MDBweCcsXG4gICAgICBkYXRhOiA8UG9wb3V0VGV4dEVkaXRvckRpYWxvZ0RhdGE+e1xuICAgICAgICB2YWx1ZTogdGhpcy5mb3JtR3JvdXAuY29udHJvbHMuc3RyaW5nVmFsdWUudmFsdWUsXG4gICAgICAgIHJlYWRPbmx5OiB0aGlzLmZvcm1Hcm91cC5jb250cm9scy5zdHJpbmdWYWx1ZS5kaXNhYmxlZCxcbiAgICAgICAgdmFsaWRhdG9yczogdGhpcy5mb3JtR2VuZXJhdG9yLmdldFZhbGlkYXRvcnNGb3JTZXR0aW5nVHlwZShTZXR0aW5nVHlwZS5TdHJpbmcsIHRoaXMuZmVhdHVyZUZsYWdMaW1pdGF0aW9ucyksXG4gICAgICAgIG1heFZhbHVlTGVuZ3RoOiB0aGlzLmZlYXR1cmVGbGFnTGltaXRhdGlvbnMubWF4U3RyaW5nRmxhZ1ZhbHVlTGVuZ3RoID8/IDEwMDAwMCxcbiAgICAgICAgZGVzY3JpcHRpb246IHRoaXMuaXNQcmVyZXF1aXNpdGVcbiAgICAgICAgICA/ICdNb2RpZnkgdGhlIHRleHQgd2l0aGluIHRoZSBlZGl0b3IgdG8gY2hhbmdlIHRoZSBwcmVyZXF1aXNpdGUgZmVhdHVyZSBmbGFnIGNvbXBhcmlzb24gdmFsdWUuIFRoZSBlZGl0b3Igc3VwcG9ydHMgSlNPTiBzeW50YXggaGlnaGxpZ2h0aW5nLidcbiAgICAgICAgICA6ICdNb2RpZnkgdGhlIHRleHQgd2l0aGluIHRoZSBlZGl0b3IgdG8gY2hhbmdlIHRoZSBmZWF0dXJlIGZsYWcgdmFsdWUuIFRoZSBlZGl0b3Igc3VwcG9ydHMgSlNPTiBzeW50YXggaGlnaGxpZ2h0aW5nLidcbiAgICAgIH1cbiAgICB9KTtcblxuICAgIGRpYWxvZ1JlZi5hZnRlckNsb3NlZCgpLnN1YnNjcmliZShkYXRhID0+IHtcbiAgICAgIGlmIChkYXRhKSB7XG4gICAgICAgIHRoaXMuZm9ybUdyb3VwLmNvbnRyb2xzLnN0cmluZ1ZhbHVlLnNldFZhbHVlKGRhdGEudmFsdWUpO1xuICAgICAgICB0aGlzLmZvcm1Hcm91cC5jb250cm9scy5zdHJpbmdWYWx1ZS51cGRhdGVWYWx1ZUFuZFZhbGlkaXR5KCk7XG4gICAgICAgIHRoaXMuZm9ybUdyb3VwLmNvbnRyb2xzLnN0cmluZ1ZhbHVlLm1hcmtBc1RvdWNoZWQoKTtcbiAgICAgICAgdGhpcy5mb3JtR3JvdXAuY29udHJvbHMuc3RyaW5nVmFsdWUubWFya0FzRGlydHkoKTtcbiAgICAgIH1cbiAgICB9KTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInRhcmdldGluZy1ydWxlLWNvbXBvbmVudCBzbWFsbGVzdC1mb3JtLWZpZWxkIGdyb3dcIj5cbiAgICA8bWF0LWZvcm0tZmllbGQgYXBwZWFyYW5jZT1cIm91dGxpbmVcIiBzdWJzY3JpcHRTaXppbmc9XCJkeW5hbWljXCIgKm5nSWY9XCJmb3JtR3JvdXAuY29udHJvbHMuc3RyaW5nVmFsdWVcIj5cbiAgICAgICAgPGlucHV0IG1hdElucHV0IHR5cGU9XCJ0ZXh0XCIgW2Zvcm1Db250cm9sXT1cImZvcm1Hcm91cC5jb250cm9scy5zdHJpbmdWYWx1ZVwiIFttYXRUb29sdGlwXT1cInRvb2x0aXBcIlxuICAgICAgICAgICAgcGxhY2Vob2xkZXI9XCJBZGQgdGV4dCAuLi5cIiAvPlxuICAgICAgICA8YnV0dG9uIG1hdFN1ZmZpeCBjbGFzcz1cImV4cGFuZC1idXR0b25cIiB0eXBlPVwiYnV0dG9uXCIgbWF0LWljb24tYnV0dG9uIG1hdFRvb2x0aXA9XCJBZHZhbmNlZCBlZGl0b3JcIlxuICAgICAgICAgICAgKGNsaWNrKT1cImV4cGFuZFRleHQoKVwiPjxtYXQtaWNvbj5lZGl0X25vdGU8L21hdC1pY29uPjwvYnV0dG9uPlxuICAgICAgICA8bWF0LWVycm9yICpuZ0lmPVwiZm9ybUdyb3VwLmNvbnRyb2xzLnN0cmluZ1ZhbHVlLmludmFsaWRcIj5cbiAgICAgICAgICAgIHt7Rm9ybUhlbHBlci5nZXRFcnJvck1lc3NhZ2UoZm9ybUdyb3VwLmNvbnRyb2xzLnN0cmluZ1ZhbHVlKX19XG4gICAgICAgIDwvbWF0LWVycm9yPlxuICAgIDwvbWF0LWZvcm0tZmllbGQ+XG4gICAgPG1hdC1mb3JtLWZpZWxkIGFwcGVhcmFuY2U9XCJvdXRsaW5lXCIgc3Vic2NyaXB0U2l6aW5nPVwiZHluYW1pY1wiICpuZ0lmPVwiZm9ybUdyb3VwLmNvbnRyb2xzLmludFZhbHVlXCI+XG4gICAgICAgIDxpbnB1dCBtYXRJbnB1dCB0eXBlPVwibnVtYmVyXCIgW2Zvcm1Db250cm9sXT1cImZvcm1Hcm91cC5jb250cm9scy5pbnRWYWx1ZVwiXG4gICAgICAgICAgICBkaWdpdE9ubHkgZGlnaXRPbmx5QWxsb3dOZWdhdGl2ZXM9XCJ0cnVlXCJcbiAgICAgICAgICAgIGlucHV0RGlzcGxheU5vcm1hbGl6ZXIgW21hdFRvb2x0aXBdPVwidG9vbHRpcFwiIHBsYWNlaG9sZGVyPVwiQWRkIG51bWJlciAuLi5cIiAvPlxuICAgICAgICA8bWF0LWVycm9yICpuZ0lmPVwiZm9ybUdyb3VwLmNvbnRyb2xzLmludFZhbHVlLmludmFsaWRcIj5cbiAgICAgICAgICAgIHt7Rm9ybUhlbHBlci5nZXRFcnJvck1lc3NhZ2UoZm9ybUdyb3VwLmNvbnRyb2xzLmludFZhbHVlKX19XG4gICAgICAgIDwvbWF0LWVycm9yPlxuICAgIDwvbWF0LWZvcm0tZmllbGQ+XG4gICAgPG1hdC1mb3JtLWZpZWxkIGFwcGVhcmFuY2U9XCJvdXRsaW5lXCIgc3Vic2NyaXB0U2l6aW5nPVwiZHluYW1pY1wiICpuZ0lmPVwiZm9ybUdyb3VwLmNvbnRyb2xzLmRvdWJsZVZhbHVlXCI+XG4gICAgICAgIDxpbnB1dCBtYXRJbnB1dCB0eXBlPVwibnVtYmVyXCIgW2Zvcm1Db250cm9sXT1cImZvcm1Hcm91cC5jb250cm9scy5kb3VibGVWYWx1ZVwiIGlucHV0RGlzcGxheU5vcm1hbGl6ZXJcbiAgICAgICAgICAgIFttYXRUb29sdGlwXT1cInRvb2x0aXBcIiBwbGFjZWhvbGRlcj1cIkFkZCBudW1iZXIgLi4uXCIgLz5cbiAgICAgICAgPG1hdC1lcnJvciAqbmdJZj1cImZvcm1Hcm91cC5jb250cm9scy5kb3VibGVWYWx1ZS5pbnZhbGlkXCI+XG4gICAgICAgICAgICB7e0Zvcm1IZWxwZXIuZ2V0RXJyb3JNZXNzYWdlKGZvcm1Hcm91cC5jb250cm9scy5kb3VibGVWYWx1ZSl9fVxuICAgICAgICA8L21hdC1lcnJvcj5cbiAgICA8L21hdC1mb3JtLWZpZWxkPlxuICAgIDxkaXYgKm5nSWY9XCJmb3JtR3JvdXAuY29udHJvbHMuYm9vbFZhbHVlXCIgY2xhc3M9XCJib29sXCIgW2NsYXNzLnJlYWRvbmx5XT1cImZsYWdTdGF0ZS5yZWFkT25seVwiPlxuICAgICAgICA8bGFiZWwgY2xhc3M9XCJzd2l0Y2hcIiBbbWF0VG9vbHRpcF09XCJ0b29sdGlwXCI+XG4gICAgICAgICAgICA8aW5wdXQgdHlwZT1cImNoZWNrYm94XCIgW2Zvcm1Db250cm9sXT1cImZvcm1Hcm91cC5jb250cm9scy5ib29sVmFsdWVcIiAvPlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJzbGlkZXIgcm91bmRcIj48L3NwYW4+XG4gICAgICAgIDwvbGFiZWw+XG4gICAgPC9kaXY+XG48L2Rpdj4iXX0=
|
|
@@ -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: "17.1
|
|
63
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1
|
|
62
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", 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: "17.3.1", 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", "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"], 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: "17.1
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", 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: "17.1
|
|
15
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1
|
|
14
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ConditionChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
15
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", 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", "tabIndex"], 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.1
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", 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: "17.1
|
|
75
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1
|
|
74
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: ConditionsComponent, deps: [{ token: i1.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
75
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", 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-outlined-button-container-height: 24px;--mdc-protected-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: "17.1
|
|
77
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", 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-outlined-button-container-height: 24px;--mdc-protected-button-container-height: 24px
|
|
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-outlined-button-container-height: 24px;--mdc-protected-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: "17.1
|
|
57
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1
|
|
56
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: PrerequisiteFlagConditionComponent, deps: [{ token: i1.FormGenerator }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
57
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", 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/V2/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: "17.1
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", 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/V2/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: [{
|