ng-configcat-publicapi-ui 5.0.1 → 5.0.3
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.
|
@@ -1441,7 +1441,9 @@ function provideConfigCatPublicApiUi() {
|
|
|
1441
1441
|
},
|
|
1442
1442
|
{
|
|
1443
1443
|
provide: MAT_SELECT_CONFIG,
|
|
1444
|
-
useValue: {
|
|
1444
|
+
useValue: {
|
|
1445
|
+
overlayPanelClass: "select-overlay-panel",
|
|
1446
|
+
},
|
|
1445
1447
|
},
|
|
1446
1448
|
{
|
|
1447
1449
|
provide: MAT_TOOLTIP_DEFAULT_OPTIONS,
|
|
@@ -2478,7 +2480,7 @@ class SettingComponent {
|
|
|
2478
2480
|
+ this.model().setting.settingId);
|
|
2479
2481
|
}
|
|
2480
2482
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SettingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2481
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SettingComponent, isStandalone: true, selector: "app-setting", inputs: { dashboardBasePath: { classPropertyName: "dashboardBasePath", publicName: "dashboardBasePath", isSignal: true, isRequired: false, transformFunction: null }, productId: { classPropertyName: "productId", publicName: "productId", isSignal: true, isRequired: true, transformFunction: null }, environmentId: { classPropertyName: "environmentId", publicName: "environmentId", isSignal: true, isRequired: true, transformFunction: null }, configId: { classPropertyName: "configId", publicName: "configId", isSignal: true, isRequired: true, transformFunction: null }, featureFlagLimitations: { classPropertyName: "featureFlagLimitations", publicName: "featureFlagLimitations", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, canDeleteSetting: { classPropertyName: "canDeleteSetting", publicName: "canDeleteSetting", isSignal: true, isRequired: false, transformFunction: null }, deleteSettingText: { classPropertyName: "deleteSettingText", publicName: "deleteSettingText", isSignal: true, isRequired: false, transformFunction: null }, showEnvironmentName: { classPropertyName: "showEnvironmentName", publicName: "showEnvironmentName", isSignal: true, isRequired: false, transformFunction: null }, segments: { classPropertyName: "segments", publicName: "segments", isSignal: true, isRequired: true, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { deleteSettingRequested: "deleteSettingRequested", subscriptionLimitReached: "subscriptionLimitReached" }, ngImport: i0, template: "@let settingModel = model();\n\n<div class=\"setting-container\">\n <div class=\"setting-full\" [formGroup]=\"formGroup()\">\n <div class=\"berries\">\n @if (canDeleteSetting()) {\n <div class=\"berry delete\" matTooltip=\"Delete feature flag\" data-robot=\"deleteSetting\" (click)=\"deleteSetting()\">\n <mat-icon class=\"icon-transform-rotate\">cancel</mat-icon>\n </div>\n }\n </div>\n <div class=\"setting-header flex\">\n <div class=\"setting-name flex\">\n <div class=\"name\" data-robot=\"settingName\">\n {{ settingModel.setting.name }}\n @if (showEnvironmentName()) {\n <span class=\"environment-name\">({{ settingModel.environment.name }})</span>\n }\n </div>\n </div>\n </div>\n <div class=\"setting-content\">\n <div class=\"setting-details\">\n <div class=\"setting-key\">\n <code data-robot=\"settingKey\">{{ settingModel.setting.key }}</code>\n </div>\n @if (settingModel.setting.hint) {\n <span class=\"description\">{{ settingModel.setting.hint }}</span>\n }\n <div class=\"integrations\">\n <a target=\"_blank\" rel=\"noopener noreferrer\" [href]=\"getDashboardUrl()\">Open in ConfigCat</a>\n </div>\n </div>\n\n <div class=\"rules-list\">\n <div class=\"rollout-rules\">\n @if (formGroup().controls.rolloutRules.controls.length !== 0) {\n <app-rollout-rules\n [formGroup]=\"formGroup()\"\n [segments]=\"segments()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n </div>\n\n @if (formGroup().controls.rolloutPercentageItems.controls.length !== 0) {\n <app-rollout-percentage-items\n [formGroup]=\"formGroup()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n\n <div class=\"all-other flex\">\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length !== 0\n ) {\n <div\n matTooltip=\"This value will be served to all users who the above rules don't apply.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To all other users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (formGroup().controls.rolloutPercentageItems.length !== 0) {\n <div\n matTooltip=\"This fallback value will be served in case the user can't be identified.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To unidentified users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length === 0\n ) {\n <div>\n <mat-chip-set>\n <mat-chip class=\"chip\">To all users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n <app-value\n class=\"served-value\"\n [valueFormControl]=\"formGroup().controls.value\"\n [setting]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n </div>\n <div class=\"buttons\">\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target specific users\" : \"Add new targeting rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addSegmentRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target segment\" : \"Add new segment rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button\n type=\"button\"\n class=\"targeting-button\"\n [disabled]=\"\n settingModel.setting.settingType === SettingType.Boolean &&\n formGroup().controls.rolloutPercentageItems.length !== 0\n \"\n (click)=\"addRolloutPercentageItem()\">\n {{ formGroup().controls.rolloutPercentageItems.length === 0 ? \"Target % of users\" : \"Add % option\" }}\n </button>\n }\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".setting-container{display:flex;flex-wrap:nowrap}.colorbar{min-width:10px;opacity:var(--environment-color-opacity)}.setting-full{width:calc(100% - 10px);position:relative;display:flex;flex-wrap:nowrap;flex-direction:column;border:1px solid var(--flag-v1-box-border);background-color:var(--flag-v1-box-background)}.setting-full .berries{position:absolute;right:-10px;top:-10px;display:flex}.setting-full .berry{margin-left:3px;cursor:pointer;background-color:var(--page-background-color);height:20px;width:20px;border-radius:50%}.setting-full .berry mat-icon{font-size:20px;height:20px;width:20px;opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .berry:hover mat-icon{opacity:1}.setting-full .delete{color:var(--flag-delete)}.setting-full .edit mat-icon{padding-left:1px}.setting-full .code mat-icon{padding-left:1px}.setting-full .reverse-berry{display:flex;align-items:center;justify-content:center;color:var(--flag-v1-colored-berry)}.setting-full .reverse-berry .berry-container{display:flex;align-items:center;justify-content:center;height:17px;width:17px;border-radius:50%;background-color:var(--flag-v1-colored-berry-background);opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .reverse-berry .berry-container:hover{opacity:1}.setting-full .reverse-berry .berry-container mat-icon{font-size:15px;height:15px;width:15px;opacity:1}.setting-full .setting-header{padding:1.5em .8em 0 1em}.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;margin-right:4px;max-width:100%;font-size:14px}.setting-full .setting-header .setting-name .environment-name{font-weight:400;font-size:14px;padding-top:4px;margin-right:12px;overflow:hidden;text-overflow:ellipsis}.setting-full .setting-header .setting-meta{margin-left:auto;margin-right:14px;font-size:10px;color:var(--flag-meta)}.setting-full .setting-content{display:flex}.setting-full .setting-content .setting-details{display:flex;flex-direction:column;width:400px;padding:0 0 .5em .5em}.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;background-color:var(--flag-v1-key-background);padding:3px 6px;font-size:14px}.setting-full .setting-content .setting-details .description{font-size:11px;white-space:pre-wrap;word-wrap:break-word;max-width:300px}.setting-full .setting-content .rules-list{width:100%;padding:0 .3em .3em 1em}.setting-full .setting-content .targeting-button{margin-left:.5rem;margin-right:.5rem;margin-bottom:1.5em;height:26px!important}.setting-full .all-other{min-height:40px;justify-content:flex-start;border:1px solid var(--flag-v1-rule-border);background-color:var(--flag-v1-rule-background);margin:.5em 1em;padding:4px 0 4px .5em}.setting-full .all-other .chip{background-color:var(--flag-v1-chip-background)}.setting-full .all-other .served-value{margin-left:auto;margin-top:3px;margin-bottom:3px}.end{margin-left:auto}.buttons{display:flex;margin-left:.5rem;margin-right:.5rem}.buttons .updated-date{font-size:10px;margin-left:auto;margin-right:12px;color:var(--flag-meta);display:flex;align-items:center}.buttons .updated-date .history{margin-left:8px}.buttons .updated-date .history mat-icon{font-size:1.8em}.flex{display:flex;flex-wrap:wrap;align-items:center}.show-hide-toggle{margin-left:1em;cursor:pointer}.show-hide-toggle a{font-size:.8rem}.tag-menu-action{display:flex;align-items:center}.tag-select-container{line-height:16px;overflow:unset;max-width:100%;width:fit-content}.watch-wrapper .status{font-size:.7rem}.watch-wrapper .watch{position:relative;display:inline-block;padding:2px 4px;border:1px solid var(--flag-v1-box-border);font-size:.8rem;cursor:pointer;margin-left:3px}.watch-wrapper .watch:hover{background-color:var(--flag-v1-key-background);cursor:pointer}.watch-wrapper .watch:hover .stale-settings{display:inline-block}.watch-wrapper .watch .mat-icon{font-size:15px;height:15px;width:15px;vertical-align:middle}.tags{font-size:.8rem;display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.tags .tag-container{position:relative;max-width:100%;min-width:0}.tags .tag-container:hover .delete-tag{display:block}.tags .delete-tag{position:absolute;color:var(--flag-delete);cursor:pointer;background-color:var(--flag-v1-box-background);display:none;height:14px;width:14px;border-radius:50%;right:-6px;top:-7px;z-index:1}.tags .delete-tag mat-icon{height:14px;width:14px;font-size:14px;opacity:.7}.tags .delete-tag:hover mat-icon{opacity:1}.tags .add-tag{border:1px dashed var(--input-border-color);color:var(--flag-meta);padding:2px 4px}.tags .add-tag:hover{background-color:var(--flag-v1-key-background);cursor:pointer}@media (max-width: 1200px){.setting-details{width:300px!important}}@media (max-width: 920px){.setting-full{width:calc(100% - 5px)}.setting-full .setting-content{flex-wrap:wrap}.setting-full .setting-content .rules-list{padding:0}.setting-full .setting-content .targeting-button{margin-bottom:.5em;margin-top:.5em;padding:.6em 0}.colorbar{min-width:5px}.buttons{flex-direction:column;margin-bottom:.5em;margin-left:.4em;margin-right:.4em}.created-date,.updated-date{display:none}.setting-details{width:100%!important;padding:.2em 0 .2em .2em}.setting-details .description{max-width:none!important}.rollout-rules{margin-bottom:1em}.all-other{margin:1em;padding:7px 0 7px .5em}.all-other .served-value{margin:7px 7px 4px auto}}.targeting-button{background-color:var(--flag-v1-targeting-button-background);color:var(--flag-v1-targeting-button);cursor:pointer;text-transform:uppercase;justify-content:center;padding:.375em .75em;text-align:center;white-space:nowrap;border-radius:2px;font-size:.75rem;border:1px solid var(--flag-v1-box-border);box-shadow:none;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;margin:0 .2rem}.targeting-button:hover{background-color:var(--flag-v1-targeting-button-hover-background)}.targeting-button:disabled{background-color:var(--flag-v1-targeting-button-disabled-background);color:var(--flag-v1-targeting-button-disabled);cursor:auto}@media (max-width: 380px){.targeting-button{font-size:.65rem}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: RolloutRulesComponent, selector: "app-rollout-rules", inputs: ["featureFlagLimitations", "formGroup", "settingModel", "readOnly", "segments"] }, { kind: "component", type: RolloutPercentageItemsComponent, selector: "app-rollout-percentage-items", inputs: ["settingModel", "formGroup", "featureFlagLimitations", "readOnly"] }, { kind: "component", type: MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: ValueComponent, selector: "app-value", inputs: ["valueFormControl", "setting", "featureFlagLimitations"] }] }); }
|
|
2483
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SettingComponent, isStandalone: true, selector: "app-setting", inputs: { dashboardBasePath: { classPropertyName: "dashboardBasePath", publicName: "dashboardBasePath", isSignal: true, isRequired: false, transformFunction: null }, productId: { classPropertyName: "productId", publicName: "productId", isSignal: true, isRequired: true, transformFunction: null }, environmentId: { classPropertyName: "environmentId", publicName: "environmentId", isSignal: true, isRequired: true, transformFunction: null }, configId: { classPropertyName: "configId", publicName: "configId", isSignal: true, isRequired: true, transformFunction: null }, featureFlagLimitations: { classPropertyName: "featureFlagLimitations", publicName: "featureFlagLimitations", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, canDeleteSetting: { classPropertyName: "canDeleteSetting", publicName: "canDeleteSetting", isSignal: true, isRequired: false, transformFunction: null }, deleteSettingText: { classPropertyName: "deleteSettingText", publicName: "deleteSettingText", isSignal: true, isRequired: false, transformFunction: null }, showEnvironmentName: { classPropertyName: "showEnvironmentName", publicName: "showEnvironmentName", isSignal: true, isRequired: false, transformFunction: null }, segments: { classPropertyName: "segments", publicName: "segments", isSignal: true, isRequired: true, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { deleteSettingRequested: "deleteSettingRequested", subscriptionLimitReached: "subscriptionLimitReached" }, ngImport: i0, template: "@let settingModel = model();\n\n<div class=\"setting-container\">\n <div class=\"setting-full\" [formGroup]=\"formGroup()\">\n <div class=\"berries\">\n @if (canDeleteSetting()) {\n <div class=\"berry delete\" matTooltip=\"Delete feature flag\" data-robot=\"deleteSetting\" (click)=\"deleteSetting()\">\n <mat-icon class=\"icon-transform-rotate\">cancel</mat-icon>\n </div>\n }\n </div>\n <div class=\"setting-header flex\">\n <div class=\"setting-name flex\">\n <div class=\"name\" data-robot=\"settingName\">\n {{ settingModel.setting.name }}\n @if (showEnvironmentName()) {\n <span class=\"environment-name\">({{ settingModel.environment.name }})</span>\n }\n </div>\n </div>\n </div>\n <div class=\"setting-content\">\n <div class=\"setting-details\">\n <div class=\"setting-key\">\n <code data-robot=\"settingKey\">{{ settingModel.setting.key }}</code>\n </div>\n @if (settingModel.setting.hint) {\n <span class=\"description\">{{ settingModel.setting.hint }}</span>\n }\n <div class=\"integrations\">\n <a target=\"_blank\" rel=\"noopener noreferrer\" [href]=\"getDashboardUrl()\">Open in ConfigCat</a>\n </div>\n </div>\n\n <div class=\"rules-list\">\n <div class=\"rollout-rules\">\n @if (formGroup().controls.rolloutRules.controls.length !== 0) {\n <app-rollout-rules\n [formGroup]=\"formGroup()\"\n [segments]=\"segments()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n </div>\n\n @if (formGroup().controls.rolloutPercentageItems.controls.length !== 0) {\n <app-rollout-percentage-items\n [formGroup]=\"formGroup()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n\n <div class=\"all-other flex\">\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length !== 0\n ) {\n <div\n matTooltip=\"This value will be served to all users who the above rules don't apply.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To all other users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (formGroup().controls.rolloutPercentageItems.length !== 0) {\n <div\n matTooltip=\"This fallback value will be served in case the user can't be identified.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To unidentified users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length === 0\n ) {\n <div>\n <mat-chip-set>\n <mat-chip class=\"chip\">To all users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n <app-value\n class=\"served-value\"\n [valueFormControl]=\"formGroup().controls.value\"\n [setting]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n </div>\n <div class=\"buttons\">\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target specific users\" : \"Add new targeting rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addSegmentRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target segment\" : \"Add new segment rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button\n type=\"button\"\n class=\"targeting-button\"\n [disabled]=\"\n settingModel.setting.settingType === SettingType.Boolean &&\n formGroup().controls.rolloutPercentageItems.length !== 0\n \"\n (click)=\"addRolloutPercentageItem()\">\n {{ formGroup().controls.rolloutPercentageItems.length === 0 ? \"Target % of users\" : \"Add % option\" }}\n </button>\n }\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".setting-container{display:flex;flex-wrap:nowrap}.colorbar{min-width:10px;opacity:var(--environment-color-opacity)}.setting-full{width:calc(100% - 10px);position:relative;display:flex;flex-wrap:nowrap;flex-direction:column;border:1px solid var(--flag-v1-box-border);background-color:var(--flag-v1-box-background)}.setting-full .berries{position:absolute;right:-10px;top:-10px;display:flex}.setting-full .berry{margin-left:3px;cursor:pointer;background-color:var(--page-background-color);height:20px;width:20px;border-radius:50%}.setting-full .berry mat-icon{font-size:20px;height:20px;width:20px;opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .berry:hover mat-icon{opacity:1}.setting-full .delete{color:var(--flag-delete)}.setting-full .edit mat-icon{padding-left:1px}.setting-full .code mat-icon{padding-left:1px}.setting-full .reverse-berry{display:flex;align-items:center;justify-content:center;color:var(--flag-v1-colored-berry)}.setting-full .reverse-berry .berry-container{display:flex;align-items:center;justify-content:center;height:17px;width:17px;border-radius:50%;background-color:var(--flag-v1-colored-berry-background);opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .reverse-berry .berry-container:hover{opacity:1}.setting-full .reverse-berry .berry-container mat-icon{font-size:15px;height:15px;width:15px;opacity:1}.setting-full .setting-header{padding:1.5em .8em 0 1em}.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;margin-right:4px;max-width:100%;font-size:14px}.setting-full .setting-header .setting-name .environment-name{font-weight:400;font-size:14px;padding-top:4px;margin-right:12px;overflow:hidden;text-overflow:ellipsis}.setting-full .setting-header .setting-meta{margin-left:auto;margin-right:14px;font-size:10px;color:var(--flag-meta)}.setting-full .setting-content{display:flex}.setting-full .setting-content .setting-details{display:flex;flex-direction:column;width:400px;padding:0 0 .5em .5em}.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;background-color:var(--flag-v1-key-background);color:var(--text-color);padding:3px 6px;font-size:14px}.setting-full .setting-content .setting-details .setting-key>code{background-color:var(--flag-v1-key-background)}.setting-full .setting-content .setting-details .description{font-size:11px;white-space:pre-wrap;word-wrap:break-word;max-width:300px}.setting-full .setting-content .rules-list{width:100%;padding:0 .3em .3em 1em}.setting-full .setting-content .targeting-button{margin-left:.5rem;margin-right:.5rem;margin-bottom:1.5em;height:26px!important}.setting-full .all-other{min-height:40px;justify-content:flex-start;border:1px solid var(--flag-v1-rule-border);background-color:var(--flag-v1-rule-background);margin:.5em 1em;padding:4px 0 4px .5em}.setting-full .all-other .chip{background-color:var(--flag-v1-chip-background)}.setting-full .all-other .served-value{margin-left:auto;margin-top:3px;margin-bottom:3px}.end{margin-left:auto}.buttons{display:flex;margin-left:.5rem;margin-right:.5rem}.buttons .updated-date{font-size:10px;margin-left:auto;margin-right:12px;color:var(--flag-meta);display:flex;align-items:center}.buttons .updated-date .history{margin-left:8px}.buttons .updated-date .history mat-icon{font-size:1.8em}.flex{display:flex;flex-wrap:wrap;align-items:center}.show-hide-toggle{margin-left:1em;cursor:pointer}.show-hide-toggle a{font-size:.8rem}.tag-menu-action{display:flex;align-items:center}.tag-select-container{line-height:16px;overflow:unset;max-width:100%;width:fit-content}.watch-wrapper .status{font-size:.7rem}.watch-wrapper .watch{position:relative;display:inline-block;padding:2px 4px;border:1px solid var(--flag-v1-box-border);font-size:.8rem;cursor:pointer;margin-left:3px}.watch-wrapper .watch:hover{background-color:var(--flag-v1-key-background);cursor:pointer}.watch-wrapper .watch:hover .stale-settings{display:inline-block}.watch-wrapper .watch .mat-icon{font-size:15px;height:15px;width:15px;vertical-align:middle}.tags{font-size:.8rem;display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.tags .tag-container{position:relative;max-width:100%;min-width:0}.tags .tag-container:hover .delete-tag{display:block}.tags .delete-tag{position:absolute;color:var(--flag-delete);cursor:pointer;background-color:var(--flag-v1-box-background);display:none;height:14px;width:14px;border-radius:50%;right:-6px;top:-7px;z-index:1}.tags .delete-tag mat-icon{height:14px;width:14px;font-size:14px;opacity:.7}.tags .delete-tag:hover mat-icon{opacity:1}.tags .add-tag{border:1px dashed var(--input-border-color);color:var(--flag-meta);padding:2px 4px}.tags .add-tag:hover{background-color:var(--flag-v1-key-background);cursor:pointer}@media (max-width: 1200px){.setting-details{width:300px!important}}@media (max-width: 920px){.setting-full{width:calc(100% - 5px)}.setting-full .setting-content{flex-wrap:wrap}.setting-full .setting-content .rules-list{padding:0}.setting-full .setting-content .targeting-button{margin-bottom:.5em;margin-top:.5em;padding:.6em 0}.colorbar{min-width:5px}.buttons{flex-direction:column;margin-bottom:.5em;margin-left:.4em;margin-right:.4em}.created-date,.updated-date{display:none}.setting-details{width:100%!important;padding:.2em 0 .2em .2em}.setting-details .description{max-width:none!important}.rollout-rules{margin-bottom:1em}.all-other{margin:1em;padding:7px 0 7px .5em}.all-other .served-value{margin:7px 7px 4px auto}}.targeting-button{background-color:var(--flag-v1-targeting-button-background);color:var(--flag-v1-targeting-button);cursor:pointer;text-transform:uppercase;justify-content:center;padding:.375em .75em;text-align:center;white-space:nowrap;border-radius:2px;font-size:.75rem;border:1px solid var(--flag-v1-box-border);box-shadow:none;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;margin:0 .2rem}.targeting-button:hover{background-color:var(--flag-v1-targeting-button-hover-background)}.targeting-button:disabled{background-color:var(--flag-v1-targeting-button-disabled-background);color:var(--flag-v1-targeting-button-disabled);cursor:auto}@media (max-width: 380px){.targeting-button{font-size:.65rem}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: RolloutRulesComponent, selector: "app-rollout-rules", inputs: ["featureFlagLimitations", "formGroup", "settingModel", "readOnly", "segments"] }, { kind: "component", type: RolloutPercentageItemsComponent, selector: "app-rollout-percentage-items", inputs: ["settingModel", "formGroup", "featureFlagLimitations", "readOnly"] }, { kind: "component", type: MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "component", type: MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: ValueComponent, selector: "app-value", inputs: ["valueFormControl", "setting", "featureFlagLimitations"] }] }); }
|
|
2482
2484
|
}
|
|
2483
2485
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SettingComponent, decorators: [{
|
|
2484
2486
|
type: Component,
|
|
@@ -2493,7 +2495,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImpor
|
|
|
2493
2495
|
MatChipSet,
|
|
2494
2496
|
MatChip,
|
|
2495
2497
|
ValueComponent,
|
|
2496
|
-
], template: "@let settingModel = model();\n\n<div class=\"setting-container\">\n <div class=\"setting-full\" [formGroup]=\"formGroup()\">\n <div class=\"berries\">\n @if (canDeleteSetting()) {\n <div class=\"berry delete\" matTooltip=\"Delete feature flag\" data-robot=\"deleteSetting\" (click)=\"deleteSetting()\">\n <mat-icon class=\"icon-transform-rotate\">cancel</mat-icon>\n </div>\n }\n </div>\n <div class=\"setting-header flex\">\n <div class=\"setting-name flex\">\n <div class=\"name\" data-robot=\"settingName\">\n {{ settingModel.setting.name }}\n @if (showEnvironmentName()) {\n <span class=\"environment-name\">({{ settingModel.environment.name }})</span>\n }\n </div>\n </div>\n </div>\n <div class=\"setting-content\">\n <div class=\"setting-details\">\n <div class=\"setting-key\">\n <code data-robot=\"settingKey\">{{ settingModel.setting.key }}</code>\n </div>\n @if (settingModel.setting.hint) {\n <span class=\"description\">{{ settingModel.setting.hint }}</span>\n }\n <div class=\"integrations\">\n <a target=\"_blank\" rel=\"noopener noreferrer\" [href]=\"getDashboardUrl()\">Open in ConfigCat</a>\n </div>\n </div>\n\n <div class=\"rules-list\">\n <div class=\"rollout-rules\">\n @if (formGroup().controls.rolloutRules.controls.length !== 0) {\n <app-rollout-rules\n [formGroup]=\"formGroup()\"\n [segments]=\"segments()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n </div>\n\n @if (formGroup().controls.rolloutPercentageItems.controls.length !== 0) {\n <app-rollout-percentage-items\n [formGroup]=\"formGroup()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n\n <div class=\"all-other flex\">\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length !== 0\n ) {\n <div\n matTooltip=\"This value will be served to all users who the above rules don't apply.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To all other users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (formGroup().controls.rolloutPercentageItems.length !== 0) {\n <div\n matTooltip=\"This fallback value will be served in case the user can't be identified.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To unidentified users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length === 0\n ) {\n <div>\n <mat-chip-set>\n <mat-chip class=\"chip\">To all users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n <app-value\n class=\"served-value\"\n [valueFormControl]=\"formGroup().controls.value\"\n [setting]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n </div>\n <div class=\"buttons\">\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target specific users\" : \"Add new targeting rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addSegmentRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target segment\" : \"Add new segment rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button\n type=\"button\"\n class=\"targeting-button\"\n [disabled]=\"\n settingModel.setting.settingType === SettingType.Boolean &&\n formGroup().controls.rolloutPercentageItems.length !== 0\n \"\n (click)=\"addRolloutPercentageItem()\">\n {{ formGroup().controls.rolloutPercentageItems.length === 0 ? \"Target % of users\" : \"Add % option\" }}\n </button>\n }\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".setting-container{display:flex;flex-wrap:nowrap}.colorbar{min-width:10px;opacity:var(--environment-color-opacity)}.setting-full{width:calc(100% - 10px);position:relative;display:flex;flex-wrap:nowrap;flex-direction:column;border:1px solid var(--flag-v1-box-border);background-color:var(--flag-v1-box-background)}.setting-full .berries{position:absolute;right:-10px;top:-10px;display:flex}.setting-full .berry{margin-left:3px;cursor:pointer;background-color:var(--page-background-color);height:20px;width:20px;border-radius:50%}.setting-full .berry mat-icon{font-size:20px;height:20px;width:20px;opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .berry:hover mat-icon{opacity:1}.setting-full .delete{color:var(--flag-delete)}.setting-full .edit mat-icon{padding-left:1px}.setting-full .code mat-icon{padding-left:1px}.setting-full .reverse-berry{display:flex;align-items:center;justify-content:center;color:var(--flag-v1-colored-berry)}.setting-full .reverse-berry .berry-container{display:flex;align-items:center;justify-content:center;height:17px;width:17px;border-radius:50%;background-color:var(--flag-v1-colored-berry-background);opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .reverse-berry .berry-container:hover{opacity:1}.setting-full .reverse-berry .berry-container mat-icon{font-size:15px;height:15px;width:15px;opacity:1}.setting-full .setting-header{padding:1.5em .8em 0 1em}.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;margin-right:4px;max-width:100%;font-size:14px}.setting-full .setting-header .setting-name .environment-name{font-weight:400;font-size:14px;padding-top:4px;margin-right:12px;overflow:hidden;text-overflow:ellipsis}.setting-full .setting-header .setting-meta{margin-left:auto;margin-right:14px;font-size:10px;color:var(--flag-meta)}.setting-full .setting-content{display:flex}.setting-full .setting-content .setting-details{display:flex;flex-direction:column;width:400px;padding:0 0 .5em .5em}.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;background-color:var(--flag-v1-key-background);padding:3px 6px;font-size:14px}.setting-full .setting-content .setting-details .description{font-size:11px;white-space:pre-wrap;word-wrap:break-word;max-width:300px}.setting-full .setting-content .rules-list{width:100%;padding:0 .3em .3em 1em}.setting-full .setting-content .targeting-button{margin-left:.5rem;margin-right:.5rem;margin-bottom:1.5em;height:26px!important}.setting-full .all-other{min-height:40px;justify-content:flex-start;border:1px solid var(--flag-v1-rule-border);background-color:var(--flag-v1-rule-background);margin:.5em 1em;padding:4px 0 4px .5em}.setting-full .all-other .chip{background-color:var(--flag-v1-chip-background)}.setting-full .all-other .served-value{margin-left:auto;margin-top:3px;margin-bottom:3px}.end{margin-left:auto}.buttons{display:flex;margin-left:.5rem;margin-right:.5rem}.buttons .updated-date{font-size:10px;margin-left:auto;margin-right:12px;color:var(--flag-meta);display:flex;align-items:center}.buttons .updated-date .history{margin-left:8px}.buttons .updated-date .history mat-icon{font-size:1.8em}.flex{display:flex;flex-wrap:wrap;align-items:center}.show-hide-toggle{margin-left:1em;cursor:pointer}.show-hide-toggle a{font-size:.8rem}.tag-menu-action{display:flex;align-items:center}.tag-select-container{line-height:16px;overflow:unset;max-width:100%;width:fit-content}.watch-wrapper .status{font-size:.7rem}.watch-wrapper .watch{position:relative;display:inline-block;padding:2px 4px;border:1px solid var(--flag-v1-box-border);font-size:.8rem;cursor:pointer;margin-left:3px}.watch-wrapper .watch:hover{background-color:var(--flag-v1-key-background);cursor:pointer}.watch-wrapper .watch:hover .stale-settings{display:inline-block}.watch-wrapper .watch .mat-icon{font-size:15px;height:15px;width:15px;vertical-align:middle}.tags{font-size:.8rem;display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.tags .tag-container{position:relative;max-width:100%;min-width:0}.tags .tag-container:hover .delete-tag{display:block}.tags .delete-tag{position:absolute;color:var(--flag-delete);cursor:pointer;background-color:var(--flag-v1-box-background);display:none;height:14px;width:14px;border-radius:50%;right:-6px;top:-7px;z-index:1}.tags .delete-tag mat-icon{height:14px;width:14px;font-size:14px;opacity:.7}.tags .delete-tag:hover mat-icon{opacity:1}.tags .add-tag{border:1px dashed var(--input-border-color);color:var(--flag-meta);padding:2px 4px}.tags .add-tag:hover{background-color:var(--flag-v1-key-background);cursor:pointer}@media (max-width: 1200px){.setting-details{width:300px!important}}@media (max-width: 920px){.setting-full{width:calc(100% - 5px)}.setting-full .setting-content{flex-wrap:wrap}.setting-full .setting-content .rules-list{padding:0}.setting-full .setting-content .targeting-button{margin-bottom:.5em;margin-top:.5em;padding:.6em 0}.colorbar{min-width:5px}.buttons{flex-direction:column;margin-bottom:.5em;margin-left:.4em;margin-right:.4em}.created-date,.updated-date{display:none}.setting-details{width:100%!important;padding:.2em 0 .2em .2em}.setting-details .description{max-width:none!important}.rollout-rules{margin-bottom:1em}.all-other{margin:1em;padding:7px 0 7px .5em}.all-other .served-value{margin:7px 7px 4px auto}}.targeting-button{background-color:var(--flag-v1-targeting-button-background);color:var(--flag-v1-targeting-button);cursor:pointer;text-transform:uppercase;justify-content:center;padding:.375em .75em;text-align:center;white-space:nowrap;border-radius:2px;font-size:.75rem;border:1px solid var(--flag-v1-box-border);box-shadow:none;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;margin:0 .2rem}.targeting-button:hover{background-color:var(--flag-v1-targeting-button-hover-background)}.targeting-button:disabled{background-color:var(--flag-v1-targeting-button-disabled-background);color:var(--flag-v1-targeting-button-disabled);cursor:auto}@media (max-width: 380px){.targeting-button{font-size:.65rem}}\n"] }]
|
|
2498
|
+
], template: "@let settingModel = model();\n\n<div class=\"setting-container\">\n <div class=\"setting-full\" [formGroup]=\"formGroup()\">\n <div class=\"berries\">\n @if (canDeleteSetting()) {\n <div class=\"berry delete\" matTooltip=\"Delete feature flag\" data-robot=\"deleteSetting\" (click)=\"deleteSetting()\">\n <mat-icon class=\"icon-transform-rotate\">cancel</mat-icon>\n </div>\n }\n </div>\n <div class=\"setting-header flex\">\n <div class=\"setting-name flex\">\n <div class=\"name\" data-robot=\"settingName\">\n {{ settingModel.setting.name }}\n @if (showEnvironmentName()) {\n <span class=\"environment-name\">({{ settingModel.environment.name }})</span>\n }\n </div>\n </div>\n </div>\n <div class=\"setting-content\">\n <div class=\"setting-details\">\n <div class=\"setting-key\">\n <code data-robot=\"settingKey\">{{ settingModel.setting.key }}</code>\n </div>\n @if (settingModel.setting.hint) {\n <span class=\"description\">{{ settingModel.setting.hint }}</span>\n }\n <div class=\"integrations\">\n <a target=\"_blank\" rel=\"noopener noreferrer\" [href]=\"getDashboardUrl()\">Open in ConfigCat</a>\n </div>\n </div>\n\n <div class=\"rules-list\">\n <div class=\"rollout-rules\">\n @if (formGroup().controls.rolloutRules.controls.length !== 0) {\n <app-rollout-rules\n [formGroup]=\"formGroup()\"\n [segments]=\"segments()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n </div>\n\n @if (formGroup().controls.rolloutPercentageItems.controls.length !== 0) {\n <app-rollout-percentage-items\n [formGroup]=\"formGroup()\"\n [readOnly]=\"readOnly()\"\n [settingModel]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n }\n\n <div class=\"all-other flex\">\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length !== 0\n ) {\n <div\n matTooltip=\"This value will be served to all users who the above rules don't apply.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To all other users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (formGroup().controls.rolloutPercentageItems.length !== 0) {\n <div\n matTooltip=\"This fallback value will be served in case the user can't be identified.\"\n matTooltipPosition=\"above\">\n <mat-chip-set>\n <mat-chip class=\"chip\">To unidentified users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n @if (\n formGroup().controls.rolloutPercentageItems.length === 0 && formGroup().controls.rolloutRules.length === 0\n ) {\n <div>\n <mat-chip-set>\n <mat-chip class=\"chip\">To all users, serve:</mat-chip>\n </mat-chip-set>\n </div>\n }\n <app-value\n class=\"served-value\"\n [valueFormControl]=\"formGroup().controls.value\"\n [setting]=\"settingModel.setting\"\n [featureFlagLimitations]=\"featureFlagLimitations()\" />\n </div>\n <div class=\"buttons\">\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target specific users\" : \"Add new targeting rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button type=\"button\" class=\"targeting-button\" (click)=\"addSegmentRolloutRule()\">\n {{ formGroup().controls.rolloutRules.length === 0 ? \"Target segment\" : \"Add new segment rule\" }}\n </button>\n }\n @if (!readOnly()) {\n <button\n type=\"button\"\n class=\"targeting-button\"\n [disabled]=\"\n settingModel.setting.settingType === SettingType.Boolean &&\n formGroup().controls.rolloutPercentageItems.length !== 0\n \"\n (click)=\"addRolloutPercentageItem()\">\n {{ formGroup().controls.rolloutPercentageItems.length === 0 ? \"Target % of users\" : \"Add % option\" }}\n </button>\n }\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".setting-container{display:flex;flex-wrap:nowrap}.colorbar{min-width:10px;opacity:var(--environment-color-opacity)}.setting-full{width:calc(100% - 10px);position:relative;display:flex;flex-wrap:nowrap;flex-direction:column;border:1px solid var(--flag-v1-box-border);background-color:var(--flag-v1-box-background)}.setting-full .berries{position:absolute;right:-10px;top:-10px;display:flex}.setting-full .berry{margin-left:3px;cursor:pointer;background-color:var(--page-background-color);height:20px;width:20px;border-radius:50%}.setting-full .berry mat-icon{font-size:20px;height:20px;width:20px;opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .berry:hover mat-icon{opacity:1}.setting-full .delete{color:var(--flag-delete)}.setting-full .edit mat-icon{padding-left:1px}.setting-full .code mat-icon{padding-left:1px}.setting-full .reverse-berry{display:flex;align-items:center;justify-content:center;color:var(--flag-v1-colored-berry)}.setting-full .reverse-berry .berry-container{display:flex;align-items:center;justify-content:center;height:17px;width:17px;border-radius:50%;background-color:var(--flag-v1-colored-berry-background);opacity:var(--flag-v1-colored-berry-opacity)}.setting-full .reverse-berry .berry-container:hover{opacity:1}.setting-full .reverse-berry .berry-container mat-icon{font-size:15px;height:15px;width:15px;opacity:1}.setting-full .setting-header{padding:1.5em .8em 0 1em}.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;margin-right:4px;max-width:100%;font-size:14px}.setting-full .setting-header .setting-name .environment-name{font-weight:400;font-size:14px;padding-top:4px;margin-right:12px;overflow:hidden;text-overflow:ellipsis}.setting-full .setting-header .setting-meta{margin-left:auto;margin-right:14px;font-size:10px;color:var(--flag-meta)}.setting-full .setting-content{display:flex}.setting-full .setting-content .setting-details{display:flex;flex-direction:column;width:400px;padding:0 0 .5em .5em}.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;background-color:var(--flag-v1-key-background);color:var(--text-color);padding:3px 6px;font-size:14px}.setting-full .setting-content .setting-details .setting-key>code{background-color:var(--flag-v1-key-background)}.setting-full .setting-content .setting-details .description{font-size:11px;white-space:pre-wrap;word-wrap:break-word;max-width:300px}.setting-full .setting-content .rules-list{width:100%;padding:0 .3em .3em 1em}.setting-full .setting-content .targeting-button{margin-left:.5rem;margin-right:.5rem;margin-bottom:1.5em;height:26px!important}.setting-full .all-other{min-height:40px;justify-content:flex-start;border:1px solid var(--flag-v1-rule-border);background-color:var(--flag-v1-rule-background);margin:.5em 1em;padding:4px 0 4px .5em}.setting-full .all-other .chip{background-color:var(--flag-v1-chip-background)}.setting-full .all-other .served-value{margin-left:auto;margin-top:3px;margin-bottom:3px}.end{margin-left:auto}.buttons{display:flex;margin-left:.5rem;margin-right:.5rem}.buttons .updated-date{font-size:10px;margin-left:auto;margin-right:12px;color:var(--flag-meta);display:flex;align-items:center}.buttons .updated-date .history{margin-left:8px}.buttons .updated-date .history mat-icon{font-size:1.8em}.flex{display:flex;flex-wrap:wrap;align-items:center}.show-hide-toggle{margin-left:1em;cursor:pointer}.show-hide-toggle a{font-size:.8rem}.tag-menu-action{display:flex;align-items:center}.tag-select-container{line-height:16px;overflow:unset;max-width:100%;width:fit-content}.watch-wrapper .status{font-size:.7rem}.watch-wrapper .watch{position:relative;display:inline-block;padding:2px 4px;border:1px solid var(--flag-v1-box-border);font-size:.8rem;cursor:pointer;margin-left:3px}.watch-wrapper .watch:hover{background-color:var(--flag-v1-key-background);cursor:pointer}.watch-wrapper .watch:hover .stale-settings{display:inline-block}.watch-wrapper .watch .mat-icon{font-size:15px;height:15px;width:15px;vertical-align:middle}.tags{font-size:.8rem;display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.tags .tag-container{position:relative;max-width:100%;min-width:0}.tags .tag-container:hover .delete-tag{display:block}.tags .delete-tag{position:absolute;color:var(--flag-delete);cursor:pointer;background-color:var(--flag-v1-box-background);display:none;height:14px;width:14px;border-radius:50%;right:-6px;top:-7px;z-index:1}.tags .delete-tag mat-icon{height:14px;width:14px;font-size:14px;opacity:.7}.tags .delete-tag:hover mat-icon{opacity:1}.tags .add-tag{border:1px dashed var(--input-border-color);color:var(--flag-meta);padding:2px 4px}.tags .add-tag:hover{background-color:var(--flag-v1-key-background);cursor:pointer}@media (max-width: 1200px){.setting-details{width:300px!important}}@media (max-width: 920px){.setting-full{width:calc(100% - 5px)}.setting-full .setting-content{flex-wrap:wrap}.setting-full .setting-content .rules-list{padding:0}.setting-full .setting-content .targeting-button{margin-bottom:.5em;margin-top:.5em;padding:.6em 0}.colorbar{min-width:5px}.buttons{flex-direction:column;margin-bottom:.5em;margin-left:.4em;margin-right:.4em}.created-date,.updated-date{display:none}.setting-details{width:100%!important;padding:.2em 0 .2em .2em}.setting-details .description{max-width:none!important}.rollout-rules{margin-bottom:1em}.all-other{margin:1em;padding:7px 0 7px .5em}.all-other .served-value{margin:7px 7px 4px auto}}.targeting-button{background-color:var(--flag-v1-targeting-button-background);color:var(--flag-v1-targeting-button);cursor:pointer;text-transform:uppercase;justify-content:center;padding:.375em .75em;text-align:center;white-space:nowrap;border-radius:2px;font-size:.75rem;border:1px solid var(--flag-v1-box-border);box-shadow:none;font-family:Montserrat,Roboto,Helvetica Neue,sans-serif;margin:0 .2rem}.targeting-button:hover{background-color:var(--flag-v1-targeting-button-hover-background)}.targeting-button:disabled{background-color:var(--flag-v1-targeting-button-disabled-background);color:var(--flag-v1-targeting-button-disabled);cursor:auto}@media (max-width: 380px){.targeting-button{font-size:.65rem}}\n"] }]
|
|
2497
2499
|
}] });
|
|
2498
2500
|
|
|
2499
2501
|
class SettingListComponent {
|
|
@@ -2516,7 +2518,6 @@ class SettingListComponent {
|
|
|
2516
2518
|
this.formValuesChanged = output();
|
|
2517
2519
|
this.loading = true;
|
|
2518
2520
|
this.submitting = false;
|
|
2519
|
-
this.showRevertQuestion = false;
|
|
2520
2521
|
this.showFeedBackMessage = false;
|
|
2521
2522
|
this.readOnly = false;
|
|
2522
2523
|
}
|
|
@@ -2652,12 +2653,20 @@ class SettingListComponent {
|
|
|
2652
2653
|
},
|
|
2653
2654
|
});
|
|
2654
2655
|
}
|
|
2655
|
-
|
|
2656
|
-
this.
|
|
2657
|
-
|
|
2658
|
-
|
|
2659
|
-
|
|
2660
|
-
|
|
2656
|
+
revert() {
|
|
2657
|
+
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
|
|
2658
|
+
data: {
|
|
2659
|
+
title: "Revert to last saved state?",
|
|
2660
|
+
body: "All changes will be lost.",
|
|
2661
|
+
yesButtonLabel: "Revert",
|
|
2662
|
+
cancelButtonLabel: "No",
|
|
2663
|
+
},
|
|
2664
|
+
});
|
|
2665
|
+
dialogRef.afterClosed().subscribe(result => {
|
|
2666
|
+
if (result === "yes") {
|
|
2667
|
+
this.reloadSettingValues();
|
|
2668
|
+
}
|
|
2669
|
+
});
|
|
2661
2670
|
}
|
|
2662
2671
|
onDeleteSettingRequested(setting) {
|
|
2663
2672
|
this.deleteSettingRequested.emit({
|
|
@@ -2667,11 +2676,11 @@ class SettingListComponent {
|
|
|
2667
2676
|
});
|
|
2668
2677
|
}
|
|
2669
2678
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SettingListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2670
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SettingListComponent, isStandalone: true, selector: "app-setting-list", inputs: { productId: { classPropertyName: "productId", publicName: "productId", isSignal: true, isRequired: true, transformFunction: null }, environmentId: { classPropertyName: "environmentId", publicName: "environmentId", isSignal: true, isRequired: true, transformFunction: null }, configId: { classPropertyName: "configId", publicName: "configId", isSignal: true, isRequired: true, transformFunction: null }, dashboardBasePath: { classPropertyName: "dashboardBasePath", publicName: "dashboardBasePath", isSignal: true, isRequired: false, transformFunction: null }, canDeleteSetting: { classPropertyName: "canDeleteSetting", publicName: "canDeleteSetting", isSignal: true, isRequired: false, transformFunction: null }, onSave: { classPropertyName: "onSave", publicName: "onSave", isSignal: true, isRequired: true, transformFunction: null }, loadSettingValues: { classPropertyName: "loadSettingValues", publicName: "loadSettingValues", isSignal: true, isRequired: true, transformFunction: null }, loadSegments: { classPropertyName: "loadSegments", publicName: "loadSegments", isSignal: true, isRequired: true, transformFunction: null }, deleteSettingText: { classPropertyName: "deleteSettingText", publicName: "deleteSettingText", isSignal: true, isRequired: false, transformFunction: null }, showEnvironmentName: { classPropertyName: "showEnvironmentName", publicName: "showEnvironmentName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loadSucceeded: "loadSucceeded", deleteSettingRequested: "deleteSettingRequested", formValuesChanged: "formValuesChanged" }, usesOnChanges: true, ngImport: i0, template: "@if (!loading) {\n <form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n @for (settingValueFromGroup of formGroup!.controls.settingValues.controls; track $index; let i = $index) {\n <div class=\"wrapper\">\n <div class=\"size-obs\" [style.display]=\"'block'\">\n <div>\n <app-setting\n [formGroup]=\"settingValueFromGroup\"\n [readOnly]=\"readOnly\"\n [canDeleteSetting]=\"canDeleteSetting()\"\n [deleteSettingText]=\"deleteSettingText()\"\n [showEnvironmentName]=\"showEnvironmentName()\"\n [model]=\"settingValues!.settingValues[i]\"\n [segments]=\"segments\"\n [productId]=\"productId()\"\n [configId]=\"configId()\"\n [environmentId]=\"environmentId()\"\n [dashboardBasePath]=\"dashboardBasePath()\"\n [featureFlagLimitations]=\"settingValues!.featureFlagLimitations\"\n (subscriptionLimitReached)=\"onSubscriptionLimitReached()\"\n (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" />\n </div>\n </div>\n </div>\n }\n @if (!readOnly && !submitting && formGroup.dirty) {\n <div class=\"save\">\n <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\n <mat-icon>backup</mat-icon>\n <span>Save & publish changes</span>\n </button>\n
|
|
2679
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SettingListComponent, isStandalone: true, selector: "app-setting-list", inputs: { productId: { classPropertyName: "productId", publicName: "productId", isSignal: true, isRequired: true, transformFunction: null }, environmentId: { classPropertyName: "environmentId", publicName: "environmentId", isSignal: true, isRequired: true, transformFunction: null }, configId: { classPropertyName: "configId", publicName: "configId", isSignal: true, isRequired: true, transformFunction: null }, dashboardBasePath: { classPropertyName: "dashboardBasePath", publicName: "dashboardBasePath", isSignal: true, isRequired: false, transformFunction: null }, canDeleteSetting: { classPropertyName: "canDeleteSetting", publicName: "canDeleteSetting", isSignal: true, isRequired: false, transformFunction: null }, onSave: { classPropertyName: "onSave", publicName: "onSave", isSignal: true, isRequired: true, transformFunction: null }, loadSettingValues: { classPropertyName: "loadSettingValues", publicName: "loadSettingValues", isSignal: true, isRequired: true, transformFunction: null }, loadSegments: { classPropertyName: "loadSegments", publicName: "loadSegments", isSignal: true, isRequired: true, transformFunction: null }, deleteSettingText: { classPropertyName: "deleteSettingText", publicName: "deleteSettingText", isSignal: true, isRequired: false, transformFunction: null }, showEnvironmentName: { classPropertyName: "showEnvironmentName", publicName: "showEnvironmentName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loadSucceeded: "loadSucceeded", deleteSettingRequested: "deleteSettingRequested", formValuesChanged: "formValuesChanged" }, usesOnChanges: true, ngImport: i0, template: "@if (!loading) {\n <form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n @for (settingValueFromGroup of formGroup!.controls.settingValues.controls; track $index; let i = $index) {\n <div class=\"wrapper\">\n <div class=\"size-obs\" [style.display]=\"'block'\">\n <div>\n <app-setting\n [formGroup]=\"settingValueFromGroup\"\n [readOnly]=\"readOnly\"\n [canDeleteSetting]=\"canDeleteSetting()\"\n [deleteSettingText]=\"deleteSettingText()\"\n [showEnvironmentName]=\"showEnvironmentName()\"\n [model]=\"settingValues!.settingValues[i]\"\n [segments]=\"segments\"\n [productId]=\"productId()\"\n [configId]=\"configId()\"\n [environmentId]=\"environmentId()\"\n [dashboardBasePath]=\"dashboardBasePath()\"\n [featureFlagLimitations]=\"settingValues!.featureFlagLimitations\"\n (subscriptionLimitReached)=\"onSubscriptionLimitReached()\"\n (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" />\n </div>\n </div>\n </div>\n }\n @if (!readOnly && !submitting && formGroup.dirty) {\n <div class=\"save\">\n <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\n <mat-icon>backup</mat-icon>\n <span>Save & publish changes</span>\n </button>\n <button type=\"button\" class=\"revert-button\" mat-stroked-button (click)=\"revert()\">\n <span>Revert</span>\n </button>\n @if (formGroup.touched && formGroup.invalid && showFeedBackMessage) {\n <div class=\"feedback\">\n @if (formGroup.errors && formGroup.errors[\"internalServerError\"]) {\n <div class=\"error\">\n <span>\n Something went wrong and we could not save your settings. You can try again or\n <a href=\"https://configcat.com/support\" target=\"_blank\" rel=\"noopener noreferrer\">contact us.</a>\n </span>\n </div>\n }\n @if (!formGroup.errors || !formGroup.errors[\"internalServerError\"]) {\n <div class=\"error\">\n <span>Oh no! A feature flag has invalid or missing data.</span>\n </div>\n }\n </div>\n }\n </div>\n }\n </form>\n}\n", styles: [".wrapper{margin:1rem 0;padding:0 .5rem}.size-obs .hidden{display:none}.size-obs .visible{display:block}.show-hide a{cursor:pointer;font-size:.8rem}.save{position:sticky;bottom:0;min-height:38px;padding:.5rem 0 .5rem 12px;background-color:var(--page-background-color);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;z-index:999}.save .save-button{animation:shadow-pulse 1s 3}.save .save-button:disabled{animation:none}.save>*{margin:.3em}.save .revert{margin:0 16px;font-size:14px}.save .yes{margin:0 5px}.error{color:var(--flag-validation-error);padding:5px;font-size:.9em}.error a{color:var(--flag-validation-error);text-decoration:underline}@media (max-width: 700px){.save{padding:.5rem 0}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.RxwebFormDirective, selector: "[formGroup],[rxwebForm]", inputs: ["formGroup", "rxwebForm"] }, { kind: "component", type: SettingComponent, selector: "app-setting", inputs: ["dashboardBasePath", "productId", "environmentId", "configId", "featureFlagLimitations", "formGroup", "readOnly", "canDeleteSetting", "deleteSettingText", "showEnvironmentName", "segments", "model"], outputs: ["deleteSettingRequested", "subscriptionLimitReached"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
|
2671
2680
|
}
|
|
2672
2681
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SettingListComponent, decorators: [{
|
|
2673
2682
|
type: Component,
|
|
2674
|
-
args: [{ selector: "app-setting-list", imports: [FormsModule, ReactiveFormsModule, RxReactiveFormsModule, SettingComponent, MatButton, MatIcon], template: "@if (!loading) {\n <form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n @for (settingValueFromGroup of formGroup!.controls.settingValues.controls; track $index; let i = $index) {\n <div class=\"wrapper\">\n <div class=\"size-obs\" [style.display]=\"'block'\">\n <div>\n <app-setting\n [formGroup]=\"settingValueFromGroup\"\n [readOnly]=\"readOnly\"\n [canDeleteSetting]=\"canDeleteSetting()\"\n [deleteSettingText]=\"deleteSettingText()\"\n [showEnvironmentName]=\"showEnvironmentName()\"\n [model]=\"settingValues!.settingValues[i]\"\n [segments]=\"segments\"\n [productId]=\"productId()\"\n [configId]=\"configId()\"\n [environmentId]=\"environmentId()\"\n [dashboardBasePath]=\"dashboardBasePath()\"\n [featureFlagLimitations]=\"settingValues!.featureFlagLimitations\"\n (subscriptionLimitReached)=\"onSubscriptionLimitReached()\"\n (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" />\n </div>\n </div>\n </div>\n }\n @if (!readOnly && !submitting && formGroup.dirty) {\n <div class=\"save\">\n <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\n <mat-icon>backup</mat-icon>\n <span>Save & publish changes</span>\n </button>\n
|
|
2683
|
+
args: [{ selector: "app-setting-list", imports: [FormsModule, ReactiveFormsModule, RxReactiveFormsModule, SettingComponent, MatButton, MatIcon], template: "@if (!loading) {\n <form [formGroup]=\"formGroup\" (ngSubmit)=\"submit()\">\n @for (settingValueFromGroup of formGroup!.controls.settingValues.controls; track $index; let i = $index) {\n <div class=\"wrapper\">\n <div class=\"size-obs\" [style.display]=\"'block'\">\n <div>\n <app-setting\n [formGroup]=\"settingValueFromGroup\"\n [readOnly]=\"readOnly\"\n [canDeleteSetting]=\"canDeleteSetting()\"\n [deleteSettingText]=\"deleteSettingText()\"\n [showEnvironmentName]=\"showEnvironmentName()\"\n [model]=\"settingValues!.settingValues[i]\"\n [segments]=\"segments\"\n [productId]=\"productId()\"\n [configId]=\"configId()\"\n [environmentId]=\"environmentId()\"\n [dashboardBasePath]=\"dashboardBasePath()\"\n [featureFlagLimitations]=\"settingValues!.featureFlagLimitations\"\n (subscriptionLimitReached)=\"onSubscriptionLimitReached()\"\n (deleteSettingRequested)=\"onDeleteSettingRequested($event)\" />\n </div>\n </div>\n </div>\n }\n @if (!readOnly && !submitting && formGroup.dirty) {\n <div class=\"save\">\n <button class=\"save-button\" mat-flat-button color=\"warn\" type=\"submit\" [disabled]=\"submitting\">\n <mat-icon>backup</mat-icon>\n <span>Save & publish changes</span>\n </button>\n <button type=\"button\" class=\"revert-button\" mat-stroked-button (click)=\"revert()\">\n <span>Revert</span>\n </button>\n @if (formGroup.touched && formGroup.invalid && showFeedBackMessage) {\n <div class=\"feedback\">\n @if (formGroup.errors && formGroup.errors[\"internalServerError\"]) {\n <div class=\"error\">\n <span>\n Something went wrong and we could not save your settings. You can try again or\n <a href=\"https://configcat.com/support\" target=\"_blank\" rel=\"noopener noreferrer\">contact us.</a>\n </span>\n </div>\n }\n @if (!formGroup.errors || !formGroup.errors[\"internalServerError\"]) {\n <div class=\"error\">\n <span>Oh no! A feature flag has invalid or missing data.</span>\n </div>\n }\n </div>\n }\n </div>\n }\n </form>\n}\n", styles: [".wrapper{margin:1rem 0;padding:0 .5rem}.size-obs .hidden{display:none}.size-obs .visible{display:block}.show-hide a{cursor:pointer;font-size:.8rem}.save{position:sticky;bottom:0;min-height:38px;padding:.5rem 0 .5rem 12px;background-color:var(--page-background-color);display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;z-index:999}.save .save-button{animation:shadow-pulse 1s 3}.save .save-button:disabled{animation:none}.save>*{margin:.3em}.save .revert{margin:0 16px;font-size:14px}.save .yes{margin:0 5px}.error{color:var(--flag-validation-error);padding:5px;font-size:.9em}.error a{color:var(--flag-validation-error);text-decoration:underline}@media (max-width: 700px){.save{padding:.5rem 0}}\n"] }]
|
|
2675
2684
|
}] });
|
|
2676
2685
|
|
|
2677
2686
|
class SettingItemComponent extends BaseComponent {
|
|
@@ -2854,11 +2863,11 @@ class ProductSelectComponent extends BaseSelectComponent {
|
|
|
2854
2863
|
});
|
|
2855
2864
|
}
|
|
2856
2865
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: ProductSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2857
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: ProductSelectComponent, isStandalone: true, selector: "app-product-select", inputs: { valueFormControl: { classPropertyName: "valueFormControl", publicName: "valueFormControl", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Product</mat-label>\n <mat-select\n placeholder=\"Product\"\n name=\"productValue\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (product of products; track product.productId) {\n <mat-option [value]=\"product.productId\" [matTooltip]=\"product.name\"
|
|
2866
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: ProductSelectComponent, isStandalone: true, selector: "app-product-select", inputs: { valueFormControl: { classPropertyName: "valueFormControl", publicName: "valueFormControl", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: "<mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Product</mat-label>\n <mat-select\n placeholder=\"Product\"\n name=\"productValue\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (product of products; track product.productId) {\n <mat-option [value]=\"product.productId\" [matTooltip]=\"product.name\">\n {{ product.name }}\n </mat-option>\n }\n </mat-select>\n</mat-form-field>\n", styles: [".form-field{width:100%}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
|
|
2858
2867
|
}
|
|
2859
2868
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: ProductSelectComponent, decorators: [{
|
|
2860
2869
|
type: Component,
|
|
2861
|
-
args: [{ selector: "app-product-select", imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "<mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Product</mat-label>\n <mat-select\n placeholder=\"Product\"\n name=\"productValue\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (product of products; track product.productId) {\n <mat-option [value]=\"product.productId\" [matTooltip]=\"product.name\"
|
|
2870
|
+
args: [{ selector: "app-product-select", imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "<mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Product</mat-label>\n <mat-select\n placeholder=\"Product\"\n name=\"productValue\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (product of products; track product.productId) {\n <mat-option [value]=\"product.productId\" [matTooltip]=\"product.name\">\n {{ product.name }}\n </mat-option>\n }\n </mat-select>\n</mat-form-field>\n", styles: [".form-field{width:100%}\n"] }]
|
|
2862
2871
|
}] });
|
|
2863
2872
|
|
|
2864
2873
|
class ConfigSelectComponent extends BaseSelectComponent {
|
|
@@ -2898,7 +2907,7 @@ class ConfigSelectComponent extends BaseSelectComponent {
|
|
|
2898
2907
|
useExisting: forwardRef(() => ConfigSelectComponent),
|
|
2899
2908
|
multi: true,
|
|
2900
2909
|
},
|
|
2901
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (configs) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Config</mat-label>\n <mat-select\n placeholder=\"Config\"\n name=\"value\"\n disableOptionCentering\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (config of configs; track config.configId) {\n <mat-option [value]=\"config.configId\" [matTooltip]=\"config.name\"
|
|
2910
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (configs) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Config</mat-label>\n <mat-select\n placeholder=\"Config\"\n name=\"value\"\n disableOptionCentering\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (config of configs; track config.configId) {\n <mat-option [value]=\"config.configId\" [matTooltip]=\"config.name\">\n {{ config.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n}\n", styles: [".form-field{width:100%}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
|
|
2902
2911
|
}
|
|
2903
2912
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: ConfigSelectComponent, decorators: [{
|
|
2904
2913
|
type: Component,
|
|
@@ -2908,7 +2917,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImpor
|
|
|
2908
2917
|
useExisting: forwardRef(() => ConfigSelectComponent),
|
|
2909
2918
|
multi: true,
|
|
2910
2919
|
},
|
|
2911
|
-
], imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "@if (configs) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Config</mat-label>\n <mat-select\n placeholder=\"Config\"\n name=\"value\"\n disableOptionCentering\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (config of configs; track config.configId) {\n <mat-option [value]=\"config.configId\" [matTooltip]=\"config.name\"
|
|
2920
|
+
], imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "@if (configs) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Config</mat-label>\n <mat-select\n placeholder=\"Config\"\n name=\"value\"\n disableOptionCentering\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (config of configs; track config.configId) {\n <mat-option [value]=\"config.configId\" [matTooltip]=\"config.name\">\n {{ config.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n}\n", styles: [".form-field{width:100%}\n"] }]
|
|
2912
2921
|
}] });
|
|
2913
2922
|
|
|
2914
2923
|
class EnvironmentSelectComponent extends BaseSelectComponent {
|
|
@@ -2942,11 +2951,11 @@ class EnvironmentSelectComponent extends BaseSelectComponent {
|
|
|
2942
2951
|
}
|
|
2943
2952
|
}
|
|
2944
2953
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: EnvironmentSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2945
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: EnvironmentSelectComponent, isStandalone: true, selector: "app-environment-select", inputs: { valueFormControl: { classPropertyName: "valueFormControl", publicName: "valueFormControl", isSignal: true, isRequired: true, transformFunction: null }, productId: { classPropertyName: "productId", publicName: "productId", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (environments) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Environment</mat-label>\n <mat-select\n placeholder=\"Environment\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (environment of environments; track environment.environmentId) {\n <mat-option [value]=\"environment.environmentId\" [matTooltip]=\"environment.name\"
|
|
2954
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: EnvironmentSelectComponent, isStandalone: true, selector: "app-environment-select", inputs: { valueFormControl: { classPropertyName: "valueFormControl", publicName: "valueFormControl", isSignal: true, isRequired: true, transformFunction: null }, productId: { classPropertyName: "productId", publicName: "productId", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (environments) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Environment</mat-label>\n <mat-select\n placeholder=\"Environment\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (environment of environments; track environment.environmentId) {\n <mat-option [value]=\"environment.environmentId\" [matTooltip]=\"environment.name\">\n {{ environment.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n}\n", styles: [".form-field{width:100%}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
|
|
2946
2955
|
}
|
|
2947
2956
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: EnvironmentSelectComponent, decorators: [{
|
|
2948
2957
|
type: Component,
|
|
2949
|
-
args: [{ selector: "app-environment-select", imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "@if (environments) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Environment</mat-label>\n <mat-select\n placeholder=\"Environment\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (environment of environments; track environment.environmentId) {\n <mat-option [value]=\"environment.environmentId\" [matTooltip]=\"environment.name\"
|
|
2958
|
+
args: [{ selector: "app-environment-select", imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "@if (environments) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Environment</mat-label>\n <mat-select\n placeholder=\"Environment\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (environment of environments; track environment.environmentId) {\n <mat-option [value]=\"environment.environmentId\" [matTooltip]=\"environment.name\">\n {{ environment.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n}\n", styles: [".form-field{width:100%}\n"] }]
|
|
2950
2959
|
}] });
|
|
2951
2960
|
|
|
2952
2961
|
class SettingSelectComponent extends BaseSelectComponent {
|
|
@@ -2980,11 +2989,11 @@ class SettingSelectComponent extends BaseSelectComponent {
|
|
|
2980
2989
|
}
|
|
2981
2990
|
}
|
|
2982
2991
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SettingSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2983
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SettingSelectComponent, isStandalone: true, selector: "app-setting-select", inputs: { valueFormControl: { classPropertyName: "valueFormControl", publicName: "valueFormControl", isSignal: true, isRequired: true, transformFunction: null }, configId: { classPropertyName: "configId", publicName: "configId", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (settings) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Feature flag or setting</mat-label>\n <mat-select\n placeholder=\"Feature flag or setting\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (setting of settings; track setting.settingId) {\n <mat-option [value]=\"setting.settingId\" [matTooltip]=\"setting.name\"
|
|
2992
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.3", type: SettingSelectComponent, isStandalone: true, selector: "app-setting-select", inputs: { valueFormControl: { classPropertyName: "valueFormControl", publicName: "valueFormControl", isSignal: true, isRequired: true, transformFunction: null }, configId: { classPropertyName: "configId", publicName: "configId", isSignal: true, isRequired: true, transformFunction: null } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (settings) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Feature flag or setting</mat-label>\n <mat-select\n placeholder=\"Feature flag or setting\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (setting of settings; track setting.settingId) {\n <mat-option [value]=\"setting.settingId\" [matTooltip]=\"setting.name\">\n {{ setting.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n}\n", styles: [".form-field{width:100%}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RxReactiveFormsModule }, { kind: "directive", type: i2.AsyncValidationDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["async"] }, { kind: "directive", type: i2.RxFormControlDirective, selector: "[ngModel],[formControlName],[formControl]", inputs: ["rxalpha", "rxalphaNumeric", "rxascii", "rxcompare", "rxcompose", "rxcontains", "rxcreditCard", "rxdataUri", "rxdifferent", "rxdigit", "rxemail", "rxendsWith", "rxeven", "rxextension", "rxfactor", "rxfileSize", "rxgreaterThanEqualTo", "rxgreaterThan", "rxhexColor", "rxjson", "rxlatitude", "rxlatLong", "rxleapYear", "rxlessThan", "rxlessThanEqualTo", "rxlongitude", "rxlowerCase", "rxmac", "rxmaxDate", "rxmaxLength", "rxmaxNumber", "rxminDate", "rxminLength", "rxminNumber", "rxnumeric", "rxodd", "rxpassword", "rxport", "rxprimeNumber", "rxrequired", "rxrange", "rxrule", "rxstartsWith", "rxtime", "rxupperCase", "rxurl", "rxunique", "rxnotEmpty", "rxcusip", "rxgrid", "rxdate"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
|
|
2984
2993
|
}
|
|
2985
2994
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.3", ngImport: i0, type: SettingSelectComponent, decorators: [{
|
|
2986
2995
|
type: Component,
|
|
2987
|
-
args: [{ selector: "app-setting-select", imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "@if (settings) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Feature flag or setting</mat-label>\n <mat-select\n placeholder=\"Feature flag or setting\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (setting of settings; track setting.settingId) {\n <mat-option [value]=\"setting.settingId\" [matTooltip]=\"setting.name\"
|
|
2996
|
+
args: [{ selector: "app-setting-select", imports: [MatFormField, MatLabel, MatSelect, FormsModule, ReactiveFormsModule, RxReactiveFormsModule, MatOption, MatTooltip], template: "@if (settings) {\n <mat-form-field class=\"form-field\" appearance=\"outline\">\n <mat-label>Feature flag or setting</mat-label>\n <mat-select\n placeholder=\"Feature flag or setting\"\n name=\"value\"\n [formControl]=\"valueFormControl()\"\n [panelClass]=\"customDropdown() ? 'custom-dropdown-below' : ''\"\n (openedChange)=\"openChanged($event)\">\n @for (setting of settings; track setting.settingId) {\n <mat-option [value]=\"setting.settingId\" [matTooltip]=\"setting.name\">\n {{ setting.name }}\n </mat-option>\n }\n </mat-select>\n </mat-form-field>\n}\n", styles: [".form-field{width:100%}\n"] }]
|
|
2988
2997
|
}] });
|
|
2989
2998
|
|
|
2990
2999
|
class DeleteSettingDialogComponent {
|