@valtimo/choice-field 5.14.0 → 10.0.0

package/fesm2015/valtimo-choice-field.mjs

@@ -55,41 +55,41 @@ class ChoiceFieldService {
         this.valtimoApiConfig = configService.config.valtimoApi;
     }
     query(params) {
-        return this.http.get(`${this.valtimoApiConfig.endpointUri}choice-fields`, {
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}v1/choice-fields`, {
             observe: 'response',
             params,
         });
     }
     get(id) {
-        return this.http.get(`${this.valtimoApiConfig.endpointUri}choice-fields/${id}`);
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}v1/choice-fields/${id}`);
     }
     create(choiceField) {
-        return this.http.post(`${this.valtimoApiConfig.endpointUri}choice-fields`, choiceField);
+        return this.http.post(`${this.valtimoApiConfig.endpointUri}v1/choice-fields`, choiceField);
     }
     delete(id) {
-        return this.http.delete(`${this.valtimoApiConfig.endpointUri}choice-fields/${id}`);
+        return this.http.delete(`${this.valtimoApiConfig.endpointUri}v1/choice-fields/${id}`);
     }
     update(choiceField) {
-        return this.http.put(`${this.valtimoApiConfig.endpointUri}choice-fields`, choiceField);
+        return this.http.put(`${this.valtimoApiConfig.endpointUri}v1/choice-fields`, choiceField);
     }
     queryValues(keyName, params) {
-        return this.http.get(`${this.valtimoApiConfig.endpointUri}choice-field-values/${keyName}/values`, { observe: 'response', params });
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}v1/choice-field-values/${keyName}/values`, { observe: 'response', params });
     }
     getValue(choiceFieldId) {
-        return this.http.get(`${this.valtimoApiConfig.endpointUri}choice-field-values/${choiceFieldId}`);
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}v1/choice-field-values/${choiceFieldId}`);
     }
     updateValue(choiceFieldValue, choiceFieldName) {
-        return this.http.put(`${this.valtimoApiConfig.endpointUri}choice-field-values`, choiceFieldValue, {
+        return this.http.put(`${this.valtimoApiConfig.endpointUri}v1/choice-field-values`, choiceFieldValue, {
             params: { choice_field_name: choiceFieldName },
         });
     }
     createValue(choiceFieldValue, choiceFieldName) {
-        return this.http.post(`${this.valtimoApiConfig.endpointUri}choice-field-values`, choiceFieldValue, { params: { choice_field_name: choiceFieldName } });
+        return this.http.post(`${this.valtimoApiConfig.endpointUri}v1/choice-field-values`, choiceFieldValue, { params: { choice_field_name: choiceFieldName } });
     }
 }
-ChoiceFieldService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldService, deps: [{ token: i1.HttpClient }, { token: i2.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable });
-ChoiceFieldService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldService, decorators: [{
+ChoiceFieldService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldService, deps: [{ token: i1.HttpClient }, { token: i2.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable });
+ChoiceFieldService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -156,11 +156,11 @@ class ChoiceFieldListComponent {
         this.initData();
     }
 }
-ChoiceFieldListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldListComponent, deps: [{ token: i1$1.Router }, { token: ChoiceFieldService }], target: i0.ɵɵFactoryTarget.Component });
-ChoiceFieldListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChoiceFieldListComponent, selector: "valtimo-choice-field-list", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFields\"\n        [fields]=\"fields\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        paginationIdentifier=\"choiceFieldList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        (paginationSet)=\"paginationSet()\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice fields' | translate }}</h3>\n          <h5 class=\"list-header-description\">{{ 'Overview of all Choice fields' | translate }}</h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n", styles: [""], components: [{ type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { type: i4.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState", "lastColumnTemplate"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }], directives: [{ type: i1$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "translate": i4$1.TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldListComponent, decorators: [{
+ChoiceFieldListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldListComponent, deps: [{ token: i1$1.Router }, { token: ChoiceFieldService }], target: i0.ɵɵFactoryTarget.Component });
+ChoiceFieldListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChoiceFieldListComponent, selector: "valtimo-choice-field-list", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFields\"\n        [fields]=\"fields\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        paginationIdentifier=\"choiceFieldList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        (paginationSet)=\"paginationSet()\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice fields' | translate }}</h3>\n          <h5 class=\"list-header-description\">{{ 'Overview of all Choice fields' | translate }}</h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: i4.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState", "lastColumnTemplate"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "directive", type: i1$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-choice-field-list', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFields\"\n        [fields]=\"fields\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        paginationIdentifier=\"choiceFieldList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        (paginationSet)=\"paginationSet()\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice fields' | translate }}</h3>\n          <h5 class=\"list-header-description\">{{ 'Overview of all Choice fields' | translate }}</h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-choice-field-list', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFields\"\n        [fields]=\"fields\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        paginationIdentifier=\"choiceFieldList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        (paginationSet)=\"paginationSet()\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice fields' | translate }}</h3>\n          <h5 class=\"list-header-description\">{{ 'Overview of all Choice fields' | translate }}</h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: ChoiceFieldService }]; } });
 
 /*
@@ -245,11 +245,11 @@ class ChoiceFieldValueListComponent {
         this.initData(this.id);
     }
 }
-ChoiceFieldValueListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldValueListComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }], target: i0.ɵɵFactoryTarget.Component });
-ChoiceFieldValueListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChoiceFieldValueListComponent, selector: "valtimo-choice-field-value-list", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create-value'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field value' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFieldValues\"\n        [fields]=\"fields\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        paginationIdentifier=\"choiceFieldValueList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice field values' | translate }}</h3>\n          <h5 class=\"list-header-description\">\n            {{ 'Overview of all Choice field values' | translate }}\n          </h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n", styles: [""], components: [{ type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { type: i4.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState", "lastColumnTemplate"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }], directives: [{ type: i1$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "translate": i4$1.TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldValueListComponent, decorators: [{
+ChoiceFieldValueListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldValueListComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }], target: i0.ɵɵFactoryTarget.Component });
+ChoiceFieldValueListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChoiceFieldValueListComponent, selector: "valtimo-choice-field-value-list", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create-value'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field value' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFieldValues\"\n        [fields]=\"fields\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        paginationIdentifier=\"choiceFieldValueList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice field values' | translate }}</h3>\n          <h5 class=\"list-header-description\">\n            {{ 'Overview of all Choice field values' | translate }}\n          </h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: i4.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState", "lastColumnTemplate"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "directive", type: i1$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldValueListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-choice-field-value-list', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create-value'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field value' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFieldValues\"\n        [fields]=\"fields\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        paginationIdentifier=\"choiceFieldValueList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice field values' | translate }}</h3>\n          <h5 class=\"list-header-description\">\n            {{ 'Overview of all Choice field values' | translate }}\n          </h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-choice-field-value-list', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create-value'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus mr-1\"></i>\n          <span>{{ 'Create new Choice field value' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"choiceFieldValues\"\n        [fields]=\"fields\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n        (rowClicked)=\"rowClick($event)\"\n        [pagination]=\"pagination\"\n        paginationIdentifier=\"choiceFieldValueList\"\n        (paginationClicked)=\"paginationClicked($event)\"\n        [header]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Choice field values' | translate }}</h3>\n          <h5 class=\"list-header-description\">\n            {{ 'Overview of all Choice field values' | translate }}\n          </h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i2$1.FormBuilder }, { type: ChoiceFieldService }]; } });
 
 /*
@@ -353,11 +353,11 @@ class ChoiceFieldDetailComponent {
         });
     }
 }
-ChoiceFieldDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldDetailComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-ChoiceFieldDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChoiceFieldDetailComponent, selector: "valtimo-choice-field-detail", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                  <button class=\"btn btn-space btn-danger\" type=\"button\" (click)=\"delete()\">\n                    Delete\n                  </button>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n\n<div class=\"page-head\">\n  <h2 class=\"page-head-title\">Choice field values</h2>\n</div>\n<valtimo-choice-field-value-list></valtimo-choice-field-value-list>\n", styles: [""], components: [{ type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { type: ChoiceFieldValueListComponent, selector: "valtimo-choice-field-value-list" }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldDetailComponent, decorators: [{
+ChoiceFieldDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldDetailComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
+ChoiceFieldDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChoiceFieldDetailComponent, selector: "valtimo-choice-field-detail", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                  <button class=\"btn btn-space btn-danger\" type=\"button\" (click)=\"delete()\">\n                    Delete\n                  </button>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n\n<div class=\"page-head\">\n  <h2 class=\"page-head-title\">Choice field values</h2>\n</div>\n<valtimo-choice-field-value-list></valtimo-choice-field-value-list>\n", styles: [""], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "directive", type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ChoiceFieldValueListComponent, selector: "valtimo-choice-field-value-list" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-choice-field-detail', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                  <button class=\"btn btn-space btn-danger\" type=\"button\" (click)=\"delete()\">\n                    Delete\n                  </button>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n\n<div class=\"page-head\">\n  <h2 class=\"page-head-title\">Choice field values</h2>\n</div>\n<valtimo-choice-field-value-list></valtimo-choice-field-value-list>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-choice-field-detail', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                  <button class=\"btn btn-space btn-danger\" type=\"button\" (click)=\"delete()\">\n                    Delete\n                  </button>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n\n<div class=\"page-head\">\n  <h2 class=\"page-head-title\">Choice field values</h2>\n</div>\n<valtimo-choice-field-value-list></valtimo-choice-field-value-list>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i2$1.FormBuilder }, { type: ChoiceFieldService }, { type: i4.AlertService }]; } });
 
 /*
@@ -404,11 +404,11 @@ class ChoiceFieldCreateComponent {
         this.form = this.createFormGroup();
     }
 }
-ChoiceFieldCreateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldCreateComponent, deps: [{ token: i1$1.Router }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-ChoiceFieldCreateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChoiceFieldCreateComponent, selector: "valtimo-choice-field-create", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget>\n        <div>\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"keyName\"\n                  >Key</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"keyName\"\n                    formControlName=\"keyName\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field key name\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.keyName.touched && formControls.keyName.valid,\n                      'is-invalid': formControls.keyName.touched && formControls.keyName.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.keyName.touched && formControls.keyName.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.keyName.errors.required\">Key name is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""], components: [{ type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }], directives: [{ type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldCreateComponent, decorators: [{
+ChoiceFieldCreateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldCreateComponent, deps: [{ token: i1$1.Router }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
+ChoiceFieldCreateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChoiceFieldCreateComponent, selector: "valtimo-choice-field-create", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget>\n        <div>\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"keyName\"\n                  >Key</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"keyName\"\n                    formControlName=\"keyName\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field key name\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.keyName.touched && formControls.keyName.valid,\n                      'is-invalid': formControls.keyName.touched && formControls.keyName.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.keyName.touched && formControls.keyName.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.keyName.errors.required\">Key name is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "directive", type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldCreateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-choice-field-create', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget>\n        <div>\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"keyName\"\n                  >Key</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"keyName\"\n                    formControlName=\"keyName\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field key name\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.keyName.touched && formControls.keyName.valid,\n                      'is-invalid': formControls.keyName.touched && formControls.keyName.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.keyName.touched && formControls.keyName.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.keyName.errors.required\">Key name is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-choice-field-create', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget>\n        <div>\n          <div class=\"p-5 bg-white\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"keyName\"\n                  >Key</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"keyName\"\n                    formControlName=\"keyName\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field key name\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.keyName.touched && formControls.keyName.valid,\n                      'is-invalid': formControls.keyName.touched && formControls.keyName.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.keyName.touched && formControls.keyName.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.keyName.errors.required\">Key name is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"title\"\n                  >Title</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"title\"\n                    formControlName=\"title\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field title\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.title.touched && formControls.title.valid,\n                      'is-invalid': formControls.title.touched && formControls.title.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.title.touched && formControls.title.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.title.errors.required\">Title is required</div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'/choice-fields'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i2$1.FormBuilder }, { type: ChoiceFieldService }, { type: i4.AlertService }]; } });
 
 /*
@@ -473,11 +473,11 @@ class ChoiceFieldValueCreateComponent {
         this.initData(this.choiceFieldId);
     }
 }
-ChoiceFieldValueCreateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldValueCreateComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-ChoiceFieldValueCreateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChoiceFieldValueCreateComponent, selector: "valtimo-choice-field-value-create", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""], components: [{ type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldValueCreateComponent, decorators: [{
+ChoiceFieldValueCreateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldValueCreateComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
+ChoiceFieldValueCreateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChoiceFieldValueCreateComponent, selector: "valtimo-choice-field-value-create", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "directive", type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldValueCreateComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-choice-field-value-create', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-choice-field-value-create', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i2$1.FormBuilder }, { type: ChoiceFieldService }, { type: i4.AlertService }]; } });
 
 /*
@@ -548,11 +548,11 @@ class ChoiceFieldValueDetailComponent {
         });
     }
 }
-ChoiceFieldValueDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldValueDetailComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
-ChoiceFieldValueDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ChoiceFieldValueDetailComponent, selector: "valtimo-choice-field-value-detail", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 pt-3\">\n                    <strong>Choice field value</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceFieldValue.id }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""], components: [{ type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldValueDetailComponent, decorators: [{
+ChoiceFieldValueDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldValueDetailComponent, deps: [{ token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i2$1.FormBuilder }, { token: ChoiceFieldService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component });
+ChoiceFieldValueDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ChoiceFieldValueDetailComponent, selector: "valtimo-choice-field-value-detail", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 pt-3\">\n                    <strong>Choice field value</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceFieldValue.id }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "directive", type: i4.FieldAutoFocusDirective, selector: "[valtimoFieldAutoFocus]" }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldValueDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-choice-field-value-detail', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 pt-3\">\n                    <strong>Choice field value</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceFieldValue.id }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-choice-field-value-detail', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget *ngIf=\"choiceField\">\n        <div>\n          <div class=\"card-body bg-light\">\n            <div class=\"row py-5\">\n              <div class=\"col-12\">\n                <div class=\"row mb-3\">\n                  <div class=\"col-12\">\n                    <strong>Choice field</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.id }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Key</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.keyName }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>Title</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceField.title }}</div>\n                </div>\n                <div class=\"row mb-3\">\n                  <div class=\"col-12 pt-3\">\n                    <strong>Choice field value</strong>\n                    <hr />\n                  </div>\n                </div>\n                <div class=\"row\">\n                  <div class=\"col-12 col-sm-3 text-sm-right\"><strong>ID</strong></div>\n                  <div class=\"col-12 col-sm-8 col-lg-6\">{{ choiceFieldValue.id }}</div>\n                </div>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"bg-white p-5\">\n            <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Key</label>\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    valtimoFieldAutoFocus\n                    type=\"text\"\n                    id=\"name\"\n                    formControlName=\"name\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value key\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.name.touched && formControls.name.valid,\n                      'is-invalid': formControls.name.touched && formControls.name.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.name.errors.required\">\n                      Choice field value key is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"value\"\n                  >Value</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"text\"\n                    id=\"value\"\n                    formControlName=\"value\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.value.touched && formControls.value.valid,\n                      'is-invalid': formControls.value.touched && formControls.value.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.value.touched && formControls.value.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.value.errors.required\">\n                      Choice field value is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"sortOrder\"\n                  >Sequence</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <input\n                    type=\"number\"\n                    id=\"sortOrder\"\n                    formControlName=\"sortOrder\"\n                    class=\"form-control\"\n                    placeholder=\"Choice field value sequence\"\n                    [ngClass]=\"{\n                      'is-valid': formControls.sortOrder.touched && formControls.sortOrder.valid,\n                      'is-invalid': formControls.sortOrder.touched && formControls.sortOrder.errors\n                    }\"\n                    required\n                  />\n                  <div\n                    *ngIf=\"formControls.sortOrder.touched && formControls.sortOrder.errors\"\n                    class=\"invalid-feedback\"\n                  >\n                    <div *ngIf=\"formControls.sortOrder.errors.required\">\n                      Choice field value sequence is required\n                    </div>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"form-group row\">\n                <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"deprecated\"\n                  >Deprecated</label\n                >\n                <div class=\"col-12 col-sm-8 col-lg-6\">\n                  <div class=\"switch-button switch-button-sm switch-button-success\">\n                    <input type=\"checkbox\" formControlName=\"deprecated\" id=\"deprecated\" /><span>\n                      <label for=\"deprecated\"></label\n                    ></span>\n                  </div>\n                </div>\n              </div>\n\n              <div class=\"row pt-3 mt-1\">\n                <div class=\"col-12 col-sm-6 text-left\">\n                  <a [routerLink]=\"'../../'\" class=\"btn btn-space btn-default\">Back</a>\n                </div>\n                <div class=\"col-12 col-sm-6 text-right\">\n                  <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">\n                    Reset\n                  </button>\n                  <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                    Submit\n                  </button>\n                </div>\n              </div>\n            </form>\n          </div>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i2$1.FormBuilder }, { type: ChoiceFieldService }, { type: i4.AlertService }]; } });
 
 /*
@@ -619,10 +619,10 @@ const routes = [
 ];
 class ChoiceFieldRoutingModule {
 }
-ChoiceFieldRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ChoiceFieldRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldRoutingModule, imports: [CommonModule, i1$1.RouterModule], exports: [RouterModule] });
-ChoiceFieldRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldRoutingModule, imports: [[CommonModule, RouterModule.forChild(routes)], RouterModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldRoutingModule, decorators: [{
+ChoiceFieldRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ChoiceFieldRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldRoutingModule, imports: [CommonModule, i1$1.RouterModule], exports: [RouterModule] });
+ChoiceFieldRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldRoutingModule, imports: [CommonModule, RouterModule.forChild(routes), RouterModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldRoutingModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, RouterModule.forChild(routes)],
@@ -647,8 +647,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  */
 class ChoiceFieldModule {
 }
-ChoiceFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ChoiceFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldModule, declarations: [ChoiceFieldListComponent,
+ChoiceFieldModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ChoiceFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldModule, declarations: [ChoiceFieldListComponent,
         ChoiceFieldDetailComponent,
         ChoiceFieldCreateComponent,
         ChoiceFieldValueListComponent,
@@ -662,18 +662,16 @@ ChoiceFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
         ChoiceFieldRoutingModule,
         AlertModule,
         TranslateModule] });
-ChoiceFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldModule, imports: [[
-            CommonModule,
-            ListModule,
-            WidgetModule,
-            FieldAutoFocusModule,
-            FormsModule,
-            ReactiveFormsModule,
-            ChoiceFieldRoutingModule,
-            AlertModule,
-            TranslateModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ChoiceFieldModule, decorators: [{
+ChoiceFieldModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldModule, imports: [CommonModule,
+        ListModule,
+        WidgetModule,
+        FieldAutoFocusModule,
+        FormsModule,
+        ReactiveFormsModule,
+        ChoiceFieldRoutingModule,
+        AlertModule,
+        TranslateModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ChoiceFieldModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [