@vgip/meta-ui 2.3.8 → 2.3.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1036,10 +1036,10 @@ class MetaHttpClient {
1036
1036
  };
1037
1037
  return options;
1038
1038
  }
1039
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaHttpClient, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
1040
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaHttpClient, providedIn: 'root' }); }
1039
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaHttpClient, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
1040
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaHttpClient, providedIn: 'root' }); }
1041
1041
  }
1042
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaHttpClient, decorators: [{
1042
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaHttpClient, decorators: [{
1043
1043
  type: Injectable,
1044
1044
  args: [{
1045
1045
  providedIn: 'root'
@@ -1174,10 +1174,10 @@ class MetaResourceService {
1174
1174
  return this.httpClient.post(`${this.baseResourceUrl}`, payload);
1175
1175
  }
1176
1176
  }
1177
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceService, deps: [{ token: MetaHttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
1178
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceService, providedIn: 'root' }); }
1177
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResourceService, deps: [{ token: MetaHttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
1178
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResourceService, providedIn: 'root' }); }
1179
1179
  }
1180
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceService, decorators: [{
1180
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResourceService, decorators: [{
1181
1181
  type: Injectable,
1182
1182
  args: [{
1183
1183
  providedIn: 'root'
@@ -1223,10 +1223,10 @@ class MetaContextService {
1223
1223
  delete this.onClick2Dial;
1224
1224
  }
1225
1225
  }
1226
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1227
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaContextService, providedIn: 'root' }); }
1226
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1227
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaContextService, providedIn: 'root' }); }
1228
1228
  }
1229
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaContextService, decorators: [{
1229
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaContextService, decorators: [{
1230
1230
  type: Injectable,
1231
1231
  args: [{
1232
1232
  providedIn: 'root'
@@ -1304,10 +1304,10 @@ class MetaMsgService {
1304
1304
  }
1305
1305
  }
1306
1306
  }
1307
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaMsgService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
1308
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaMsgService, providedIn: 'root' }); }
1307
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaMsgService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
1308
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaMsgService, providedIn: 'root' }); }
1309
1309
  }
1310
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaMsgService, decorators: [{
1310
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaMsgService, decorators: [{
1311
1311
  type: Injectable,
1312
1312
  args: [{
1313
1313
  providedIn: 'root'
@@ -1418,10 +1418,10 @@ class MetaReferenceService {
1418
1418
  });
1419
1419
  return modalObservable;
1420
1420
  }
1421
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaReferenceService, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
1422
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaReferenceService, providedIn: 'root' }); }
1421
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaReferenceService, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
1422
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaReferenceService, providedIn: 'root' }); }
1423
1423
  }
1424
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaReferenceService, decorators: [{
1424
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaReferenceService, decorators: [{
1425
1425
  type: Injectable,
1426
1426
  args: [{
1427
1427
  providedIn: 'root'
@@ -1746,10 +1746,10 @@ class FieldAbstract {
1746
1746
  }
1747
1747
  });
1748
1748
  }
1749
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldAbstract, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1750
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: FieldAbstract, isStandalone: true, ngImport: i0 }); }
1749
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldAbstract, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
1750
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.12", type: FieldAbstract, isStandalone: true, ngImport: i0 }); }
1751
1751
  }
1752
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldAbstract, decorators: [{
1752
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldAbstract, decorators: [{
1753
1753
  type: Directive
1754
1754
  }] });
1755
1755
  class MetaElem {
@@ -1827,10 +1827,10 @@ class MetaFieldContentDirective {
1827
1827
  constructor(viewContainerRef) {
1828
1828
  this.viewContainerRef = viewContainerRef;
1829
1829
  }
1830
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFieldContentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
1831
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: MetaFieldContentDirective, isStandalone: false, selector: "[metaFieldContent]", ngImport: i0 }); }
1830
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaFieldContentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
1831
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.12", type: MetaFieldContentDirective, isStandalone: false, selector: "[metaFieldContent]", ngImport: i0 }); }
1832
1832
  }
