ng-configcat-publicapi-ui 2.2.1 → 2.3.3

package/ng-configcat-publicapi-ui.metadata.json

@@ -1 +0,0 @@
-{"__symbolic":"module","version":4,"exports":[{"from":"./lib/public-api.service"}],"metadata":{"NgConfigCatPublicApiUIModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":38,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ProductSelectComponent"},{"__symbolic":"reference","name":"ConfigSelectComponent"},{"__symbolic":"reference","name":"EnvironmentSelectComponent"},{"__symbolic":"reference","name":"SettingSelectComponent"},{"__symbolic":"reference","name":"SettingItemComponent"},{"__symbolic":"reference","name":"AuthorizationComponent"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵg"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵi"},{"__symbolic":"reference","name":"ɵj"},{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"},{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵn"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":58,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":59,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":60,"character":4},{"__symbolic":"reference","module":"@angular/platform-browser/animations","name":"BrowserAnimationsModule","line":61,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":62,"character":4},{"__symbolic":"reference","module":"ng-configcat-publicapi","name":"ApiModule","line":63,"character":4},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":64,"character":4},{"__symbolic":"reference","module":"@angular/material/core","name":"MatOptionModule","line":65,"character":4},{"__symbolic":"reference","module":"@angular/material/select","name":"MatSelectModule","line":66,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":67,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":68,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":69,"character":4},{"__symbolic":"reference","module":"@angular/material/tooltip","name":"MatTooltipModule","line":70,"character":4},{"__symbolic":"reference","module":"@angular/material/chips","name":"MatChipsModule","line":71,"character":4},{"__symbolic":"reference","module":"@angular/material/autocomplete","name":"MatAutocompleteModule","line":72,"character":4},{"__symbolic":"reference","module":"@angular/cdk/drag-drop","name":"DragDropModule","line":73,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":74,"character":4},{"__symbolic":"reference","module":"@angular/material/snack-bar","name":"MatSnackBarModule","line":75,"character":4},{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialogModule","line":76,"character":4},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":77,"character":4}],"exports":[{"__symbolic":"reference","module":"ng-configcat-publicapi","name":"ApiModule","line":80,"character":4},{"__symbolic":"reference","name":"AuthorizationComponent"},{"__symbolic":"reference","name":"ProductSelectComponent"},{"__symbolic":"reference","name":"ConfigSelectComponent"},{"__symbolic":"reference","name":"EnvironmentSelectComponent"},{"__symbolic":"reference","name":"SettingSelectComponent"},{"__symbolic":"reference","name":"SettingItemComponent"}]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]},"statics":{"forRoot":{"__symbolic":"function","parameters":["configurationFactory"],"value":{"ngModule":{"__symbolic":"reference","name":"NgConfigCatPublicApiUIModule"},"providers":[{"provide":{"__symbolic":"reference","name":"ɵc"},"useFactory":{"__symbolic":"reference","name":"configurationFactory"}}]}}}},"SettingItemComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"configcat-setting-item","template":"<configcat-setting-list [canEditSetting]=\"canEditSetting\" [canDeleteSetting]=\"canDeleteSetting\"\r\n    [onSave]=\"handleSave\" [loadSettingValues]=\"loadSettingValues\"\r\n    (editSettingRequested)=\"onEditSettingRequested($event)\" (deleteSettingRequested)=\"onDeleteSettingRequested($event)\"\r\n    [deleteSettingText]=\"deleteSettingText\"\r\n    [showEnvironmentName]=\"showEnvironmentName\" (formValuesChanged)=\"onFormValuesChanged()\">\r\n</configcat-setting-list>","styles":[".container{font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;background-color:#f3f3f3;border:1px solid rgba(0,0,0,.12);border-radius:4px;margin:1em 0}.container .setting-full{position:relative;display:flex;flex-wrap:nowrap}.container .setting-full .setting-details{display:flex;flex-direction:column;width:400px;padding:1em 0 1em 1em}.container .setting-full .setting-details>*{margin:.5em}.container .setting-full .setting-details .setting-name{flex-direction:row}.container .setting-full .setting-details .setting-name .name{font-weight:700;word-wrap:break-word;max-width:100%}.container .setting-full .setting-details .setting-key{word-wrap:break-word}.container .setting-full .setting-details .description{font-size:.8em}.container .setting-full .setting-details code{background-color:#d3d3d3;padding:3px 6px}.container .setting-full .rules-list{width:100%;padding:1em}.container .setting-full .targeting-button{margin-left:1rem;margin-bottom:1em}.all-other{min-height:40px;justify-content:flex-start;border:1px solid #d5d5d5;border-radius:4px;background-color:#fff;margin:.5em 1em;padding:4px 0 4px .5em}.all-other .chip{background-color:#67b1fc3d}.all-other .served-value{margin-left:auto;min-width:100px}.end{margin-left:auto}.flex{display:flex;flex-wrap:wrap;align-items:center}.show-hide-toggle{margin-left:1em;cursor:pointer}@media (max-width:1200px){.setting-full .setting-details{width:300px}}@media (max-width:700px){.setting-full{flex-wrap:wrap}.setting-full .setting-details{padding:.2em 0 .2em .2em}.setting-full .all-other{margin:.5em .3em}}"]}]}],"members":{"productId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"environmentId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"configId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"settingId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"canEditSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"canDeleteSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"deleteSettingText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"showEnvironmentName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"editSettingRequested":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":3}}]}],"deleteSettingRequested":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":3}}]}],"loadSucceeded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":3}}]}],"loadFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":29,"character":3}}]}],"saveSucceeded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":30,"character":3}}]}],"saveFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3}}]}],"formValuesChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":33,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"}]}],"ngOnInit":[{"__symbolic":"method"}],"onEditSettingRequested":[{"__symbolic":"method"}],"onDeleteSettingRequested":[{"__symbolic":"method"}],"onFormValuesChanged":[{"__symbolic":"method"}]}},"AuthorizationComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"configcat-authorization","template":"<form [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\r\n    <div class=\"container\">\r\n        <div class=\"form\">\r\n            <p>\r\n                <a href=\"https://app.configcat.com/my-account/public-api-credentials\" target=\"_blank\">\r\n                    Get your Basic Auth user name and password</a> to access ConfigCat Public API.\r\n                <br /><br />\r\n                <b>Note!</b> Your ConfigCat account's email address and password will not work here.\r\n            </p>\r\n\r\n            <mat-form-field class=\"form-field\">\r\n                <mat-label>Basic auth user name</mat-label>\r\n                <input matInput placeholder=\"Basic auth user name\" formControlName=\"basicAuthUsername\">\r\n                <mat-error *ngIf=\"formGroup.controls.basicAuthUsername.invalid\">\r\n                    {{FormHelper.getErrorMessage(formGroup.controls.basicAuthUsername)}}\r\n                </mat-error>\r\n            </mat-form-field>\r\n            <mat-form-field class=\"form-field\">\r\n                <mat-label>Basic auth password</mat-label>\r\n                <input matInput placeholder=\"Basic auth password\" formControlName=\"basicAuthPassword\" type=\"password\"\r\n                    autocomplete=\"current-password\">\r\n                <mat-error *ngIf=\"formGroup.controls.basicAuthPassword.invalid\">\r\n                    {{FormHelper.getErrorMessage(formGroup.controls.basicAuthPassword)}}\r\n                </mat-error>\r\n            </mat-form-field>\r\n            <div>\r\n                <button mat-raised-button color=\"primary\" type=\"submit\" class=\"submit\">Authorize</button>\r\n                <mat-error *ngIf=\"formGroup.invalid && formGroup.errors && formGroup.errors.invalidAuthorization\">\r\n                    {{formGroup.errors.invalidAuthorization}}</mat-error>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</form>","styles":[".container{display:flex;margin:8px}.form{width:100%}.form-field{width:100%;margin-bottom:8px}.submit{margin-top:8px;margin-bottom:8px}"]}]}],"members":{"basePath":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"authorized":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":14,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":18,"character":25},{"__symbolic":"reference","name":"ɵd"}]}],"ngOnInit":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}]}},"ProductSelectComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"configcat-product-select","template":"<mat-form-field class=\"form-field\">\r\n    <mat-select placeholder=\"Product\" [formControl]=\"valueFormControl\" name=\"productValue\">\r\n        <mat-option *ngFor=\"let product of products\" [value]=\"product.productId\">{{product.name}}\r\n        </mat-option>\r\n    </mat-select>\r\n</mat-form-field>","styles":[".form-field{width:100%}"]}]}],"members":{"valueFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ConfigSelectComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"configcat-config-select","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":12,"character":15},"useExisting":{"__symbolic":"reference","name":"ConfigSelectComponent"},"multi":true}],"template":"<mat-form-field class=\"form-field\">\r\n    <mat-select placeholder=\"Config\" [formControl]=\"valueFormControl\" *ngIf=\"configs\" name=\"value\">\r\n        <mat-option *ngFor=\"let config of configs\" [value]=\"config.configId\">{{config.name}}</mat-option>\r\n    </mat-select>\r\n</mat-form-field>","styles":[".form-field{width:100%}"]}]}],"members":{"valueFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"productId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"reloadConfigs":[{"__symbolic":"method"}]}},"EnvironmentSelectComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"configcat-environment-select","template":"<mat-form-field class=\"form-field\">\r\n    <mat-select placeholder=\"Environment\" [formControl]=\"valueFormControl\" *ngIf=\"environments\" name=\"value\">\r\n        <mat-option *ngFor=\"let environment of environments\" [value]=\"environment.environmentId\">{{environment.name}}\r\n        </mat-option>\r\n    </mat-select>\r\n</mat-form-field>","styles":[".form-field{width:100%}"]}]}],"members":{"valueFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"productId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"reloadEnvironments":[{"__symbolic":"method"}]}},"SettingSelectComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"configcat-setting-select","template":"<mat-form-field class=\"form-field\">\r\n    <mat-select placeholder=\"Feature flag or setting\" [formControl]=\"valueFormControl\" *ngIf=\"settings\" name=\"value\">\r\n        <mat-option *ngFor=\"let setting of settings\" [value]=\"setting.settingId\">{{setting.name}}\r\n        </mat-option>\r\n    </mat-select>\r\n</mat-form-field>","styles":[".form-field{width:100%}"]}]}],"members":{"valueFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"configId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵd"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"reloadSettings":[{"__symbolic":"method"}]}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"base","template":"<div></div>"}]}],"members":{"basePath":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":3}}]}],"basicAuthUsername":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"basicAuthPassword":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵb"}]}],"createProductsService":[{"__symbolic":"method"}],"createConfigsService":[{"__symbolic":"method"}],"createEnvironmentsService":[{"__symbolic":"method"}],"createSettingsService":[{"__symbolic":"method"}],"createSettingValuesService":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":10,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":15,"character":9}}]],"parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":14,"character":28},{"__symbolic":"reference","name":"ɵc"}]}],"createMeService":[{"__symbolic":"method"}],"createProductsService":[{"__symbolic":"method"}],"createConfigsService":[{"__symbolic":"method"}],"createEnvironmentsService":[{"__symbolic":"method"}],"createSettingsService":[{"__symbolic":"method"}],"createSettingValuesService":[{"__symbolic":"method"}],"createIntegrationLinksService":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1}}],"members":{}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"configcat-setting-list","template":"<form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\" *ngIf=\"!loading\">\r\n  <div class=\"wrapper\" *ngFor=\"let settingValueFromGroup of settingValuesFormArray().controls; let i = index\">\r\n    <setting [formGroup]=\"settingValueFromGroup\" [readOnly]=\"readOnly\"\r\n             [canEditSetting]=\"canEditSetting\" [canDeleteSetting]=\"canDeleteSetting\"\r\n             (editSettingRequested)=\"onEditSettingRequested($event)\"\r\n             (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" [deleteSettingText]=\"deleteSettingText\"\r\n             [showEnvironmentName]=\"showEnvironmentName\">\r\n    </setting>\r\n  </div>\r\n\r\n  <div class=\"save\" *ngIf=\"!readOnly && !submitting && formGroup.dirty\">\r\n    <div class=\"feedback\" *ngIf=\"formGroup.touched && formGroup.invalid && showFeedBackMessage\">\r\n      <div class=\"error\" *ngIf=\"formGroup.errors && formGroup.errors.internalServerError\">\r\n        <span>Something went wrong and we could not save your settings. You can try again or <a\r\n             href=\"https://configcat.com/support\" target=\"_blank\" rel=\"noopener noreferrer\">contact us.</a></span>\r\n      </div>\r\n      <div class=\"error\" *ngIf=\"!formGroup.errors || !formGroup.errors.internalServerError\">\r\n        <span>Oh no! A feature flag has invalid or missing data.</span>\r\n      </div>\r\n    </div>\r\n    <button type=\"button\" mat-stroked-button *ngIf=\"!showRevertQuestion\" (click)=\"showRevertQuestion = true\">\r\n      <mat-icon>history</mat-icon><span>Revert changes</span>\r\n    </button>\r\n    <div *ngIf=\"showRevertQuestion\">\r\n      <span class=\"revert\">Revert to last saved state?</span>\r\n      <button type=\"button\" class=\"yes\" mat-stroked-button (click)=\"handleRevertYes()\">Yes</button>\r\n      <button type=\"button\" mat-stroked-button (click)=\"handleRevertCancel()\">No</button>\r\n    </div>\r\n    <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\r\n      <mat-icon>backup</mat-icon> <span> Save & publish changes</span>\r\n    </button>\r\n  </div>\r\n</form>\r\n","styles":[".wrapper{background-color:#f3f3f3;border:1px solid rgba(0,0,0,.12);border-radius:4px;margin:1em 0}.show-hide a{cursor:pointer;font-size:.8rem}.save{position:sticky;bottom:0;min-height:38px;padding:.5rem .5rem .5rem 0;background-color:#fff;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-end;z-index:1000}.save .save-button{-webkit-animation:shadow-pulse 1s 3;animation:shadow-pulse 1s 3;margin-left:1rem}.save>*{margin:.3em}.save .revert{margin:0 16px;font-size:14px}.save .yes{margin:0 5px}.error{background-color:#a32b2d;color:#fff;padding:5px;font-size:.9em}.error a{color:#fff;text-decoration:underline}@media (max-width:700px){.save{padding:.5rem 0}}"]}]}],"members":{"canEditSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"canDeleteSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"onSave":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"loadSettingValues":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"deleteSettingText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"showEnvironmentName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"editSettingRequested":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":3}}]}],"deleteSettingRequested":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":3}}]}],"formValuesChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","module":"@angular/material/snack-bar","name":"MatSnackBar","line":43,"character":22},{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialog","line":44,"character":20}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"reloadSettingValues":[{"__symbolic":"method"}],"createFormGroup":[{"__symbolic":"method"}],"settingValuesFormArray":[{"__symbolic":"method"}],"submit":[{"__symbolic":"method"}],"updateSettingValues":[{"__symbolic":"method"}],"handleRevertYes":[{"__symbolic":"method"}],"handleRevertCancel":[{"__symbolic":"method"}],"onEditSettingRequested":[{"__symbolic":"method"}],"onDeleteSettingRequested":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":8,"character":37}]}],"createSettingValuesFormGroup":[{"__symbolic":"method"}],"createSettingValueFormGroup":[{"__symbolic":"method"}],"createRolloutPercentageItemFormGroup":[{"__symbolic":"method"}],"createRolloutRuleFormGroup":[{"__symbolic":"method"}],"getValidatorsForSettingType":[{"__symbolic":"method"}],"getAllRolloutRules":[{"__symbolic":"method"}],"getComparisonAttributes":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"setting","template":"<div class=\"setting-full\"\r\n  [formGroup]=\"formGroup\">\r\n  <div class=\"delete\" (click)=\"deleteSetting()\" *ngIf=\"canDeleteSetting\" [matTooltip]=\"deleteSettingText\"\r\n       data-robot=\"deleteSetting\">\r\n    <mat-icon>cancel</mat-icon>\r\n  </div>\r\n  <div class=\"setting-header flex\">\r\n    <div class=\"setting-name flex\">\r\n      <div class=\"name\" data-robot=\"settingName\">\r\n        {{setting().name}}\r\n        <span *ngIf=\"showEnvironmentName\"> ({{environment().name}})</span>\r\n      </div>\r\n      <div class=\"edit\" matTooltip=\"Edit name and description\" (click)=\"editSetting()\" *ngIf=\"canEditSetting\"\r\n           data-robot=\"renameSetting\">\r\n        <mat-icon>edit</mat-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"setting-content\">\r\n    <div class=\"setting-details\">\r\n      <div class=\"setting-key\"><code data-robot=\"settingKey\">{{setting().key}}</code></div>\r\n      <span *ngIf=\"setting().hint\" class=\"description\">{{setting().hint}}</span>\r\n    </div>\r\n\r\n    <div class=\"rules-list\">\r\n      <div>\r\n        <configcat-rollout-rules *ngIf=\"rolloutRules().controls.length !== 0\" [formGroup]=\"formGroup\">\r\n        </configcat-rollout-rules>\r\n      </div>\r\n\r\n      <configcat-rollout-percentage-items *ngIf=\"rolloutPercentageItems().controls.length !== 0\"\r\n                                          [formGroup]=\"formGroup\">\r\n      </configcat-rollout-percentage-items>\r\n\r\n      <div class=\"all-other flex\">\r\n        <div *ngIf=\"rolloutPercentageItems().length === 0 && rolloutRules().length !== 0\"\r\n             data-tooltip=\"This value will be served to all users who the above rules don't apply.\">\r\n          <mat-chip-list>\r\n            <mat-chip class=\"chip\">To all other users, serve:</mat-chip>\r\n          </mat-chip-list>\r\n        </div>\r\n        <div *ngIf=\"rolloutPercentageItems().length !== 0\"\r\n             data-tooltip=\"This fallback value will be served in case the user can't be identified.\">\r\n          <mat-chip-list>\r\n            <mat-chip class=\"chip\">To unidentified users, serve:</mat-chip>\r\n          </mat-chip-list>\r\n        </div>\r\n        <div *ngIf=\"rolloutPercentageItems().length === 0 && rolloutRules().length === 0\">\r\n          <mat-chip-list>\r\n            <mat-chip class=\"chip\">To all users, serve:</mat-chip>\r\n          </mat-chip-list>\r\n        </div>\r\n        <configcat-value class=\"served-value\" [valueFormControl]=\"value()\" [setting]=\"setting()\">\r\n        </configcat-value>\r\n      </div>\r\n      <div class=\"buttons\">\r\n        <button type=\"button\" class=\"sige-button targeting-button\" (click)=\"addRolloutRule()\" *ngIf=\"!readOnly\">\r\n          {{rolloutRules().length === 0 ? 'Target specific users' : 'Add new targeting rule'}}\r\n        </button>\r\n        <button type=\"button\" class=\"sige-button targeting-button\" (click)=\"addRolloutPercentageItem()\"\r\n                *ngIf=\"!readOnly\"\r\n                [disabled]=\"setting().settingType === SettingType.Boolean && rolloutPercentageItems().length !== 0\">\r\n          {{rolloutPercentageItems().length === 0 ? 'Target % of users' : 'Add new % option'}}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n","styles":[".setting-full{position:relative;display:flex;flex-wrap:nowrap;flex-direction:column;border-radius:3px}.setting-full .delete{position:absolute;right:-15px;top:-10px;color:#d6a9a9;cursor:pointer}.setting-full .delete:hover{color:#ed5251}.setting-full .delete mat-icon{font-size:20px}.setting-full .setting-header{padding:1.5em 1.5em 0}.setting-full .setting-header .setting-name{flex-direction:row}.setting-full .setting-header .setting-name:hover>.edit{visibility:visible}.setting-full .setting-header .setting-name .name{font-weight:700;word-wrap:break-word;max-width:100%}.setting-full .setting-header .setting-name .edit{margin:5px 0 0 5px;cursor:pointer;visibility:hidden;color:grey}.setting-full .setting-header .setting-name .edit:hover{visibility:visible}.setting-full .setting-header .setting-name .edit mat-icon{font-size:18px}.setting-full .setting-header .setting-meta{margin-left:auto;margin-right:14px;font-size:.7em;color:grey}.setting-full .setting-content{display:flex}.setting-full .setting-content .setting-details{display:flex;flex-direction:column;width:400px;padding:0 0 1em 1em}.setting-full .setting-content .setting-details>*{margin:.5em}.setting-full .setting-content .setting-details .integrations{font-size:.8rem}.setting-full .setting-content .setting-details .integrations>div{margin:3px}.setting-full .setting-content .setting-details .integrations>div>a:hover{text-decoration:underline}.setting-full .setting-content .setting-details .setting-key{word-wrap:break-word}.setting-full .setting-content .setting-details .description{font-size:.8em;white-space:pre-wrap;word-wrap:break-word;max-width:300px}.setting-full .setting-content .setting-details code{background-color:#d3d3d3;padding:3px 6px}.setting-full .setting-content .rules-list{width:100%;padding:0 1em 1em}.setting-full .setting-content .targeting-button{margin-left:.5rem;margin-right:.5rem;margin-bottom:1em}.all-other{min-height:40px;justify-content:flex-start;border:1px solid #d5d5d5;border-radius:4px;background-color:#fff;margin:.5em 1em;padding:4px 0 4px .5em}.all-other .chip{background-color:#67b1fc3d}.all-other .served-value{margin-left:auto;min-width:100px}.end{margin-left:auto}.buttons{display:flex;margin-left:.5rem;margin-right:.5rem}.buttons .updated-date{font-size:.7em;margin-left:auto;margin-right:22px;color:grey}.flex{display:flex;flex-wrap:wrap;align-items:center}.show-hide-toggle{margin-left:1em;cursor:pointer}.show-hide-toggle a{font-size:.8rem}.sige-button{background-color:#d9eadc;color:#363636;cursor:pointer;justify-content:center;padding:.375em .75em;text-align:center;white-space:nowrap;border-radius:2px;font-size:.75rem;border:1px solid #dbdbdb;box-shadow:none;display:inline-flex;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif}.sige-button:hover{background-color:#bad0be}.sige-button:disabled{background-color:#fff;color:#b3b3b3}@media (max-width:1200px){.setting-details{width:300px}}@media (max-width:700px){.setting-full .setting-content{flex-wrap:wrap}.setting-full .setting-content .rules-list{padding:0}.buttons{flex-direction:column}.updated-date{display:none}.setting-details{padding:.2em 0 .2em .2em}.all-other{margin:.5em .3em}}"]}]}],"members":{"formGroup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"readOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"canEditSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"canDeleteSetting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"deleteSettingText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"showEnvironmentName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"editSettingRequested":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":19,"character":3}}]}],"deleteSettingRequested":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":20,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵf"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":27,"character":19}]}],"ngOnInit":[{"__symbolic":"method"}],"environment":[{"__symbolic":"method"}],"setting":[{"__symbolic":"method"}],"integrationLinks":[{"__symbolic":"method"}],"rolloutRules":[{"__symbolic":"method"}],"rolloutPercentageItems":[{"__symbolic":"method"}],"value":[{"__symbolic":"method"}],"addRolloutRule":[{"__symbolic":"method"}],"removeRolloutRules":[{"__symbolic":"method"}],"addRolloutPercentageItem":[{"__symbolic":"method"}],"removeRolloutPercentageItems":[{"__symbolic":"method"}],"editSetting":[{"__symbolic":"method"}],"deleteSetting":[{"__symbolic":"method"}]}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"configcat-rollout-percentage-items","template":"<div class=\"percentage-wrapper\" [formGroup]=\"formGroup\">\r\n\r\n    <div class=\"if\" *ngIf=\"rolloutRules().controls.length > 0\">\r\n        <mat-chip-list>\r\n            <mat-chip class=\"chip\">ELSE IF</mat-chip>\r\n        </mat-chip-list>\r\n    </div>\r\n    <div class=\"grow\">\r\n        <div class=\"percentage-row flex\"\r\n            *ngFor=\"let rolloutPercentageItem of rolloutPercentageItems().controls; let i = index\">\r\n            <div class=\"flex\">\r\n                <input type=\"number\" [formControl]=\"rolloutPercentageItem.controls.percentage\"\r\n                    (input)=\"percentageChanged(i)\">%\r\n                <span class=\"users\">of <a href=\"https://configcat.com/docs/advanced/user-object\"\r\n                        target=\"_blank\" rel=\"noopener noreferrer\">users</a>\r\n                </span>\r\n            </div>\r\n\r\n            <div class=\"delete-option\" matTooltip=\"Remove this % option\"\r\n                *ngIf=\"!readOnly && rolloutPercentageItems().controls.length > 2\"\r\n                (click)=\"removeRolloutPercentageItem(i)\">\r\n                <mat-icon>cancel</mat-icon>\r\n            </div>\r\n\r\n            <span data-tooltip=\"The sum of percentages must be equal to 100.\"\r\n                *ngIf=\"(i === rolloutPercentageItems().controls.length -1) && (rolloutPercentageItemsSum().invalid)\">\r\n                <mat-icon color=\"warn\">\r\n                    error_outline\r\n                </mat-icon>\r\n            </span>\r\n\r\n            <div class=\"value flex\">\r\n                <span class=\"value-name\" *ngIf=\"setting().settingType !== SettingType.Boolean\">Served value:</span>\r\n                <configcat-value class=\"served-value\" [valueFormControl]=\"value(rolloutPercentageItem)\" [setting]=\"setting()\">\r\n                </configcat-value>\r\n            </div>\r\n            <div class=\"delete\" matTooltip=\"Remove % options\" (click)=\"removeAll()\" *ngIf=\"!readOnly\">\r\n                <mat-icon>cancel</mat-icon>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>","styles":[".percentage-wrapper{border:1px solid #d5d5d5;background-color:#fff;border-radius:4px;margin:.5em 1em;position:relative;padding:.5em 0;display:flex}.percentage-wrapper .delete{position:absolute;color:#d6a9a9;cursor:pointer;top:-8px;right:-12px}.percentage-wrapper .delete:hover{color:#ed5251}.percentage-wrapper .delete mat-icon{font-size:20px}.percentage-wrapper .delete-option{color:#d6a9a9;cursor:pointer;margin-left:1rem;margin-top:4px}.percentage-wrapper .delete-option:hover{color:#ed5251}.percentage-wrapper .delete-option mat-icon{font-size:20px}.if{display:flex;align-items:center}.if>*{margin:0 .5em}.if .spacing{margin-right:44px}.if .chip{background-color:#67b1fc3d}.grow{flex-grow:1}.percentage-row{min-height:40px;margin-left:.5em}.flex{display:flex;flex-wrap:wrap;align-items:center}.value{margin-left:auto;min-width:100px}.value .value-name{display:none}input{background-color:#fff;border:1px solid #e5e5e5;min-height:28px;width:40px;margin-right:5px;font-size:15px;padding:0 5px;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;font-weight:300}.users{margin-left:20px}@media (max-width:700px){.percentage-wrapper{margin:.5em .3em}}"]}]}],"members":{"formGroup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"readOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"setting":[{"__symbolic":"method"}],"rolloutRules":[{"__symbolic":"method"}],"rolloutPercentageItems":[{"__symbolic":"method"}],"rolloutPercentageItemsSum":[{"__symbolic":"method"}],"value":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor"}],"percentageChanged":[{"__symbolic":"method"}],"updateSum":[{"__symbolic":"method"}],"removeRolloutPercentageItem":[{"__symbolic":"method"}],"removeAll":[{"__symbolic":"method"}]}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"configcat-rollout-rules","template":"<div [formGroup]=\"formGroup\">\r\n    <div cdkDropList (cdkDropListDropped)=\"onDrop($event)\" [cdkDropListDisabled]=\"readOnly\"\r\n        [cdkDropListData]=\"rolloutRules().controls\">\r\n        <div *ngFor=\"let rolloutRule of rolloutRules().controls; trackBy: trackByIndex; let i = index\" cdkDrag>\r\n            <div class=\"targeting-row\">\r\n                <div class=\"fields flex\">\r\n                    <div class=\"drag-handle\" cdkDragHandle data-tooltip=\"Drag here to reorder\" *ngIf=\"!readOnly\">\r\n                        <mat-icon>drag_indicator</mat-icon>\r\n                    </div>\r\n                    <div class=\"if\">\r\n                        <mat-chip-list [class.spacing]=\"i === 0\">\r\n                            <mat-chip class=\"chip\">{{ i === 0 ? 'IF' : 'ELSE IF' }}</mat-chip>\r\n                        </mat-chip-list>\r\n                        <a href=\"https://configcat.com/docs/advanced/user-object\" target=\"_blank\" rel=\"noopener noreferrer\">user's</a>\r\n                    </div>\r\n\r\n                    <select class=\"custom-select attribute-select\" matTooltip=\"Comparison attribute\"\r\n                        matTooltipPosition=\"above\" [matTooltipDisabled]=\"onlyFirstTooltip() && i !== 0\"\r\n                        (change)=\"attributeChanged($event.target.value, rolloutRule.controls.comparisonAttribute)\">\r\n                        <option *ngFor=\"let comparisonAttribute of defaultComparisonAttributes\"\r\n                            [selected]=\"comparisonAttribute === rolloutRule.controls.comparisonAttribute.value\">\r\n                            {{comparisonAttribute}}</option>\r\n                        <option\r\n                            [selected]=\"defaultComparisonAttributes.indexOf(rolloutRule.controls.comparisonAttribute.value) === -1\">\r\n                            Custom\r\n                        </option>\r\n                    </select>\r\n\r\n\r\n                    <span class=\"attribute-span\" data-tooltip=\"Custom user attribute\"\r\n                        [hidden]=\"defaultComparisonAttributes.indexOf(rolloutRule.controls.comparisonAttribute.value) !== -1\">\r\n                        <span class=\"attribute-error\" *ngIf=\"rolloutRule.controls.comparisonAttribute.invalid\">*</span>\r\n                        <input [ngClass]=\"{'invalid': rolloutRule.controls.comparisonAttribute.invalid}\" type=\"text\"\r\n                            matInput [matAutocomplete]=\"auto\" [formControl]=\"rolloutRule.controls.comparisonAttribute\"\r\n                            class=\"attribute\" placeholder=\"e.g. Eye color\">\r\n                    </span>\r\n\r\n                    <mat-autocomplete #auto=\"matAutocomplete\">\r\n                        <mat-option *ngFor=\"let option of comparisonAttributes()\" [value]=\"option\">\r\n                            {{option}}\r\n                        </mat-option>\r\n                    </mat-autocomplete>\r\n\r\n                    <div class=\"select-wrapper\">\r\n                        <select class=\"custom-select\" [formControl]=\"rolloutRule.controls.comparator\"\r\n                            matTooltip=\"Comparator\" matTooltipPosition=\"above\"\r\n                            [matTooltipDisabled]=\"onlyFirstTooltip() && i !== 0\"\r\n                            (change)=\"comparatorChanged(rolloutRule)\">\r\n                            <optgroup label=\"SENSITIVE TEXT\">\r\n                                <option *ngFor=\"let comparator of rolloutRuleComparators.slice(16, 18)\"\r\n                                    [ngValue]=\"comparator.value\">\r\n                                    {{comparator.label}}\r\n                                </option>\r\n                            </optgroup>\r\n                            <optgroup label=\"TEXT\">\r\n                                <option *ngFor=\"let comparator of rolloutRuleComparators.slice(0, 4)\"\r\n                                    [ngValue]=\"comparator.value\">\r\n                                    {{comparator.label}}\r\n                                </option>\r\n                            </optgroup>\r\n                            <optgroup label=\"SEMANTIC VERSION\">\r\n                                <option *ngFor=\"let comparator of rolloutRuleComparators.slice(4, 10)\"\r\n                                    [ngValue]=\"comparator.value\">\r\n                                    {{comparator.label}}\r\n                                </option>\r\n                            </optgroup>\r\n                            <optgroup label=\"NUMBER\">\r\n                                <option *ngFor=\"let comparator of rolloutRuleComparators.slice(10, 16)\"\r\n                                    [ngValue]=\"comparator.value\">\r\n                                    {{comparator.label}}\r\n                                </option>\r\n                            </optgroup>\r\n                        </select>\r\n                        <div [class]=\"getInfoClass(rolloutRule)\" [matTooltip]=\"getInfoTooltip(rolloutRule)\"\r\n                            [matTooltipDisabled]=\"onlyFirstTooltip() && i !== 0\">\r\n                            <a href=\"https://configcat.com/docs/advanced/targeting/#comparator\" target=\"_blank\" rel=\"noopener noreferrer\">\r\n                                <mat-icon>info</mat-icon>\r\n                            </a>\r\n                        </div>\r\n                    </div>\r\n\r\n                    <div class=\"comparison-value\" data-tooltip=\"Comparison value\">\r\n                        <span class=\"error\" *ngIf=\"rolloutRule.controls.comparisonValue.invalid\">*</span>\r\n\r\n                        <input [ngClass]=\"{'invalid': rolloutRule.controls.comparisonValue.invalid}\"\r\n                            [formControl]=\"rolloutRule.controls.comparisonValue\"\r\n                            [type]=\"getComparisonValueType(rolloutRule)\" [placeholder]=\"getPlaceHolder(rolloutRule)\">\r\n                        <div class=\"expand\" matTooltip=\"Pop-out Editor\" (click)=\"popOut(rolloutRule)\" *ngIf=\"getComparisonValueType(rolloutRule)==='text'\">\r\n                            <mat-icon>height</mat-icon>\r\n                        </div>\r\n                    </div>\r\n\r\n                    <div class=\"delete\" matTooltip=\"Remove targeting rule\"\r\n                        [matTooltipDisabled]=\"onlyFirstTooltip() && i !== 0\" *ngIf=\"!readOnly\" (click)=\"removeRule(i)\">\r\n                        <mat-icon>cancel</mat-icon>\r\n                    </div>\r\n                </div>\r\n                <div class=\"value flex\">\r\n                    <div class=\"serve\" *ngIf=\"setting().settingType !== SettingType.Boolean\">\r\n                        <mat-chip-list>\r\n                            <mat-chip class=\"chip\">Serve:</mat-chip>\r\n                        </mat-chip-list>\r\n                    </div>\r\n\r\n                    <configcat-value class=\"served-value\" [valueFormControl]=\"rolloutRule.controls.value\"\r\n                        [setting]=\"setting()\">\r\n                    </configcat-value>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>","styles":[".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)}.targeting-row{border:1px solid #d5d5d5;border-radius:4px;background-color:#fff;margin:.5em 1em;display:flex;padding:.5em 0}.targeting-row,.targeting-row .select-wrapper{position:relative}.targeting-row .info{position:absolute;cursor:pointer;top:-8px;left:166px}.targeting-row .info a{color:#7fb3fd}.targeting-row .info a:hover{color:#0068f0}.targeting-row .info mat-icon{font-size:18px}.targeting-row .warn{position:absolute;cursor:pointer;top:-8px;left:128px}.targeting-row .warn a{color:#fdc67f}.targeting-row .warn a:hover{color:#ff9200}.targeting-row .warn mat-icon{font-size:18px}.chip{background-color:#67b1fc3d}.fields{justify-content:left;max-width:1060px;flex-grow:100}.fields .if{display:flex;align-items:center}.fields .if>*{margin:0 .5em}.fields .if .spacing{margin-right:46px}.fields .attribute-span{margin-left:.5em}.fields .attribute{width:170px;background-color:#fff;border:1px solid #e5e5e5;min-height:28px;min-width:170px;font-size:15px;padding:0 10px;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;font-weight:300}.fields .invalid{border:1px solid #ff5252}.fields .attribute-error{color:#ff5252;margin-right:5px}.fields .delete{position:absolute;color:#d6a9a9;cursor:pointer;top:-8px;right:-12px;z-index:999}.fields .delete:hover{color:#ed5251}.fields .delete mat-icon{font-size:20px}.fields .drag-handle{position:absolute;cursor:-webkit-grab;cursor:-moz-grab;left:-20px;top:14px}.fields .drag-handle mat-icon{font-size:20px}.fields .custom-select{margin-left:.5em;width:170px;background-color:#fff;border:1px solid #e5e5e5;min-height:30px;min-width:170px;font-size:.8em;padding:0 5px;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;font-weight:300}.fields .attribute-select{min-width:100px;width:100px;margin-left:0}.fields .comparison-value{flex-grow:100;min-width:200px;display:flex;align-items:center;margin-left:.5em}.fields .comparison-value .error{color:#ff5252;margin:0 5px}.fields .comparison-value input{background-color:#fff;border:1px solid #e5e5e5;min-height:28px;min-width:170px;flex-grow:100;font-size:15px;padding:0 30px 0 10px;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;font-weight:300}.fields .comparison-value .invalid{border:1px solid #ff5252}.value{margin-left:auto;flex-wrap:nowrap}.value .serve{margin:0 5px}.warn{padding-left:3em;font-size:.8em}.flex{display:flex;flex-wrap:wrap;align-items:center}.expand{position:absolute;right:2px;font-size:8px;cursor:pointer;margin-left:-28px;z-index:1;color:#b3b3b3;background-color:#fff}.expand mat-icon{transform:rotate(45deg)}@media (max-width:1200px){.targeting-row{flex-wrap:wrap}.targeting-row .fields{max-width:500px}}@media (max-width:700px){.targeting-row{flex-direction:column;margin:.5em .3em}.targeting-row .help{left:161px}.targeting-row .fields{flex-direction:column;align-items:stretch}.targeting-row .fields .comparison-value,.targeting-row .fields .custom-select{margin:0}}"]}]}],"members":{"formGroup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"readOnly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialog","line":46,"character":30}]}],"onlyFirstTooltip":[{"__symbolic":"method"}],"setting":[{"__symbolic":"method"}],"rolloutRules":[{"__symbolic":"method"}],"comparisonAttributes":[{"__symbolic":"method"}],"removeRule":[{"__symbolic":"method"}],"onDrop":[{"__symbolic":"method"}],"attributeChanged":[{"__symbolic":"method"}],"getPlaceHolder":[{"__symbolic":"method"}],"getComparisonValueType":[{"__symbolic":"method"}],"getInfoClass":[{"__symbolic":"method"}],"getInfoTooltip":[{"__symbolic":"method"}],"comparatorChanged":[{"__symbolic":"method"}],"isListType":[{"__symbolic":"method"}],"validateSemVer":[{"__symbolic":"method"}],"validateSemVerList":[{"__symbolic":"method"}],"popOut":[{"__symbolic":"method"}],"trackByIndex":[{"__symbolic":"method"}]}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"configcat-value","template":"<div class=\"flex\">\r\n  <div class=\"container\" [ngSwitch]=\"setting.settingType\">\r\n    <div *ngSwitchCase=\"SettingType.String\" class=\"with-validation\">\r\n      <span *ngIf=\"valueFormControl.invalid\" class=\"error\">*</span>\r\n      <input [ngClass]=\"{'invalid': valueFormControl.invalid}\" type=\"text\"\r\n             [formControl]=\"valueFormControl\" placeholder=\"my value\" name=\"value\">\r\n      <div class=\"expand\" (click)=\"popOut()\" matTooltip=\"Pop-out Editor\">\r\n        <mat-icon>height</mat-icon>\r\n      </div>\r\n    </div>\r\n    <div *ngSwitchCase=\"SettingType.Int\" class=\"with-validation\">\r\n      <span *ngIf=\"valueFormControl.invalid\" class=\"error\">*</span>\r\n      <input [ngClass]=\"{'invalid': valueFormControl.invalid}\" type=\"number\" [formControl]=\"valueFormControl\"\r\n             placeholder=\"42\" name=\"value\" />\r\n    </div>\r\n    <div *ngSwitchCase=\"SettingType.Double\" class=\"with-validation\">\r\n      <span *ngIf=\"valueFormControl.invalid\" class=\"error\">*</span>\r\n      <input [ngClass]=\"{'invalid': valueFormControl.invalid}\" type=\"number\" [formControl]=\"valueFormControl\"\r\n             placeholder=\"3.14\" name=\"value\">\r\n    </div>\r\n    <div *ngSwitchCase=\"SettingType.Boolean\" class=\"toggle\">\r\n      <label class=\"switch\">\r\n        <input type=\"checkbox\" [formControl]=\"valueFormControl\" name=\"value\" />\r\n        <span class=\"slider round\"></span>\r\n      </label>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"setting.settingType === SettingType.Boolean\" class=\"spacer\"></div>\r\n\r\n</div>\r\n","styles":[".switch{position:relative;width:66px;height:30px;margin-left:4px;margin-top:0;margin-bottom:0}.switch input{display:none}.slider{cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ff5252;width:66px;height:30px}.slider,.slider:before{position:absolute;transition:.4s}.slider:before{content:\"\";height:22px;width:22px;left:4px;bottom:4px;background-color:#fff}input:checked+.slider{background-color:#9acd32}input:focus+.slider{box-shadow:0 0 1px #9acd32}input:checked+.slider:before{transform:translateX(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%)}",".flex{display:flex;margin-right:20px;align-items:center}.flex .spacer{width:15px}.flex .container .with-validation{display:flex;flex-wrap:nowrap}.flex .container .toggle{width:66px;height:30px}.flex .container input{background-color:#fff;border:1px solid #e5e5e5;min-height:28px;font-size:15px;padding:0 30px 0 10px;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;font-weight:300;min-width:170px}.flex .container .invalid{border:1px solid #ff5252}.flex .container .error{color:#ff5252;margin-right:5px}@media (max-width:1200px){.flex .container input{min-width:auto}}.flex .variationId{margin-left:5px;cursor:pointer;color:#888;display:flex;align-items:center}.flex .expand{position:relative;top:2px;height:24px;cursor:pointer;margin-left:-28px;z-index:1;color:#b3b3b3;background-color:#fff}.flex .expand mat-icon{transform:rotate(45deg)}"]}]}],"members":{"valueFormControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"setting":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/material/dialog","name":"MatDialog","line":22,"character":30}]}],"popOut":[{"__symbolic":"method"}]}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"configcat-reason-dialog","template":"<h3 mat-dialog-title>Add notes</h3>\r\n<p>This will appear in the Why column of the Audit Log.</p>\r\n<form [formGroup]=\"formGroup\" (ngSubmit)=\"handleSaveButton()\">\r\n  <div mat-dialog-content class=\"container\">\r\n    <mat-form-field appearance=\"outline\">\r\n      <mat-label></mat-label>\r\n      <textarea matInput formControlName=\"reason\" name=\"reason\" placeholder=\"I'm changing settings because...\"\r\n        rows=\"3\"></textarea>\r\n      <mat-error *ngIf=\"formGroup.controls.reason.invalid\">The field is required.</mat-error>\r\n    </mat-form-field>\r\n  </div>\r\n  <br>\r\n  <div mat-dialog-actions>\r\n    <button type=\"submit\" style=\"margin-right: 10px;\" mat-raised-button color=\"primary\">Add notes & Save</button>\r\n    <button type=\"button\" mat-raised-button (click)=\"cancel()\">Cancel</button>\r\n  </div>\r\n</form>","styles":[".container>*{width:100%}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"MatDialogRef","module":"@angular/material/dialog","arguments":[{"__symbolic":"reference","name":"ɵk"}]},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":15,"character":25}]}],"ngOnInit":[{"__symbolic":"method"}],"handleSaveButton":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"configcat-concurrent-dialog","template":"<h3 mat-dialog-title>Concurrent update detected</h3>\r\n<p>\r\n    Somebody updated the feature flags & settings while you were editing them.\r\n</p>\r\n<ul>\r\n    <li>\r\n        To discard your local changes and reload the updated values, click <strong>Discard my changes & reload</strong>\r\n    </li>\r\n    <li>\r\n        To save you local values and overwrite the remote changes, click <strong>Save anyway</strong>\r\n    </li>\r\n</ul>\r\n<p>For more info about the changes check the <a [routerLink]=\"['/auditlog']\" target=\"_blank\" rel=\"noopener noreferrer\" >audit logs</a> in a new tab.</p>\r\n<div mat-dialog-actions>\r\n    <button type=\"button\" style=\"margin-right: 10px;\" mat-raised-button color=\"primary\" (click)=\"discard()\">Discard\r\n        local changes & reload</button>\r\n    <button type=\"button\" mat-raised-button (click)=\"save()\">Save anyway</button>\r\n</div>","styles":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"MatDialogRef","module":"@angular/material/dialog","arguments":[{"__symbolic":"reference","name":"ɵl"}]}]}],"ngOnInit":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"discard":[{"__symbolic":"method"}]}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"configcat-save-snackbar","template":"<p class=\"header\">Settings saved successfully.</p>","styles":["p{text-align:center;font-weight:700}.header{font-size:1.2em}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵn":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"configcat-expand-dialog","template":"<div mat-dialog-content class=\"container\">\r\n\r\n    <mat-form-field appearance=\"outline\" *ngIf=\"!data.multiline\">\r\n        <mat-label></mat-label>\r\n        <textarea matInput [formControl]=\"data.control\" rows=\"15\"></textarea>\r\n    </mat-form-field>\r\n    <div [formGroup]=\"formGroup\" *ngIf=\"data.multiline\">\r\n        <div *ngFor=\"let valueControl of values().controls; let i = index;\" class=\"value-field\">\r\n            <mat-form-field appearance=\"outline\">\r\n                <input matInput [formControl]=\"valueControl\" rows=\"15\" />\r\n            </mat-form-field>\r\n            <button (click)=\"remove(i)\" mat-icon-button type=\"button\">\r\n                <mat-icon>delete_outline</mat-icon>\r\n            </button>\r\n        </div>\r\n        <button (click)=\"add()\" mat-icon-button type=\"button\">\r\n            <mat-icon>add</mat-icon>\r\n        </button>\r\n    </div>\r\n</div>\r\n<div mat-dialog-actions>\r\n    <button type=\"button\" mat-raised-button color=\"primary\" (click)=\"close()\">Done</button>\r\n</div>","styles":[".container>*{width:100%}.container>* .value-field{display:flex;font-size:12px;flex-wrap:nowrap}.container>* .value-field mat-form-field{flex-grow:1}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":19,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/material/dialog","name":"MAT_DIALOG_DATA","line":19,"character":12}]}]],"parameters":[{"__symbolic":"reference","name":"MatDialogRef","module":"@angular/material/dialog","arguments":[{"__symbolic":"reference","name":"ɵn"}]},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":18,"character":25},{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"values":[{"__symbolic":"method"}],"buildFormGroup":[{"__symbolic":"method"}],"add":[{"__symbolic":"method"}],"remove":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"close":[{"__symbolic":"method"}]}}},"origins":{"NgConfigCatPublicApiUIModule":"./lib/ng-configcat-publicapi-ui.module","SettingItemComponent":"./lib/setting-item/setting-item.component","AuthorizationComponent":"./lib/authorization/authorization.component","ProductSelectComponent":"./lib/selects/product-select/product-select.component","ConfigSelectComponent":"./lib/selects/config-select/config-select.component","EnvironmentSelectComponent":"./lib/selects/environment-select/environment-select.component","SettingSelectComponent":"./lib/selects/setting-select/setting-select.component","ɵa":"./lib/base/base.component","ɵb":"./lib/_services/public-api.service","ɵc":"./lib/configuration","ɵd":"./lib/_services","ɵe":"./lib/setting-list/setting-list.component","ɵf":"./lib/_services/setting-list-form-helper","ɵg":"./lib/setting-list/setting/setting.component","ɵh":"./lib/setting-list/setting/rollout-percentage-items/rollout-percentage-items.component","ɵi":"./lib/setting-list/setting/rollout-rules/rollout-rules.component","ɵj":"./lib/setting-list/setting/value/value.component","ɵk":"./lib/dialogs/reason-dialog/reason-dialog.component","ɵl":"./lib/dialogs/concurrent-dialog/concurrent-dialog.component","ɵm":"./lib/dialogs/save-snackbar/save-snackbar.component","ɵn":"./lib/dialogs/expand-dialog/expand-dialog.component"},"importAs":"ng-configcat-publicapi-ui"}