1833
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFieldContentDirective, decorators: [{
1833
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaFieldContentDirective, decorators: [{
1834
1834
  type: Directive,
1835
1835
  args: [{
1836
1836
  selector: '[metaFieldContent]',
@@ -1878,10 +1878,10 @@ class MetaField extends FieldAbstract {
1878
1878
  enumerable: false
1879
1879
  });
1880
1880
  }
1881
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaField, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
1882
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaField, isStandalone: false, selector: "vgip-meta-field", inputs: { meta: "meta", parent: "parent", integrationCode: "integrationCode", resourceType: "resourceType", index: "index", scope: "scope", preview: "preview", theme: "theme", overlayContainer: "overlayContainer", delegate: "delegate" }, outputs: { onChange: "onChange", onLeave: "onLeave", onRefTypeChange: "onRefTypeChange" }, viewQueries: [{ propertyName: "fieldContent", first: true, predicate: MetaFieldContentDirective, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: '<ng-template metaFieldContent>Loading</ng-template>', isInline: true, styles: [":host ::ng-deep label.wrapper{padding:0;pointer-events:initial;position:initial;top:initial;transition:none}@media only screen and (max-width:575px){:host ::ng-deep .hidden-mobile{display:none}}@media only screen and (min-width:576px){:host ::ng-deep .hidden-desktop{display:none}}:host ::ng-deep .Vlt-form__element>.Vlt-label,:host ::ng-deep .Vlt-form__element>label>.Vlt-label{margin-top:-6px}:host ::ng-deep .Vlt-form__element .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}:host ::ng-deep .Vlt-form__element .Vlt-input input,:host ::ng-deep .Vlt-form__element .Vlt-select select,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea{color:var(--vgip-meta-input-color)}@media(hover:none){:host ::ng-deep .Vlt-form__element .Vlt-input input,:host ::ng-deep .Vlt-form__element .Vlt-select select,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea{font-size:16px}}:host ::ng-deep .Vlt-form__element .Vlt-input input::placeholder,:host ::ng-deep .Vlt-form__element .Vlt-select select::placeholder,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea::placeholder{color:var(--vgip-meta-input-placeholder-color)}:host ::ng-deep .Vlt-form__element label{color:var(--vgip-meta-input-label-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon{background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:disabled{background:var(--vgip-meta-input-disabled-bg-color);border-color:var(--vgip-meta-input-disabled-border-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon .active{border-color:var(--vgip-meta-input-active-border-color)}:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-input input:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-select select:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-textarea textarea:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-custom-select__input:focus{border-color:#f25a6b}:host ::ng-deep .Vlt-dropdown__link{padding:12px}:host ::ng-deep .Vlt-dropdown__link svg{margin-left:0}:host ::ng-deep .Vlt-dropdown__link small{line-height:inherit}:host ::ng-deep .Vlt-dropdown__link.Vlt-dropdown__link--selected:after{width:20px;top:14px;background:var(--vgip-meta-dropdown-check-icon) no-repeat right center;background-size:contain}:host ::ng-deep .Vlt-dropdown__block{padding:2px 16px}:host ::ng-deep .meta-field-reference .Vlt-dropdown__link.has-type.Vlt-dropdown__link--selected:after{position:initial}:host ::ng-deep .Vlt-dropdown__panel__content{background:var(--vgip-meta-dropdown-bg-color);box-shadow:var(--vgip-meta-dropdown-shadow)}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__link,:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__block{color:var(--vgip-meta-input-color)}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__scroll::-webkit-scrollbar{width:8px}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__scroll::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}:host ::ng-deep .Vlt-dropdown__panel__content.suggestions{background:var(--vgip-meta-suggestions-bg-color)}:host ::ng-deep .Vlt-dropdown__panel{z-index:999}:host ::ng-deep .Vlt-dropdown__panel__content--scroll-area{padding:0}:host ::ng-deep .Vlt-composite__append--icon{bottom:0;height:initial}:host ::ng-deep .search-progress{display:block;position:relative;width:100%;height:3px;margin-top:-3px;padding-top:0!important;margin-bottom:0!important}:host ::ng-deep .search-progress .container{display:block;position:relative;overflow:hidden;width:100%;height:3px;transform:translate(0) scale(1)}:host ::ng-deep .search-progress .container .bar{position:absolute;left:0;top:0;bottom:0;width:100%;height:3px;border-radius:50%;transition:all .3s linear;animation:query .9s infinite cubic-bezier(.3,.6,.6,1)}@keyframes query{0%{opacity:1;transform:translate(35%) scaleX(.3)}to{opacity:0;transform:translate(-50%) scaleX(0)}}::ng-deep vgip-meta-field.shown vgip-meta-field{display:initial}::ng-deep vgip-meta-field .vgip-meta-field-preview{display:flex;flex-direction:row;padding-bottom:5px;padding-top:5px;margin-left:10px;border-bottom:1px solid #e7ebee}::ng-deep vgip-meta-field .vgip-meta-field-preview .vgip-meta-field-label{flex:1 1 100%;max-width:20%;max-height:100%;box-sizing:border-box;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:2px}::ng-deep vgip-meta-field .vgip-meta-field-preview .vgip-meta-field-value{min-width:0;width:0;box-sizing:border-box;flex:1;font-weight:700}\n"], dependencies: [{ kind: "directive", type: MetaFieldContentDirective, selector: "[metaFieldContent]" }] }); }
1881
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaField, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
1882
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: MetaField, isStandalone: false, selector: "vgip-meta-field", inputs: { meta: "meta", parent: "parent", integrationCode: "integrationCode", resourceType: "resourceType", index: "index", scope: "scope", preview: "preview", theme: "theme", overlayContainer: "overlayContainer", delegate: "delegate" }, outputs: { onChange: "onChange", onLeave: "onLeave", onRefTypeChange: "onRefTypeChange" }, viewQueries: [{ propertyName: "fieldContent", first: true, predicate: MetaFieldContentDirective, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: '<ng-template metaFieldContent>Loading</ng-template>', isInline: true, styles: [":host ::ng-deep label.wrapper{padding:0;pointer-events:initial;position:initial;top:initial;transition:none}@media only screen and (max-width:575px){:host ::ng-deep .hidden-mobile{display:none}}@media only screen and (min-width:576px){:host ::ng-deep .hidden-desktop{display:none}}:host ::ng-deep .Vlt-form__element>.Vlt-label,:host ::ng-deep .Vlt-form__element>label>.Vlt-label{margin-top:-6px}:host ::ng-deep .Vlt-form__element .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}:host ::ng-deep .Vlt-form__element .Vlt-input input,:host ::ng-deep .Vlt-form__element .Vlt-select select,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea{color:var(--vgip-meta-input-color)}@media(hover:none){:host ::ng-deep .Vlt-form__element .Vlt-input input,:host ::ng-deep .Vlt-form__element .Vlt-select select,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea{font-size:16px}}:host ::ng-deep .Vlt-form__element .Vlt-input input::placeholder,:host ::ng-deep .Vlt-form__element .Vlt-select select::placeholder,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea::placeholder{color:var(--vgip-meta-input-placeholder-color)}:host ::ng-deep .Vlt-form__element label{color:var(--vgip-meta-input-label-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon{background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:disabled{background:var(--vgip-meta-input-disabled-bg-color);border-color:var(--vgip-meta-input-disabled-border-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon .active{border-color:var(--vgip-meta-input-active-border-color)}:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-input input:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-select select:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-textarea textarea:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-custom-select__input:focus{border-color:#f25a6b}:host ::ng-deep .Vlt-dropdown__link{padding:12px}:host ::ng-deep .Vlt-dropdown__link svg{margin-left:0}:host ::ng-deep .Vlt-dropdown__link small{line-height:inherit}:host ::ng-deep .Vlt-dropdown__link.Vlt-dropdown__link--selected:after{width:20px;top:14px;background:var(--vgip-meta-dropdown-check-icon) no-repeat right center;background-size:contain}:host ::ng-deep .Vlt-dropdown__block{padding:2px 16px}:host ::ng-deep .meta-field-reference .Vlt-dropdown__link.has-type.Vlt-dropdown__link--selected:after{position:initial}:host ::ng-deep .Vlt-dropdown__panel__content{background:var(--vgip-meta-dropdown-bg-color);box-shadow:var(--vgip-meta-dropdown-shadow)}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__link,:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__block{color:var(--vgip-meta-input-color)}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__scroll::-webkit-scrollbar{width:8px}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__scroll::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}:host ::ng-deep .Vlt-dropdown__panel__content.suggestions{background:var(--vgip-meta-suggestions-bg-color)}:host ::ng-deep .Vlt-dropdown__panel{z-index:999}:host ::ng-deep .Vlt-dropdown__panel__content--scroll-area{padding:0}:host ::ng-deep .Vlt-composite__append--icon{bottom:0;height:initial}:host ::ng-deep .search-progress{display:block;position:relative;width:100%;height:3px;margin-top:-3px;padding-top:0!important;margin-bottom:0!important}:host ::ng-deep .search-progress .container{display:block;position:relative;overflow:hidden;width:100%;height:3px;transform:translate(0) scale(1)}:host ::ng-deep .search-progress .container .bar{position:absolute;left:0;top:0;bottom:0;width:100%;height:3px;border-radius:50%;transition:all .3s linear;animation:query .9s infinite cubic-bezier(.3,.6,.6,1)}@keyframes query{0%{opacity:1;transform:translate(35%) scaleX(.3)}to{opacity:0;transform:translate(-50%) scaleX(0)}}::ng-deep vgip-meta-field.shown vgip-meta-field{display:initial}::ng-deep vgip-meta-field .vgip-meta-field-preview{display:flex;flex-direction:row;padding-bottom:5px;padding-top:5px;margin-left:10px;border-bottom:1px solid #e7ebee}::ng-deep vgip-meta-field .vgip-meta-field-preview .vgip-meta-field-label{flex:1 1 100%;max-width:20%;max-height:100%;box-sizing:border-box;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:2px}::ng-deep vgip-meta-field .vgip-meta-field-preview .vgip-meta-field-value{min-width:0;width:0;box-sizing:border-box;flex:1;font-weight:700}\n"], dependencies: [{ kind: "directive", type: MetaFieldContentDirective, selector: "[metaFieldContent]" }] }); }
1883
1883
  }
1884
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaField, decorators: [{
1884
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaField, decorators: [{
1885
1885
  type: Component,
1886
1886
  args: [{ selector: 'vgip-meta-field', template: '<ng-template metaFieldContent>Loading</ng-template>', standalone: false, styles: [":host ::ng-deep label.wrapper{padding:0;pointer-events:initial;position:initial;top:initial;transition:none}@media only screen and (max-width:575px){:host ::ng-deep .hidden-mobile{display:none}}@media only screen and (min-width:576px){:host ::ng-deep .hidden-desktop{display:none}}:host ::ng-deep .Vlt-form__element>.Vlt-label,:host ::ng-deep .Vlt-form__element>label>.Vlt-label{margin-top:-6px}:host ::ng-deep .Vlt-form__element .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}:host ::ng-deep .Vlt-form__element .Vlt-input input,:host ::ng-deep .Vlt-form__element .Vlt-select select,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea{color:var(--vgip-meta-input-color)}@media(hover:none){:host ::ng-deep .Vlt-form__element .Vlt-input input,:host ::ng-deep .Vlt-form__element .Vlt-select select,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea{font-size:16px}}:host ::ng-deep .Vlt-form__element .Vlt-input input::placeholder,:host ::ng-deep .Vlt-form__element .Vlt-select select::placeholder,:host ::ng-deep .Vlt-form__element .Vlt-textarea textarea::placeholder{color:var(--vgip-meta-input-placeholder-color)}:host ::ng-deep .Vlt-form__element label{color:var(--vgip-meta-input-label-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon{background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:disabled,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:disabled{background:var(--vgip-meta-input-disabled-bg-color);border-color:var(--vgip-meta-input-disabled-border-color)}:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-form-error-style .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-input input.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-select select.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-textarea textarea.ng-untouched:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-custom-select__input:invalid .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-radio__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-radio input.ng-untouched:invalid+.Vlt-checkbox__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-radio__icon .active,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:hover,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon:focus,:host ::ng-deep .Vlt-form__element:not(.Vlt-form__element--error) .Vlt-checkbox input.ng-untouched:invalid+.Vlt-checkbox__icon .active{border-color:var(--vgip-meta-input-active-border-color)}:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-input input:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-select select:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-textarea textarea:focus,:host ::ng-deep .Vlt-form__element.Vlt-form__element--error .Vlt-custom-select__input:focus{border-color:#f25a6b}:host ::ng-deep .Vlt-dropdown__link{padding:12px}:host ::ng-deep .Vlt-dropdown__link svg{margin-left:0}:host ::ng-deep .Vlt-dropdown__link small{line-height:inherit}:host ::ng-deep .Vlt-dropdown__link.Vlt-dropdown__link--selected:after{width:20px;top:14px;background:var(--vgip-meta-dropdown-check-icon) no-repeat right center;background-size:contain}:host ::ng-deep .Vlt-dropdown__block{padding:2px 16px}:host ::ng-deep .meta-field-reference .Vlt-dropdown__link.has-type.Vlt-dropdown__link--selected:after{position:initial}:host ::ng-deep .Vlt-dropdown__panel__content{background:var(--vgip-meta-dropdown-bg-color);box-shadow:var(--vgip-meta-dropdown-shadow)}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__link,:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__block{color:var(--vgip-meta-input-color)}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__scroll::-webkit-scrollbar{width:8px}:host ::ng-deep .Vlt-dropdown__panel__content .Vlt-dropdown__scroll::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}:host ::ng-deep .Vlt-dropdown__panel__content.suggestions{background:var(--vgip-meta-suggestions-bg-color)}:host ::ng-deep .Vlt-dropdown__panel{z-index:999}:host ::ng-deep .Vlt-dropdown__panel__content--scroll-area{padding:0}:host ::ng-deep .Vlt-composite__append--icon{bottom:0;height:initial}:host ::ng-deep .search-progress{display:block;position:relative;width:100%;height:3px;margin-top:-3px;padding-top:0!important;margin-bottom:0!important}:host ::ng-deep .search-progress .container{display:block;position:relative;overflow:hidden;width:100%;height:3px;transform:translate(0) scale(1)}:host ::ng-deep .search-progress .container .bar{position:absolute;left:0;top:0;bottom:0;width:100%;height:3px;border-radius:50%;transition:all .3s linear;animation:query .9s infinite cubic-bezier(.3,.6,.6,1)}@keyframes query{0%{opacity:1;transform:translate(35%) scaleX(.3)}to{opacity:0;transform:translate(-50%) scaleX(0)}}::ng-deep vgip-meta-field.shown vgip-meta-field{display:initial}::ng-deep vgip-meta-field .vgip-meta-field-preview{display:flex;flex-direction:row;padding-bottom:5px;padding-top:5px;margin-left:10px;border-bottom:1px solid #e7ebee}::ng-deep vgip-meta-field .vgip-meta-field-preview .vgip-meta-field-label{flex:1 1 100%;max-width:20%;max-height:100%;box-sizing:border-box;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-right:2px}::ng-deep vgip-meta-field .vgip-meta-field-preview .vgip-meta-field-value{min-width:0;width:0;box-sizing:border-box;flex:1;font-weight:700}\n"] }]
1887
1887
  }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { meta: [{
@@ -2095,10 +2095,10 @@ class MetaLayout {
2095
2095
  this.el.nativeElement.style.setProperty(key, metaTheme.properties[key]);
2096
2096
  }
2097
2097
  }
2098
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaLayout, deps: [{ token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaReferenceService }, { token: MetaMsgService }, { token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
2099
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MetaLayout, isStandalone: false, selector: "vgip-meta-layout", inputs: { meta: "meta", resource: "resource", integration: "integration", type: "type", preview: "preview", theme: "theme", delegate: "delegate" }, usesOnChanges: true, ngImport: i0, template: "@for (section of meta.sections; track section) {\n <div class='Vlt-section' [ngClass]=\"{ shown: showAll || section.visible || (!meta.oneTimeOptional && !section.$optional) || (meta.oneTimeOptional && !optionalFieldsCount) }\">\n @if (section.label) {\n <h5 class=\"Vlt-section__title\">{{section.label}}</h5>\n }\n <div style='overflow: visible;' [ngClass]=\"{ 'for-preview': preview }\">\n @if (section.description) {\n <small class=\"Vlt-form__element__hint\">{{section.description}}</small>\n }\n <div>\n @for (field of section.fields; track field) {\n @if (!field.$hidden && (showAll || section.visible || !field.$optional)) {\n <vgip-meta-field [meta]='field' [parent]='resource' [integrationCode]='integrationCode' [resourceType]='resourceType' [preview]='preview' [ngClass]=\"{ shown: !field.$invisible && (showAll || true) }\" theme='inherit' [attr.data-theme]='theme' [delegate]='delegate'></vgip-meta-field>\n }\n }\n </div>\n </div>\n </div>\n}\n@if (isPersistedResource && meta.children && preview) {\n <div>\n @for (child of meta.children; track child) {\n <div>\n <h5 class='Vlt-children__title'>\n <svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-stack\" /></svg>&nbsp;\n {{child.label}} <span class='Vlt-grey'>({{(resource[child.name] || []).length}})</span>\n </h5>\n @for (c of resource[child.name]; track c) {\n <div style='position: relative;'>\n <div class=\"Vlt-card Vlt-bg-white\">\n <div class=\"Vlt-card__content Vlt-btn-on-hover\">\n <h5>{{childResourceCardLabel(c)}}</h5>\n <div style='font-size: 12px; line-height: 16px;'>\n Created: <span class='Vlt-black'>{{c._vgis.createdDate | date:'mediumDate'}}</span>\n Edited: <span class='Vlt-black'>{{c._vgis.modifiedDate | date:'medium'}}</span>\n </div>\n <div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{c._vgis.resourceType}}</div>\n <div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n @if (c._vgis.externalLink) {\n <a attr.href='{{c._vgis.externalLink}}' target='_blank' rel='noopener' rel='noopener' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Open external'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\"/></svg></a>\n }\n <button type='button' (click)='openChild(child, c)' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\"><svg style='margin-left: 0; margin-right: 0;'><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ child.reference.editable ? 'edit' : 'eye-negative' }}\"/></svg></button>\n </div>\n </div>\n </div>\n </div>\n }\n <button style='width: 100%; margin-top: 0; max-width: 100%;' type='button' (click)='openChild(child)' class=\"Vlt-btn Vlt-btn--small Vlt-btn--secondary\" [disabled]='child.creatable === false'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{child.reference.label}}\n </button>\n </div>\n }\n </div>\n}\n@if (!(meta.oneTimeOptional && showAll)) {\n <div [ngClass]='{ centered: !meta.oneTimeOptional }'>\n @if (!preview && optionalFieldsCount) {\n <button type='button' (click)='toggleOptionalFields()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--link more-button\" style='margin: 0; margin-bottom: 10px;'>\n <svg><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-chevron-{{ showAll ? 'up' : 'down' }}\"/></svg>\n {{ showAll ? 'Hide' : 'Show' }} Optional Fields ({{optionalFieldsCount}})\n </button>\n }\n </div>\n}\n", styles: ["vgip-meta-field{display:none}vgip-meta-field.shown{display:initial}.Vlt-section__title{line-height:14px;padding:16px 16px 14px 3px;margin:-9px -1px 8px;background-color:var(--vgip-meta-resource-bg-color);color:var(--vgip-meta-resource-color);position:sticky;top:-9px;z-index:3;border-bottom:1px solid var(--vgip-meta-separator-color)}.Vlt-section{margin:0;padding-bottom:8px;display:none}.Vlt-section.shown{display:block}.Vlt-btn.vlt-add-child:hover{transform:scale(1.02)}.for-preview{margin-top:-6px}.Vlt-card{margin-bottom:16px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}button.more-button:focus{font-weight:700}.centered{text-align:center}.Vlt-btn--link{color:var(--vgip-meta-link-color)}.Vlt-btn--link:hover{color:var(--vgip-meta-link-hover-color)}.Vlt-btn--link svg{fill:var(--vgip-meta-link-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
2098
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaLayout, deps: [{ token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaReferenceService }, { token: MetaMsgService }, { token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
2099
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: MetaLayout, isStandalone: false, selector: "vgip-meta-layout", inputs: { meta: "meta", resource: "resource", integration: "integration", type: "type", preview: "preview", theme: "theme", delegate: "delegate" }, usesOnChanges: true, ngImport: i0, template: "@for (section of meta.sections; track section) {\n <div class='Vlt-section' [ngClass]=\"{ shown: showAll || section.visible || (!meta.oneTimeOptional && !section.$optional) || (meta.oneTimeOptional && !optionalFieldsCount) }\">\n @if (section.label) {\n <h5 class=\"Vlt-section__title\">{{section.label}}</h5>\n }\n <div style='overflow: visible;' [ngClass]=\"{ 'for-preview': preview }\">\n @if (section.description) {\n <small class=\"Vlt-form__element__hint\">{{section.description}}</small>\n }\n <div>\n @for (field of section.fields; track field) {\n @if (!field.$hidden && (showAll || section.visible || !field.$optional)) {\n <vgip-meta-field [meta]='field' [parent]='resource' [integrationCode]='integrationCode' [resourceType]='resourceType' [preview]='preview' [ngClass]=\"{ shown: !field.$invisible && (showAll || true) }\" theme='inherit' [attr.data-theme]='theme' [delegate]='delegate'></vgip-meta-field>\n }\n }\n </div>\n </div>\n </div>\n}\n@if (isPersistedResource && meta.children && preview) {\n <div>\n @for (child of meta.children; track child) {\n <div>\n <h5 class='Vlt-children__title'>\n <svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-stack\" /></svg>&nbsp;\n {{child.label}} <span class='Vlt-grey'>({{(resource[child.name] || []).length}})</span>\n </h5>\n @for (c of resource[child.name]; track c) {\n <div style='position: relative;'>\n <div class=\"Vlt-card Vlt-bg-white\">\n <div class=\"Vlt-card__content Vlt-btn-on-hover\">\n <h5>{{childResourceCardLabel(c)}}</h5>\n <div style='font-size: 12px; line-height: 16px;'>\n Created: <span class='Vlt-black'>{{c._vgis.createdDate | date:'mediumDate'}}</span>\n Edited: <span class='Vlt-black'>{{c._vgis.modifiedDate | date:'medium'}}</span>\n </div>\n <div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{c._vgis.resourceType}}</div>\n <div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n @if (c._vgis.externalLink) {\n <a attr.href='{{c._vgis.externalLink}}' target='_blank' rel='noopener' rel='noopener' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Open external'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\"/></svg></a>\n }\n <button type='button' (click)='openChild(child, c)' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\"><svg style='margin-left: 0; margin-right: 0;'><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ child.reference.editable ? 'edit' : 'eye-negative' }}\"/></svg></button>\n </div>\n </div>\n </div>\n </div>\n }\n <button style='width: 100%; margin-top: 0; max-width: 100%;' type='button' (click)='openChild(child)' class=\"Vlt-btn Vlt-btn--small Vlt-btn--secondary\" [disabled]='child.creatable === false'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{child.reference.label}}\n </button>\n </div>\n }\n </div>\n}\n@if (!(meta.oneTimeOptional && showAll)) {\n <div [ngClass]='{ centered: !meta.oneTimeOptional }'>\n @if (!preview && optionalFieldsCount) {\n <button type='button' (click)='toggleOptionalFields()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--link more-button\" style='margin: 0; margin-bottom: 10px;'>\n <svg><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-chevron-{{ showAll ? 'up' : 'down' }}\"/></svg>\n {{ showAll ? 'Hide' : 'Show' }} Optional Fields ({{optionalFieldsCount}})\n </button>\n }\n </div>\n}\n", styles: ["vgip-meta-field{display:none}vgip-meta-field.shown{display:initial}.Vlt-section__title{line-height:14px;padding:16px 16px 14px 3px;margin:-9px -1px 8px;background-color:var(--vgip-meta-resource-bg-color);color:var(--vgip-meta-resource-color);position:sticky;top:-9px;z-index:3;border-bottom:1px solid var(--vgip-meta-separator-color)}.Vlt-section{margin:0;padding-bottom:8px;display:none}.Vlt-section.shown{display:block}.Vlt-btn.vlt-add-child:hover{transform:scale(1.02)}.for-preview{margin-top:-6px}.Vlt-card{margin-bottom:16px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}button.more-button:focus{font-weight:700}.centered{text-align:center}.Vlt-btn--link{color:var(--vgip-meta-link-color)}.Vlt-btn--link:hover{color:var(--vgip-meta-link-hover-color)}.Vlt-btn--link svg{fill:var(--vgip-meta-link-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
2100
2100
  }
2101
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaLayout, decorators: [{
2101
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaLayout, decorators: [{
2102
2102
  type: Component,
2103
2103
  args: [{ selector: "vgip-meta-layout", standalone: false, template: "@for (section of meta.sections; track section) {\n <div class='Vlt-section' [ngClass]=\"{ shown: showAll || section.visible || (!meta.oneTimeOptional && !section.$optional) || (meta.oneTimeOptional && !optionalFieldsCount) }\">\n @if (section.label) {\n <h5 class=\"Vlt-section__title\">{{section.label}}</h5>\n }\n <div style='overflow: visible;' [ngClass]=\"{ 'for-preview': preview }\">\n @if (section.description) {\n <small class=\"Vlt-form__element__hint\">{{section.description}}</small>\n }\n <div>\n @for (field of section.fields; track field) {\n @if (!field.$hidden && (showAll || section.visible || !field.$optional)) {\n <vgip-meta-field [meta]='field' [parent]='resource' [integrationCode]='integrationCode' [resourceType]='resourceType' [preview]='preview' [ngClass]=\"{ shown: !field.$invisible && (showAll || true) }\" theme='inherit' [attr.data-theme]='theme' [delegate]='delegate'></vgip-meta-field>\n }\n }\n </div>\n </div>\n </div>\n}\n@if (isPersistedResource && meta.children && preview) {\n <div>\n @for (child of meta.children; track child) {\n <div>\n <h5 class='Vlt-children__title'>\n <svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-stack\" /></svg>&nbsp;\n {{child.label}} <span class='Vlt-grey'>({{(resource[child.name] || []).length}})</span>\n </h5>\n @for (c of resource[child.name]; track c) {\n <div style='position: relative;'>\n <div class=\"Vlt-card Vlt-bg-white\">\n <div class=\"Vlt-card__content Vlt-btn-on-hover\">\n <h5>{{childResourceCardLabel(c)}}</h5>\n <div style='font-size: 12px; line-height: 16px;'>\n Created: <span class='Vlt-black'>{{c._vgis.createdDate | date:'mediumDate'}}</span>\n Edited: <span class='Vlt-black'>{{c._vgis.modifiedDate | date:'medium'}}</span>\n </div>\n <div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{c._vgis.resourceType}}</div>\n <div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n @if (c._vgis.externalLink) {\n <a attr.href='{{c._vgis.externalLink}}' target='_blank' rel='noopener' rel='noopener' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Open external'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\"/></svg></a>\n }\n <button type='button' (click)='openChild(child, c)' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\"><svg style='margin-left: 0; margin-right: 0;'><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ child.reference.editable ? 'edit' : 'eye-negative' }}\"/></svg></button>\n </div>\n </div>\n </div>\n </div>\n }\n <button style='width: 100%; margin-top: 0; max-width: 100%;' type='button' (click)='openChild(child)' class=\"Vlt-btn Vlt-btn--small Vlt-btn--secondary\" [disabled]='child.creatable === false'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{child.reference.label}}\n </button>\n </div>\n }\n </div>\n}\n@if (!(meta.oneTimeOptional && showAll)) {\n <div [ngClass]='{ centered: !meta.oneTimeOptional }'>\n @if (!preview && optionalFieldsCount) {\n <button type='button' (click)='toggleOptionalFields()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--link more-button\" style='margin: 0; margin-bottom: 10px;'>\n <svg><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-chevron-{{ showAll ? 'up' : 'down' }}\"/></svg>\n {{ showAll ? 'Hide' : 'Show' }} Optional Fields ({{optionalFieldsCount}})\n </button>\n }\n </div>\n}\n", styles: ["vgip-meta-field{display:none}vgip-meta-field.shown{display:initial}.Vlt-section__title{line-height:14px;padding:16px 16px 14px 3px;margin:-9px -1px 8px;background-color:var(--vgip-meta-resource-bg-color);color:var(--vgip-meta-resource-color);position:sticky;top:-9px;z-index:3;border-bottom:1px solid var(--vgip-meta-separator-color)}.Vlt-section{margin:0;padding-bottom:8px;display:none}.Vlt-section.shown{display:block}.Vlt-btn.vlt-add-child:hover{transform:scale(1.02)}.for-preview{margin-top:-6px}.Vlt-card{margin-bottom:16px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}button.more-button:focus{font-weight:700}.centered{text-align:center}.Vlt-btn--link{color:var(--vgip-meta-link-color)}.Vlt-btn--link:hover{color:var(--vgip-meta-link-hover-color)}.Vlt-btn--link svg{fill:var(--vgip-meta-link-color)}\n"] }]
2104
2104
  }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: MetaResourceService }, { type: MetaReferenceService }, { type: MetaMsgService }, { type: MetaContextService }], propDecorators: { meta: [{
@@ -2137,10 +2137,10 @@ class MetaAutofocusDirective {
2137
2137
  }, 300);
2138
2138
  }
2139
2139
  }
2140
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaAutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
2141
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: MetaAutofocusDirective, isStandalone: false, selector: "[vgipMetaFormAutofocus]", inputs: { vgipMetaFormAutofocus: "vgipMetaFormAutofocus" }, ngImport: i0 }); }
2140
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaAutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
2141
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.12", type: MetaAutofocusDirective, isStandalone: false, selector: "[vgipMetaFormAutofocus]", inputs: { vgipMetaFormAutofocus: "vgipMetaFormAutofocus" }, ngImport: i0 }); }
2142
2142
  }
2143
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaAutofocusDirective, decorators: [{
2143
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaAutofocusDirective, decorators: [{
2144
2144
  type: Directive,
2145
2145
  args: [{
2146
2146
  // eslint-disable-next-line
@@ -2345,14 +2345,18 @@ class MetaResource {
2345
2345
  }
2346
2346
  }
2347
2347
  }
2348
+ /** Modifying Data as per CRM requirements */
2349
+ this.transformResourceForCRM(resource);
2348
2350
  /* eslint-enable no-underscore-dangle */
2349
- for (const p in resource) {
2350
- if ((typeof (resource[p]) !== 'undefined') && (this.fieldNames.indexOf(p) !== -1 || p === '_vgis') ||
2351
- (this.resource.preserveFieldsNames || []).indexOf(p) !== -1) {
2352
- this.model[p] = resource[p];
2353
- }
2354
- }
2355
- delete this.busy;
2351
+ // for (const p in resource) {
2352
+ // if ((typeof (resource[p]) !== 'undefined') && (
2353
+ // this.fieldNames.indexOf(p) !== -1 || p === '_vgis') ||
2354
+ // (this.resource.preserveFieldsNames || []).indexOf(p) !== -1
2355
+ // ) {
2356
+ // this.model[p] = resource[p];
2357
+ // }
2358
+ // }
2359
+ // delete this.busy;
2356
2360
  },
2357
2361
  error: (resourceError) => {
2358
2362
  this.generalError = resourceError.error ? resourceError.error.message || resourceError.message : resourceError.message;
@@ -2375,6 +2379,36 @@ class MetaResource {
2375
2379
  this.performAutoFill();
2376
2380
  }
2377
2381
  }
2382
+ transformResourceForCRM(resource) {
2383
+ this.metaMsgService.sendMessage(this.integrationCode, {
2384
+ action: 'dataTransform',
2385
+ integration: this.integrationCode,
2386
+ resourceType: this.resourceType,
2387
+ resource: JSON.parse(JSON.stringify(resource)),
2388
+ fields: this.niceFields,
2389
+ event: this.metaContext.context,
2390
+ profile: this.metaContext.profiles[this.integrationCode]
2391
+ }, (response) => {
2392
+ console.log('Data transform response', response);
2393
+ if (!response.error) {
2394
+ for (const p in response.resource) {
2395
+ if ((typeof (response.resource[p]) !== 'undefined') && (this.fieldNames.indexOf(p) !== -1 || p === '_vgis') ||
2396
+ (this.resource.preserveFieldsNames || []).indexOf(p) !== -1) {
2397
+ this.model[p] = response.resource[p];
2398
+ }
2399
+ }
2400
+ }
2401
+ else {
2402
+ for (const p in resource) {
2403
+ if ((typeof (resource[p]) !== 'undefined') && (this.fieldNames.indexOf(p) !== -1 || p === '_vgis') ||
2404
+ (this.resource.preserveFieldsNames || []).indexOf(p) !== -1) {
2405
+ this.model[p] = resource[p];
2406
+ }
2407
+ }
2408
+ }
2409
+ delete this.busy;
2410
+ });
2411
+ }
2378
2412
  performAutoFill() {
2379
2413
  this.metaMsgService.sendMessage(this.integrationCode, {
2380
2414
  action: 'autoFill',
@@ -2666,10 +2700,10 @@ class MetaResource {
2666
2700
  extractPreserveSectionFields(s);
2667
2701
  }
2668
2702
  }
2669
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResource, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaContextService }, { token: MetaMsgService }], target: i0.ɵɵFactoryTarget.Component }); }
2670
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MetaResource, isStandalone: false, selector: "vgip-meta-resource", inputs: { resource: "resource", model: "model", metaResourceServiceDelegated: "metaResourceServiceDelegated", theme: "theme", editMode: "editMode" }, outputs: { done: "done", resourceChange: "resourceChange" }, viewQueries: [{ propertyName: "resourceForm", first: true, predicate: ["resourceForm"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (generalError) {\n <div class=\"Vlt-callout Vlt-callout--critical\" style='overflow: auto; margin: 20px;'>\n <i></i>\n <div class=\"Vlt-callout__content\">\n <p>{{generalError}}</p>\n </div>\n </div>\n}\n@if (!meta) {\n <div class=\"Vlt-progress\">\n <div class=\"Vlt-progress__bar\" [ngClass]=\"{ loading: metaLoading }\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuetext=\"Loading Metadata\" aria-valuemax=\"100\"></div>\n </div>\n}\n@if (meta && !generalError) {\n <form [vgipMetaFormAutofocus]='!resource || !resource.externalId' #resourceForm=\"ngForm\" [name]='resource.resourceType' (ngSubmit)='submit(resourceForm)' (change)='onFormChange()' novalidate>\n <div class='form-content' style='overflow: hidden;'>\n <div [ngClass]=\"{ 'Vlt-callout--dismissed': !formErrors }\" class=\"Vlt-callout Vlt-callout--banner Vlt-callout--critical\">\n <i></i>\n <div class=\"Vlt-callout__content\" style=\"margin-top: auto;\">\n <p>There is a problem with one or more fields</p>\n @if (formErrors) {\n <small style='font-weight: 600; font-size: 1.0em;'>{{ formErrors.message || formErrors }}</small>\n }\n </div>\n <button type='button' class=\"Vlt-callout__dismiss\" (click)='clearFormErrors()' aria-label=\"Dismiss\"></button>\n </div>\n <div class=\"Vlt-card__content\" style='min-height: 40px;'>\n @if (edit) {\n <vgip-meta-layout [meta]='meta.layout' [resource]='model' [preview]='false' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit'></vgip-meta-layout>\n }\n @if (!edit) {\n <vgip-meta-layout [meta]='meta.layout' [resource]='model' [preview]='true' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit' [attr.data-vrn]='resourceVrn'></vgip-meta-layout>\n }\n </div>\n </div>\n <div class=\"Vlt-card__footer\">\n <button class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--outline\" type='button' aria-label='Cancel' (click)='close()'>\n {{ edit ? 'Cancel' : 'Close' }}\n </button>\n @if (edit) {\n <button class=\"Vlt-btn Vlt-btn--app\" [ngClass]=\"{ 'Vlt-btn--primary': isPersistent, 'Vlt-btn--secondary': !isPersistent }\" type='submit'>\n {{ (resource && resource.externalId) ? 'Update' : 'Create' }}\n </button>\n }\n @if (!edit && isEditable) {\n <button (click)='setEditMode()' [disabled]='!isEditable' class=\"Vlt-btn Vlt-btn--app Vlt-btn--primary\" type='button' aria-label='Edit'>\n Edit\n </button>\n }\n <div style='margin-right: 8px; flex: 1;'>\n @if (meta.availableLayouts && meta.availableLayouts.length) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" style='padding: 0; margin: -8px -18px -8px 0;'>\n <div class=\"Vlt-select\">\n <label style='all: inherit;'>\n <select style='border: 0; margin-top: 3px; background: transparent;' (change)='changeLayout()' [(ngModel)]='currentLayoutId' [ngModelOptions]='{ standalone: true }' [disabled]='lockedLayoutId === currentLayoutId'>\n <option selected disabled>Select layout</option>\n @for (layout of meta.availableLayouts; track layout) {\n <option [ngValue]='layout.id'>{{layout.name}}</option>\n }\n </select>\n <label>Layout</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n </div>\n }\n </div>\n <div class=\"Vlt-dropdown resource-menu\" [ngClass]=\"{ 'Vlt-dropdown--expanded': resourceMenuVisible }\" style='margin-left: 2px;'>\n <div class=\"Vlt-dropdown__panel\" style='bottom: 40px; right: -4px; top: initial;'>\n <div class=\"Vlt-dropdown__panel__content\">\n <a href='#' class=\"Vlt-dropdown__link\" (click)='loadMetadata(currentLayoutId, true, $event)'>\n <div>\n <svg class='Vlt-icon Vlt-icon--smaller'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-refresh\"/></svg>&nbsp;&nbsp;Refresh metadata\n </div>\n </a>\n </div>\n </div>\n <div class=\"Vlt-dropdown__trigger\">\n <button type='button' (click)='openResourceMenu()' class=\"Vlt-btn Vlt-btn--link\" aria-label='Resource menu'>\n <svg class='Vlt-icon Vlt-icon--small' style='margin: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-more-v-negative\"/></svg>\n </button>\n </div>\n </div>\n </div>\n </form>\n}\n<div class='busy-mask' [ngClass]=\"{ active: busy }\">\n <div style='height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;'>\n <div class=\"Vlt-spinner\"></div>\n </div>\n</div>\n", styles: [":host{flex:1;display:flex;flex-direction:column;min-height:0;color:var(--vgip-meta-resource-color)}.Vlt-callout--banner{-webkit-box-pack:initial;justify-content:initial;text-align:initial;overflow-y:auto}.Vlt-callout--banner.Vlt-callout--dismissed{padding:0}.Vlt-callout--banner:not(.Vlt-callout--dismissed){min-height:78px}.Vlt-spinner:before,.Vlt-spinner:after{border:6px solid #616266;border-color:#616266 transparent transparent}.Vlt-card__content{padding:8px 8px 8px 16px;display:flex;flex-direction:column;min-height:0;flex:1;overflow-y:scroll;overflow-x:hidden;background-color:var(--vgip-meta-resource-bg-color)}@media(hover:none){.Vlt-card__content{padding-right:16px}}.Vlt-card__content::-webkit-scrollbar{width:8px}.Vlt-card__content::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}.Vlt-card__footer{background:var(--vgip-meta-resource-bar-color);border-top:1px solid var(--vgip-meta-separator-color);display:flex;flex-direction:row;margin:16px -24px -24px;padding:8px 8px 8px 16px;box-shadow:0 0 4px #00000040;z-index:1}.Vlt-card__footer .Vlt-select select{color:var(--vgip-meta-input-color)}.Vlt-card__footer .Vlt-select select:disabled{background:initial;cursor:not-allowed}.Vlt-card__footer .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon)}.Vlt-card__footer .resource-menu .Vlt-icon:not(:hover){fill:var(--vgip-meta-input-label-color)}.Vlt-card__footer button.Vlt-btn--secondary{border:none}.Vlt-card__footer button.Vlt-btn--secondary:not([type=submit]){color:var(--vgip-meta-input-color)}.Vlt-card__footer button.Vlt-btn--secondary{box-shadow:inset 0 0 0 1px var(--vgip-meta-button-border-color)}.Vlt-card__footer button.Vlt-btn--secondary:hover[type=submit]{background-color:var(--vgip-meta-submit-hover-bg-color)}.Vlt-card__footer button.Vlt-btn--secondary:hover{box-shadow:inset 0 0 0 1px var(--vgip-meta-input-accent-color)}.Vlt-progress{margin:0;position:sticky}.Vlt-progress .Vlt-progress__bar{width:0;transition:width 5s}.Vlt-progress .Vlt-progress__bar.loading{width:100%}form{border-radius:6px;padding:24px;display:flex;flex-direction:column;min-height:0;flex:1}form .form-content{margin:-24px -24px -16px;padding-bottom:0;flex:1;display:flex;flex-direction:column}.busy-mask{position:absolute;inset:0;background:#00000052;opacity:1;z-index:898;display:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:1px;cursor:progress}.busy-mask.active{display:block}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MetaLayout, selector: "vgip-meta-layout", inputs: ["meta", "resource", "integration", "type", "preview", "theme", "delegate"] }, { kind: "directive", type: MetaAutofocusDirective, selector: "[vgipMetaFormAutofocus]", inputs: ["vgipMetaFormAutofocus"] }] }); }
2703
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResource, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaContextService }, { token: MetaMsgService }], target: i0.ɵɵFactoryTarget.Component }); }
2704
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: MetaResource, isStandalone: false, selector: "vgip-meta-resource", inputs: { resource: "resource", model: "model", metaResourceServiceDelegated: "metaResourceServiceDelegated", theme: "theme", editMode: "editMode" }, outputs: { done: "done", resourceChange: "resourceChange" }, viewQueries: [{ propertyName: "resourceForm", first: true, predicate: ["resourceForm"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (generalError) {\n <div class=\"Vlt-callout Vlt-callout--critical\" style='overflow: auto; margin: 20px;'>\n <i></i>\n <div class=\"Vlt-callout__content\">\n <p>{{generalError}}</p>\n </div>\n </div>\n}\n@if (!meta) {\n <div class=\"Vlt-progress\">\n <div class=\"Vlt-progress__bar\" [ngClass]=\"{ loading: metaLoading }\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuetext=\"Loading Metadata\" aria-valuemax=\"100\"></div>\n </div>\n}\n@if (meta && !generalError) {\n <form [vgipMetaFormAutofocus]='!resource || !resource.externalId' #resourceForm=\"ngForm\" [name]='resource.resourceType' (ngSubmit)='submit(resourceForm)' (change)='onFormChange()' novalidate>\n <div class='form-content' style='overflow: hidden;'>\n <div [ngClass]=\"{ 'Vlt-callout--dismissed': !formErrors }\" class=\"Vlt-callout Vlt-callout--banner Vlt-callout--critical\">\n <i></i>\n <div class=\"Vlt-callout__content\" style=\"margin-top: auto;\">\n <p>There is a problem with one or more fields</p>\n @if (formErrors) {\n <small style='font-weight: 600; font-size: 1.0em;'>{{ formErrors.message || formErrors }}</small>\n }\n </div>\n <button type='button' class=\"Vlt-callout__dismiss\" (click)='clearFormErrors()' aria-label=\"Dismiss\"></button>\n </div>\n <div class=\"Vlt-card__content\" style='min-height: 40px;'>\n @if (edit) {\n <vgip-meta-layout [meta]='meta.layout' [resource]='model' [preview]='false' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit'></vgip-meta-layout>\n }\n @if (!edit) {\n <vgip-meta-layout [meta]='meta.layout' [resource]='model' [preview]='true' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit' [attr.data-vrn]='resourceVrn'></vgip-meta-layout>\n }\n </div>\n </div>\n <div class=\"Vlt-card__footer\">\n <button class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--outline\" type='button' aria-label='Cancel' (click)='close()'>\n {{ edit ? 'Cancel' : 'Close' }}\n </button>\n @if (edit) {\n <button class=\"Vlt-btn Vlt-btn--app\" [ngClass]=\"{ 'Vlt-btn--primary': isPersistent, 'Vlt-btn--secondary': !isPersistent }\" type='submit'>\n {{ (resource && resource.externalId) ? 'Update' : 'Create' }}\n </button>\n }\n @if (!edit && isEditable) {\n <button (click)='setEditMode()' [disabled]='!isEditable' class=\"Vlt-btn Vlt-btn--app Vlt-btn--primary\" type='button' aria-label='Edit'>\n Edit\n </button>\n }\n <div style='margin-right: 8px; flex: 1;'>\n @if (meta.availableLayouts && meta.availableLayouts.length) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" style='padding: 0; margin: -8px -18px -8px 0;'>\n <div class=\"Vlt-select\">\n <label style='all: inherit;'>\n <select style='border: 0; margin-top: 3px; background: transparent;' (change)='changeLayout()' [(ngModel)]='currentLayoutId' [ngModelOptions]='{ standalone: true }' [disabled]='lockedLayoutId === currentLayoutId'>\n <option selected disabled>Select layout</option>\n @for (layout of meta.availableLayouts; track layout) {\n <option [ngValue]='layout.id'>{{layout.name}}</option>\n }\n </select>\n <label>Layout</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n </div>\n }\n </div>\n <div class=\"Vlt-dropdown resource-menu\" [ngClass]=\"{ 'Vlt-dropdown--expanded': resourceMenuVisible }\" style='margin-left: 2px;'>\n <div class=\"Vlt-dropdown__panel\" style='bottom: 40px; right: -4px; top: initial;'>\n <div class=\"Vlt-dropdown__panel__content\">\n <a href='#' class=\"Vlt-dropdown__link\" (click)='loadMetadata(currentLayoutId, true, $event)'>\n <div>\n <svg class='Vlt-icon Vlt-icon--smaller'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-refresh\"/></svg>&nbsp;&nbsp;Refresh metadata\n </div>\n </a>\n </div>\n </div>\n <div class=\"Vlt-dropdown__trigger\">\n <button type='button' (click)='openResourceMenu()' class=\"Vlt-btn Vlt-btn--link\" aria-label='Resource menu'>\n <svg class='Vlt-icon Vlt-icon--small' style='margin: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-more-v-negative\"/></svg>\n </button>\n </div>\n </div>\n </div>\n </form>\n}\n<div class='busy-mask' [ngClass]=\"{ active: busy }\">\n <div style='height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;'>\n <div class=\"Vlt-spinner\"></div>\n </div>\n</div>\n", styles: [":host{flex:1;display:flex;flex-direction:column;min-height:0;color:var(--vgip-meta-resource-color)}.Vlt-callout--banner{-webkit-box-pack:initial;justify-content:initial;text-align:initial;overflow-y:auto}.Vlt-callout--banner.Vlt-callout--dismissed{padding:0}.Vlt-callout--banner:not(.Vlt-callout--dismissed){min-height:78px}.Vlt-spinner:before,.Vlt-spinner:after{border:6px solid #616266;border-color:#616266 transparent transparent}.Vlt-card__content{padding:8px 8px 8px 16px;display:flex;flex-direction:column;min-height:0;flex:1;overflow-y:scroll;overflow-x:hidden;background-color:var(--vgip-meta-resource-bg-color)}@media(hover:none){.Vlt-card__content{padding-right:16px}}.Vlt-card__content::-webkit-scrollbar{width:8px}.Vlt-card__content::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}.Vlt-card__footer{background:var(--vgip-meta-resource-bar-color);border-top:1px solid var(--vgip-meta-separator-color);display:flex;flex-direction:row;margin:16px -24px -24px;padding:8px 8px 8px 16px;box-shadow:0 0 4px #00000040;z-index:1}.Vlt-card__footer .Vlt-select select{color:var(--vgip-meta-input-color)}.Vlt-card__footer .Vlt-select select:disabled{background:initial;cursor:not-allowed}.Vlt-card__footer .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon)}.Vlt-card__footer .resource-menu .Vlt-icon:not(:hover){fill:var(--vgip-meta-input-label-color)}.Vlt-card__footer button.Vlt-btn--secondary{border:none}.Vlt-card__footer button.Vlt-btn--secondary:not([type=submit]){color:var(--vgip-meta-input-color)}.Vlt-card__footer button.Vlt-btn--secondary{box-shadow:inset 0 0 0 1px var(--vgip-meta-button-border-color)}.Vlt-card__footer button.Vlt-btn--secondary:hover[type=submit]{background-color:var(--vgip-meta-submit-hover-bg-color)}.Vlt-card__footer button.Vlt-btn--secondary:hover{box-shadow:inset 0 0 0 1px var(--vgip-meta-input-accent-color)}.Vlt-progress{margin:0;position:sticky}.Vlt-progress .Vlt-progress__bar{width:0;transition:width 5s}.Vlt-progress .Vlt-progress__bar.loading{width:100%}form{border-radius:6px;padding:24px;display:flex;flex-direction:column;min-height:0;flex:1}form .form-content{margin:-24px -24px -16px;padding-bottom:0;flex:1;display:flex;flex-direction:column}.busy-mask{position:absolute;inset:0;background:#00000052;opacity:1;z-index:898;display:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:1px;cursor:progress}.busy-mask.active{display:block}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MetaLayout, selector: "vgip-meta-layout", inputs: ["meta", "resource", "integration", "type", "preview", "theme", "delegate"] }, { kind: "directive", type: MetaAutofocusDirective, selector: "[vgipMetaFormAutofocus]", inputs: ["vgipMetaFormAutofocus"] }] }); }
2671
2705
  }
2672
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResource, decorators: [{
2706
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResource, decorators: [{
2673
2707
  type: Component,
2674
2708
  args: [{ selector: 'vgip-meta-resource', standalone: false, template: "@if (generalError) {\n <div class=\"Vlt-callout Vlt-callout--critical\" style='overflow: auto; margin: 20px;'>\n <i></i>\n <div class=\"Vlt-callout__content\">\n <p>{{generalError}}</p>\n </div>\n </div>\n}\n@if (!meta) {\n <div class=\"Vlt-progress\">\n <div class=\"Vlt-progress__bar\" [ngClass]=\"{ loading: metaLoading }\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuetext=\"Loading Metadata\" aria-valuemax=\"100\"></div>\n </div>\n}\n@if (meta && !generalError) {\n <form [vgipMetaFormAutofocus]='!resource || !resource.externalId' #resourceForm=\"ngForm\" [name]='resource.resourceType' (ngSubmit)='submit(resourceForm)' (change)='onFormChange()' novalidate>\n <div class='form-content' style='overflow: hidden;'>\n <div [ngClass]=\"{ 'Vlt-callout--dismissed': !formErrors }\" class=\"Vlt-callout Vlt-callout--banner Vlt-callout--critical\">\n <i></i>\n <div class=\"Vlt-callout__content\" style=\"margin-top: auto;\">\n <p>There is a problem with one or more fields</p>\n @if (formErrors) {\n <small style='font-weight: 600; font-size: 1.0em;'>{{ formErrors.message || formErrors }}</small>\n }\n </div>\n <button type='button' class=\"Vlt-callout__dismiss\" (click)='clearFormErrors()' aria-label=\"Dismiss\"></button>\n </div>\n <div class=\"Vlt-card__content\" style='min-height: 40px;'>\n @if (edit) {\n <vgip-meta-layout [meta]='meta.layout' [resource]='model' [preview]='false' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit'></vgip-meta-layout>\n }\n @if (!edit) {\n <vgip-meta-layout [meta]='meta.layout' [resource]='model' [preview]='true' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit' [attr.data-vrn]='resourceVrn'></vgip-meta-layout>\n }\n </div>\n </div>\n <div class=\"Vlt-card__footer\">\n <button class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--outline\" type='button' aria-label='Cancel' (click)='close()'>\n {{ edit ? 'Cancel' : 'Close' }}\n </button>\n @if (edit) {\n <button class=\"Vlt-btn Vlt-btn--app\" [ngClass]=\"{ 'Vlt-btn--primary': isPersistent, 'Vlt-btn--secondary': !isPersistent }\" type='submit'>\n {{ (resource && resource.externalId) ? 'Update' : 'Create' }}\n </button>\n }\n @if (!edit && isEditable) {\n <button (click)='setEditMode()' [disabled]='!isEditable' class=\"Vlt-btn Vlt-btn--app Vlt-btn--primary\" type='button' aria-label='Edit'>\n Edit\n </button>\n }\n <div style='margin-right: 8px; flex: 1;'>\n @if (meta.availableLayouts && meta.availableLayouts.length) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" style='padding: 0; margin: -8px -18px -8px 0;'>\n <div class=\"Vlt-select\">\n <label style='all: inherit;'>\n <select style='border: 0; margin-top: 3px; background: transparent;' (change)='changeLayout()' [(ngModel)]='currentLayoutId' [ngModelOptions]='{ standalone: true }' [disabled]='lockedLayoutId === currentLayoutId'>\n <option selected disabled>Select layout</option>\n @for (layout of meta.availableLayouts; track layout) {\n <option [ngValue]='layout.id'>{{layout.name}}</option>\n }\n </select>\n <label>Layout</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n </div>\n }\n </div>\n <div class=\"Vlt-dropdown resource-menu\" [ngClass]=\"{ 'Vlt-dropdown--expanded': resourceMenuVisible }\" style='margin-left: 2px;'>\n <div class=\"Vlt-dropdown__panel\" style='bottom: 40px; right: -4px; top: initial;'>\n <div class=\"Vlt-dropdown__panel__content\">\n <a href='#' class=\"Vlt-dropdown__link\" (click)='loadMetadata(currentLayoutId, true, $event)'>\n <div>\n <svg class='Vlt-icon Vlt-icon--smaller'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-refresh\"/></svg>&nbsp;&nbsp;Refresh metadata\n </div>\n </a>\n </div>\n </div>\n <div class=\"Vlt-dropdown__trigger\">\n <button type='button' (click)='openResourceMenu()' class=\"Vlt-btn Vlt-btn--link\" aria-label='Resource menu'>\n <svg class='Vlt-icon Vlt-icon--small' style='margin: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-more-v-negative\"/></svg>\n </button>\n </div>\n </div>\n </div>\n </form>\n}\n<div class='busy-mask' [ngClass]=\"{ active: busy }\">\n <div style='height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;'>\n <div class=\"Vlt-spinner\"></div>\n </div>\n</div>\n", styles: [":host{flex:1;display:flex;flex-direction:column;min-height:0;color:var(--vgip-meta-resource-color)}.Vlt-callout--banner{-webkit-box-pack:initial;justify-content:initial;text-align:initial;overflow-y:auto}.Vlt-callout--banner.Vlt-callout--dismissed{padding:0}.Vlt-callout--banner:not(.Vlt-callout--dismissed){min-height:78px}.Vlt-spinner:before,.Vlt-spinner:after{border:6px solid #616266;border-color:#616266 transparent transparent}.Vlt-card__content{padding:8px 8px 8px 16px;display:flex;flex-direction:column;min-height:0;flex:1;overflow-y:scroll;overflow-x:hidden;background-color:var(--vgip-meta-resource-bg-color)}@media(hover:none){.Vlt-card__content{padding-right:16px}}.Vlt-card__content::-webkit-scrollbar{width:8px}.Vlt-card__content::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}.Vlt-card__footer{background:var(--vgip-meta-resource-bar-color);border-top:1px solid var(--vgip-meta-separator-color);display:flex;flex-direction:row;margin:16px -24px -24px;padding:8px 8px 8px 16px;box-shadow:0 0 4px #00000040;z-index:1}.Vlt-card__footer .Vlt-select select{color:var(--vgip-meta-input-color)}.Vlt-card__footer .Vlt-select select:disabled{background:initial;cursor:not-allowed}.Vlt-card__footer .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon)}.Vlt-card__footer .resource-menu .Vlt-icon:not(:hover){fill:var(--vgip-meta-input-label-color)}.Vlt-card__footer button.Vlt-btn--secondary{border:none}.Vlt-card__footer button.Vlt-btn--secondary:not([type=submit]){color:var(--vgip-meta-input-color)}.Vlt-card__footer button.Vlt-btn--secondary{box-shadow:inset 0 0 0 1px var(--vgip-meta-button-border-color)}.Vlt-card__footer button.Vlt-btn--secondary:hover[type=submit]{background-color:var(--vgip-meta-submit-hover-bg-color)}.Vlt-card__footer button.Vlt-btn--secondary:hover{box-shadow:inset 0 0 0 1px var(--vgip-meta-input-accent-color)}.Vlt-progress{margin:0;position:sticky}.Vlt-progress .Vlt-progress__bar{width:0;transition:width 5s}.Vlt-progress .Vlt-progress__bar.loading{width:100%}form{border-radius:6px;padding:24px;display:flex;flex-direction:column;min-height:0;flex:1}form .form-content{margin:-24px -24px -16px;padding-bottom:0;flex:1;display:flex;flex-direction:column}.busy-mask{position:absolute;inset:0;background:#00000052;opacity:1;z-index:898;display:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:1px;cursor:progress}.busy-mask.active{display:block}\n"] }]
2675
2709
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: MetaResourceService }, { type: MetaContextService }, { type: MetaMsgService }], propDecorators: { resource: [{
@@ -2813,10 +2847,10 @@ class MetaRefDialog {
2813
2847
  this.el.nativeElement.style.setProperty(key, metaTheme.properties[key]);
2814
2848
  }
2815
2849
  }
2816
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaRefDialog, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
2817
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MetaRefDialog, isStandalone: false, selector: "ng-component", ngImport: i0, template: "<div class='Vlt-modal Vlt-modal--large'>\n <div class=\"Vlt-modal__panel\">\n <div class=\"Vlt-tabs\">\n <div class='Vlt-tabs__header--background'>\n <div class=\"Vlt-tabs__header Vlt-tabs__header--shadow\">\n <svg class=\"Vlt-icon\" [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\"><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" /></svg>\n @for (r of resources | keyvalue: keepOrder; track r) {\n <a href='#' (click)='selectResource($event, r.key)' class=\"Vlt-tabs__link\" [ngClass]=\"{ 'Vlt-tabs__link_active': currentResource === r.key}\">\n {{r.key}}\n </a>\n }\n <a href='#' class=\"Vlt-modal__dismiss\" (click)=\"dismiss($event)\">\n <svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" /></svg>\n </a>\n </div>\n </div>\n <div class=\"Vlt-tabs__content\" style='min-height: 90px;'>\n @for (r of resources | keyvalue: keepOrder; track r) {\n @if (currentResource === r.key) {\n <div class=\"Vlt-tabs__panel Vlt-tabs__panel_active\">\n <vgip-meta-resource [resource]='r.value' [model]='models[r.key]' [metaResourceServiceDelegated]='metaResource' (done)='onResourceDone($event)' theme='inherit' [attr.data-theme]='theme'></vgip-meta-resource>\n </div>\n }\n }\n </div>\n </div>\n </div>\n</div>\n", styles: [".Vlt-modal_visible{background:var(--vgip-meta-overlay-background)}.Vlt-modal__panel{padding:0;background:var(--vgip-meta-resource-bg-color);overflow:hidden}@media only screen and (max-width:575px){.Vlt-modal__panel{height:100%;width:100%;max-height:none;border-bottom-left-radius:0;border-bottom-right-radius:0;margin:10px 6px 0}.Vlt-modal__panel ::ng-deep .busy-mask{min-height:calc(100vh - 58px)}}.Vlt-modal__panel .Vlt-tabs__header--background{border-top-left-radius:5px;border-top-right-radius:5px}.Vlt-modal__panel .Vlt-tabs__header{background:var(--vgip-meta-resource-bar-color);padding-left:52px;padding-right:45px;border-bottom:0;flex-wrap:wrap;min-height:52px;max-height:52px;align-items:center}.Vlt-modal__panel .Vlt-tabs__header>.Vlt-icon{position:absolute;left:14px}.Vlt-modal__panel .Vlt-tabs__header h5{margin-bottom:0;font-weight:initial}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link{padding-top:4px;padding-bottom:2px;color:var(--vgip-meta-input-label-color);text-transform:capitalize}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link_active{color:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link_active:after{background:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss{background-image:none;width:18px;height:18px;opacity:initial}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss svg{width:16px;height:16px;fill:var(--vgip-meta-input-label-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss:hover svg{fill:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header::-webkit-scrollbar{width:8px}.Vlt-modal__panel .Vlt-tabs__header::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}.Vlt-modal__panel .Vlt-tabs__content{margin-top:0}.Vlt-modal__panel .Vlt-tabs__content .Vlt-tabs__link{font-size:1.8rem}.Vlt-modal__panel .Vlt-callout--banner{-webkit-box-pack:initial;justify-content:initial;text-align:initial;overflow-y:auto}.Vlt-modal__panel .Vlt-callout--banner.Vlt-callout--dismissed{padding:0}.Vlt-modal__panel .Vlt-callout--banner:not(.Vlt-callout--dismissed){min-height:78px}.Vlt-modal__panel .Vlt-modal__cancel{z-index:899}.Vlt-modal__panel .Vlt-modal__dismiss{right:16px;top:14px}.Vlt-modal__panel .Vlt-card__footer button{margin-top:0;margin-bottom:0}.Vlt-modal__panel .Vlt-select select:disabled{background:initial;cursor:not-allowed}.Vlt-modal__panel ::ng-deep .form-content{min-height:0;max-height:calc(95vh - 172px)}@media only screen and (max-width:575px){.Vlt-modal__panel ::ng-deep .form-content{min-height:calc(100vh - 113px)}}.resource-menu button{margin:0 -10px}.resource-menu button:not(:hover) .Vlt-icon{color:#616266;fill:#616266}.busy-mask{position:absolute;inset:0;background:#00000052;opacity:1;z-index:898;display:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:1px;cursor:progress}.busy-mask.active{display:block}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MetaResource, selector: "vgip-meta-resource", inputs: ["resource", "model", "metaResourceServiceDelegated", "theme", "editMode"], outputs: ["done", "resourceChange"] }, { kind: "pipe", type: i1$2.KeyValuePipe, name: "keyvalue" }] }); }
2850
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaRefDialog, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
2851
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: MetaRefDialog, isStandalone: false, selector: "ng-component", ngImport: i0, template: "<div class='Vlt-modal Vlt-modal--large'>\n <div class=\"Vlt-modal__panel\">\n <div class=\"Vlt-tabs\">\n <div class='Vlt-tabs__header--background'>\n <div class=\"Vlt-tabs__header Vlt-tabs__header--shadow\">\n <svg class=\"Vlt-icon\" [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\"><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" /></svg>\n @for (r of resources | keyvalue: keepOrder; track r) {\n <a href='#' (click)='selectResource($event, r.key)' class=\"Vlt-tabs__link\" [ngClass]=\"{ 'Vlt-tabs__link_active': currentResource === r.key}\">\n {{r.key}}\n </a>\n }\n <a href='#' class=\"Vlt-modal__dismiss\" (click)=\"dismiss($event)\">\n <svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" /></svg>\n </a>\n </div>\n </div>\n <div class=\"Vlt-tabs__content\" style='min-height: 90px;'>\n @for (r of resources | keyvalue: keepOrder; track r) {\n @if (currentResource === r.key) {\n <div class=\"Vlt-tabs__panel Vlt-tabs__panel_active\">\n <vgip-meta-resource [resource]='r.value' [model]='models[r.key]' [metaResourceServiceDelegated]='metaResource' (done)='onResourceDone($event)' theme='inherit' [attr.data-theme]='theme'></vgip-meta-resource>\n </div>\n }\n }\n </div>\n </div>\n </div>\n</div>\n", styles: [".Vlt-modal_visible{background:var(--vgip-meta-overlay-background)}.Vlt-modal__panel{padding:0;background:var(--vgip-meta-resource-bg-color);overflow:hidden}@media only screen and (max-width:575px){.Vlt-modal__panel{height:100%;width:100%;max-height:none;border-bottom-left-radius:0;border-bottom-right-radius:0;margin:10px 6px 0}.Vlt-modal__panel ::ng-deep .busy-mask{min-height:calc(100vh - 58px)}}.Vlt-modal__panel .Vlt-tabs__header--background{border-top-left-radius:5px;border-top-right-radius:5px}.Vlt-modal__panel .Vlt-tabs__header{background:var(--vgip-meta-resource-bar-color);padding-left:52px;padding-right:45px;border-bottom:0;flex-wrap:wrap;min-height:52px;max-height:52px;align-items:center}.Vlt-modal__panel .Vlt-tabs__header>.Vlt-icon{position:absolute;left:14px}.Vlt-modal__panel .Vlt-tabs__header h5{margin-bottom:0;font-weight:initial}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link{padding-top:4px;padding-bottom:2px;color:var(--vgip-meta-input-label-color);text-transform:capitalize}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link_active{color:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link_active:after{background:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss{background-image:none;width:18px;height:18px;opacity:initial}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss svg{width:16px;height:16px;fill:var(--vgip-meta-input-label-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss:hover svg{fill:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header::-webkit-scrollbar{width:8px}.Vlt-modal__panel .Vlt-tabs__header::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}.Vlt-modal__panel .Vlt-tabs__content{margin-top:0}.Vlt-modal__panel .Vlt-tabs__content .Vlt-tabs__link{font-size:1.8rem}.Vlt-modal__panel .Vlt-callout--banner{-webkit-box-pack:initial;justify-content:initial;text-align:initial;overflow-y:auto}.Vlt-modal__panel .Vlt-callout--banner.Vlt-callout--dismissed{padding:0}.Vlt-modal__panel .Vlt-callout--banner:not(.Vlt-callout--dismissed){min-height:78px}.Vlt-modal__panel .Vlt-modal__cancel{z-index:899}.Vlt-modal__panel .Vlt-modal__dismiss{right:16px;top:14px}.Vlt-modal__panel .Vlt-card__footer button{margin-top:0;margin-bottom:0}.Vlt-modal__panel .Vlt-select select:disabled{background:initial;cursor:not-allowed}.Vlt-modal__panel ::ng-deep .form-content{min-height:0;max-height:calc(95vh - 172px)}@media only screen and (max-width:575px){.Vlt-modal__panel ::ng-deep .form-content{min-height:calc(100vh - 113px)}}.resource-menu button{margin:0 -10px}.resource-menu button:not(:hover) .Vlt-icon{color:#616266;fill:#616266}.busy-mask{position:absolute;inset:0;background:#00000052;opacity:1;z-index:898;display:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:1px;cursor:progress}.busy-mask.active{display:block}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MetaResource, selector: "vgip-meta-resource", inputs: ["resource", "model", "metaResourceServiceDelegated", "theme", "editMode"], outputs: ["done", "resourceChange"] }, { kind: "pipe", type: i1$2.KeyValuePipe, name: "keyvalue" }] }); }
2818
2852
  }
2819
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaRefDialog, decorators: [{
2853
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaRefDialog, decorators: [{
2820
2854
  type: Component,
2821
2855
  args: [{ standalone: false, template: "<div class='Vlt-modal Vlt-modal--large'>\n <div class=\"Vlt-modal__panel\">\n <div class=\"Vlt-tabs\">\n <div class='Vlt-tabs__header--background'>\n <div class=\"Vlt-tabs__header Vlt-tabs__header--shadow\">\n <svg class=\"Vlt-icon\" [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\"><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" /></svg>\n @for (r of resources | keyvalue: keepOrder; track r) {\n <a href='#' (click)='selectResource($event, r.key)' class=\"Vlt-tabs__link\" [ngClass]=\"{ 'Vlt-tabs__link_active': currentResource === r.key}\">\n {{r.key}}\n </a>\n }\n <a href='#' class=\"Vlt-modal__dismiss\" (click)=\"dismiss($event)\">\n <svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" /></svg>\n </a>\n </div>\n </div>\n <div class=\"Vlt-tabs__content\" style='min-height: 90px;'>\n @for (r of resources | keyvalue: keepOrder; track r) {\n @if (currentResource === r.key) {\n <div class=\"Vlt-tabs__panel Vlt-tabs__panel_active\">\n <vgip-meta-resource [resource]='r.value' [model]='models[r.key]' [metaResourceServiceDelegated]='metaResource' (done)='onResourceDone($event)' theme='inherit' [attr.data-theme]='theme'></vgip-meta-resource>\n </div>\n }\n }\n </div>\n </div>\n </div>\n</div>\n", styles: [".Vlt-modal_visible{background:var(--vgip-meta-overlay-background)}.Vlt-modal__panel{padding:0;background:var(--vgip-meta-resource-bg-color);overflow:hidden}@media only screen and (max-width:575px){.Vlt-modal__panel{height:100%;width:100%;max-height:none;border-bottom-left-radius:0;border-bottom-right-radius:0;margin:10px 6px 0}.Vlt-modal__panel ::ng-deep .busy-mask{min-height:calc(100vh - 58px)}}.Vlt-modal__panel .Vlt-tabs__header--background{border-top-left-radius:5px;border-top-right-radius:5px}.Vlt-modal__panel .Vlt-tabs__header{background:var(--vgip-meta-resource-bar-color);padding-left:52px;padding-right:45px;border-bottom:0;flex-wrap:wrap;min-height:52px;max-height:52px;align-items:center}.Vlt-modal__panel .Vlt-tabs__header>.Vlt-icon{position:absolute;left:14px}.Vlt-modal__panel .Vlt-tabs__header h5{margin-bottom:0;font-weight:initial}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link{padding-top:4px;padding-bottom:2px;color:var(--vgip-meta-input-label-color);text-transform:capitalize}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link_active{color:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-tabs__link_active:after{background:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss{background-image:none;width:18px;height:18px;opacity:initial}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss svg{width:16px;height:16px;fill:var(--vgip-meta-input-label-color)}.Vlt-modal__panel .Vlt-tabs__header .Vlt-modal__dismiss:hover svg{fill:var(--vgip-meta-input-accent-color)}.Vlt-modal__panel .Vlt-tabs__header::-webkit-scrollbar{width:8px}.Vlt-modal__panel .Vlt-tabs__header::-webkit-scrollbar-thumb{background-color:var(--vgip-meta-scrollbar-color);border:2px solid transparent;border-radius:6px;background-clip:content-box}.Vlt-modal__panel .Vlt-tabs__content{margin-top:0}.Vlt-modal__panel .Vlt-tabs__content .Vlt-tabs__link{font-size:1.8rem}.Vlt-modal__panel .Vlt-callout--banner{-webkit-box-pack:initial;justify-content:initial;text-align:initial;overflow-y:auto}.Vlt-modal__panel .Vlt-callout--banner.Vlt-callout--dismissed{padding:0}.Vlt-modal__panel .Vlt-callout--banner:not(.Vlt-callout--dismissed){min-height:78px}.Vlt-modal__panel .Vlt-modal__cancel{z-index:899}.Vlt-modal__panel .Vlt-modal__dismiss{right:16px;top:14px}.Vlt-modal__panel .Vlt-card__footer button{margin-top:0;margin-bottom:0}.Vlt-modal__panel .Vlt-select select:disabled{background:initial;cursor:not-allowed}.Vlt-modal__panel ::ng-deep .form-content{min-height:0;max-height:calc(95vh - 172px)}@media only screen and (max-width:575px){.Vlt-modal__panel ::ng-deep .form-content{min-height:calc(100vh - 113px)}}.resource-menu button{margin:0 -10px}.resource-menu button:not(:hover) .Vlt-icon{color:#616266;fill:#616266}.busy-mask{position:absolute;inset:0;background:#00000052;opacity:1;z-index:898;display:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:1px;cursor:progress}.busy-mask.active{display:block}\n"] }]
2822
2856
  }], ctorParameters: () => [{ type: i0.ElementRef }] });
@@ -2848,10 +2882,10 @@ class MetaResourceCard {
2848
2882
  // }
2849
2883
  });
2850
2884
  }
2851
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceCard, deps: [{ token: MetaResourceService }, { token: MetaReferenceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
2852
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: MetaResourceCard, isStandalone: false, selector: "vgip-meta-resource-card", inputs: { resource: "resource", model: "model" }, ngImport: i0, template: "<div class=\"Vlt-card Vlt-bg-white\">\n <div class=\"Vlt-card__content Vlt-btn-on-hover\">\n <h5>{{model.Subject || model.subject || model.summary || model.title || model.CaseNumber || model.comment || model.body || model.name || model.topic || '...' }}</h5>\n <div style='font-size: 12px; line-height: 16px;'>\n Created: <span class='Vlt-black'>{{model._vgis.createdDate | date:'mediumDate'}}</span>\n Edited: <span class='Vlt-black'>{{model._vgis.modifiedDate | date:'medium'}}</span>\n </div>\n <div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{model._vgis.resourceType}}</div>\n <div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n @if (model._vgis.externalLink) {\n <a attr.href='{{model._vgis.externalLink}}' target='_blank' rel='noopener' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Open external'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\"/></svg></a>\n }\n <button type='button' (click)='open(resource, model)' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Edit'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\"/></svg></button>\n </div>\n </div>\n</div>\n", styles: [".Vlt-card{margin-bottom:8px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}\n"], dependencies: [{ kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
2885
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResourceCard, deps: [{ token: MetaResourceService }, { token: MetaReferenceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
2886
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: MetaResourceCard, isStandalone: false, selector: "vgip-meta-resource-card", inputs: { resource: "resource", model: "model" }, ngImport: i0, template: "<div class=\"Vlt-card Vlt-bg-white\">\n <div class=\"Vlt-card__content Vlt-btn-on-hover\">\n <h5>{{model.Subject || model.subject || model.summary || model.title || model.CaseNumber || model.comment || model.body || model.name || model.topic || '...' }}</h5>\n <div style='font-size: 12px; line-height: 16px;'>\n Created: <span class='Vlt-black'>{{model._vgis.createdDate | date:'mediumDate'}}</span>\n Edited: <span class='Vlt-black'>{{model._vgis.modifiedDate | date:'medium'}}</span>\n </div>\n <div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{model._vgis.resourceType}}</div>\n <div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n @if (model._vgis.externalLink) {\n <a attr.href='{{model._vgis.externalLink}}' target='_blank' rel='noopener' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Open external'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\"/></svg></a>\n }\n <button type='button' (click)='open(resource, model)' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Edit'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\"/></svg></button>\n </div>\n </div>\n</div>\n", styles: [".Vlt-card{margin-bottom:8px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}\n"], dependencies: [{ kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
2853
2887
  }
2854
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceCard, decorators: [{
2888
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaResourceCard, decorators: [{
2855
2889
  type: Component,
2856
2890
  args: [{ selector: 'vgip-meta-resource-card', standalone: false, template: "<div class=\"Vlt-card Vlt-bg-white\">\n <div class=\"Vlt-card__content Vlt-btn-on-hover\">\n <h5>{{model.Subject || model.subject || model.summary || model.title || model.CaseNumber || model.comment || model.body || model.name || model.topic || '...' }}</h5>\n <div style='font-size: 12px; line-height: 16px;'>\n Created: <span class='Vlt-black'>{{model._vgis.createdDate | date:'mediumDate'}}</span>\n Edited: <span class='Vlt-black'>{{model._vgis.modifiedDate | date:'medium'}}</span>\n </div>\n <div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{model._vgis.resourceType}}</div>\n <div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n @if (model._vgis.externalLink) {\n <a attr.href='{{model._vgis.externalLink}}' target='_blank' rel='noopener' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Open external'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\"/></svg></a>\n }\n <button type='button' (click)='open(resource, model)' class=\"Vlt-btn Vlt-btn--tertiary Vlt-btn--icon\" aria-label='Edit'><svg style='margin-left: 0; margin-right: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\"/></svg></button>\n </div>\n </div>\n</div>\n", styles: [".Vlt-card{margin-bottom:8px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}\n"] }]
2857
2891
  }], ctorParameters: () => [{ type: MetaResourceService }, { type: MetaReferenceService }, { type: i0.ViewContainerRef }], propDecorators: { resource: [{
@@ -2867,10 +2901,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
2867
2901
  * @Last Modified time: 2019-11-15 13:04:01
2868
2902
  */
2869
2903
  class FieldUnknown extends FieldAbstract {
2870
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldUnknown, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2871
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldUnknown, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"Vlt-form__element Vlt-form__element--big\">\n <div class=\"Vlt-input\">\n <label class='wrapper'>\n <input class='main model' type=\"text\" placeholder=\"\" value=\"Unknown field type '{{meta.type}}'.\" disabled/>\n <label class=\"Vlt-label Vlt-truncate\" style='padding-right: 20px;'>{{meta.label || meta.name}}</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n</div>\n" }); }
2904
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldUnknown, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2905
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldUnknown, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"Vlt-form__element Vlt-form__element--big\">\n <div class=\"Vlt-input\">\n <label class='wrapper'>\n <input class='main model' type=\"text\" placeholder=\"\" value=\"Unknown field type '{{meta.type}}'.\" disabled/>\n <label class=\"Vlt-label Vlt-truncate\" style='padding-right: 20px;'>{{meta.label || meta.name}}</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n</div>\n" }); }
2872
2906
  }
2873
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldUnknown, decorators: [{
2907
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldUnknown, decorators: [{
2874
2908
  type: Component,
2875
2909
  args: [{ standalone: false, template: "<div class=\"Vlt-form__element Vlt-form__element--big\">\n <div class=\"Vlt-input\">\n <label class='wrapper'>\n <input class='main model' type=\"text\" placeholder=\"\" value=\"Unknown field type '{{meta.type}}'.\" disabled/>\n <label class=\"Vlt-label Vlt-truncate\" style='padding-right: 20px;'>{{meta.label || meta.name}}</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n</div>\n" }]
2876
2910
  }] });
@@ -2939,10 +2973,10 @@ class MetaModelPipe {
2939
2973
  transform(value) {
2940
2974
  return value;
2941
2975
  }
2942
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModelPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
2943
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaModelPipe, isStandalone: false, name: "metaModel" }); }
2976
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaModelPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
2977
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: MetaModelPipe, isStandalone: false, name: "metaModel" }); }
2944
2978
  }
2945
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModelPipe, decorators: [{
2979
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaModelPipe, decorators: [{
2946
2980
  type: Pipe,
2947
2981
  args: [{
2948
2982
  name: 'metaModel',
@@ -3407,10 +3441,10 @@ class FieldInput extends FieldAbstract {
3407
3441
  }
3408
3442
  }
3409
3443
  }
3410
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldInput, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
3411
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldInput, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n @if (isPhoneNumber) {\n <a href='#' (click)=\"click2dial($event)\" class=\"Vlt-text-link\" aria-label='Dial'>\n <svg class=\"Vlt-icon Vlt-icon--smaller\" style=\"margin-top: -3px;\">\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-phone-full\" />\n </svg>\n {{model}}\n </a>\n } @else {\n {{model}}\n }\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched), 'multiple': multiple, 'has-value': f.value, active: keyListenerActive }\">\n @if (multiple) {\n <div class='items-container'>\n @if (model) {\n <div class='badges-container keep-focus' (click)='focus()'> <!-- eslint-disable-line -->\n @for (item of model; track item) {\n <div class=\"Vlt-badge Vlt-badge--transparent Vlt-badge--app Vlt-badge--large keep-focus\">\n {{item}}\n <button class=\"Vlt-badge__dismiss keep-focus\" (click)='remove($event, item)'></button> <!-- eslint-disable-line @angular-eslint/template/elements-content -->\n </div>\n }\n </div>\n }\n </div>\n }\n <div class=\"Vlt-input Vlt-dropdown\" style='display: block;' [ngClass]=\"{'vgip-disable': disabled}\">\n <label class='wrapper'>\n <input [attr.title]='model' class='main model' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [step]='validations.step' [disabled]='disabled' [readonly]=\"readonly\" [(ngModel)]='model' (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name' [type]=\"multiple ? 'hidden' : (logicalSubtype || meta.subtype || 'text')\" placeholder=\" \" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n @if (multiple) {\n <input class='main' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [(ngModel)]='addText' [ngModelOptions]=\"{ standalone: true }\" [type]=\"logicalSubtype || meta.subtype || 'text'\" [disabled]='disabled' [readonly]='readonly' placeholder=\"+Add\" (keydown.enter)='onAdd($event)' (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n }\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model && multiple) {\n <span class='Vlt-black'>({{model.length}})</span>\n }\n </label>\n </label>\n <div class='Vlt-composite__append right-actions'>\n @if (model && showClear) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </a>\n }\n </div>\n <!-- <div *ngIf=\"!meta.subtype || meta.subtype == 'text'\" class=\"Vlt-composite__append Vlt-composite__append--icon\" style='bottom: 7px; right: 10px; padding: 3px; width: initial; height: initial; cursor: pointer;'>\n <div *ngIf=\"!meta.type || meta.type === 'string'\" class=\"Vlt-composite__icon\" (click)='textToSpeech()'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-microphone\"/></svg>\n </div>\n </div> -->\n @if (suggestions.length) {\n <div class=\"Vlt-dropdown__panel\">\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area suggestions\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 13px;'>\n Suggestions\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block\"></div>\n @if (dropdown) {\n <div class=\"Vlt-dropdown__scroll\">\n @for (suggestion of suggestions; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': (activeSuggestionIndex === i) }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link\" style='padding: 0;'\n [attr.title]=\"suggestion.hint ? `${suggestion.label} - ${suggestion.hint}` : (suggestion.label || suggestion)\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label [title]='suggestion.label || suggestion'>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(suggestion) !== -1'/>\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{suggestion.label || suggestion}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;text-overflow: ellipsis;overflow: hidden;'>\n {{suggestion.label || suggestion}}\n </div>\n }\n </a>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\" style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\">Clear all</button>\n <button (click)='dismissDropdown($event)' type='button' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.minlength) {\n <span>Must be longer than {{validations.minlength}} characters.&nbsp;</span>\n }\n @if (f.errors.maxlength) {\n <span>Must be lest than {{validations.maxlength}} characters.&nbsp;</span>\n }\n @if (f.errors.pattern) {\n <span>{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element--big .Vlt-input input{padding-right:40px;text-overflow:ellipsis}@media screen and (-webkit-min-device-pixel-ratio:0){.Vlt-form__element--big .Vlt-input input{line-height:20px}}.Vlt-form__element--big .Vlt-input input:disabled{cursor:not-allowed}.Vlt-form__element--big:hover .items-container,.Vlt-form__element--big:hover .main,.Vlt-form__element--big:hover input,.Vlt-form__element--big.active .items-container,.Vlt-form__element--big.active .main,.Vlt-form__element--big.active input{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .Vlt-composite.Vlt-dropdown{margin-top:3px}.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) input,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) input{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .items-container{background-color:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color);border-bottom:0;border-top-left-radius:6px;border-top-right-radius:6px}.Vlt-form__element--big.multiple .items-container.creatable{margin-right:62px}.Vlt-form__element--big.multiple .items-container .badges-container{overflow:auto;max-height:140px;padding:6px 4px 0 6px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge{margin-bottom:3px;margin-left:0;margin-right:3px;overflow:hidden;max-width:100%}.Vlt-form__element--big.multiple:not(.has-value) .items-container{border:0}.Vlt-form__element--big.multiple.has-value .main,.Vlt-form__element--big.multiple.has-value input{border-top:0;border-top-left-radius:0;border-top-right-radius:0;box-shadow:none}.Vlt-form__element--big.Vlt-form__element--error .items-container,.Vlt-form__element--big.Vlt-form__element--error .main,.Vlt-form__element--big.Vlt-form__element--error input{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}label.Vlt-truncate{padding-right:42px}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:10px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
3444
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldInput, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
3445
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldInput, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n @if (isPhoneNumber) {\n <a href='#' (click)=\"click2dial($event)\" class=\"Vlt-text-link\" aria-label='Dial'>\n <svg class=\"Vlt-icon Vlt-icon--smaller\" style=\"margin-top: -3px;\">\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-phone-full\" />\n </svg>\n {{model}}\n </a>\n } @else {\n {{model}}\n }\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched), 'multiple': multiple, 'has-value': f.value, active: keyListenerActive }\">\n @if (multiple) {\n <div class='items-container'>\n @if (model) {\n <div class='badges-container keep-focus' (click)='focus()'> <!-- eslint-disable-line -->\n @for (item of model; track item) {\n <div class=\"Vlt-badge Vlt-badge--transparent Vlt-badge--app Vlt-badge--large keep-focus\">\n {{item}}\n <button class=\"Vlt-badge__dismiss keep-focus\" (click)='remove($event, item)'></button> <!-- eslint-disable-line @angular-eslint/template/elements-content -->\n </div>\n }\n </div>\n }\n </div>\n }\n <div class=\"Vlt-input Vlt-dropdown\" style='display: block;' [ngClass]=\"{'vgip-disable': disabled}\">\n <label class='wrapper'>\n <input [attr.title]='model' class='main model' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [step]='validations.step' [disabled]='disabled' [readonly]=\"readonly\" [(ngModel)]='model' (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name' [type]=\"multiple ? 'hidden' : (logicalSubtype || meta.subtype || 'text')\" placeholder=\" \" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n @if (multiple) {\n <input class='main' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [(ngModel)]='addText' [ngModelOptions]=\"{ standalone: true }\" [type]=\"logicalSubtype || meta.subtype || 'text'\" [disabled]='disabled' [readonly]='readonly' placeholder=\"+Add\" (keydown.enter)='onAdd($event)' (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n }\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model && multiple) {\n <span class='Vlt-black'>({{model.length}})</span>\n }\n </label>\n </label>\n <div class='Vlt-composite__append right-actions'>\n @if (model && showClear) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </a>\n }\n </div>\n <!-- <div *ngIf=\"!meta.subtype || meta.subtype == 'text'\" class=\"Vlt-composite__append Vlt-composite__append--icon\" style='bottom: 7px; right: 10px; padding: 3px; width: initial; height: initial; cursor: pointer;'>\n <div *ngIf=\"!meta.type || meta.type === 'string'\" class=\"Vlt-composite__icon\" (click)='textToSpeech()'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-microphone\"/></svg>\n </div>\n </div> -->\n @if (suggestions.length) {\n <div class=\"Vlt-dropdown__panel\">\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area suggestions\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 13px;'>\n Suggestions\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block\"></div>\n @if (dropdown) {\n <div class=\"Vlt-dropdown__scroll\">\n @for (suggestion of suggestions; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': (activeSuggestionIndex === i) }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link\" style='padding: 0;'\n [attr.title]=\"suggestion.hint ? `${suggestion.label} - ${suggestion.hint}` : (suggestion.label || suggestion)\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label [title]='suggestion.label || suggestion'>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(suggestion) !== -1'/>\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{suggestion.label || suggestion}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;text-overflow: ellipsis;overflow: hidden;'>\n {{suggestion.label || suggestion}}\n </div>\n }\n </a>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\" style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\">Clear all</button>\n <button (click)='dismissDropdown($event)' type='button' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.minlength) {\n <span>Must be longer than {{validations.minlength}} characters.&nbsp;</span>\n }\n @if (f.errors.maxlength) {\n <span>Must be lest than {{validations.maxlength}} characters.&nbsp;</span>\n }\n @if (f.errors.pattern) {\n <span>{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element--big .Vlt-input input{padding-right:40px;text-overflow:ellipsis}@media screen and (-webkit-min-device-pixel-ratio:0){.Vlt-form__element--big .Vlt-input input{line-height:20px}}.Vlt-form__element--big .Vlt-input input:disabled{cursor:not-allowed}.Vlt-form__element--big:hover .items-container,.Vlt-form__element--big:hover .main,.Vlt-form__element--big:hover input,.Vlt-form__element--big.active .items-container,.Vlt-form__element--big.active .main,.Vlt-form__element--big.active input{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .Vlt-composite.Vlt-dropdown{margin-top:3px}.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) input,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) input{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .items-container{background-color:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color);border-bottom:0;border-top-left-radius:6px;border-top-right-radius:6px}.Vlt-form__element--big.multiple .items-container.creatable{margin-right:62px}.Vlt-form__element--big.multiple .items-container .badges-container{overflow:auto;max-height:140px;padding:6px 4px 0 6px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge{margin-bottom:3px;margin-left:0;margin-right:3px;overflow:hidden;max-width:100%}.Vlt-form__element--big.multiple:not(.has-value) .items-container{border:0}.Vlt-form__element--big.multiple.has-value .main,.Vlt-form__element--big.multiple.has-value input{border-top:0;border-top-left-radius:0;border-top-right-radius:0;box-shadow:none}.Vlt-form__element--big.Vlt-form__element--error .items-container,.Vlt-form__element--big.Vlt-form__element--error .main,.Vlt-form__element--big.Vlt-form__element--error input{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}label.Vlt-truncate{padding-right:42px}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:10px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
3412
3446
  }
3413
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldInput, decorators: [{
3447
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldInput, decorators: [{
3414
3448
  type: Component,
3415
3449
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n @if (isPhoneNumber) {\n <a href='#' (click)=\"click2dial($event)\" class=\"Vlt-text-link\" aria-label='Dial'>\n <svg class=\"Vlt-icon Vlt-icon--smaller\" style=\"margin-top: -3px;\">\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-phone-full\" />\n </svg>\n {{model}}\n </a>\n } @else {\n {{model}}\n }\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched), 'multiple': multiple, 'has-value': f.value, active: keyListenerActive }\">\n @if (multiple) {\n <div class='items-container'>\n @if (model) {\n <div class='badges-container keep-focus' (click)='focus()'> <!-- eslint-disable-line -->\n @for (item of model; track item) {\n <div class=\"Vlt-badge Vlt-badge--transparent Vlt-badge--app Vlt-badge--large keep-focus\">\n {{item}}\n <button class=\"Vlt-badge__dismiss keep-focus\" (click)='remove($event, item)'></button> <!-- eslint-disable-line @angular-eslint/template/elements-content -->\n </div>\n }\n </div>\n }\n </div>\n }\n <div class=\"Vlt-input Vlt-dropdown\" style='display: block;' [ngClass]=\"{'vgip-disable': disabled}\">\n <label class='wrapper'>\n <input [attr.title]='model' class='main model' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [step]='validations.step' [disabled]='disabled' [readonly]=\"readonly\" [(ngModel)]='model' (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name' [type]=\"multiple ? 'hidden' : (logicalSubtype || meta.subtype || 'text')\" placeholder=\" \" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n @if (multiple) {\n <input class='main' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [(ngModel)]='addText' [ngModelOptions]=\"{ standalone: true }\" [type]=\"logicalSubtype || meta.subtype || 'text'\" [disabled]='disabled' [readonly]='readonly' placeholder=\"+Add\" (keydown.enter)='onAdd($event)' (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n }\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model && multiple) {\n <span class='Vlt-black'>({{model.length}})</span>\n }\n </label>\n </label>\n <div class='Vlt-composite__append right-actions'>\n @if (model && showClear) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </a>\n }\n </div>\n <!-- <div *ngIf=\"!meta.subtype || meta.subtype == 'text'\" class=\"Vlt-composite__append Vlt-composite__append--icon\" style='bottom: 7px; right: 10px; padding: 3px; width: initial; height: initial; cursor: pointer;'>\n <div *ngIf=\"!meta.type || meta.type === 'string'\" class=\"Vlt-composite__icon\" (click)='textToSpeech()'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-microphone\"/></svg>\n </div>\n </div> -->\n @if (suggestions.length) {\n <div class=\"Vlt-dropdown__panel\">\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area suggestions\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 13px;'>\n Suggestions\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block\"></div>\n @if (dropdown) {\n <div class=\"Vlt-dropdown__scroll\">\n @for (suggestion of suggestions; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': (activeSuggestionIndex === i) }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link\" style='padding: 0;'\n [attr.title]=\"suggestion.hint ? `${suggestion.label} - ${suggestion.hint}` : (suggestion.label || suggestion)\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label [title]='suggestion.label || suggestion'>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(suggestion) !== -1'/>\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{suggestion.label || suggestion}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;text-overflow: ellipsis;overflow: hidden;'>\n {{suggestion.label || suggestion}}\n </div>\n }\n </a>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\" style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\">Clear all</button>\n <button (click)='dismissDropdown($event)' type='button' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.minlength) {\n <span>Must be longer than {{validations.minlength}} characters.&nbsp;</span>\n }\n @if (f.errors.maxlength) {\n <span>Must be lest than {{validations.maxlength}} characters.&nbsp;</span>\n }\n @if (f.errors.pattern) {\n <span>{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element--big .Vlt-input input{padding-right:40px;text-overflow:ellipsis}@media screen and (-webkit-min-device-pixel-ratio:0){.Vlt-form__element--big .Vlt-input input{line-height:20px}}.Vlt-form__element--big .Vlt-input input:disabled{cursor:not-allowed}.Vlt-form__element--big:hover .items-container,.Vlt-form__element--big:hover .main,.Vlt-form__element--big:hover input,.Vlt-form__element--big.active .items-container,.Vlt-form__element--big.active .main,.Vlt-form__element--big.active input{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .Vlt-composite.Vlt-dropdown{margin-top:3px}.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) input,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) input{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .items-container{background-color:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color);border-bottom:0;border-top-left-radius:6px;border-top-right-radius:6px}.Vlt-form__element--big.multiple .items-container.creatable{margin-right:62px}.Vlt-form__element--big.multiple .items-container .badges-container{overflow:auto;max-height:140px;padding:6px 4px 0 6px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge{margin-bottom:3px;margin-left:0;margin-right:3px;overflow:hidden;max-width:100%}.Vlt-form__element--big.multiple:not(.has-value) .items-container{border:0}.Vlt-form__element--big.multiple.has-value .main,.Vlt-form__element--big.multiple.has-value input{border-top:0;border-top-left-radius:0;border-top-right-radius:0;box-shadow:none}.Vlt-form__element--big.Vlt-form__element--error .items-container,.Vlt-form__element--big.Vlt-form__element--error .main,.Vlt-form__element--big.Vlt-form__element--error input{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}label.Vlt-truncate{padding-right:42px}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:10px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}\n"] }]
3416
3450
  }], ctorParameters: () => [{ type: MetaContextService }] });
@@ -3485,10 +3519,10 @@ class FieldText extends FieldAbstract {
3485
3519
  textToSpeech() {
3486
3520
  this.focus();
3487
3521
  }
3488
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldText, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
3489
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldText, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{parent[meta.name]}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <label class='wrapper'>\n <div class=\"Vlt-textarea\">\n <textarea class='main model' [required]='validations.required' [maxlength]='validations.maxlength' rows=\"{{ meta.rows || 4 }}\" placeholder=' ' [(ngModel)]='model' (ngModelChange)=\"onModelChangeLocal($event)\" #f='ngModel' [name]='name'></textarea>\n <!-- <div class=\"Vlt-composite__append Vlt-composite__append--icon\">\n <div class=\"Vlt-composite__icon\" (click)='textToSpeech()'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-microphone\"/></svg>\n </div>\n </div> -->\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n </div>\n </label>\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n</div>\n}\n", styles: [".Vlt-composite__append--icon{bottom:7px;right:16px;padding:3px;width:initial;height:initial;cursor:pointer}.Vlt-composite__append--icon:hover svg{fill:#2c2d30}.Vlt-form__element--big .Vlt-textarea .Vlt-label{right:18px;background:var(--vgip-meta-input-bg-color)}.Vlt-form__element--error textarea{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
3522
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldText, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
3523
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldText, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{parent[meta.name]}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <label class='wrapper'>\n <div class=\"Vlt-textarea\">\n <textarea class='main model' [required]='validations.required' [maxlength]='validations.maxlength' rows=\"{{ meta.rows || 4 }}\" placeholder=' ' [(ngModel)]='model' (ngModelChange)=\"onModelChangeLocal($event)\" #f='ngModel' [name]='name'></textarea>\n <!-- <div class=\"Vlt-composite__append Vlt-composite__append--icon\">\n <div class=\"Vlt-composite__icon\" (click)='textToSpeech()'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-microphone\"/></svg>\n </div>\n </div> -->\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n </div>\n </label>\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n</div>\n}\n", styles: [".Vlt-composite__append--icon{bottom:7px;right:16px;padding:3px;width:initial;height:initial;cursor:pointer}.Vlt-composite__append--icon:hover svg{fill:#2c2d30}.Vlt-form__element--big .Vlt-textarea .Vlt-label{right:18px;background:var(--vgip-meta-input-bg-color)}.Vlt-form__element--error textarea{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
3490
3524
  }
3491
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldText, decorators: [{
3525
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldText, decorators: [{
3492
3526
  type: Component,
3493
3527
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{parent[meta.name]}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <label class='wrapper'>\n <div class=\"Vlt-textarea\">\n <textarea class='main model' [required]='validations.required' [maxlength]='validations.maxlength' rows=\"{{ meta.rows || 4 }}\" placeholder=' ' [(ngModel)]='model' (ngModelChange)=\"onModelChangeLocal($event)\" #f='ngModel' [name]='name'></textarea>\n <!-- <div class=\"Vlt-composite__append Vlt-composite__append--icon\">\n <div class=\"Vlt-composite__icon\" (click)='textToSpeech()'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-microphone\"/></svg>\n </div>\n </div> -->\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n </div>\n </label>\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n</div>\n}\n", styles: [".Vlt-composite__append--icon{bottom:7px;right:16px;padding:3px;width:initial;height:initial;cursor:pointer}.Vlt-composite__append--icon:hover svg{fill:#2c2d30}.Vlt-form__element--big .Vlt-textarea .Vlt-label{right:18px;background:var(--vgip-meta-input-bg-color)}.Vlt-form__element--error textarea{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}\n"] }]
3494
3528
  }], ctorParameters: () => [{ type: MetaContextService }] });
@@ -4060,10 +4094,10 @@ class FieldSelect extends FieldAbstract {
4060
4094
  delete this.searching;
4061
4095
  });
4062
4096
  }
4063
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldSelect, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
4064
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldSelect, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
4097
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldSelect, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
4098
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldSelect, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
4065
4099
  }
4066
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldSelect, decorators: [{
4100
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldSelect, decorators: [{
4067
4101
  type: Component,
4068
4102
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}\n"] }]
4069
4103
  }], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: i0.ViewContainerRef }] });
@@ -4092,10 +4126,10 @@ class MetaTrackerService {
4092
4126
  }
4093
4127
  this.events.emit(event);
4094
4128
  }
4095
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
4096
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaTrackerService, providedIn: 'root' }); }
4129
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
4130
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaTrackerService, providedIn: 'root' }); }
4097
4131
  }
4098
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaTrackerService, decorators: [{
4132
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaTrackerService, decorators: [{
4099
4133
  type: Injectable,
4100
4134
  args: [{
4101
4135
  providedIn: 'root'
@@ -4919,10 +4953,10 @@ class FieldReference extends FieldAbstract {
4919
4953
  });
4920
4954
  }
4921
4955
  }
4922
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldReference, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: MetaMsgService }, { token: MetaContextService }, { token: MetaTrackerService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
4923
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldReference, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model && (!multiple || (multiple && model.length))) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n @if (!multiple) {\n <div class='vgip-meta-field-value __gu' [ngClass]=\"{ 'has-external-link': externalLink || model.externalLink }\">\n <svg class=\"Vlt-icon Vlt-icon--smaller\" style='margin-top: -3px;'>\n <use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" />\n </svg>\n {{model.label || model.id}} <span class='Vlt-grey'>({{model.type}})</span>\n </div>\n }\n @if (multiple) {\n <div class='vgip-meta-field-value __gu'>\n @for (m of (model || []); track m) {\n <span class='Vlt-badge Vlt-badge--app'>\n {{m.label || m.id || m}} @if (isPolymorphic) {\n <span class='Vlt-grey-dark'>({{m.type}})</span>\n }\n </span>\n }\n </div>\n }\n @if (externalLink && (model && !multiple)) {\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener'\n class=\"Vlt-composite__append--icon preview\" aria-label='Open external'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\" />\n </svg>\n </div>\n </a>\n }\n</div>\n}\n@if (!preview) {\n <div class=\"meta-field-reference Vlt-form__element Vlt-form__element--big\"\n [ngClass]=\"{ 'Vlt-form__element--error': (searchError && keyListenerActive) || (f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched)), 'multiple': multiple, 'has-value': model, active: keyListenerActive }\">\n @if (multiple) {\n <div class='items-container' [ngClass]='{ creatable: isCreatable }'>\n @if (model) {\n <div class='badges-container keep-focus' (click)='focus()' style='width: 100%;'> <!-- eslint-disable-line -->\n @for (item of model; track item) {\n <div class=\"Vlt-badge Vlt-badge--transparent Vlt-badge--app Vlt-badge--large keep-focus\" [ngClass]=\"{ grid: (item.label || item.id || '').length > 56}\">\n <span class='Vlt-truncate'>{{item.label || item.id || item }} @if (isPolymorphic) {\n <span class='Vlt-grey-darker' style='font-weight: normal;'>({{item.type}})</span>\n }</span>\n <button class=\"Vlt-badge__dismiss keep-focus\" (click)='remove($event, item)' style='position: absolute; right: 12px; top: 8px;' aria-label='Remove'></button>\n </div>\n }\n </div>\n }\n </div>\n }\n <div class=\"Vlt-composite\">\n <div class='dropdown-wrapper Vlt-dropdown' style='width: 100%; position: absolute; top: 48px;'>\n <div class=\"Vlt-dropdown__panel\">\n @if (searchError) {\n <div>\n <div class=\"Vlt-callout Vlt-callout--critical keep-focus\">\n <i></i>\n <div class=\"Vlt-callout__content\">{{searchError}}</div>\n </div>\n </div>\n }\n @if (!searchError && (suggestions.length || searchResults)) {\n <div [ngClass]=\"{ suggestions: !searchResults}\"\n class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\" style='padding: 0;'>\n <div class=\"Vlt-dropdown__block\"></div>\n @if (!searchResults) {\n <div class=\"Vlt-dropdown__scroll\">\n @for (suggestion of suggestions; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i, smart: suggestion.smart }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link has-type\">\n <svg class='Vlt-icon Vlt-icon--small'><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\"/></svg>\n <div class='__gu' [title]='suggestion.label'>{{ suggestion.label }}</div>\n <small class='Vlt-grey-dark' style='text-transform: capitalize;'>{{suggestion.type}}</small>\n </a>\n }\n </div>\n }\n @if (searchResults) {\n <div class=\"Vlt-dropdown__scroll\">\n @if (!searchResults.length) {\n <div class='Vlt-dropdown__block'> No records matching '<b style='pointer-events: none;'>{{searchText}}</b>' were found.</div>\n }\n @for (suggestion of searchResults; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link has-type\">\n <svg class='Vlt-icon Vlt-icon--small'><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\"/></svg>\n <div class='__gu' [title]='suggestion.label'>{{ suggestion.label }}</div>\n <small class='Vlt-grey-dark' style='text-transform: capitalize;'>{{suggestion.type}}</small>\n </a>\n }\n </div>\n }\n <!-- <div *ngIf='searchResults' class=\"Vlt-dropdown__block\" style='text-align: right; padding-top: 0;'>\n <small>\n {{ searchResults ? searchResults.length+' results' : 'Suggestions' }} <span style='font-style: italic; font-weight: normal;' *ngIf='searchResults'>~{{ model ? 'last search' : searchText}}</span>\n </small>\n </div> -->\n <div class=\"Vlt-dropdown__block\"></div>\n </div>\n }\n </div>\n </div>\n @if (isPolymorphic && showTypes && (multiple || !model || (dropdownVisible && ((suggestions || searchResults || []).length || searchResourceType.resourceType)))) {\n <div class=\"Vlt-composite__prepend\"\n >\n <div class=\"search-scope\" [ngClass]=\"{ 'has-value': searchResourceType.resourceType }\">\n <vgip-meta-field class='shown' [meta]='searchResourceTypeMeta' [parent]='searchResourceType'\n (onChange)='onSearchResourceTypeChanged($event)' (onLeave)='onBlur($event)'\n [integrationCode]='integrationCode' theme='inherit'></vgip-meta-field>\n <svg class='Vlt-icon Vlt-grey Vlt-icon--smaller visible-mobile mobile-icon'\n style='position: absolute; top: 15px; left: 14px; pointer-events: none;'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-menu\" />\n </svg>\n </div>\n </div>\n }\n @if (!(isPolymorphic && showTypes && (multiple || !model || dropdownVisible))) {\n <div>\n <!-- required by css -->\n </div>\n }\n <div class=\"Vlt-composite__wrapper Vlt-input\" style='overflow: hidden;'\n [ngClass]=\"{ 'has-append-button': hasAppendButton && !disabled, 'vgip-disable': disabled }\">\n <label class='wrapper'>\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\" style='top: 0; padding-top: 15px;'>\n <div class=\"Vlt-composite__icon\">\n @if (isSearchable && (!model || multiple)) {\n <svg class='Vlt-grey'>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ multiple ? 'stack' : 'search'}}\" />\n </svg>\n }\n @if (!isSearchable || (model && !multiple)) {\n <svg\n [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\">\n <use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" />\n </svg>\n }\n </div>\n @if (suggestions.length) {\n <div class=\"Vlt-badge Vlt-badge--small Vlt-badge--purple\"\n style='padding: 0px 4px; position: absolute; top: 26px; left: 4px; pointer-events: none; min-width: 14px;'>\n {{suggestions.length}}</div>\n }\n </div>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n <input class='main' [readonly]='!isSearchable || (model && !multiple)' [ngModel]='searchText' #ft='ngModel' (ngModelChange)='onSearchTextChanged($event)' [ngModelOptions]=\"{standalone: true}\" type=\"text\" placeholder=\"{{ placeHolderLabel || ' ' }}\" [ngClass]='{ ext: externalLink }' (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)' [disabled]='disabled' [title]=\"model ? model.label : ''\"/>\n <label class='Vlt-truncate hidden-mobile' style='padding-left: 25px; padding-right: 42px;'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{ (multiple && isPolymorphic) ? '+Add ' : ((model || !isPolymorphic) ? meta.label : ( meta.searchLabel || 'Search')) }}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model) {\n <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;'>({{model.type || model.resourceType || model.length}})</span>\n }\n </label>\n <label class='Vlt-truncate hidden-desktop' style='padding-left: 25px; padding-right: 42px;'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model) {\n <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;'>({{model.type || model.resourceType || model.length}})</span>\n }\n </label>\n </label>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n <!-- <div *ngIf='prevModel && !model' class=\"Vlt-composite__append--icon\" (click)='revert()'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-reply\"/></svg>\n </div>\n </div> -->\n @if (model && !multiple) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='removeSelection($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n @if (externalLink && (model && !multiple)) {\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener' class=\"Vlt-composite__append--icon\" aria-label='Open external'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <!-- <span *ngIf='hasCreatables'>\n <button type='button' *ngIf='!model || multiple' (click)='openResource()' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n <button type='button' *ngIf='model && !multiple' (click)='openResource(model)' class=\"Vlt-btn Vlt-btn--primary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\"/></svg>\n </button>\n</span> -->\n@if (hasAppendButton && !disabled) {\n <div class=\"Vlt-composite__append\">\n @if (!model || multiple) {\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button'\n (click)='openResource()' class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon\" aria-label='Add new' [disabled]='delegate'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg>\n </button>\n }\n @if (model && !multiple) {\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button'\n (click)='openResource(model)' class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon\" aria-label='Edit' [disabled]='delegate'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\" />\n </svg>\n </button>\n }\n </div>\n}\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched && keyListenerActive))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.pattern) {\n <span>Should match '{{validations.pattern}}' pattern</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.helpText || meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText || meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element--big .Vlt-input input:placeholder-shown:not(:focus)~label.Vlt-truncate{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-right:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.Vlt-form__element--big:hover .items-container,.Vlt-form__element--big:hover .main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:hover ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone,.Vlt-form__element--big.active .items-container,.Vlt-form__element--big.active .main,.Vlt-form__element--big.active .Vlt-composite__append button,.Vlt-form__element--big.active ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error .items-container,.Vlt-form__element--big.Vlt-form__element--error .main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button,.Vlt-form__element--big.Vlt-form__element--error ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:#f25a6b}.Vlt-form__element--big.multiple .Vlt-composite.Vlt-dropdown{margin-top:3px}.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .Vlt-composite__append button,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .Vlt-composite__append button,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .items-container{background-color:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color);border-bottom:0;border-top-left-radius:6px;border-top-right-radius:6px}.Vlt-form__element--big.multiple .items-container .badges-container{overflow:auto;padding:6px 4px 3px 6px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge{margin-bottom:3px;margin-left:0;margin-right:3px;overflow:hidden;max-width:100%;position:relative;padding-right:30px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge.grid{display:grid}.Vlt-form__element--big.multiple:not(.has-value) .items-container{border:0}.Vlt-form__element--big.multiple.has-value .main:not(.Vlt-btn--icon),.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button:not(.Vlt-btn--icon),.Vlt-form__element--big.multiple.has-value ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone:not(.Vlt-btn--icon){border-top:0}.Vlt-form__element--big.multiple.has-value .main,.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button,.Vlt-form__element--big.multiple.has-value ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-top-left-radius:0;border-top-right-radius:0;height:48px}.Vlt-form__element--big.multiple.has-value .Vlt-composite__prepend ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-top-right-radius:6px}.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button{border-top-left-radius:6px;border-top:0}.Vlt-composite__prepend{z-index:initial}.Vlt-composite__prepend--icon{top:0;padding-top:15px;left:3px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:0}.Vlt-input.has-append-button .Vlt-composite__append.right-actions .Vlt-composite__append--icon:last-child{width:36px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:5px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-composite__append--icon.preview{bottom:initial;padding:0 2px}.Vlt-composite__append button{height:48px;padding-right:16px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-composite__append button:disabled{opacity:.2}.Vlt-input input{padding-left:38px;text-overflow:ellipsis;padding-right:36px}.Vlt-input input.ext{padding-right:72px}.Vlt-composite__wrapper.has-append-button input.main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-input input{background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);font-weight:700}.Vlt-dropdown__panel{max-width:100%;width:100%;min-width:280px}.Vlt-dropdown__panel .Vlt-dropdown__link.smart{font-weight:700;background:var(--vgip-meta-dropdown-bg-color)}.Vlt-dropdown__panel .Vlt-dropdown__link.smart.hidden{display:none}.Vlt-dropdown__panel .Vlt-dropdown__link.bold:after{background-color:#e1e2e6;content:\"\";height:1px;left:0;position:absolute;right:0;bottom:0}.Vlt-dropdown__panel .Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel .Vlt-dropdown__link>div{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.Vlt-dropdown__panel .Vlt-dropdown__link>svg{margin-right:8px}.vgip-meta-field-preview .Vlt-badge{margin:1px 3px 1px 0;overflow:hidden;max-width:100%}:host .search-scope{width:130px}:host .search-scope ::ng-deep .Vlt-form__element.has-value .Vlt-select:after{display:none}:host .search-scope ::ng-deep .Vlt-form__element .right-actions{right:12px}:host .search-scope ::ng-deep .Vlt-form__element label.Vlt-truncate{padding-right:48px}:host .search-scope .mobile-icon{display:none}@media only screen and (max-width:575px){:host .search-scope{width:60px}:host .search-scope:not(.has-value) .mobile-icon{display:block}:host .search-scope.has-value .mobile-label{display:block}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big .Vlt-composite__append{display:none}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big .Vlt-select:after{margin-right:-7px}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big label.Vlt-truncate{visibility:hidden}}:host .search-scope ::ng-deep vgip-meta-field .Vlt-input input.main.standalone{padding-right:initial;background:var(--vgip-meta-input-accent-bg-color);border-color:var(--vgip-meta-input-border-color)}:host .search-scope ::ng-deep vgip-meta-field .Vlt-form__element{padding:0}:host .search-scope ::ng-deep vgip-meta-field .Vlt-form__element .Vlt-dropdown__panel{width:initial}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
4956
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldReference, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: MetaMsgService }, { token: MetaContextService }, { token: MetaTrackerService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
4957
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldReference, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model && (!multiple || (multiple && model.length))) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n @if (!multiple) {\n <div class='vgip-meta-field-value __gu' [ngClass]=\"{ 'has-external-link': externalLink || model.externalLink }\">\n <svg class=\"Vlt-icon Vlt-icon--smaller\" style='margin-top: -3px;'>\n <use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" />\n </svg>\n {{model.label || model.id}} <span class='Vlt-grey'>({{model.type}})</span>\n </div>\n }\n @if (multiple) {\n <div class='vgip-meta-field-value __gu'>\n @for (m of (model || []); track m) {\n <span class='Vlt-badge Vlt-badge--app'>\n {{m.label || m.id || m}} @if (isPolymorphic) {\n <span class='Vlt-grey-dark'>({{m.type}})</span>\n }\n </span>\n }\n </div>\n }\n @if (externalLink && (model && !multiple)) {\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener'\n class=\"Vlt-composite__append--icon preview\" aria-label='Open external'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\" />\n </svg>\n </div>\n </a>\n }\n</div>\n}\n@if (!preview) {\n <div class=\"meta-field-reference Vlt-form__element Vlt-form__element--big\"\n [ngClass]=\"{ 'Vlt-form__element--error': (searchError && keyListenerActive) || (f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched)), 'multiple': multiple, 'has-value': model, active: keyListenerActive }\">\n @if (multiple) {\n <div class='items-container' [ngClass]='{ creatable: isCreatable }'>\n @if (model) {\n <div class='badges-container keep-focus' (click)='focus()' style='width: 100%;'> <!-- eslint-disable-line -->\n @for (item of model; track item) {\n <div class=\"Vlt-badge Vlt-badge--transparent Vlt-badge--app Vlt-badge--large keep-focus\" [ngClass]=\"{ grid: (item.label || item.id || '').length > 56}\">\n <span class='Vlt-truncate'>{{item.label || item.id || item }} @if (isPolymorphic) {\n <span class='Vlt-grey-darker' style='font-weight: normal;'>({{item.type}})</span>\n }</span>\n <button class=\"Vlt-badge__dismiss keep-focus\" (click)='remove($event, item)' style='position: absolute; right: 12px; top: 8px;' aria-label='Remove'></button>\n </div>\n }\n </div>\n }\n </div>\n }\n <div class=\"Vlt-composite\">\n <div class='dropdown-wrapper Vlt-dropdown' style='width: 100%; position: absolute; top: 48px;'>\n <div class=\"Vlt-dropdown__panel\">\n @if (searchError) {\n <div>\n <div class=\"Vlt-callout Vlt-callout--critical keep-focus\">\n <i></i>\n <div class=\"Vlt-callout__content\">{{searchError}}</div>\n </div>\n </div>\n }\n @if (!searchError && (suggestions.length || searchResults)) {\n <div [ngClass]=\"{ suggestions: !searchResults}\"\n class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\" style='padding: 0;'>\n <div class=\"Vlt-dropdown__block\"></div>\n @if (!searchResults) {\n <div class=\"Vlt-dropdown__scroll\">\n @for (suggestion of suggestions; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i, smart: suggestion.smart }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link has-type\">\n <svg class='Vlt-icon Vlt-icon--small'><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\"/></svg>\n <div class='__gu' [title]='suggestion.label'>{{ suggestion.label }}</div>\n <small class='Vlt-grey-dark' style='text-transform: capitalize;'>{{suggestion.type}}</small>\n </a>\n }\n </div>\n }\n @if (searchResults) {\n <div class=\"Vlt-dropdown__scroll\">\n @if (!searchResults.length) {\n <div class='Vlt-dropdown__block'> No records matching '<b style='pointer-events: none;'>{{searchText}}</b>' were found.</div>\n }\n @for (suggestion of searchResults; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link has-type\">\n <svg class='Vlt-icon Vlt-icon--small'><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\"/></svg>\n <div class='__gu' [title]='suggestion.label'>{{ suggestion.label }}</div>\n <small class='Vlt-grey-dark' style='text-transform: capitalize;'>{{suggestion.type}}</small>\n </a>\n }\n </div>\n }\n <!-- <div *ngIf='searchResults' class=\"Vlt-dropdown__block\" style='text-align: right; padding-top: 0;'>\n <small>\n {{ searchResults ? searchResults.length+' results' : 'Suggestions' }} <span style='font-style: italic; font-weight: normal;' *ngIf='searchResults'>~{{ model ? 'last search' : searchText}}</span>\n </small>\n </div> -->\n <div class=\"Vlt-dropdown__block\"></div>\n </div>\n }\n </div>\n </div>\n @if (isPolymorphic && showTypes && (multiple || !model || (dropdownVisible && ((suggestions || searchResults || []).length || searchResourceType.resourceType)))) {\n <div class=\"Vlt-composite__prepend\"\n >\n <div class=\"search-scope\" [ngClass]=\"{ 'has-value': searchResourceType.resourceType }\">\n <vgip-meta-field class='shown' [meta]='searchResourceTypeMeta' [parent]='searchResourceType'\n (onChange)='onSearchResourceTypeChanged($event)' (onLeave)='onBlur($event)'\n [integrationCode]='integrationCode' theme='inherit'></vgip-meta-field>\n <svg class='Vlt-icon Vlt-grey Vlt-icon--smaller visible-mobile mobile-icon'\n style='position: absolute; top: 15px; left: 14px; pointer-events: none;'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-menu\" />\n </svg>\n </div>\n </div>\n }\n @if (!(isPolymorphic && showTypes && (multiple || !model || dropdownVisible))) {\n <div>\n <!-- required by css -->\n </div>\n }\n <div class=\"Vlt-composite__wrapper Vlt-input\" style='overflow: hidden;'\n [ngClass]=\"{ 'has-append-button': hasAppendButton && !disabled, 'vgip-disable': disabled }\">\n <label class='wrapper'>\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\" style='top: 0; padding-top: 15px;'>\n <div class=\"Vlt-composite__icon\">\n @if (isSearchable && (!model || multiple)) {\n <svg class='Vlt-grey'>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ multiple ? 'stack' : 'search'}}\" />\n </svg>\n }\n @if (!isSearchable || (model && !multiple)) {\n <svg\n [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\">\n <use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" />\n </svg>\n }\n </div>\n @if (suggestions.length) {\n <div class=\"Vlt-badge Vlt-badge--small Vlt-badge--purple\"\n style='padding: 0px 4px; position: absolute; top: 26px; left: 4px; pointer-events: none; min-width: 14px;'>\n {{suggestions.length}}</div>\n }\n </div>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n <input class='main' [readonly]='!isSearchable || (model && !multiple)' [ngModel]='searchText' #ft='ngModel' (ngModelChange)='onSearchTextChanged($event)' [ngModelOptions]=\"{standalone: true}\" type=\"text\" placeholder=\"{{ placeHolderLabel || ' ' }}\" [ngClass]='{ ext: externalLink }' (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)' [disabled]='disabled' [title]=\"model ? model.label : ''\"/>\n <label class='Vlt-truncate hidden-mobile' style='padding-left: 25px; padding-right: 42px;'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{ (multiple && isPolymorphic) ? '+Add ' : ((model || !isPolymorphic) ? meta.label : ( meta.searchLabel || 'Search')) }}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model) {\n <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;'>({{model.type || model.resourceType || model.length}})</span>\n }\n </label>\n <label class='Vlt-truncate hidden-desktop' style='padding-left: 25px; padding-right: 42px;'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model) {\n <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;'>({{model.type || model.resourceType || model.length}})</span>\n }\n </label>\n </label>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n <!-- <div *ngIf='prevModel && !model' class=\"Vlt-composite__append--icon\" (click)='revert()'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-reply\"/></svg>\n </div>\n </div> -->\n @if (model && !multiple) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='removeSelection($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n @if (externalLink && (model && !multiple)) {\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener' class=\"Vlt-composite__append--icon\" aria-label='Open external'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <!-- <span *ngIf='hasCreatables'>\n <button type='button' *ngIf='!model || multiple' (click)='openResource()' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n <button type='button' *ngIf='model && !multiple' (click)='openResource(model)' class=\"Vlt-btn Vlt-btn--primary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\"/></svg>\n </button>\n</span> -->\n@if (hasAppendButton && !disabled) {\n <div class=\"Vlt-composite__append\">\n @if (!model || multiple) {\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button'\n (click)='openResource()' class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon\" aria-label='Add new' [disabled]='delegate'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg>\n </button>\n }\n @if (model && !multiple) {\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button'\n (click)='openResource(model)' class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon\" aria-label='Edit' [disabled]='delegate'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\" />\n </svg>\n </button>\n }\n </div>\n}\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched && keyListenerActive))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.pattern) {\n <span>Should match '{{validations.pattern}}' pattern</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.helpText || meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText || meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element--big .Vlt-input input:placeholder-shown:not(:focus)~label.Vlt-truncate{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-right:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.Vlt-form__element--big:hover .items-container,.Vlt-form__element--big:hover .main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:hover ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone,.Vlt-form__element--big.active .items-container,.Vlt-form__element--big.active .main,.Vlt-form__element--big.active .Vlt-composite__append button,.Vlt-form__element--big.active ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error .items-container,.Vlt-form__element--big.Vlt-form__element--error .main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button,.Vlt-form__element--big.Vlt-form__element--error ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:#f25a6b}.Vlt-form__element--big.multiple .Vlt-composite.Vlt-dropdown{margin-top:3px}.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .Vlt-composite__append button,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .Vlt-composite__append button,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .items-container{background-color:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color);border-bottom:0;border-top-left-radius:6px;border-top-right-radius:6px}.Vlt-form__element--big.multiple .items-container .badges-container{overflow:auto;padding:6px 4px 3px 6px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge{margin-bottom:3px;margin-left:0;margin-right:3px;overflow:hidden;max-width:100%;position:relative;padding-right:30px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge.grid{display:grid}.Vlt-form__element--big.multiple:not(.has-value) .items-container{border:0}.Vlt-form__element--big.multiple.has-value .main:not(.Vlt-btn--icon),.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button:not(.Vlt-btn--icon),.Vlt-form__element--big.multiple.has-value ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone:not(.Vlt-btn--icon){border-top:0}.Vlt-form__element--big.multiple.has-value .main,.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button,.Vlt-form__element--big.multiple.has-value ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-top-left-radius:0;border-top-right-radius:0;height:48px}.Vlt-form__element--big.multiple.has-value .Vlt-composite__prepend ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-top-right-radius:6px}.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button{border-top-left-radius:6px;border-top:0}.Vlt-composite__prepend{z-index:initial}.Vlt-composite__prepend--icon{top:0;padding-top:15px;left:3px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:0}.Vlt-input.has-append-button .Vlt-composite__append.right-actions .Vlt-composite__append--icon:last-child{width:36px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:5px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-composite__append--icon.preview{bottom:initial;padding:0 2px}.Vlt-composite__append button{height:48px;padding-right:16px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-composite__append button:disabled{opacity:.2}.Vlt-input input{padding-left:38px;text-overflow:ellipsis;padding-right:36px}.Vlt-input input.ext{padding-right:72px}.Vlt-composite__wrapper.has-append-button input.main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-input input{background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);font-weight:700}.Vlt-dropdown__panel{max-width:100%;width:100%;min-width:280px}.Vlt-dropdown__panel .Vlt-dropdown__link.smart{font-weight:700;background:var(--vgip-meta-dropdown-bg-color)}.Vlt-dropdown__panel .Vlt-dropdown__link.smart.hidden{display:none}.Vlt-dropdown__panel .Vlt-dropdown__link.bold:after{background-color:#e1e2e6;content:\"\";height:1px;left:0;position:absolute;right:0;bottom:0}.Vlt-dropdown__panel .Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel .Vlt-dropdown__link>div{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.Vlt-dropdown__panel .Vlt-dropdown__link>svg{margin-right:8px}.vgip-meta-field-preview .Vlt-badge{margin:1px 3px 1px 0;overflow:hidden;max-width:100%}:host .search-scope{width:130px}:host .search-scope ::ng-deep .Vlt-form__element.has-value .Vlt-select:after{display:none}:host .search-scope ::ng-deep .Vlt-form__element .right-actions{right:12px}:host .search-scope ::ng-deep .Vlt-form__element label.Vlt-truncate{padding-right:48px}:host .search-scope .mobile-icon{display:none}@media only screen and (max-width:575px){:host .search-scope{width:60px}:host .search-scope:not(.has-value) .mobile-icon{display:block}:host .search-scope.has-value .mobile-label{display:block}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big .Vlt-composite__append{display:none}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big .Vlt-select:after{margin-right:-7px}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big label.Vlt-truncate{visibility:hidden}}:host .search-scope ::ng-deep vgip-meta-field .Vlt-input input.main.standalone{padding-right:initial;background:var(--vgip-meta-input-accent-bg-color);border-color:var(--vgip-meta-input-border-color)}:host .search-scope ::ng-deep vgip-meta-field .Vlt-form__element{padding:0}:host .search-scope ::ng-deep vgip-meta-field .Vlt-form__element .Vlt-dropdown__panel{width:initial}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
4924
4958
  }
4925
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldReference, decorators: [{
4959
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldReference, decorators: [{
4926
4960
  type: Component,
4927
4961
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model && (!multiple || (multiple && model.length))) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n @if (!multiple) {\n <div class='vgip-meta-field-value __gu' [ngClass]=\"{ 'has-external-link': externalLink || model.externalLink }\">\n <svg class=\"Vlt-icon Vlt-icon--smaller\" style='margin-top: -3px;'>\n <use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" />\n </svg>\n {{model.label || model.id}} <span class='Vlt-grey'>({{model.type}})</span>\n </div>\n }\n @if (multiple) {\n <div class='vgip-meta-field-value __gu'>\n @for (m of (model || []); track m) {\n <span class='Vlt-badge Vlt-badge--app'>\n {{m.label || m.id || m}} @if (isPolymorphic) {\n <span class='Vlt-grey-dark'>({{m.type}})</span>\n }\n </span>\n }\n </div>\n }\n @if (externalLink && (model && !multiple)) {\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener'\n class=\"Vlt-composite__append--icon preview\" aria-label='Open external'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\" />\n </svg>\n </div>\n </a>\n }\n</div>\n}\n@if (!preview) {\n <div class=\"meta-field-reference Vlt-form__element Vlt-form__element--big\"\n [ngClass]=\"{ 'Vlt-form__element--error': (searchError && keyListenerActive) || (f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched)), 'multiple': multiple, 'has-value': model, active: keyListenerActive }\">\n @if (multiple) {\n <div class='items-container' [ngClass]='{ creatable: isCreatable }'>\n @if (model) {\n <div class='badges-container keep-focus' (click)='focus()' style='width: 100%;'> <!-- eslint-disable-line -->\n @for (item of model; track item) {\n <div class=\"Vlt-badge Vlt-badge--transparent Vlt-badge--app Vlt-badge--large keep-focus\" [ngClass]=\"{ grid: (item.label || item.id || '').length > 56}\">\n <span class='Vlt-truncate'>{{item.label || item.id || item }} @if (isPolymorphic) {\n <span class='Vlt-grey-darker' style='font-weight: normal;'>({{item.type}})</span>\n }</span>\n <button class=\"Vlt-badge__dismiss keep-focus\" (click)='remove($event, item)' style='position: absolute; right: 12px; top: 8px;' aria-label='Remove'></button>\n </div>\n }\n </div>\n }\n </div>\n }\n <div class=\"Vlt-composite\">\n <div class='dropdown-wrapper Vlt-dropdown' style='width: 100%; position: absolute; top: 48px;'>\n <div class=\"Vlt-dropdown__panel\">\n @if (searchError) {\n <div>\n <div class=\"Vlt-callout Vlt-callout--critical keep-focus\">\n <i></i>\n <div class=\"Vlt-callout__content\">{{searchError}}</div>\n </div>\n </div>\n }\n @if (!searchError && (suggestions.length || searchResults)) {\n <div [ngClass]=\"{ suggestions: !searchResults}\"\n class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\" style='padding: 0;'>\n <div class=\"Vlt-dropdown__block\"></div>\n @if (!searchResults) {\n <div class=\"Vlt-dropdown__scroll\">\n @for (suggestion of suggestions; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i, smart: suggestion.smart }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link has-type\">\n <svg class='Vlt-icon Vlt-icon--small'><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\"/></svg>\n <div class='__gu' [title]='suggestion.label'>{{ suggestion.label }}</div>\n <small class='Vlt-grey-dark' style='text-transform: capitalize;'>{{suggestion.type}}</small>\n </a>\n }\n </div>\n }\n @if (searchResults) {\n <div class=\"Vlt-dropdown__scroll\">\n @if (!searchResults.length) {\n <div class='Vlt-dropdown__block'> No records matching '<b style='pointer-events: none;'>{{searchText}}</b>' were found.</div>\n }\n @for (suggestion of searchResults; track suggestion; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\" (click)='onSuggestionSelect($event, suggestion)' class=\"Vlt-dropdown__link has-type\">\n <svg class='Vlt-icon Vlt-icon--small'><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\"/></svg>\n <div class='__gu' [title]='suggestion.label'>{{ suggestion.label }}</div>\n <small class='Vlt-grey-dark' style='text-transform: capitalize;'>{{suggestion.type}}</small>\n </a>\n }\n </div>\n }\n <!-- <div *ngIf='searchResults' class=\"Vlt-dropdown__block\" style='text-align: right; padding-top: 0;'>\n <small>\n {{ searchResults ? searchResults.length+' results' : 'Suggestions' }} <span style='font-style: italic; font-weight: normal;' *ngIf='searchResults'>~{{ model ? 'last search' : searchText}}</span>\n </small>\n </div> -->\n <div class=\"Vlt-dropdown__block\"></div>\n </div>\n }\n </div>\n </div>\n @if (isPolymorphic && showTypes && (multiple || !model || (dropdownVisible && ((suggestions || searchResults || []).length || searchResourceType.resourceType)))) {\n <div class=\"Vlt-composite__prepend\"\n >\n <div class=\"search-scope\" [ngClass]=\"{ 'has-value': searchResourceType.resourceType }\">\n <vgip-meta-field class='shown' [meta]='searchResourceTypeMeta' [parent]='searchResourceType'\n (onChange)='onSearchResourceTypeChanged($event)' (onLeave)='onBlur($event)'\n [integrationCode]='integrationCode' theme='inherit'></vgip-meta-field>\n <svg class='Vlt-icon Vlt-grey Vlt-icon--smaller visible-mobile mobile-icon'\n style='position: absolute; top: 15px; left: 14px; pointer-events: none;'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-menu\" />\n </svg>\n </div>\n </div>\n }\n @if (!(isPolymorphic && showTypes && (multiple || !model || dropdownVisible))) {\n <div>\n <!-- required by css -->\n </div>\n }\n <div class=\"Vlt-composite__wrapper Vlt-input\" style='overflow: hidden;'\n [ngClass]=\"{ 'has-append-button': hasAppendButton && !disabled, 'vgip-disable': disabled }\">\n <label class='wrapper'>\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\" style='top: 0; padding-top: 15px;'>\n <div class=\"Vlt-composite__icon\">\n @if (isSearchable && (!model || multiple)) {\n <svg class='Vlt-grey'>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ multiple ? 'stack' : 'search'}}\" />\n </svg>\n }\n @if (!isSearchable || (model && !multiple)) {\n <svg\n [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\">\n <use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" />\n </svg>\n }\n </div>\n @if (suggestions.length) {\n <div class=\"Vlt-badge Vlt-badge--small Vlt-badge--purple\"\n style='padding: 0px 4px; position: absolute; top: 26px; left: 4px; pointer-events: none; min-width: 14px;'>\n {{suggestions.length}}</div>\n }\n </div>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n <input class='main' [readonly]='!isSearchable || (model && !multiple)' [ngModel]='searchText' #ft='ngModel' (ngModelChange)='onSearchTextChanged($event)' [ngModelOptions]=\"{standalone: true}\" type=\"text\" placeholder=\"{{ placeHolderLabel || ' ' }}\" [ngClass]='{ ext: externalLink }' (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)' [disabled]='disabled' [title]=\"model ? model.label : ''\"/>\n <label class='Vlt-truncate hidden-mobile' style='padding-left: 25px; padding-right: 42px;'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{ (multiple && isPolymorphic) ? '+Add ' : ((model || !isPolymorphic) ? meta.label : ( meta.searchLabel || 'Search')) }}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model) {\n <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;'>({{model.type || model.resourceType || model.length}})</span>\n }\n </label>\n <label class='Vlt-truncate hidden-desktop' style='padding-left: 25px; padding-right: 42px;'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n &nbsp;\n @if (model) {\n <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;'>({{model.type || model.resourceType || model.length}})</span>\n }\n </label>\n </label>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n <!-- <div *ngIf='prevModel && !model' class=\"Vlt-composite__append--icon\" (click)='revert()'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-reply\"/></svg>\n </div>\n </div> -->\n @if (model && !multiple) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='removeSelection($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n @if (externalLink && (model && !multiple)) {\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener' class=\"Vlt-composite__append--icon\" aria-label='Open external'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-open\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <!-- <span *ngIf='hasCreatables'>\n <button type='button' *ngIf='!model || multiple' (click)='openResource()' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n <button type='button' *ngIf='model && !multiple' (click)='openResource(model)' class=\"Vlt-btn Vlt-btn--primary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\"/></svg>\n </button>\n</span> -->\n@if (hasAppendButton && !disabled) {\n <div class=\"Vlt-composite__append\">\n @if (!model || multiple) {\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button'\n (click)='openResource()' class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon\" aria-label='Add new' [disabled]='delegate'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg>\n </button>\n }\n @if (model && !multiple) {\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button'\n (click)='openResource(model)' class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon\" aria-label='Edit' [disabled]='delegate'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-edit\" />\n </svg>\n </button>\n }\n </div>\n}\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched && keyListenerActive))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.pattern) {\n <span>Should match '{{validations.pattern}}' pattern</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n}\n@if (meta.helpText || meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText || meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element--big .Vlt-input input:placeholder-shown:not(:focus)~label.Vlt-truncate{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-right:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.Vlt-form__element--big:hover .items-container,.Vlt-form__element--big:hover .main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:hover ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone,.Vlt-form__element--big.active .items-container,.Vlt-form__element--big.active .main,.Vlt-form__element--big.active .Vlt-composite__append button,.Vlt-form__element--big.active ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error .items-container,.Vlt-form__element--big.Vlt-form__element--error .main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button,.Vlt-form__element--big.Vlt-form__element--error ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:#f25a6b}.Vlt-form__element--big.multiple .Vlt-composite.Vlt-dropdown{margin-top:3px}.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) .Vlt-composite__append button,.Vlt-form__element--big.multiple:hover:not(.Vlt-form__element--error) ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .items-container,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .main,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) .Vlt-composite__append button,.Vlt-form__element--big.multiple.active:not(.Vlt-form__element--error) ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.multiple .items-container{background-color:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color);border-bottom:0;border-top-left-radius:6px;border-top-right-radius:6px}.Vlt-form__element--big.multiple .items-container .badges-container{overflow:auto;padding:6px 4px 3px 6px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge{margin-bottom:3px;margin-left:0;margin-right:3px;overflow:hidden;max-width:100%;position:relative;padding-right:30px}.Vlt-form__element--big.multiple .items-container .badges-container .Vlt-badge.grid{display:grid}.Vlt-form__element--big.multiple:not(.has-value) .items-container{border:0}.Vlt-form__element--big.multiple.has-value .main:not(.Vlt-btn--icon),.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button:not(.Vlt-btn--icon),.Vlt-form__element--big.multiple.has-value ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone:not(.Vlt-btn--icon){border-top:0}.Vlt-form__element--big.multiple.has-value .main,.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button,.Vlt-form__element--big.multiple.has-value ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-top-left-radius:0;border-top-right-radius:0;height:48px}.Vlt-form__element--big.multiple.has-value .Vlt-composite__prepend ::ng-deep .search-scope vgip-meta-field .Vlt-input input.main.standalone{border-top-right-radius:6px}.Vlt-form__element--big.multiple.has-value .Vlt-composite__append button{border-top-left-radius:6px;border-top:0}.Vlt-composite__prepend{z-index:initial}.Vlt-composite__prepend--icon{top:0;padding-top:15px;left:3px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:0}.Vlt-input.has-append-button .Vlt-composite__append.right-actions .Vlt-composite__append--icon:last-child{width:36px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:5px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-composite__append--icon.preview{bottom:initial;padding:0 2px}.Vlt-composite__append button{height:48px;padding-right:16px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-composite__append button:disabled{opacity:.2}.Vlt-input input{padding-left:38px;text-overflow:ellipsis;padding-right:36px}.Vlt-input input.ext{padding-right:72px}.Vlt-composite__wrapper.has-append-button input.main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-input input{background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);font-weight:700}.Vlt-dropdown__panel{max-width:100%;width:100%;min-width:280px}.Vlt-dropdown__panel .Vlt-dropdown__link.smart{font-weight:700;background:var(--vgip-meta-dropdown-bg-color)}.Vlt-dropdown__panel .Vlt-dropdown__link.smart.hidden{display:none}.Vlt-dropdown__panel .Vlt-dropdown__link.bold:after{background-color:#e1e2e6;content:\"\";height:1px;left:0;position:absolute;right:0;bottom:0}.Vlt-dropdown__panel .Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel .Vlt-dropdown__link>div{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.Vlt-dropdown__panel .Vlt-dropdown__link>svg{margin-right:8px}.vgip-meta-field-preview .Vlt-badge{margin:1px 3px 1px 0;overflow:hidden;max-width:100%}:host .search-scope{width:130px}:host .search-scope ::ng-deep .Vlt-form__element.has-value .Vlt-select:after{display:none}:host .search-scope ::ng-deep .Vlt-form__element .right-actions{right:12px}:host .search-scope ::ng-deep .Vlt-form__element label.Vlt-truncate{padding-right:48px}:host .search-scope .mobile-icon{display:none}@media only screen and (max-width:575px){:host .search-scope{width:60px}:host .search-scope:not(.has-value) .mobile-icon{display:block}:host .search-scope.has-value .mobile-label{display:block}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big .Vlt-composite__append{display:none}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big .Vlt-select:after{margin-right:-7px}:host .search-scope ::ng-deep .Vlt-form__element.Vlt-form__element--big label.Vlt-truncate{visibility:hidden}}:host .search-scope ::ng-deep vgip-meta-field .Vlt-input input.main.standalone{padding-right:initial;background:var(--vgip-meta-input-accent-bg-color);border-color:var(--vgip-meta-input-border-color)}:host .search-scope ::ng-deep vgip-meta-field .Vlt-form__element{padding:0}:host .search-scope ::ng-deep vgip-meta-field .Vlt-form__element .Vlt-dropdown__panel{width:initial}\n"] }]
4928
4962
  }], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: MetaMsgService }, { type: MetaContextService }, { type: MetaTrackerService }, { type: i0.ViewContainerRef }] });
@@ -5004,10 +5038,10 @@ class FieldComposite extends FieldAbstract {
5004
5038
  onValueChange() {
5005
5039
  this.onChange.emit(this.value);
5006
5040
  }
5007
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldComposite, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5008
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldComposite, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n @for (field of fields; track field) {\n @if (!field.$hidden && !field.$invisible) {\n <div style='margin: 0;' [ngClass]=\"{ 'Vlt-col': isRow, 'Vlt-col--1of3': isRow && fields.length > 3 }\">\n @if (!meta.$invisible) {\n <vgip-meta-field [ngClass]=\"{ shown: !field.$invisible}\" [index]='index' [scope]='scope' [meta]='field'\n [parent]='value' [integrationCode]='integrationCode' [resourceType]='resourceType' [preview]='preview' (onChange)='onValueChange()'\n theme='inherit'></vgip-meta-field>\n }\n </div>\n }\n }\n</div>\n", styles: ["div>vgip-meta-field{display:none}div>vgip-meta-field.shown{display:initial}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }] }); }
5041
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldComposite, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5042
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldComposite, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n @for (field of fields; track field) {\n @if (!field.$hidden && !field.$invisible) {\n <div style='margin: 0;' [ngClass]=\"{ 'Vlt-col': isRow, 'Vlt-col--1of3': isRow && fields.length > 3 }\">\n @if (!meta.$invisible) {\n <vgip-meta-field [ngClass]=\"{ shown: !field.$invisible}\" [index]='index' [scope]='scope' [meta]='field'\n [parent]='value' [integrationCode]='integrationCode' [resourceType]='resourceType' [preview]='preview' (onChange)='onValueChange()'\n theme='inherit'></vgip-meta-field>\n }\n </div>\n }\n }\n</div>\n", styles: ["div>vgip-meta-field{display:none}div>vgip-meta-field.shown{display:initial}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }] }); }
5009
5043
  }
5010
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldComposite, decorators: [{
5044
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldComposite, decorators: [{
5011
5045
  type: Component,
5012
5046
  args: [{ standalone: false, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n @for (field of fields; track field) {\n @if (!field.$hidden && !field.$invisible) {\n <div style='margin: 0;' [ngClass]=\"{ 'Vlt-col': isRow, 'Vlt-col--1of3': isRow && fields.length > 3 }\">\n @if (!meta.$invisible) {\n <vgip-meta-field [ngClass]=\"{ shown: !field.$invisible}\" [index]='index' [scope]='scope' [meta]='field'\n [parent]='value' [integrationCode]='integrationCode' [resourceType]='resourceType' [preview]='preview' (onChange)='onValueChange()'\n theme='inherit'></vgip-meta-field>\n }\n </div>\n }\n }\n</div>\n", styles: ["div>vgip-meta-field{display:none}div>vgip-meta-field.shown{display:initial}\n"] }]
5013
5047
  }] });
@@ -5055,10 +5089,10 @@ class FieldBoolean extends FieldAbstract {
5055
5089
  onOptionChange() {
5056
5090
  this.onModelChange(this.model);
5057
5091
  }
5058
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldBoolean, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5059
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldBoolean, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{ model ? '\u2714' : '\u2718'}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @if (meta.subtype === 'switch') {\n <div class=\"Vlt-switch\">\n <label style='vertical-align: middle;'>\n <input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n <span class=\"Vlt-switch__slider\"></span>\n <span style='margin-left: 60px; line-height: 30px; white-space: nowrap;'>{{meta.label || meta.name}}</span>\n </label>\n </div>\n }\n @if (meta.subtype !== 'switch') {\n <div class=\"Vlt-checkbox\">\n <label style='cursor: pointer;'>\n <span class=\"Vlt-checkbox__button\">\n <input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{meta.label || meta.name}}\n </label>\n </div>\n }\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-checkbox+.Vlt-form__element__hint{margin-top:4px}.Vlt-checkbox__button input:not(:checked)~.Vlt-checkbox__icon{background-color:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}.Vlt-checkbox__button input:checked~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-border-color)}.Vlt-checkbox__button input:hover:not(:checked)~.Vlt-checkbox__icon,.Vlt-checkbox__button input:focus:not(:checked)~.Vlt-checkbox__icon,.Vlt-checkbox__button input:active:not(:checked)~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-checkbox__button input:hover:checked~.Vlt-checkbox__icon,.Vlt-checkbox__button input:focus:checked~.Vlt-checkbox__icon,.Vlt-checkbox__button input:active:checked~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-accent-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5092
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldBoolean, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5093
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldBoolean, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{ model ? '\u2714' : '\u2718'}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @if (meta.subtype === 'switch') {\n <div class=\"Vlt-switch\">\n <label style='vertical-align: middle;'>\n <input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n <span class=\"Vlt-switch__slider\"></span>\n <span style='margin-left: 60px; line-height: 30px; white-space: nowrap;'>{{meta.label || meta.name}}</span>\n </label>\n </div>\n }\n @if (meta.subtype !== 'switch') {\n <div class=\"Vlt-checkbox\">\n <label style='cursor: pointer;'>\n <span class=\"Vlt-checkbox__button\">\n <input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{meta.label || meta.name}}\n </label>\n </div>\n }\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-checkbox+.Vlt-form__element__hint{margin-top:4px}.Vlt-checkbox__button input:not(:checked)~.Vlt-checkbox__icon{background-color:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}.Vlt-checkbox__button input:checked~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-border-color)}.Vlt-checkbox__button input:hover:not(:checked)~.Vlt-checkbox__icon,.Vlt-checkbox__button input:focus:not(:checked)~.Vlt-checkbox__icon,.Vlt-checkbox__button input:active:not(:checked)~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-checkbox__button input:hover:checked~.Vlt-checkbox__icon,.Vlt-checkbox__button input:focus:checked~.Vlt-checkbox__icon,.Vlt-checkbox__button input:active:checked~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-accent-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5060
5094
  }
5061
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldBoolean, decorators: [{
5095
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldBoolean, decorators: [{
5062
5096
  type: Component,
5063
5097
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{ model ? '\u2714' : '\u2718'}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @if (meta.subtype === 'switch') {\n <div class=\"Vlt-switch\">\n <label style='vertical-align: middle;'>\n <input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n <span class=\"Vlt-switch__slider\"></span>\n <span style='margin-left: 60px; line-height: 30px; white-space: nowrap;'>{{meta.label || meta.name}}</span>\n </label>\n </div>\n }\n @if (meta.subtype !== 'switch') {\n <div class=\"Vlt-checkbox\">\n <label style='cursor: pointer;'>\n <span class=\"Vlt-checkbox__button\">\n <input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{meta.label || meta.name}}\n </label>\n </div>\n }\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-checkbox+.Vlt-form__element__hint{margin-top:4px}.Vlt-checkbox__button input:not(:checked)~.Vlt-checkbox__icon{background-color:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}.Vlt-checkbox__button input:checked~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-border-color)}.Vlt-checkbox__button input:hover:not(:checked)~.Vlt-checkbox__icon,.Vlt-checkbox__button input:focus:not(:checked)~.Vlt-checkbox__icon,.Vlt-checkbox__button input:active:not(:checked)~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-checkbox__button input:hover:checked~.Vlt-checkbox__icon,.Vlt-checkbox__button input:focus:checked~.Vlt-checkbox__icon,.Vlt-checkbox__button input:active:checked~.Vlt-checkbox__icon{border-color:var(--vgip-meta-input-accent-color)}\n"] }]
5064
5098
  }] });
@@ -5141,10 +5175,10 @@ class FieldRadio extends FieldAbstract {
5141
5175
  ev.srcElement.removeEventListener('keydown', this.keydown);
5142
5176
  }
5143
5177
  }
5144
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRadio, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5145
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldRadio, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{ model.label || model }}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @for (option of options; track option) {\n <fieldset class=\"Vlt-radio Vlt-radio--inline\">\n <label style='cursor: pointer;'>\n <span class=\"Vlt-radio__button\">\n <input class='main' (change)='onOptionChange(option)' type=\"radio\" [checked]='option === model' [value]='option' [name]='name' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <span class=\"Vlt-radio__icon\"></span>\n </span>\n <span style='white-space: nowrap;'>{{option.label || option}}</span>\n </label>\n </fieldset>\n }\n @if (f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched)) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-form__element{padding-bottom:4px}.Vlt-form__element__hint,.Vlt-form__element__error{margin-top:4px}.Vlt-radio--inline{margin-bottom:4px}.Vlt-radio .Vlt-radio__icon{border-color:var(--vgip-meta-input-border-color)}.Vlt-radio:hover .Vlt-radio__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:checked~.Vlt-radio__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:checked~.Vlt-radio__icon:after{background:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:focus+.Vlt-radio__icon,.Vlt-radio input:active+.Vlt-radio__icon{background:var(--vgip-meta-input-bg-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5178
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldRadio, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5179
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldRadio, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{ model.label || model }}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @for (option of options; track option) {\n <fieldset class=\"Vlt-radio Vlt-radio--inline\">\n <label style='cursor: pointer;'>\n <span class=\"Vlt-radio__button\">\n <input class='main' (change)='onOptionChange(option)' type=\"radio\" [checked]='option === model' [value]='option' [name]='name' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <span class=\"Vlt-radio__icon\"></span>\n </span>\n <span style='white-space: nowrap;'>{{option.label || option}}</span>\n </label>\n </fieldset>\n }\n @if (f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched)) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-form__element{padding-bottom:4px}.Vlt-form__element__hint,.Vlt-form__element__error{margin-top:4px}.Vlt-radio--inline{margin-bottom:4px}.Vlt-radio .Vlt-radio__icon{border-color:var(--vgip-meta-input-border-color)}.Vlt-radio:hover .Vlt-radio__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:checked~.Vlt-radio__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:checked~.Vlt-radio__icon:after{background:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:focus+.Vlt-radio__icon,.Vlt-radio input:active+.Vlt-radio__icon{background:var(--vgip-meta-input-bg-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5146
5180
  }
5147
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRadio, decorators: [{
5181
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldRadio, decorators: [{
5148
5182
  type: Component,
5149
5183
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{ model.label || model }}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @for (option of options; track option) {\n <fieldset class=\"Vlt-radio Vlt-radio--inline\">\n <label style='cursor: pointer;'>\n <span class=\"Vlt-radio__button\">\n <input class='main' (change)='onOptionChange(option)' type=\"radio\" [checked]='option === model' [value]='option' [name]='name' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <span class=\"Vlt-radio__icon\"></span>\n </span>\n <span style='white-space: nowrap;'>{{option.label || option}}</span>\n </label>\n </fieldset>\n }\n @if (f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched)) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-form__element{padding-bottom:4px}.Vlt-form__element__hint,.Vlt-form__element__error{margin-top:4px}.Vlt-radio--inline{margin-bottom:4px}.Vlt-radio .Vlt-radio__icon{border-color:var(--vgip-meta-input-border-color)}.Vlt-radio:hover .Vlt-radio__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:checked~.Vlt-radio__icon{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:checked~.Vlt-radio__icon:after{background:var(--vgip-meta-input-active-border-color)}.Vlt-radio input:focus+.Vlt-radio__icon,.Vlt-radio input:active+.Vlt-radio__icon{background:var(--vgip-meta-input-bg-color)}\n"] }]
5150
5184
  }] });
@@ -5212,10 +5246,10 @@ class FieldList extends FieldAbstract {
5212
5246
  onChildChange() {
5213
5247
  this.onChange.emit(this.model);
5214
5248
  }
5215
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5216
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldList, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (true) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': (f | metaModel)._parent.submitted && f.invalid }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}} ({{(model || []).length}})\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n @if (meta.hint) {\n <small style='margin-bottom: 4px;' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @if (model) {\n @for (item of model; track item; let i = $index) {\n <div style='display: flex; border-bottom: 1px solid var(--vgip-meta-separator-color);'>\n <vgip-meta-field style='flex: 1;' [index]='i' [scope]='scope' [meta]='cloneList' [parent]='item' [integrationCode]='integrationCode' [resourceType]='meta.resourceType || resourceType' theme='inherit' [preview]='preview' (onChange)='onChildChange()'></vgip-meta-field>\n @if (meta.selectable) {\n <vgip-meta-field [meta]=\"{ name: meta.selectable.name, label: ' ', type: 'radio', options: [ { id: meta.selectable.value, label: meta.selectable.label } ] }\" [parent]='item' [integrationCode]='integrationCode' theme='inherit' style='margin-left: 12px; margin-top: 12px; margin-right: -12px;' (onChange)='onChildChange()'></vgip-meta-field>\n }\n @if (!preview) {\n <div style='padding-left: 12px; margin-top: 3px;'>\n <button type='button' (click)='remove(i)' class=\"Vlt-btn Vlt-btn--link item-remove-button\" [disabled]='model.length === (validations.min || 0)' aria-label='Remove'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-bin\"/></svg>\n </button>\n </div>\n }\n </div>\n }\n }\n @if (!preview && (!validations.max || !model || model.length < validations.max)) {\n <button style='width: 100%;' type='button' (click)='add()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--tertiary Vlt-btn--app Vlt-btn--no-focus item-add-button\" [disabled]='validations.max && model && model.length === validations.max'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{list.label}}\n </button>\n }\n @if ((f | metaModel)._parent.submitted && f.invalid) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n </div>\n}\n", styles: [".Vlt-btn--link:not([disabled]) svg{fill:#e84545}.Vlt-btn--link:not([disabled]):hover svg{fill:#de1c1c}.item-add-button{background-color:var(--vgip-meta-input-action-hover-bg-color);color:var(--vgip-meta-input-color)}.item-add-button svg{fill:var(--vgip-meta-input-color)}.item-add-button:hover{transform:scale(1.02);box-shadow:inset 0 0 0 1px var(--vgip-meta-input-active-border-color)}.item-remove-button{border:0}.item-remove-button:disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5249
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5250
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldList, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (true) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': (f | metaModel)._parent.submitted && f.invalid }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}} ({{(model || []).length}})\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n @if (meta.hint) {\n <small style='margin-bottom: 4px;' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @if (model) {\n @for (item of model; track item; let i = $index) {\n <div style='display: flex; border-bottom: 1px solid var(--vgip-meta-separator-color);'>\n <vgip-meta-field style='flex: 1;' [index]='i' [scope]='scope' [meta]='cloneList' [parent]='item' [integrationCode]='integrationCode' [resourceType]='meta.resourceType || resourceType' theme='inherit' [preview]='preview' (onChange)='onChildChange()'></vgip-meta-field>\n @if (meta.selectable) {\n <vgip-meta-field [meta]=\"{ name: meta.selectable.name, label: ' ', type: 'radio', options: [ { id: meta.selectable.value, label: meta.selectable.label } ] }\" [parent]='item' [integrationCode]='integrationCode' theme='inherit' style='margin-left: 12px; margin-top: 12px; margin-right: -12px;' (onChange)='onChildChange()'></vgip-meta-field>\n }\n @if (!preview) {\n <div style='padding-left: 12px; margin-top: 3px;'>\n <button type='button' (click)='remove(i)' class=\"Vlt-btn Vlt-btn--link item-remove-button\" [disabled]='model.length === (validations.min || 0)' aria-label='Remove'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-bin\"/></svg>\n </button>\n </div>\n }\n </div>\n }\n }\n @if (!preview && (!validations.max || !model || model.length < validations.max)) {\n <button style='width: 100%;' type='button' (click)='add()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--tertiary Vlt-btn--app Vlt-btn--no-focus item-add-button\" [disabled]='validations.max && model && model.length === validations.max'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{list.label}}\n </button>\n }\n @if ((f | metaModel)._parent.submitted && f.invalid) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n </div>\n}\n", styles: [".Vlt-btn--link:not([disabled]) svg{fill:#e84545}.Vlt-btn--link:not([disabled]):hover svg{fill:#de1c1c}.item-add-button{background-color:var(--vgip-meta-input-action-hover-bg-color);color:var(--vgip-meta-input-color)}.item-add-button svg{fill:var(--vgip-meta-input-color)}.item-add-button:hover{transform:scale(1.02);box-shadow:inset 0 0 0 1px var(--vgip-meta-input-active-border-color)}.item-remove-button{border:0}.item-remove-button:disabled{cursor:not-allowed}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave", "onRefTypeChange"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5217
5251
  }
5218
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldList, decorators: [{
5252
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldList, decorators: [{
5219
5253
  type: Component,
5220
5254
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (true) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': (f | metaModel)._parent.submitted && f.invalid }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}} ({{(model || []).length}})\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n @if (meta.hint) {\n <small style='margin-bottom: 4px;' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n @if (model) {\n @for (item of model; track item; let i = $index) {\n <div style='display: flex; border-bottom: 1px solid var(--vgip-meta-separator-color);'>\n <vgip-meta-field style='flex: 1;' [index]='i' [scope]='scope' [meta]='cloneList' [parent]='item' [integrationCode]='integrationCode' [resourceType]='meta.resourceType || resourceType' theme='inherit' [preview]='preview' (onChange)='onChildChange()'></vgip-meta-field>\n @if (meta.selectable) {\n <vgip-meta-field [meta]=\"{ name: meta.selectable.name, label: ' ', type: 'radio', options: [ { id: meta.selectable.value, label: meta.selectable.label } ] }\" [parent]='item' [integrationCode]='integrationCode' theme='inherit' style='margin-left: 12px; margin-top: 12px; margin-right: -12px;' (onChange)='onChildChange()'></vgip-meta-field>\n }\n @if (!preview) {\n <div style='padding-left: 12px; margin-top: 3px;'>\n <button type='button' (click)='remove(i)' class=\"Vlt-btn Vlt-btn--link item-remove-button\" [disabled]='model.length === (validations.min || 0)' aria-label='Remove'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-bin\"/></svg>\n </button>\n </div>\n }\n </div>\n }\n }\n @if (!preview && (!validations.max || !model || model.length < validations.max)) {\n <button style='width: 100%;' type='button' (click)='add()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--tertiary Vlt-btn--app Vlt-btn--no-focus item-add-button\" [disabled]='validations.max && model && model.length === validations.max'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{list.label}}\n </button>\n }\n @if ((f | metaModel)._parent.submitted && f.invalid) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n </div>\n}\n", styles: [".Vlt-btn--link:not([disabled]) svg{fill:#e84545}.Vlt-btn--link:not([disabled]):hover svg{fill:#de1c1c}.item-add-button{background-color:var(--vgip-meta-input-action-hover-bg-color);color:var(--vgip-meta-input-color)}.item-add-button svg{fill:var(--vgip-meta-input-color)}.item-add-button:hover{transform:scale(1.02);box-shadow:inset 0 0 0 1px var(--vgip-meta-input-active-border-color)}.item-remove-button{border:0}.item-remove-button:disabled{cursor:not-allowed}\n"] }]
5221
5255
  }] });
@@ -5292,13 +5326,13 @@ class FieldRichtext extends FieldAbstract {
5292
5326
  textToSpeech() {
5293
5327
  this.focus();
5294
5328
  }
5295
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRichtext, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
5296
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldRichtext, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && parent[meta.name]) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{parent[meta.name]}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched) }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <div class=\"Vlt-textarea\" [ngClass]='{ active: active }'>\n <input type='hidden' class='main model' [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [(ngModel)]='parent[meta.name]' #f='ngModel' [name]='name'/>\n <quill-editor (onFocus)='active = true' (onBlur)='active = false' class='main model' [(ngModel)]='parent[meta.name]' #fq='ngModel' (ngModelChange)=\"onModelChangeLocal($event)\" [ngModelOptions]='{ standalone: true }' placeholder=' ' [modules]=\"quillConfigModules\"></quill-editor>\n </div>\n @if (f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched)) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n </div>\n}\n", styles: [".Vlt-composite__append--icon{bottom:7px;right:16px;padding:3px;width:initial;height:initial;cursor:pointer}.Vlt-composite__append--icon:hover svg{fill:#2c2d30}.Vlt-form__element.Vlt-form__element--error ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow{border-color:#f25a6b}.Vlt-form__element.Vlt-form__element--error ::ng-deep .Vlt-textarea .ql-container.ql-snow{border-color:#f25a6b}.Vlt-form__element ::ng-deep quill-editor{display:initial}.Vlt-form__element ::ng-deep .Vlt-textarea em{font-style:italic}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow{border:1px solid var(--vgip-meta-input-border-color);border-top-left-radius:5px;border-top-right-radius:5px;border-bottom:0;background:var(--vgip-meta-input-accent-bg-color);padding:11px 8px}@media only screen and (max-width:575px){.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-formats{margin-right:8px;zoom:84%}}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label{color:var(--vgip-meta-input-label-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button .ql-stroke,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label .ql-stroke{stroke:var(--vgip-meta-input-label-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button:hover,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label:hover{color:var(--vgip-meta-input-accent-color);stroke:var(--vgip-meta-input-accent-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button:hover .ql-stroke,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label:hover .ql-stroke{stroke:var(--vgip-meta-input-accent-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow{border-bottom-left-radius:5px;border-bottom-right-radius:5px;min-height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor{color:var(--vgip-meta-input-color)!important}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h1,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h2,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h3,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h4,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h5,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h6{color:inherit}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor p{color:inherit}@media(hover:none){.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor{font-size:16px}}.Vlt-form__element ::ng-deep .Vlt-textarea:hover .ql-toolbar,.Vlt-form__element ::ng-deep .Vlt-textarea:hover .ql-container,.Vlt-form__element ::ng-deep .Vlt-textarea:focus .ql-toolbar,.Vlt-form__element ::ng-deep .Vlt-textarea:focus .ql-container,.Vlt-form__element ::ng-deep .Vlt-textarea.active .ql-toolbar,.Vlt-form__element ::ng-deep .Vlt-textarea.active .ql-container{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-editor:focus{border-color:var(--vgip-meta-input-active-border-color)!important}\n", "@charset \"UTF-8\";:host ::ng-deep .ql-bubble.ql-toolbar:after,:host ::ng-deep .ql-bubble .ql-toolbar:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-bubble.ql-toolbar button,:host ::ng-deep .ql-bubble .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}:host ::ng-deep .ql-bubble.ql-toolbar button svg,:host ::ng-deep .ql-bubble .ql-toolbar button svg{float:left;height:100%}:host ::ng-deep .ql-bubble.ql-toolbar button:active:hover,:host ::ng-deep .ql-bubble .ql-toolbar button:active:hover{outline:none}:host ::ng-deep .ql-bubble.ql-toolbar input.ql-image[type=file],:host ::ng-deep .ql-bubble .ql-toolbar input.ql-image[type=file]{display:none}:host ::ng-deep .ql-bubble.ql-toolbar button:hover,:host ::ng-deep .ql-bubble .ql-toolbar button:hover,:host ::ng-deep .ql-bubble.ql-toolbar button:focus,:host ::ng-deep .ql-bubble .ql-toolbar button:focus,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected{color:#fff}:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#fff}:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#fff}@media(pointer:coarse){:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active),:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active){color:#ccc}:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#ccc}:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#ccc}}:host ::ng-deep .ql-bubble{box-sizing:border-box}:host ::ng-deep .ql-bubble *{box-sizing:border-box}:host ::ng-deep .ql-bubble .ql-hidden{display:none}:host ::ng-deep .ql-bubble .ql-out-bottom,:host ::ng-deep .ql-bubble .ql-out-top{visibility:hidden}:host ::ng-deep .ql-bubble .ql-tooltip{position:absolute;transform:translateY(10px)}:host ::ng-deep .ql-bubble .ql-tooltip a{cursor:pointer;text-decoration:none}:host ::ng-deep .ql-bubble .ql-tooltip.ql-flip{transform:translateY(-10px)}:host ::ng-deep .ql-bubble .ql-formats{display:inline-block;vertical-align:middle}:host ::ng-deep .ql-bubble .ql-formats:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-bubble .ql-stroke{fill:none;stroke:#ccc;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}:host ::ng-deep .ql-bubble .ql-stroke-miter{fill:none;stroke:#ccc;stroke-miterlimit:10;stroke-width:2}:host ::ng-deep .ql-bubble .ql-fill,:host ::ng-deep .ql-bubble .ql-stroke.ql-fill{fill:#ccc}:host ::ng-deep .ql-bubble .ql-empty{fill:none}:host ::ng-deep .ql-bubble .ql-even{fill-rule:evenodd}:host ::ng-deep .ql-bubble .ql-thin,:host ::ng-deep .ql-bubble .ql-stroke.ql-thin{stroke-width:1}:host ::ng-deep .ql-bubble .ql-transparent{opacity:.4}:host ::ng-deep .ql-bubble .ql-direction svg:last-child{display:none}:host ::ng-deep .ql-bubble .ql-direction.ql-active svg:last-child{display:inline}:host ::ng-deep .ql-bubble .ql-direction.ql-active svg:first-child{display:none}:host ::ng-deep .ql-bubble .ql-editor h1{font-size:2em}:host ::ng-deep .ql-bubble .ql-editor h2{font-size:1.5em}:host ::ng-deep .ql-bubble .ql-editor h3{font-size:1.17em}:host ::ng-deep .ql-bubble .ql-editor h4{font-size:1em}:host ::ng-deep .ql-bubble .ql-editor h5{font-size:.83em}:host ::ng-deep .ql-bubble .ql-editor h6{font-size:.67em}:host ::ng-deep .ql-bubble .ql-editor a{text-decoration:underline}:host ::ng-deep .ql-bubble .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}:host ::ng-deep .ql-bubble .ql-editor code,:host ::ng-deep .ql-bubble .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}:host ::ng-deep .ql-bubble .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}:host ::ng-deep .ql-bubble .ql-editor code{font-size:85%;padding:2px 4px}:host ::ng-deep .ql-bubble .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}:host ::ng-deep .ql-bubble .ql-editor img{max-width:100%}:host ::ng-deep .ql-bubble .ql-picker{color:#ccc;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}:host ::ng-deep .ql-bubble .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}:host ::ng-deep .ql-bubble .ql-picker-label:before{display:inline-block;line-height:22px}:host ::ng-deep .ql-bubble .ql-picker-options{background-color:#444;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}:host ::ng-deep .ql-bubble .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-label{color:#777;z-index:2}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#777}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#777}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}:host ::ng-deep .ql-bubble .ql-color-picker,:host ::ng-deep .ql-bubble .ql-icon-picker{width:28px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-label,:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-label{padding:2px 4px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-label svg,:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-label svg{right:4px}:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-options{padding:4px 0}:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}:host ::ng-deep .ql-bubble .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=\"\"]):before{content:attr(data-label)}:host ::ng-deep .ql-bubble .ql-picker.ql-header{width:98px}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{content:\"Heading 1\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{content:\"Heading 2\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{content:\"Heading 3\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{content:\"Heading 4\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{content:\"Heading 5\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{content:\"Heading 6\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{font-size:2em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{font-size:1.5em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{font-size:1.17em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{font-size:1em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{font-size:.83em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{font-size:.67em}:host ::ng-deep .ql-bubble .ql-picker.ql-font{width:108px}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label:before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item:before{content:\"Sans Serif\"}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{content:\"Serif\"}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{content:\"Monospace\"}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{font-family:Georgia,Times New Roman,serif}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{font-family:Monaco,Courier New,monospace}:host ::ng-deep .ql-bubble .ql-picker.ql-size{width:98px}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=small]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]:before{content:\"Small\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=large]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]:before{content:\"Large\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{content:\"Huge\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]:before{font-size:10px}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]:before{font-size:18px}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{font-size:32px}:host ::ng-deep .ql-bubble .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}:host ::ng-deep .ql-bubble .ql-color-picker.ql-color .ql-picker-item{background-color:#000}:host ::ng-deep .ql-bubble .ql-toolbar .ql-formats{margin:8px 12px 8px 0}:host ::ng-deep .ql-bubble .ql-toolbar .ql-formats:first-child{margin-left:12px}:host ::ng-deep .ql-bubble .ql-color-picker svg{margin:1px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-item.ql-selected,:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-item:hover{border-color:#fff}:host ::ng-deep .ql-bubble .ql-tooltip{background-color:#444;border-radius:25px;color:#fff}:host ::ng-deep .ql-bubble .ql-tooltip-arrow{border-left:6px solid transparent;border-right:6px solid transparent;content:\" \";display:block;left:50%;margin-left:-6px;position:absolute}:host ::ng-deep .ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow{border-bottom:6px solid #444;top:-6px}:host ::ng-deep .ql-bubble .ql-tooltip.ql-flip .ql-tooltip-arrow{border-top:6px solid #444;bottom:-6px}:host ::ng-deep .ql-bubble .ql-tooltip.ql-editing .ql-tooltip-editor{display:block}:host ::ng-deep .ql-bubble .ql-tooltip.ql-editing .ql-formats{visibility:hidden}:host ::ng-deep .ql-bubble .ql-tooltip-editor{display:none}:host ::ng-deep .ql-bubble .ql-tooltip-editor input[type=text]{background:transparent;border:none;color:#fff;font-size:13px;height:100%;outline:none;padding:10px 20px;position:absolute;width:100%}:host ::ng-deep .ql-bubble .ql-tooltip-editor a{top:10px;position:absolute;right:20px}:host ::ng-deep .ql-bubble .ql-tooltip-editor a:before{color:#ccc;content:\"\\d7\";font-size:16px;font-weight:700}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close){position:relative;white-space:nowrap}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):before{background-color:#444;border-radius:15px;top:-5px;font-size:12px;color:#fff;content:attr(href);font-weight:400;overflow:hidden;padding:5px 15px;text-decoration:none;z-index:1}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):after{border-top:6px solid #444;border-left:6px solid transparent;border-right:6px solid transparent;top:0;content:\" \";height:0;width:0}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):before,:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):after{left:0;margin-left:50%;position:absolute;transform:translate(-50%,-100%);transition:visibility 0s ease .2s;visibility:hidden}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):hover:before,:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):hover:after{visibility:visible}:host ::ng-deep .ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}:host ::ng-deep .ql-container.ql-disabled .ql-tooltip{visibility:hidden}:host ::ng-deep .ql-container:not(.ql-disabled) li[data-list=checked]>.ql-ui,:host ::ng-deep .ql-container:not(.ql-disabled) li[data-list=unchecked]>.ql-ui{cursor:pointer}:host ::ng-deep .ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}:host ::ng-deep .ql-clipboard p{margin:0;padding:0}:host ::ng-deep .ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}:host ::ng-deep .ql-editor>*{cursor:text}:host ::ng-deep .ql-editor p,:host ::ng-deep .ql-editor ol,:host ::ng-deep .ql-editor pre,:host ::ng-deep .ql-editor blockquote,:host ::ng-deep .ql-editor h1,:host ::ng-deep .ql-editor h2,:host ::ng-deep .ql-editor h3,:host ::ng-deep .ql-editor h4,:host ::ng-deep .ql-editor h5,:host ::ng-deep .ql-editor h6{margin:0;padding:0}@supports (counter-set: none){:host ::ng-deep .ql-editor p,:host ::ng-deep .ql-editor h1,:host ::ng-deep .ql-editor h2,:host ::ng-deep .ql-editor h3,:host ::ng-deep .ql-editor h4,:host ::ng-deep .ql-editor h5,:host ::ng-deep .ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor p,:host ::ng-deep .ql-editor h1,:host ::ng-deep .ql-editor h2,:host ::ng-deep .ql-editor h3,:host ::ng-deep .ql-editor h4,:host ::ng-deep .ql-editor h5,:host ::ng-deep .ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor table{border-collapse:collapse}:host ::ng-deep .ql-editor td{border:1px solid #000;padding:2px 5px}:host ::ng-deep .ql-editor ol{padding-left:1.5em}:host ::ng-deep .ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}:host ::ng-deep .ql-editor li>.ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}:host ::ng-deep .ql-editor li[data-list=checked]>.ql-ui,:host ::ng-deep .ql-editor li[data-list=unchecked]>.ql-ui{color:#777}:host ::ng-deep .ql-editor li[data-list=bullet]>.ql-ui:before{content:\"\\2022\"}:host ::ng-deep .ql-editor li[data-list=checked]>.ql-ui:before{content:\"\\2611\"}:host ::ng-deep .ql-editor li[data-list=unchecked]>.ql-ui:before{content:\"\\2610\"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered]{counter-increment:list-0}:host ::ng-deep .ql-editor li[data-list=ordered]>.ql-ui:before{content:counter(list-0,decimal) \". \"}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-1>.ql-ui:before{content:counter(list-1,lower-alpha) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-2>.ql-ui:before{content:counter(list-2,lower-roman) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-3>.ql-ui:before{content:counter(list-3,decimal) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-4>.ql-ui:before{content:counter(list-4,lower-alpha) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-5>.ql-ui:before{content:counter(list-5,lower-roman) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-6>.ql-ui:before{content:counter(list-6,decimal) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-7>.ql-ui:before{content:counter(list-7,lower-alpha) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-8>.ql-ui:before{content:counter(list-8,lower-roman) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-8{counter-set:list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-9>.ql-ui:before{content:counter(list-9,decimal) \". \"}:host ::ng-deep .ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}:host ::ng-deep .ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}:host ::ng-deep .ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}:host ::ng-deep .ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}:host ::ng-deep .ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}:host ::ng-deep .ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}:host ::ng-deep .ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}:host ::ng-deep .ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}:host ::ng-deep .ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}:host ::ng-deep .ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}:host ::ng-deep .ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}:host ::ng-deep .ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}:host ::ng-deep .ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}:host ::ng-deep .ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}:host ::ng-deep .ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}:host ::ng-deep .ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}:host ::ng-deep .ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}:host ::ng-deep .ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}:host ::ng-deep .ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}:host ::ng-deep .ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}:host ::ng-deep .ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}:host ::ng-deep .ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}:host ::ng-deep .ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}:host ::ng-deep .ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}:host ::ng-deep .ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}:host ::ng-deep .ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}:host ::ng-deep .ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}:host ::ng-deep .ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}:host ::ng-deep .ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}:host ::ng-deep .ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}:host ::ng-deep .ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}:host ::ng-deep .ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}:host ::ng-deep .ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}:host ::ng-deep .ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}:host ::ng-deep .ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}:host ::ng-deep .ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}:host ::ng-deep .ql-editor li.ql-direction-rtl{padding-right:1.5em}:host ::ng-deep .ql-editor li.ql-direction-rtl>.ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}:host ::ng-deep .ql-editor table{table-layout:fixed;width:100%}:host ::ng-deep .ql-editor table td{outline:none}:host ::ng-deep .ql-editor .ql-code-block-container{font-family:monospace}:host ::ng-deep .ql-editor .ql-video{display:block;max-width:100%}:host ::ng-deep .ql-editor .ql-video.ql-align-center{margin:0 auto}:host ::ng-deep .ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}:host ::ng-deep .ql-editor .ql-bg-black{background-color:#000}:host ::ng-deep .ql-editor .ql-bg-red{background-color:#e60000}:host ::ng-deep .ql-editor .ql-bg-orange{background-color:#f90}:host ::ng-deep .ql-editor .ql-bg-yellow{background-color:#ff0}:host ::ng-deep .ql-editor .ql-bg-green{background-color:#008a00}:host ::ng-deep .ql-editor .ql-bg-blue{background-color:#06c}:host ::ng-deep .ql-editor .ql-bg-purple{background-color:#93f}:host ::ng-deep .ql-editor .ql-color-white{color:#fff}:host ::ng-deep .ql-editor .ql-color-red{color:#e60000}:host ::ng-deep .ql-editor .ql-color-orange{color:#f90}:host ::ng-deep .ql-editor .ql-color-yellow{color:#ff0}:host ::ng-deep .ql-editor .ql-color-green{color:#008a00}:host ::ng-deep .ql-editor .ql-color-blue{color:#06c}:host ::ng-deep .ql-editor .ql-color-purple{color:#93f}:host ::ng-deep .ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}:host ::ng-deep .ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}:host ::ng-deep .ql-editor .ql-size-small{font-size:.75em}:host ::ng-deep .ql-editor .ql-size-large{font-size:1.5em}:host ::ng-deep .ql-editor .ql-size-huge{font-size:2.5em}:host ::ng-deep .ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}:host ::ng-deep .ql-editor .ql-align-center{text-align:center}:host ::ng-deep .ql-editor .ql-align-justify{text-align:justify}:host ::ng-deep .ql-editor .ql-align-right{text-align:right}:host ::ng-deep .ql-editor .ql-ui{position:absolute}:host ::ng-deep .ql-editor.ql-blank:before{color:#0009;content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}:host ::ng-deep .ql-snow.ql-toolbar:after,:host ::ng-deep .ql-snow .ql-toolbar:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-snow.ql-toolbar button,:host ::ng-deep .ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}:host ::ng-deep .ql-snow.ql-toolbar button svg,:host ::ng-deep .ql-snow .ql-toolbar button svg{float:left;height:100%}:host ::ng-deep .ql-snow.ql-toolbar button:active:hover,:host ::ng-deep .ql-snow .ql-toolbar button:active:hover{outline:none}:host ::ng-deep .ql-snow.ql-toolbar input.ql-image[type=file],:host ::ng-deep .ql-snow .ql-toolbar input.ql-image[type=file]{display:none}:host ::ng-deep .ql-snow.ql-toolbar button:hover,:host ::ng-deep .ql-snow .ql-toolbar button:hover,:host ::ng-deep .ql-snow.ql-toolbar button:focus,:host ::ng-deep .ql-snow .ql-toolbar button:focus,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media(pointer:coarse){:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active),:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}:host ::ng-deep .ql-snow{box-sizing:border-box}:host ::ng-deep .ql-snow *{box-sizing:border-box}:host ::ng-deep .ql-snow .ql-hidden{display:none}:host ::ng-deep .ql-snow .ql-out-bottom,:host ::ng-deep .ql-snow .ql-out-top{visibility:hidden}:host ::ng-deep .ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}:host ::ng-deep .ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}:host ::ng-deep .ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}:host ::ng-deep .ql-snow .ql-formats{display:inline-block;vertical-align:middle}:host ::ng-deep .ql-snow .ql-formats:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}:host ::ng-deep .ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}:host ::ng-deep .ql-snow .ql-fill,:host ::ng-deep .ql-snow .ql-stroke.ql-fill{fill:#444}:host ::ng-deep .ql-snow .ql-empty{fill:none}:host ::ng-deep .ql-snow .ql-even{fill-rule:evenodd}:host ::ng-deep .ql-snow .ql-thin,:host ::ng-deep .ql-snow .ql-stroke.ql-thin{stroke-width:1}:host ::ng-deep .ql-snow .ql-transparent{opacity:.4}:host ::ng-deep .ql-snow .ql-direction svg:last-child{display:none}:host ::ng-deep .ql-snow .ql-direction.ql-active svg:last-child{display:inline}:host ::ng-deep .ql-snow .ql-direction.ql-active svg:first-child{display:none}:host ::ng-deep .ql-snow .ql-editor h1{font-size:2em}:host ::ng-deep .ql-snow .ql-editor h2{font-size:1.5em}:host ::ng-deep .ql-snow .ql-editor h3{font-size:1.17em}:host ::ng-deep .ql-snow .ql-editor h4{font-size:1em}:host ::ng-deep .ql-snow .ql-editor h5{font-size:.83em}:host ::ng-deep .ql-snow .ql-editor h6{font-size:.67em}:host ::ng-deep .ql-snow .ql-editor a{text-decoration:underline}:host ::ng-deep .ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}:host ::ng-deep .ql-snow .ql-editor code,:host ::ng-deep .ql-snow .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}:host ::ng-deep .ql-snow .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}:host ::ng-deep .ql-snow .ql-editor code{font-size:85%;padding:2px 4px}:host ::ng-deep .ql-snow .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}:host ::ng-deep .ql-snow .ql-editor img{max-width:100%}:host ::ng-deep .ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}:host ::ng-deep .ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}:host ::ng-deep .ql-snow .ql-picker-label:before{display:inline-block;line-height:22px}:host ::ng-deep .ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}:host ::ng-deep .ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}:host ::ng-deep .ql-snow .ql-color-picker,:host ::ng-deep .ql-snow .ql-icon-picker{width:28px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-label,:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-label svg,:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}:host ::ng-deep .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=\"\"]):before{content:attr(data-label)}:host ::ng-deep .ql-snow .ql-picker.ql-header{width:98px}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{content:\"Heading 1\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{content:\"Heading 2\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{content:\"Heading 3\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{content:\"Heading 4\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{content:\"Heading 5\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{content:\"Heading 6\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{font-size:2em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{font-size:1.5em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{font-size:1.17em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{font-size:1em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{font-size:.83em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{font-size:.67em}:host ::ng-deep .ql-snow .ql-picker.ql-font{width:108px}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label:before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item:before{content:\"Sans Serif\"}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{content:\"Serif\"}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{content:\"Monospace\"}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{font-family:Georgia,Times New Roman,serif}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{font-family:Monaco,Courier New,monospace}:host ::ng-deep .ql-snow .ql-picker.ql-size{width:98px}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{content:\"Small\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{content:\"Large\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{content:\"Huge\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{font-size:10px}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{font-size:18px}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{font-size:32px}:host ::ng-deep .ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}:host ::ng-deep .ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}:host ::ng-deep .ql-code-block-container{position:relative}:host ::ng-deep .ql-code-block-container .ql-ui{right:5px;top:5px}:host ::ng-deep .ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;padding:8px}:host ::ng-deep .ql-toolbar.ql-snow .ql-formats{margin-right:15px}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:#0003 0 2px 8px}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}:host ::ng-deep .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,:host ::ng-deep .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}:host ::ng-deep .ql-toolbar.ql-snow+.ql-container.ql-snow{border-top:0}:host ::ng-deep .ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}:host ::ng-deep .ql-snow .ql-tooltip:before{content:\"Visit URL:\";line-height:26px;margin-right:8px}:host ::ng-deep .ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}:host ::ng-deep .ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}:host ::ng-deep .ql-snow .ql-tooltip a.ql-action:after{border-right:1px solid #ccc;content:\"Edit\";margin-left:16px;padding-right:8px}:host ::ng-deep .ql-snow .ql-tooltip a.ql-remove:before{content:\"Remove\";margin-left:8px}:host ::ng-deep .ql-snow .ql-tooltip a{line-height:26px}:host ::ng-deep .ql-snow .ql-tooltip.ql-editing a.ql-preview,:host ::ng-deep .ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}:host ::ng-deep .ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}:host ::ng-deep .ql-snow .ql-tooltip.ql-editing a.ql-action:after{border-right:0;content:\"Save\";padding-right:0}:host ::ng-deep .ql-snow .ql-tooltip[data-mode=link]:before{content:\"Enter link:\"}:host ::ng-deep .ql-snow .ql-tooltip[data-mode=formula]:before{content:\"Enter formula:\"}:host ::ng-deep .ql-snow .ql-tooltip[data-mode=video]:before{content:\"Enter video:\"}:host ::ng-deep .ql-snow a{color:#06c}:host ::ng-deep .ql-container.ql-snow{border:1px solid #ccc}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [
5329
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldRichtext, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
5330
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldRichtext, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && parent[meta.name]) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{parent[meta.name]}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched) }\">\n <label class=\"Vlt-label\"> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <div class=\"Vlt-textarea\" [ngClass]='{ active: active }'>\n <input type='hidden' class='main model' [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [(ngModel)]='parent[meta.name]' #f='ngModel' [name]='name'/>\n <quill-editor (onFocus)='active = true' (onBlur)='active = false' class='main model' [(ngModel)]='parent[meta.name]' #fq='ngModel' (ngModelChange)=\"onModelChangeLocal($event)\" [ngModelOptions]='{ standalone: true }' placeholder=' ' [modules]=\"quillConfigModules\"></quill-editor>\n </div>\n @if (f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched)) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required</span>\n }\n @if (f.errors.maxlength) {\n <span>Length can not exceed {{validations.maxlength}} characters</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.helpText) {\n <small class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n }\n </div>\n}\n", styles: [".Vlt-composite__append--icon{bottom:7px;right:16px;padding:3px;width:initial;height:initial;cursor:pointer}.Vlt-composite__append--icon:hover svg{fill:#2c2d30}.Vlt-form__element.Vlt-form__element--error ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow{border-color:#f25a6b}.Vlt-form__element.Vlt-form__element--error ::ng-deep .Vlt-textarea .ql-container.ql-snow{border-color:#f25a6b}.Vlt-form__element ::ng-deep quill-editor{display:initial}.Vlt-form__element ::ng-deep .Vlt-textarea em{font-style:italic}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow{border:1px solid var(--vgip-meta-input-border-color);border-top-left-radius:5px;border-top-right-radius:5px;border-bottom:0;background:var(--vgip-meta-input-accent-bg-color);padding:11px 8px}@media only screen and (max-width:575px){.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-formats{margin-right:8px;zoom:84%}}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label{color:var(--vgip-meta-input-label-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button .ql-stroke,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label .ql-stroke{stroke:var(--vgip-meta-input-label-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button:hover,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label:hover{color:var(--vgip-meta-input-accent-color);stroke:var(--vgip-meta-input-accent-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow button:hover .ql-stroke,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-toolbar.ql-snow .ql-picker-label:hover .ql-stroke{stroke:var(--vgip-meta-input-accent-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow{border-bottom-left-radius:5px;border-bottom-right-radius:5px;min-height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor{color:var(--vgip-meta-input-color)!important}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h1,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h2,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h3,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h4,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h5,.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor h6{color:inherit}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor p{color:inherit}@media(hover:none){.Vlt-form__element ::ng-deep .Vlt-textarea .ql-container.ql-snow .ql-editor{font-size:16px}}.Vlt-form__element ::ng-deep .Vlt-textarea:hover .ql-toolbar,.Vlt-form__element ::ng-deep .Vlt-textarea:hover .ql-container,.Vlt-form__element ::ng-deep .Vlt-textarea:focus .ql-toolbar,.Vlt-form__element ::ng-deep .Vlt-textarea:focus .ql-container,.Vlt-form__element ::ng-deep .Vlt-textarea.active .ql-toolbar,.Vlt-form__element ::ng-deep .Vlt-textarea.active .ql-container{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element ::ng-deep .Vlt-textarea .ql-editor:focus{border-color:var(--vgip-meta-input-active-border-color)!important}\n", "@charset \"UTF-8\";:host ::ng-deep .ql-bubble.ql-toolbar:after,:host ::ng-deep .ql-bubble .ql-toolbar:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-bubble.ql-toolbar button,:host ::ng-deep .ql-bubble .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}:host ::ng-deep .ql-bubble.ql-toolbar button svg,:host ::ng-deep .ql-bubble .ql-toolbar button svg{float:left;height:100%}:host ::ng-deep .ql-bubble.ql-toolbar button:active:hover,:host ::ng-deep .ql-bubble .ql-toolbar button:active:hover{outline:none}:host ::ng-deep .ql-bubble.ql-toolbar input.ql-image[type=file],:host ::ng-deep .ql-bubble .ql-toolbar input.ql-image[type=file]{display:none}:host ::ng-deep .ql-bubble.ql-toolbar button:hover,:host ::ng-deep .ql-bubble .ql-toolbar button:hover,:host ::ng-deep .ql-bubble.ql-toolbar button:focus,:host ::ng-deep .ql-bubble .ql-toolbar button:focus,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected{color:#fff}:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#fff}:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-bubble.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#fff}@media(pointer:coarse){:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active),:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active){color:#ccc}:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#ccc}:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-bubble.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,:host ::ng-deep .ql-bubble .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#ccc}}:host ::ng-deep .ql-bubble{box-sizing:border-box}:host ::ng-deep .ql-bubble *{box-sizing:border-box}:host ::ng-deep .ql-bubble .ql-hidden{display:none}:host ::ng-deep .ql-bubble .ql-out-bottom,:host ::ng-deep .ql-bubble .ql-out-top{visibility:hidden}:host ::ng-deep .ql-bubble .ql-tooltip{position:absolute;transform:translateY(10px)}:host ::ng-deep .ql-bubble .ql-tooltip a{cursor:pointer;text-decoration:none}:host ::ng-deep .ql-bubble .ql-tooltip.ql-flip{transform:translateY(-10px)}:host ::ng-deep .ql-bubble .ql-formats{display:inline-block;vertical-align:middle}:host ::ng-deep .ql-bubble .ql-formats:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-bubble .ql-stroke{fill:none;stroke:#ccc;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}:host ::ng-deep .ql-bubble .ql-stroke-miter{fill:none;stroke:#ccc;stroke-miterlimit:10;stroke-width:2}:host ::ng-deep .ql-bubble .ql-fill,:host ::ng-deep .ql-bubble .ql-stroke.ql-fill{fill:#ccc}:host ::ng-deep .ql-bubble .ql-empty{fill:none}:host ::ng-deep .ql-bubble .ql-even{fill-rule:evenodd}:host ::ng-deep .ql-bubble .ql-thin,:host ::ng-deep .ql-bubble .ql-stroke.ql-thin{stroke-width:1}:host ::ng-deep .ql-bubble .ql-transparent{opacity:.4}:host ::ng-deep .ql-bubble .ql-direction svg:last-child{display:none}:host ::ng-deep .ql-bubble .ql-direction.ql-active svg:last-child{display:inline}:host ::ng-deep .ql-bubble .ql-direction.ql-active svg:first-child{display:none}:host ::ng-deep .ql-bubble .ql-editor h1{font-size:2em}:host ::ng-deep .ql-bubble .ql-editor h2{font-size:1.5em}:host ::ng-deep .ql-bubble .ql-editor h3{font-size:1.17em}:host ::ng-deep .ql-bubble .ql-editor h4{font-size:1em}:host ::ng-deep .ql-bubble .ql-editor h5{font-size:.83em}:host ::ng-deep .ql-bubble .ql-editor h6{font-size:.67em}:host ::ng-deep .ql-bubble .ql-editor a{text-decoration:underline}:host ::ng-deep .ql-bubble .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}:host ::ng-deep .ql-bubble .ql-editor code,:host ::ng-deep .ql-bubble .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}:host ::ng-deep .ql-bubble .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}:host ::ng-deep .ql-bubble .ql-editor code{font-size:85%;padding:2px 4px}:host ::ng-deep .ql-bubble .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}:host ::ng-deep .ql-bubble .ql-editor img{max-width:100%}:host ::ng-deep .ql-bubble .ql-picker{color:#ccc;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}:host ::ng-deep .ql-bubble .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}:host ::ng-deep .ql-bubble .ql-picker-label:before{display:inline-block;line-height:22px}:host ::ng-deep .ql-bubble .ql-picker-options{background-color:#444;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}:host ::ng-deep .ql-bubble .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-label{color:#777;z-index:2}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#777}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#777}:host ::ng-deep .ql-bubble .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}:host ::ng-deep .ql-bubble .ql-color-picker,:host ::ng-deep .ql-bubble .ql-icon-picker{width:28px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-label,:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-label{padding:2px 4px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-label svg,:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-label svg{right:4px}:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-options{padding:4px 0}:host ::ng-deep .ql-bubble .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}:host ::ng-deep .ql-bubble .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=\"\"]):before{content:attr(data-label)}:host ::ng-deep .ql-bubble .ql-picker.ql-header{width:98px}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{content:\"Heading 1\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{content:\"Heading 2\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{content:\"Heading 3\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{content:\"Heading 4\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{content:\"Heading 5\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{content:\"Heading 6\"}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{font-size:2em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{font-size:1.5em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{font-size:1.17em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{font-size:1em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{font-size:.83em}:host ::ng-deep .ql-bubble .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{font-size:.67em}:host ::ng-deep .ql-bubble .ql-picker.ql-font{width:108px}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label:before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item:before{content:\"Sans Serif\"}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{content:\"Serif\"}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{content:\"Monospace\"}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{font-family:Georgia,Times New Roman,serif}:host ::ng-deep .ql-bubble .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{font-family:Monaco,Courier New,monospace}:host ::ng-deep .ql-bubble .ql-picker.ql-size{width:98px}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=small]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]:before{content:\"Small\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=large]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]:before{content:\"Large\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{content:\"Huge\"}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=small]:before{font-size:10px}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=large]:before{font-size:18px}:host ::ng-deep .ql-bubble .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{font-size:32px}:host ::ng-deep .ql-bubble .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}:host ::ng-deep .ql-bubble .ql-color-picker.ql-color .ql-picker-item{background-color:#000}:host ::ng-deep .ql-bubble .ql-toolbar .ql-formats{margin:8px 12px 8px 0}:host ::ng-deep .ql-bubble .ql-toolbar .ql-formats:first-child{margin-left:12px}:host ::ng-deep .ql-bubble .ql-color-picker svg{margin:1px}:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-item.ql-selected,:host ::ng-deep .ql-bubble .ql-color-picker .ql-picker-item:hover{border-color:#fff}:host ::ng-deep .ql-bubble .ql-tooltip{background-color:#444;border-radius:25px;color:#fff}:host ::ng-deep .ql-bubble .ql-tooltip-arrow{border-left:6px solid transparent;border-right:6px solid transparent;content:\" \";display:block;left:50%;margin-left:-6px;position:absolute}:host ::ng-deep .ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow{border-bottom:6px solid #444;top:-6px}:host ::ng-deep .ql-bubble .ql-tooltip.ql-flip .ql-tooltip-arrow{border-top:6px solid #444;bottom:-6px}:host ::ng-deep .ql-bubble .ql-tooltip.ql-editing .ql-tooltip-editor{display:block}:host ::ng-deep .ql-bubble .ql-tooltip.ql-editing .ql-formats{visibility:hidden}:host ::ng-deep .ql-bubble .ql-tooltip-editor{display:none}:host ::ng-deep .ql-bubble .ql-tooltip-editor input[type=text]{background:transparent;border:none;color:#fff;font-size:13px;height:100%;outline:none;padding:10px 20px;position:absolute;width:100%}:host ::ng-deep .ql-bubble .ql-tooltip-editor a{top:10px;position:absolute;right:20px}:host ::ng-deep .ql-bubble .ql-tooltip-editor a:before{color:#ccc;content:\"\\d7\";font-size:16px;font-weight:700}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close){position:relative;white-space:nowrap}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):before{background-color:#444;border-radius:15px;top:-5px;font-size:12px;color:#fff;content:attr(href);font-weight:400;overflow:hidden;padding:5px 15px;text-decoration:none;z-index:1}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):after{border-top:6px solid #444;border-left:6px solid transparent;border-right:6px solid transparent;top:0;content:\" \";height:0;width:0}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):before,:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):after{left:0;margin-left:50%;position:absolute;transform:translate(-50%,-100%);transition:visibility 0s ease .2s;visibility:hidden}:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):hover:before,:host ::ng-deep .ql-container.ql-bubble:not(.ql-disabled) a:not(.ql-close):hover:after{visibility:visible}:host ::ng-deep .ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}:host ::ng-deep .ql-container.ql-disabled .ql-tooltip{visibility:hidden}:host ::ng-deep .ql-container:not(.ql-disabled) li[data-list=checked]>.ql-ui,:host ::ng-deep .ql-container:not(.ql-disabled) li[data-list=unchecked]>.ql-ui{cursor:pointer}:host ::ng-deep .ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}:host ::ng-deep .ql-clipboard p{margin:0;padding:0}:host ::ng-deep .ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}:host ::ng-deep .ql-editor>*{cursor:text}:host ::ng-deep .ql-editor p,:host ::ng-deep .ql-editor ol,:host ::ng-deep .ql-editor pre,:host ::ng-deep .ql-editor blockquote,:host ::ng-deep .ql-editor h1,:host ::ng-deep .ql-editor h2,:host ::ng-deep .ql-editor h3,:host ::ng-deep .ql-editor h4,:host ::ng-deep .ql-editor h5,:host ::ng-deep .ql-editor h6{margin:0;padding:0}@supports (counter-set: none){:host ::ng-deep .ql-editor p,:host ::ng-deep .ql-editor h1,:host ::ng-deep .ql-editor h2,:host ::ng-deep .ql-editor h3,:host ::ng-deep .ql-editor h4,:host ::ng-deep .ql-editor h5,:host ::ng-deep .ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor p,:host ::ng-deep .ql-editor h1,:host ::ng-deep .ql-editor h2,:host ::ng-deep .ql-editor h3,:host ::ng-deep .ql-editor h4,:host ::ng-deep .ql-editor h5,:host ::ng-deep .ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor table{border-collapse:collapse}:host ::ng-deep .ql-editor td{border:1px solid #000;padding:2px 5px}:host ::ng-deep .ql-editor ol{padding-left:1.5em}:host ::ng-deep .ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}:host ::ng-deep .ql-editor li>.ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}:host ::ng-deep .ql-editor li[data-list=checked]>.ql-ui,:host ::ng-deep .ql-editor li[data-list=unchecked]>.ql-ui{color:#777}:host ::ng-deep .ql-editor li[data-list=bullet]>.ql-ui:before{content:\"\\2022\"}:host ::ng-deep .ql-editor li[data-list=checked]>.ql-ui:before{content:\"\\2611\"}:host ::ng-deep .ql-editor li[data-list=unchecked]>.ql-ui:before{content:\"\\2610\"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered]{counter-increment:list-0}:host ::ng-deep .ql-editor li[data-list=ordered]>.ql-ui:before{content:counter(list-0,decimal) \". \"}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-1>.ql-ui:before{content:counter(list-1,lower-alpha) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-2>.ql-ui:before{content:counter(list-2,lower-roman) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-3>.ql-ui:before{content:counter(list-3,decimal) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-4>.ql-ui:before{content:counter(list-4,lower-alpha) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-5>.ql-ui:before{content:counter(list-5,lower-roman) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-6>.ql-ui:before{content:counter(list-6,decimal) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-7>.ql-ui:before{content:counter(list-7,lower-alpha) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-8>.ql-ui:before{content:counter(list-8,lower-roman) \". \"}@supports (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-8{counter-set:list-9}}@supports not (counter-set: none){:host ::ng-deep .ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}:host ::ng-deep .ql-editor li[data-list=ordered].ql-indent-9>.ql-ui:before{content:counter(list-9,decimal) \". \"}:host ::ng-deep .ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}:host ::ng-deep .ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}:host ::ng-deep .ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}:host ::ng-deep .ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}:host ::ng-deep .ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}:host ::ng-deep .ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}:host ::ng-deep .ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}:host ::ng-deep .ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}:host ::ng-deep .ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}:host ::ng-deep .ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}:host ::ng-deep .ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}:host ::ng-deep .ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}:host ::ng-deep .ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}:host ::ng-deep .ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}:host ::ng-deep .ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}:host ::ng-deep .ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}:host ::ng-deep .ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}:host ::ng-deep .ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}:host ::ng-deep .ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}:host ::ng-deep .ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}:host ::ng-deep .ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}:host ::ng-deep .ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}:host ::ng-deep .ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}:host ::ng-deep .ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}:host ::ng-deep .ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}:host ::ng-deep .ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}:host ::ng-deep .ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}:host ::ng-deep .ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}:host ::ng-deep .ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}:host ::ng-deep .ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}:host ::ng-deep .ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}:host ::ng-deep .ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}:host ::ng-deep .ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}:host ::ng-deep .ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}:host ::ng-deep .ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}:host ::ng-deep .ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}:host ::ng-deep .ql-editor li.ql-direction-rtl{padding-right:1.5em}:host ::ng-deep .ql-editor li.ql-direction-rtl>.ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}:host ::ng-deep .ql-editor table{table-layout:fixed;width:100%}:host ::ng-deep .ql-editor table td{outline:none}:host ::ng-deep .ql-editor .ql-code-block-container{font-family:monospace}:host ::ng-deep .ql-editor .ql-video{display:block;max-width:100%}:host ::ng-deep .ql-editor .ql-video.ql-align-center{margin:0 auto}:host ::ng-deep .ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}:host ::ng-deep .ql-editor .ql-bg-black{background-color:#000}:host ::ng-deep .ql-editor .ql-bg-red{background-color:#e60000}:host ::ng-deep .ql-editor .ql-bg-orange{background-color:#f90}:host ::ng-deep .ql-editor .ql-bg-yellow{background-color:#ff0}:host ::ng-deep .ql-editor .ql-bg-green{background-color:#008a00}:host ::ng-deep .ql-editor .ql-bg-blue{background-color:#06c}:host ::ng-deep .ql-editor .ql-bg-purple{background-color:#93f}:host ::ng-deep .ql-editor .ql-color-white{color:#fff}:host ::ng-deep .ql-editor .ql-color-red{color:#e60000}:host ::ng-deep .ql-editor .ql-color-orange{color:#f90}:host ::ng-deep .ql-editor .ql-color-yellow{color:#ff0}:host ::ng-deep .ql-editor .ql-color-green{color:#008a00}:host ::ng-deep .ql-editor .ql-color-blue{color:#06c}:host ::ng-deep .ql-editor .ql-color-purple{color:#93f}:host ::ng-deep .ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}:host ::ng-deep .ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}:host ::ng-deep .ql-editor .ql-size-small{font-size:.75em}:host ::ng-deep .ql-editor .ql-size-large{font-size:1.5em}:host ::ng-deep .ql-editor .ql-size-huge{font-size:2.5em}:host ::ng-deep .ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}:host ::ng-deep .ql-editor .ql-align-center{text-align:center}:host ::ng-deep .ql-editor .ql-align-justify{text-align:justify}:host ::ng-deep .ql-editor .ql-align-right{text-align:right}:host ::ng-deep .ql-editor .ql-ui{position:absolute}:host ::ng-deep .ql-editor.ql-blank:before{color:#0009;content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}:host ::ng-deep .ql-snow.ql-toolbar:after,:host ::ng-deep .ql-snow .ql-toolbar:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-snow.ql-toolbar button,:host ::ng-deep .ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}:host ::ng-deep .ql-snow.ql-toolbar button svg,:host ::ng-deep .ql-snow .ql-toolbar button svg{float:left;height:100%}:host ::ng-deep .ql-snow.ql-toolbar button:active:hover,:host ::ng-deep .ql-snow .ql-toolbar button:active:hover{outline:none}:host ::ng-deep .ql-snow.ql-toolbar input.ql-image[type=file],:host ::ng-deep .ql-snow .ql-toolbar input.ql-image[type=file]{display:none}:host ::ng-deep .ql-snow.ql-toolbar button:hover,:host ::ng-deep .ql-snow .ql-toolbar button:hover,:host ::ng-deep .ql-snow.ql-toolbar button:focus,:host ::ng-deep .ql-snow .ql-toolbar button:focus,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button:hover .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button:focus .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,:host ::ng-deep .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}@media(pointer:coarse){:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active),:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,:host ::ng-deep .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,:host ::ng-deep .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}:host ::ng-deep .ql-snow{box-sizing:border-box}:host ::ng-deep .ql-snow *{box-sizing:border-box}:host ::ng-deep .ql-snow .ql-hidden{display:none}:host ::ng-deep .ql-snow .ql-out-bottom,:host ::ng-deep .ql-snow .ql-out-top{visibility:hidden}:host ::ng-deep .ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}:host ::ng-deep .ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}:host ::ng-deep .ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}:host ::ng-deep .ql-snow .ql-formats{display:inline-block;vertical-align:middle}:host ::ng-deep .ql-snow .ql-formats:after{clear:both;content:\"\";display:table}:host ::ng-deep .ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}:host ::ng-deep .ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}:host ::ng-deep .ql-snow .ql-fill,:host ::ng-deep .ql-snow .ql-stroke.ql-fill{fill:#444}:host ::ng-deep .ql-snow .ql-empty{fill:none}:host ::ng-deep .ql-snow .ql-even{fill-rule:evenodd}:host ::ng-deep .ql-snow .ql-thin,:host ::ng-deep .ql-snow .ql-stroke.ql-thin{stroke-width:1}:host ::ng-deep .ql-snow .ql-transparent{opacity:.4}:host ::ng-deep .ql-snow .ql-direction svg:last-child{display:none}:host ::ng-deep .ql-snow .ql-direction.ql-active svg:last-child{display:inline}:host ::ng-deep .ql-snow .ql-direction.ql-active svg:first-child{display:none}:host ::ng-deep .ql-snow .ql-editor h1{font-size:2em}:host ::ng-deep .ql-snow .ql-editor h2{font-size:1.5em}:host ::ng-deep .ql-snow .ql-editor h3{font-size:1.17em}:host ::ng-deep .ql-snow .ql-editor h4{font-size:1em}:host ::ng-deep .ql-snow .ql-editor h5{font-size:.83em}:host ::ng-deep .ql-snow .ql-editor h6{font-size:.67em}:host ::ng-deep .ql-snow .ql-editor a{text-decoration:underline}:host ::ng-deep .ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}:host ::ng-deep .ql-snow .ql-editor code,:host ::ng-deep .ql-snow .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}:host ::ng-deep .ql-snow .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}:host ::ng-deep .ql-snow .ql-editor code{font-size:85%;padding:2px 4px}:host ::ng-deep .ql-snow .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}:host ::ng-deep .ql-snow .ql-editor img{max-width:100%}:host ::ng-deep .ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}:host ::ng-deep .ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}:host ::ng-deep .ql-snow .ql-picker-label:before{display:inline-block;line-height:22px}:host ::ng-deep .ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}:host ::ng-deep .ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}:host ::ng-deep .ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}:host ::ng-deep .ql-snow .ql-color-picker,:host ::ng-deep .ql-snow .ql-icon-picker{width:28px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-label,:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-label svg,:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}:host ::ng-deep .ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}:host ::ng-deep .ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}:host ::ng-deep .ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=\"\"]):before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=\"\"]):before{content:attr(data-label)}:host ::ng-deep .ql-snow .ql-picker.ql-header{width:98px}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"1\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{content:\"Heading 1\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"2\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{content:\"Heading 2\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"3\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{content:\"Heading 3\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"4\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{content:\"Heading 4\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"5\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{content:\"Heading 5\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-label[data-value=\"6\"]:before,:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{content:\"Heading 6\"}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"1\"]:before{font-size:2em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"2\"]:before{font-size:1.5em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"3\"]:before{font-size:1.17em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"4\"]:before{font-size:1em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"5\"]:before{font-size:.83em}:host ::ng-deep .ql-snow .ql-picker.ql-header .ql-picker-item[data-value=\"6\"]:before{font-size:.67em}:host ::ng-deep .ql-snow .ql-picker.ql-font{width:108px}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label:before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item:before{content:\"Sans Serif\"}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{content:\"Serif\"}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{content:\"Monospace\"}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before{font-family:Georgia,Times New Roman,serif}:host ::ng-deep .ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before{font-family:Monaco,Courier New,monospace}:host ::ng-deep .ql-snow .ql-picker.ql-size{width:98px}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item:before{content:\"Normal\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{content:\"Small\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{content:\"Large\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{content:\"Huge\"}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before{font-size:10px}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before{font-size:18px}:host ::ng-deep .ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before{font-size:32px}:host ::ng-deep .ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}:host ::ng-deep .ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}:host ::ng-deep .ql-code-block-container{position:relative}:host ::ng-deep .ql-code-block-container .ql-ui{right:5px;top:5px}:host ::ng-deep .ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;padding:8px}:host ::ng-deep .ql-toolbar.ql-snow .ql-formats{margin-right:15px}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:#0003 0 2px 8px}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}:host ::ng-deep .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}:host ::ng-deep .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,:host ::ng-deep .ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}:host ::ng-deep .ql-toolbar.ql-snow+.ql-container.ql-snow{border-top:0}:host ::ng-deep .ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}:host ::ng-deep .ql-snow .ql-tooltip:before{content:\"Visit URL:\";line-height:26px;margin-right:8px}:host ::ng-deep .ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}:host ::ng-deep .ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}:host ::ng-deep .ql-snow .ql-tooltip a.ql-action:after{border-right:1px solid #ccc;content:\"Edit\";margin-left:16px;padding-right:8px}:host ::ng-deep .ql-snow .ql-tooltip a.ql-remove:before{content:\"Remove\";margin-left:8px}:host ::ng-deep .ql-snow .ql-tooltip a{line-height:26px}:host ::ng-deep .ql-snow .ql-tooltip.ql-editing a.ql-preview,:host ::ng-deep .ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}:host ::ng-deep .ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}:host ::ng-deep .ql-snow .ql-tooltip.ql-editing a.ql-action:after{border-right:0;content:\"Save\";padding-right:0}:host ::ng-deep .ql-snow .ql-tooltip[data-mode=link]:before{content:\"Enter link:\"}:host ::ng-deep .ql-snow .ql-tooltip[data-mode=formula]:before{content:\"Enter formula:\"}:host ::ng-deep .ql-snow .ql-tooltip[data-mode=video]:before{content:\"Enter video:\"}:host ::ng-deep .ql-snow a{color:#06c}:host ::ng-deep .ql-container.ql-snow{border:1px solid #ccc}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [
5297
5331
  { provide: ControlContainer, useExisting: NgForm },
5298
5332
  // { provide: QUILL_CONFIG_TOKEN, useValue: quillConfig }
5299
5333
  ] }); }
5300
5334
  }
5301
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRichtext, decorators: [{
5335
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldRichtext, decorators: [{
5302
5336
  type: Component,
5303
5337
  args: [{ viewProviders: [
5304
5338
  { provide: ControlContainer, useExisting: NgForm },
@@ -5321,6 +5355,7 @@ class FieldDatetime extends FieldAbstract {
5321
5355
  constructor() {
5322
5356
  super(...arguments);
5323
5357
  this.placeholder = 'dd/mm/yyyy';
5358
+ this._settingValue = false;
5324
5359
  this.clickout = (event) => {
5325
5360
  if (event.target.className === 'Vlt-dropdown__link' && this.elementRef.nativeElement.contains(event.target)) {
5326
5361
  this.focus();
@@ -5402,9 +5437,26 @@ class FieldDatetime extends FieldAbstract {
5402
5437
  else if (this.meta.type === 'time') {
5403
5438
  this.placeholder = '--:-- --';
5404
5439
  }
5405
- const origValue = this.parent[this.meta.name];
5440
+ const _rawKey = `_vgipRaw_${this.meta.name}`;
5441
+ const _existingDesc = Object.getOwnPropertyDescriptor(this.parent, this.meta.name);
5442
+ const _hasGetter = _existingDesc && typeof _existingDesc.get === 'function';
5443
+ const origValue = _hasGetter
5444
+ ? this.parent[_rawKey]
5445
+ : this.parent[this.meta.name];
5446
+ if (!_hasGetter && origValue !== undefined) {
5447
+ Object.defineProperty(this.parent, _rawKey, { value: origValue, writable: true, configurable: true, enumerable: false });
5448
+ }
5406
5449
  Object.defineProperty(this.parent, this.meta.name, {
5407
5450
  set: (value) => {
5451
+ // console.log('Setting value', value);
5452
+ if (value !== undefined && value !== null) {
5453
+ if (Object.getOwnPropertyDescriptor(this.parent, _rawKey)) {
5454
+ this.parent[_rawKey] = value;
5455
+ }
5456
+ else {
5457
+ Object.defineProperty(this.parent, _rawKey, { value, writable: true, configurable: true, enumerable: false });
5458
+ }
5459
+ }
5408
5460
  if (value) {
5409
5461
  if (['datetime', 'date', 'datetime-local'].indexOf(this.meta.type || this.meta.subtype) !== -1 && value) {
5410
5462
  try {
@@ -5661,10 +5713,10 @@ class FieldDatetime extends FieldAbstract {
5661
5713
  }
5662
5714
  }
5663
5715
  }
5664
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldDatetime, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5665
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FieldDatetime, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{model}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched), 'has-value': f.value, active: keyListenerActive }\">\n <div class=\"Vlt-input\" [ngClass]=\"{'vgip-disable': disabled}\">\n <label class='wrapper'>\n <input class='main model' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [step]='validations.step' [disabled]='disabled' [readonly]='readonly' [(ngModel)]='model' (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name' [type]=\"type\" [placeholder]=\"placeholder\" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n </label>\n <div class='Vlt-composite__append right-actions'>\n @if (model) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='clear($event)' tabindex='0'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </a>\n }\n </div>\n </div>\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.min) {\n <span>Must be later than {{validations.min}}.&nbsp;</span>\n }\n @if (f.errors.max) {\n <span>Must be no later than {{validations}}.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-form__element--big.Vlt-form__element--error input.main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{background:var(--vgip-meta-input-bg-color);border-color:#f25a6b;box-shadow:none}@-moz-document url-prefix(){.Vlt-composite__append.right-actions{right:10px!important}}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:10px;cursor:pointer}@media screen and (-webkit-min-device-pixel-ratio:0)and (min-resolution:.001dpcm){.Vlt-composite__append.right-actions{right:53px}}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:#2c2d30}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}:host-context ::ng-deep input::-webkit-calendar-picker-indicator{height:48px;width:51px;margin-top:-15px;margin-right:-15px;padding:0 2px 0 0;cursor:pointer;color:transparent;background-origin:content-box;background-size:initial;background-repeat:no-repeat;background-position:center;opacity:1;visibility:visible;background-image:var(--vgip-meta-date-icon)}:host-context ::ng-deep input::-webkit-calendar-picker-indicator:hover{background-color:var(--vgip-meta-input-action-hover-bg-color)}:host-context ::ng-deep input[type=time]::-webkit-calendar-picker-indicator{background-image:var(--vgip-meta-time-icon)}:host-context ::ng-deep input[readonly]::-webkit-calendar-picker-indicator{visibility:visible}:host-context ::ng-deep input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-clear-button{opacity:0;pointer-events:none}:host-context ::ng-deep input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-inner-spin-button{opacity:0;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5716
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldDatetime, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5717
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldDatetime, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{model}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched), 'has-value': f.value, active: keyListenerActive }\">\n <div class=\"Vlt-input\" [ngClass]=\"{'vgip-disable': disabled}\">\n <label class='wrapper'>\n <input class='main model' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [step]='validations.step' [disabled]='disabled' [readonly]='readonly' [(ngModel)]='model' (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name' [type]=\"type\" [placeholder]=\"placeholder\" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n </label>\n <div class='Vlt-composite__append right-actions'>\n @if (model) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='clear($event)' tabindex='0'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </a>\n }\n </div>\n </div>\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.min) {\n <span>Must be later than {{validations.min}}.&nbsp;</span>\n }\n @if (f.errors.max) {\n <span>Must be no later than {{validations}}.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-form__element--big.Vlt-form__element--error input.main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{background:var(--vgip-meta-input-bg-color);border-color:#f25a6b;box-shadow:none}@-moz-document url-prefix(){.Vlt-composite__append.right-actions{right:10px!important}}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:10px;cursor:pointer}@media screen and (-webkit-min-device-pixel-ratio:0)and (min-resolution:.001dpcm){.Vlt-composite__append.right-actions{right:53px}}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:#2c2d30}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}:host-context ::ng-deep input::-webkit-calendar-picker-indicator{height:48px;width:51px;margin-top:-15px;margin-right:-15px;padding:0 2px 0 0;cursor:pointer;color:transparent;background-origin:content-box;background-size:initial;background-repeat:no-repeat;background-position:center;opacity:1;visibility:visible;background-image:var(--vgip-meta-date-icon)}:host-context ::ng-deep input::-webkit-calendar-picker-indicator:hover{background-color:var(--vgip-meta-input-action-hover-bg-color)}:host-context ::ng-deep input[type=time]::-webkit-calendar-picker-indicator{background-image:var(--vgip-meta-time-icon)}:host-context ::ng-deep input[readonly]::-webkit-calendar-picker-indicator{visibility:visible}:host-context ::ng-deep input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-clear-button{opacity:0;pointer-events:none}:host-context ::ng-deep input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-inner-spin-button{opacity:0;pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
5666
5718
  }
5667
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldDatetime, decorators: [{
5719
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldDatetime, decorators: [{
5668
5720
  type: Component,
5669
5721
  args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>{{model}}</div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element Vlt-form__element--big\" [ngClass]=\"{'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched), 'has-value': f.value, active: keyListenerActive }\">\n <div class=\"Vlt-input\" [ngClass]=\"{'vgip-disable': disabled}\">\n <label class='wrapper'>\n <input class='main model' [pattern]=\"validations.pattern ? validations.pattern.value || validations.pattern : null\" [required]='validations.required' [minlength]='validations.minlength' [maxlength]='validations.maxlength' [min]='validations.min' [max]='validations.max' [step]='validations.step' [disabled]='disabled' [readonly]='readonly' [(ngModel)]='model' (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name' [type]=\"type\" [placeholder]=\"placeholder\" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n {{meta.label || meta.name}}\n @if (validations.required) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n </label>\n <div class='Vlt-composite__append right-actions'>\n @if (model) {\n <a href='#' class=\"Vlt-composite__append--icon\" (click)='clear($event)' tabindex='0'>\n <div class=\"Vlt-composite__icon\">\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </a>\n }\n </div>\n </div>\n @if (f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))) {\n <small class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required.&nbsp;</span>\n }\n @if (f.errors.min) {\n <span>Must be later than {{validations.min}}.&nbsp;</span>\n }\n @if (f.errors.max) {\n <span>Must be no later than {{validations}}.&nbsp;</span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}}&nbsp;</span>\n }\n </small>\n }\n @if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n }\n </div>\n}\n", styles: [".Vlt-form__element--big.Vlt-form__element--error input.main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{background:var(--vgip-meta-input-bg-color);border-color:#f25a6b;box-shadow:none}@-moz-document url-prefix(){.Vlt-composite__append.right-actions{right:10px!important}}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:10px;cursor:pointer}@media screen and (-webkit-min-device-pixel-ratio:0)and (min-resolution:.001dpcm){.Vlt-composite__append.right-actions{right:53px}}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:#2c2d30}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}:host-context ::ng-deep input::-webkit-calendar-picker-indicator{height:48px;width:51px;margin-top:-15px;margin-right:-15px;padding:0 2px 0 0;cursor:pointer;color:transparent;background-origin:content-box;background-size:initial;background-repeat:no-repeat;background-position:center;opacity:1;visibility:visible;background-image:var(--vgip-meta-date-icon)}:host-context ::ng-deep input::-webkit-calendar-picker-indicator:hover{background-color:var(--vgip-meta-input-action-hover-bg-color)}:host-context ::ng-deep input[type=time]::-webkit-calendar-picker-indicator{background-image:var(--vgip-meta-time-icon)}:host-context ::ng-deep input[readonly]::-webkit-calendar-picker-indicator{visibility:visible}:host-context ::ng-deep input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-clear-button{opacity:0;pointer-events:none}:host-context ::ng-deep input:enabled:read-write:-webkit-any(:focus,:hover)::-webkit-inner-spin-button{opacity:0;pointer-events:none}\n"] }]
5670
5722
  }] });
@@ -5681,10 +5733,10 @@ var index$1 = /*#__PURE__*/Object.freeze({
5681
5733
  * @Last Modified time: 2019-11-15 13:04:01
5682
5734
  */
5683
5735
  class FieldHidden extends FieldAbstract {
5684
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldHidden, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5685
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldHidden, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "" }); }
5736
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldHidden, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
5737
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: FieldHidden, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "" }); }
5686
5738
  }
5687
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldHidden, decorators: [{
5739
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldHidden, decorators: [{
5688
5740
  type: Component,
5689
5741
  args: [{ standalone: false, template: "" }]
5690
5742
  }] });
@@ -5710,10 +5762,10 @@ class MetaIconsPipe {
5710
5762
  return value; //this.sanitizer.bypassSecurityTrustHtml(value);
5711
5763
  }
5712
5764
  }
5713
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaIconsPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
5714
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaIconsPipe, isStandalone: false, name: "metaIcons" }); }
5765
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaIconsPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
5766
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: MetaIconsPipe, isStandalone: false, name: "metaIcons" }); }
5715
5767
  }
5716
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaIconsPipe, decorators: [{
5768
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaIconsPipe, decorators: [{
5717
5769
  type: Pipe,
5718
5770
  args: [{
5719
5771
  name: 'metaIcons',
@@ -5731,10 +5783,10 @@ class MetaStripHtmlPipe {
5731
5783
  transform(value) {
5732
5784
  return value.replace(/<[^>]*>/g, '');
5733
5785
  }
5734
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStripHtmlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
5735
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaStripHtmlPipe, isStandalone: false, name: "metaStripHtml" }); }
5786
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaStripHtmlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
5787
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: MetaStripHtmlPipe, isStandalone: false, name: "metaStripHtml" }); }
5736
5788
  }
5737
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStripHtmlPipe, decorators: [{
5789
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaStripHtmlPipe, decorators: [{
5738
5790
  type: Pipe,
5739
5791
  args: [{
5740
5792
  name: 'metaStripHtml',
@@ -6025,10 +6077,10 @@ class ResourceDraftsService {
6025
6077
  this.store.destroyById(COLLECTION, draft.id, cb);
6026
6078
  }
6027
6079
  }
6028
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResourceDraftsService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
6029
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResourceDraftsService, providedIn: 'root' }); }
6080
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ResourceDraftsService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
6081
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ResourceDraftsService, providedIn: 'root' }); }
6030
6082
  }
6031
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResourceDraftsService, decorators: [{
6083
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ResourceDraftsService, decorators: [{
6032
6084
  type: Injectable,
6033
6085
  args: [{
6034
6086
  providedIn: 'root'
@@ -6048,8 +6100,8 @@ class MetaModule {
6048
6100
  providers: customProviders
6049
6101
  };
6050
6102
  }
6051
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
6052
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, declarations: [MetaIconsPipe,
6103
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
6104
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: MetaModule, declarations: [MetaIconsPipe,
6053
6105
  MetaModelPipe,
6054
6106
  MetaStripHtmlPipe,
6055
6107
  MetaField,
@@ -6080,7 +6132,7 @@ class MetaModule {
6080
6132
  MetaResource,
6081
6133
  MetaResourceCard,
6082
6134
  MetaAutofocusDirective] }); }
6083
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, providers: [provideHttpClient(withInterceptorsFromDi())], imports: [CommonModule,
6135
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaModule, providers: [provideHttpClient(withInterceptorsFromDi())], imports: [CommonModule,
6084
6136
  FormsModule,
6085
6137
  ReactiveFormsModule,
6086
6138
  QuillModule.forRoot()
@@ -6098,7 +6150,7 @@ class MetaModule {
6098
6150
  // })
6099
6151
  ] }); }
6100
6152
  }
6101
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, decorators: [{
6153
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: MetaModule, decorators: [{
6102
6154
  type: NgModule,
6103
6155
  args: [{ declarations: [
6104
6156
  MetaIconsPipe,