@vgip/meta-ui 2.2.1 → 2.3.1
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.
|
@@ -1031,10 +1031,10 @@ class MetaHttpClient {
|
|
|
1031
1031
|
};
|
|
1032
1032
|
return options;
|
|
1033
1033
|
}
|
|
1034
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1035
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1034
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaHttpClient, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1035
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaHttpClient, providedIn: 'root' }); }
|
|
1036
1036
|
}
|
|
1037
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1037
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaHttpClient, decorators: [{
|
|
1038
1038
|
type: Injectable,
|
|
1039
1039
|
args: [{
|
|
1040
1040
|
providedIn: 'root'
|
|
@@ -1169,10 +1169,10 @@ class MetaResourceService {
|
|
|
1169
1169
|
return this.httpClient.post(`${this.baseResourceUrl}`, payload);
|
|
1170
1170
|
}
|
|
1171
1171
|
}
|
|
1172
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1173
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1172
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResourceService, deps: [{ token: MetaHttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1173
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResourceService, providedIn: 'root' }); }
|
|
1174
1174
|
}
|
|
1175
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1175
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResourceService, decorators: [{
|
|
1176
1176
|
type: Injectable,
|
|
1177
1177
|
args: [{
|
|
1178
1178
|
providedIn: 'root'
|
|
@@ -1218,10 +1218,10 @@ class MetaContextService {
|
|
|
1218
1218
|
delete this.onClick2Dial;
|
|
1219
1219
|
}
|
|
1220
1220
|
}
|
|
1221
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1222
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1221
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1222
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaContextService, providedIn: 'root' }); }
|
|
1223
1223
|
}
|
|
1224
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1224
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaContextService, decorators: [{
|
|
1225
1225
|
type: Injectable,
|
|
1226
1226
|
args: [{
|
|
1227
1227
|
providedIn: 'root'
|
|
@@ -1299,10 +1299,10 @@ class MetaMsgService {
|
|
|
1299
1299
|
}
|
|
1300
1300
|
}
|
|
1301
1301
|
}
|
|
1302
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1303
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1302
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaMsgService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1303
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaMsgService, providedIn: 'root' }); }
|
|
1304
1304
|
}
|
|
1305
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1305
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaMsgService, decorators: [{
|
|
1306
1306
|
type: Injectable,
|
|
1307
1307
|
args: [{
|
|
1308
1308
|
providedIn: 'root'
|
|
@@ -1413,10 +1413,10 @@ class MetaReferenceService {
|
|
|
1413
1413
|
});
|
|
1414
1414
|
return modalObservable;
|
|
1415
1415
|
}
|
|
1416
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1417
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1416
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaReferenceService, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1417
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaReferenceService, providedIn: 'root' }); }
|
|
1418
1418
|
}
|
|
1419
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1419
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaReferenceService, decorators: [{
|
|
1420
1420
|
type: Injectable,
|
|
1421
1421
|
args: [{
|
|
1422
1422
|
providedIn: 'root'
|
|
@@ -1739,10 +1739,10 @@ class FieldAbstract {
|
|
|
1739
1739
|
}
|
|
1740
1740
|
});
|
|
1741
1741
|
}
|
|
1742
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1743
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1742
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldAbstract, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1743
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: FieldAbstract, isStandalone: true, ngImport: i0 }); }
|
|
1744
1744
|
}
|
|
1745
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1745
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldAbstract, decorators: [{
|
|
1746
1746
|
type: Directive
|
|
1747
1747
|
}] });
|
|
1748
1748
|
class MetaElem {
|
|
@@ -1820,10 +1820,10 @@ class MetaFieldContentDirective {
|
|
|
1820
1820
|
constructor(viewContainerRef) {
|
|
1821
1821
|
this.viewContainerRef = viewContainerRef;
|
|
1822
1822
|
}
|
|
1823
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1824
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1823
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaFieldContentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1824
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MetaFieldContentDirective, isStandalone: false, selector: "[metaFieldContent]", ngImport: i0 }); }
|
|
1825
1825
|
}
|
|
1826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1826
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaFieldContentDirective, decorators: [{
|
|
1827
1827
|
type: Directive,
|
|
1828
1828
|
args: [{
|
|
1829
1829
|
selector: '[metaFieldContent]',
|
|
@@ -1871,10 +1871,10 @@ class MetaField extends FieldAbstract {
|
|
|
1871
1871
|
enumerable: false
|
|
1872
1872
|
});
|
|
1873
1873
|
}
|
|
1874
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1875
|
-
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]" }] }); }
|
|
1874
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaField, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1875
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", 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]" }] }); }
|
|
1876
1876
|
}
|
|
1877
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1877
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaField, decorators: [{
|
|
1878
1878
|
type: Component,
|
|
1879
1879
|
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"] }]
|
|
1880
1880
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { meta: [{
|
|
@@ -2088,12 +2088,12 @@ class MetaLayout {
|
|
|
2088
2088
|
this.el.nativeElement.style.setProperty(key, metaTheme.properties[key]);
|
|
2089
2089
|
}
|
|
2090
2090
|
}
|
|
2091
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2092
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2091
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", 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 }); }
|
|
2092
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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> \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" }] }); }
|
|
2093
2093
|
}
|
|
2094
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2094
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaLayout, decorators: [{
|
|
2095
2095
|
type: Component,
|
|
2096
|
-
args: [{ selector: "vgip-meta-layout", standalone: false, template: "
|
|
2096
|
+
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> \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"] }]
|
|
2097
2097
|
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: MetaResourceService }, { type: MetaReferenceService }, { type: MetaMsgService }, { type: MetaContextService }], propDecorators: { meta: [{
|
|
2098
2098
|
type: Input
|
|
2099
2099
|
}], resource: [{
|
|
@@ -2130,10 +2130,10 @@ class MetaAutofocusDirective {
|
|
|
2130
2130
|
}, 300);
|
|
2131
2131
|
}
|
|
2132
2132
|
}
|
|
2133
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2134
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2133
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaAutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2134
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MetaAutofocusDirective, isStandalone: false, selector: "[vgipMetaFormAutofocus]", inputs: { vgipMetaFormAutofocus: "vgipMetaFormAutofocus" }, ngImport: i0 }); }
|
|
2135
2135
|
}
|
|
2136
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2136
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaAutofocusDirective, decorators: [{
|
|
2137
2137
|
type: Directive,
|
|
2138
2138
|
args: [{
|
|
2139
2139
|
// eslint-disable-next-line
|
|
@@ -2659,12 +2659,12 @@ class MetaResource {
|
|
|
2659
2659
|
extractPreserveSectionFields(s);
|
|
2660
2660
|
}
|
|
2661
2661
|
}
|
|
2662
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2663
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2662
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResource, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaContextService }, { token: MetaMsgService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2663
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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> 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"] }] }); }
|
|
2664
2664
|
}
|
|
2665
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2665
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResource, decorators: [{
|
|
2666
2666
|
type: Component,
|
|
2667
|
-
args: [{ selector: 'vgip-meta-resource', standalone: false, template: "<div
|
|
2667
|
+
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> 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"] }]
|
|
2668
2668
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: MetaResourceService }, { type: MetaContextService }, { type: MetaMsgService }], propDecorators: { resource: [{
|
|
2669
2669
|
type: Input
|
|
2670
2670
|
}], model: [{
|
|
@@ -2806,12 +2806,12 @@ class MetaRefDialog {
|
|
|
2806
2806
|
this.el.nativeElement.style.setProperty(key, metaTheme.properties[key]);
|
|
2807
2807
|
}
|
|
2808
2808
|
}
|
|
2809
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2810
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2809
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaRefDialog, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2810
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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" }] }); }
|
|
2811
2811
|
}
|
|
2812
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2812
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaRefDialog, decorators: [{
|
|
2813
2813
|
type: Component,
|
|
2814
|
-
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
|
|
2814
|
+
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"] }]
|
|
2815
2815
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
2816
2816
|
|
|
2817
2817
|
var index$c = /*#__PURE__*/Object.freeze({
|
|
@@ -2841,12 +2841,12 @@ class MetaResourceCard {
|
|
|
2841
2841
|
// }
|
|
2842
2842
|
});
|
|
2843
2843
|
}
|
|
2844
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2845
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2844
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResourceCard, deps: [{ token: MetaResourceService }, { token: MetaReferenceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2845
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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" }] }); }
|
|
2846
2846
|
}
|
|
2847
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2847
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaResourceCard, decorators: [{
|
|
2848
2848
|
type: Component,
|
|
2849
|
-
args: [{ selector: 'vgip-meta-resource-card', standalone: false, template: "<div class=\"Vlt-card Vlt-bg-white\">\n
|
|
2849
|
+
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"] }]
|
|
2850
2850
|
}], ctorParameters: () => [{ type: MetaResourceService }, { type: MetaReferenceService }, { type: i0.ViewContainerRef }], propDecorators: { resource: [{
|
|
2851
2851
|
type: Input
|
|
2852
2852
|
}], model: [{
|
|
@@ -2860,12 +2860,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
2860
2860
|
* @Last Modified time: 2019-11-15 13:04:01
|
|
2861
2861
|
*/
|
|
2862
2862
|
class FieldUnknown extends FieldAbstract {
|
|
2863
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2864
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
2863
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldUnknown, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2864
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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" }); }
|
|
2865
2865
|
}
|
|
2866
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2866
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldUnknown, decorators: [{
|
|
2867
2867
|
type: Component,
|
|
2868
|
-
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
|
|
2868
|
+
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" }]
|
|
2869
2869
|
}] });
|
|
2870
2870
|
|
|
2871
2871
|
var index$b = /*#__PURE__*/Object.freeze({
|
|
@@ -2932,10 +2932,10 @@ class MetaModelPipe {
|
|
|
2932
2932
|
transform(value) {
|
|
2933
2933
|
return value;
|
|
2934
2934
|
}
|
|
2935
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2936
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
2935
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaModelPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
2936
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.1", ngImport: i0, type: MetaModelPipe, isStandalone: false, name: "metaModel" }); }
|
|
2937
2937
|
}
|
|
2938
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2938
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaModelPipe, decorators: [{
|
|
2939
2939
|
type: Pipe,
|
|
2940
2940
|
args: [{
|
|
2941
2941
|
name: 'metaModel',
|
|
@@ -3400,12 +3400,12 @@ class FieldInput extends FieldAbstract {
|
|
|
3400
3400
|
}
|
|
3401
3401
|
}
|
|
3402
3402
|
}
|
|
3403
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3404
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldInput, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class='vgip-meta-field-preview' *ngIf='preview && model'>\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 <a *ngIf=\"isPhoneNumber; else elseBlock\" 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 <ng-template #elseBlock>{{model}}</ng-template>\n </div>\n</div>\n<div *ngIf='!preview' 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 <div *ngIf='multiple' class='items-container'>\n <div *ngIf='model' class='badges-container keep-focus' (click)='focus()'> <!-- eslint-disable-line -->\n <div *ngFor='let item of model' 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 </div>\n </div>\n <div class=\"Vlt-input Vlt-dropdown\" style='display: block;' [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]=\"multiple ? 'hidden' : (logicalSubtype || meta.subtype || 'text')\" placeholder=\" \" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <input *ngIf='multiple' 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 <label class='Vlt-truncate'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span> <span class='Vlt-black' *ngIf='model && multiple'>({{model.length}})</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n <div class='Vlt-composite__append right-actions'>\n <a href='#' *ngIf='model && showClear' 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 </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 <div *ngIf=\"suggestions.length\" 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 <div *ngIf='dropdown' class=\"Vlt-dropdown__scroll\">\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': (activeSuggestionIndex === i) }\" (click)='onSuggestionSelect($event, suggestion)' *ngFor='let suggestion of suggestions; let i = index' class=\"Vlt-dropdown__link\" style='padding: 0;'>\n <div *ngIf='multiple' 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 <div *ngIf='!multiple' style='padding: 12px 20px;'>\n {{suggestion.label || suggestion}}\n </div>\n </a>\n </div>\n <div *ngIf='!multiple' class=\"Vlt-dropdown__block\"></div>\n <div *ngIf='multiple' 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 </div>\n </div>\n </div>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))' class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required. </span>\n <span *ngIf=\"f.errors.minlength\">Must be longer than {{validations.minlength}} characters. </span>\n <span *ngIf=\"f.errors.maxlength\">Must be lest than {{validations.maxlength}} characters. </span>\n <span *ngIf=\"f.errors.pattern\">{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}. </span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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 }] }); }
|
|
3403
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldInput, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3404
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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 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 \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 @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;'>\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. </span>\n }\n @if (f.errors.minlength) {\n <span>Must be longer than {{validations.minlength}} characters. </span>\n }\n @if (f.errors.maxlength) {\n <span>Must be lest than {{validations.maxlength}} characters. </span>\n }\n @if (f.errors.pattern) {\n <span>{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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 }] }); }
|
|
3405
3405
|
}
|
|
3406
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3406
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldInput, decorators: [{
|
|
3407
3407
|
type: Component,
|
|
3408
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview' *ngIf='preview && model'>\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 <a *ngIf=\"isPhoneNumber; else elseBlock\" 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 <ng-template #elseBlock>{{model}}</ng-template>\n </div>\n</div>\n<div *ngIf='!preview' 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 <div *ngIf='multiple' class='items-container'>\n <div *ngIf='model' class='badges-container keep-focus' (click)='focus()'> <!-- eslint-disable-line -->\n <div *ngFor='let item of model' 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 </div>\n </div>\n <div class=\"Vlt-input Vlt-dropdown\" style='display: block;' [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]=\"multiple ? 'hidden' : (logicalSubtype || meta.subtype || 'text')\" placeholder=\" \" (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'/>\n <input *ngIf='multiple' 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 <label class='Vlt-truncate'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span> <span class='Vlt-black' *ngIf='model && multiple'>({{model.length}})</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n <div class='Vlt-composite__append right-actions'>\n <a href='#' *ngIf='model && showClear' 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 </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 <div *ngIf=\"suggestions.length\" 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 <div *ngIf='dropdown' class=\"Vlt-dropdown__scroll\">\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': (activeSuggestionIndex === i) }\" (click)='onSuggestionSelect($event, suggestion)' *ngFor='let suggestion of suggestions; let i = index' class=\"Vlt-dropdown__link\" style='padding: 0;'>\n <div *ngIf='multiple' 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 <div *ngIf='!multiple' style='padding: 12px 20px;'>\n {{suggestion.label || suggestion}}\n </div>\n </a>\n </div>\n <div *ngIf='!multiple' class=\"Vlt-dropdown__block\"></div>\n <div *ngIf='multiple' 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 </div>\n </div>\n </div>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched && keyListenerActive))' class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required. </span>\n <span *ngIf=\"f.errors.minlength\">Must be longer than {{validations.minlength}} characters. </span>\n <span *ngIf=\"f.errors.maxlength\">Must be lest than {{validations.maxlength}} characters. </span>\n <span *ngIf=\"f.errors.pattern\">{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}. </span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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"] }]
|
|
3408
|
+
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 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 \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 @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;'>\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. </span>\n }\n @if (f.errors.minlength) {\n <span>Must be longer than {{validations.minlength}} characters. </span>\n }\n @if (f.errors.maxlength) {\n <span>Must be lest than {{validations.maxlength}} characters. </span>\n }\n @if (f.errors.pattern) {\n <span>{{ validations.pattern.text || \"Should match '\"+validations.pattern+\"' pattern.\" }}. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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"] }]
|
|
3409
3409
|
}], ctorParameters: () => [{ type: MetaContextService }] });
|
|
3410
3410
|
|
|
3411
3411
|
var index$a = /*#__PURE__*/Object.freeze({
|
|
@@ -3478,12 +3478,12 @@ class FieldText extends FieldAbstract {
|
|
|
3478
3478
|
textToSpeech() {
|
|
3479
3479
|
this.focus();
|
|
3480
3480
|
}
|
|
3481
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3482
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
3481
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldText, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3482
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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}} </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 }] }); }
|
|
3483
3483
|
}
|
|
3484
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3484
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldText, decorators: [{
|
|
3485
3485
|
type: Component,
|
|
3486
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview'
|
|
3486
|
+
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}} </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"] }]
|
|
3487
3487
|
}], ctorParameters: () => [{ type: MetaContextService }] });
|
|
3488
3488
|
|
|
3489
3489
|
var index$9 = /*#__PURE__*/Object.freeze({
|
|
@@ -4056,12 +4056,12 @@ class FieldSelect extends FieldAbstract {
|
|
|
4056
4056
|
delete this.searching;
|
|
4057
4057
|
});
|
|
4058
4058
|
}
|
|
4059
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4060
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldSelect, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class='vgip-meta-field-preview' *ngIf='preview && model'>\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<div *ngIf='!preview' 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'>\n <label class='Vlt-truncate'>{{meta.label || meta.name}}<span *ngIf='validations.required && options.length' class='Vlt-red'>*</span></label> <!-- eslint-disable-line -->\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText'\n #ft='ngModel' [ngModelOptions]=\"{standalone: true}\" type=\"text\"\n [placeholder]=\"meta.placeholder || ' '\" (click)='onActivated($event)' (focus)='onActivated($event)'\n (blur)='onBlur($event)' [ngClass]=\"{ 'standalone': meta.standalone }\"\n [disabled]='disabled' [attr.aria-label]='meta.label' />\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 <div *ngIf='searching' class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n <div class='Vlt-composite__append right-actions'>\n <a href='#' *ngIf='model && !meta.noX && !disabled' 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 </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 <div *ngIf=\"optionsBackup.length > 12\" 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 </div>\n <div *ngIf='dropdown' class='Vlt-dropdown__scroll'>\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' *ngFor='let option of options; let i = index'\n class=\"Vlt-dropdown__link\" title=\"{{option.hint}}\">\n <div *ngIf='multiple' 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 <div *ngIf='!multiple' style='padding: 12px 20px;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n </a>\n <!-- No Option Found -->\n <div class=\"Vlt-dropdown__link\" *ngIf=\"options.length === 0\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n <button *ngIf='isCreatable && !disabled' 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 </div>\n </div>\n <div *ngIf='!multiple' class=\"Vlt-dropdown__block\"></div>\n <div *ngIf='multiple' 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 </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 <div *ngIf='isCreatable && !disabled' 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 </div>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))'\n class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required. </span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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 }] }); }
|
|
4059
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldSelect, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4060
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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 }] }); }
|
|
4061
4061
|
}
|
|
4062
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4062
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldSelect, decorators: [{
|
|
4063
4063
|
type: Component,
|
|
4064
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview' *ngIf='preview && model'>\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<div *ngIf='!preview' 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'>\n <label class='Vlt-truncate'>{{meta.label || meta.name}}<span *ngIf='validations.required && options.length' class='Vlt-red'>*</span></label> <!-- eslint-disable-line -->\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText'\n #ft='ngModel' [ngModelOptions]=\"{standalone: true}\" type=\"text\"\n [placeholder]=\"meta.placeholder || ' '\" (click)='onActivated($event)' (focus)='onActivated($event)'\n (blur)='onBlur($event)' [ngClass]=\"{ 'standalone': meta.standalone }\"\n [disabled]='disabled' [attr.aria-label]='meta.label' />\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 <div *ngIf='searching' class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n <div class='Vlt-composite__append right-actions'>\n <a href='#' *ngIf='model && !meta.noX && !disabled' 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 </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 <div *ngIf=\"optionsBackup.length > 12\" 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 </div>\n <div *ngIf='dropdown' class='Vlt-dropdown__scroll'>\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' *ngFor='let option of options; let i = index'\n class=\"Vlt-dropdown__link\" title=\"{{option.hint}}\">\n <div *ngIf='multiple' 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 <div *ngIf='!multiple' style='padding: 12px 20px;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n </a>\n <!-- No Option Found -->\n <div class=\"Vlt-dropdown__link\" *ngIf=\"options.length === 0\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n <button *ngIf='isCreatable && !disabled' 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 </div>\n </div>\n <div *ngIf='!multiple' class=\"Vlt-dropdown__block\"></div>\n <div *ngIf='multiple' 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 </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 <div *ngIf='isCreatable && !disabled' 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 </div>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))'\n class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required. </span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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"] }]
|
|
4064
|
+
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. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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"] }]
|
|
4065
4065
|
}], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: i0.ViewContainerRef }] });
|
|
4066
4066
|
|
|
4067
4067
|
var index$8 = /*#__PURE__*/Object.freeze({
|
|
@@ -4088,10 +4088,10 @@ class MetaTrackerService {
|
|
|
4088
4088
|
}
|
|
4089
4089
|
this.events.emit(event);
|
|
4090
4090
|
}
|
|
4091
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4092
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
4091
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
4092
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaTrackerService, providedIn: 'root' }); }
|
|
4093
4093
|
}
|
|
4094
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4094
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaTrackerService, decorators: [{
|
|
4095
4095
|
type: Injectable,
|
|
4096
4096
|
args: [{
|
|
4097
4097
|
providedIn: 'root'
|
|
@@ -4914,12 +4914,12 @@ class FieldReference extends FieldAbstract {
|
|
|
4914
4914
|
});
|
|
4915
4915
|
}
|
|
4916
4916
|
}
|
|
4917
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4918
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldReference, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class='vgip-meta-field-preview' *ngIf='preview && model && (!multiple || (multiple && model.length))'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div *ngIf='!multiple' 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 <div *ngIf='multiple' class='vgip-meta-field-value __gu'>\n <span *ngFor='let m of (model || [])' class='Vlt-badge Vlt-badge--app'>\n {{m.label || m.id || m}} <span class='Vlt-grey-dark' *ngIf='isPolymorphic'>({{m.type}})</span>\n </span>\n </div>\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener'\n *ngIf='externalLink && (model && !multiple)' 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</div>\n<div *ngIf='!preview' 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 <div *ngIf='multiple' class='items-container' [ngClass]='{ creatable: isCreatable }'>\n <div *ngIf='model' class='badges-container keep-focus' (click)='focus()' style='width: 100%;'> <!-- eslint-disable-line -->\n <div *ngFor='let item of model' 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 }} <span *ngIf='isPolymorphic' class='Vlt-grey-darker' style='font-weight: normal;'>({{item.type}})</span></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 </div>\n </div>\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 <div *ngIf='searchError'>\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 <div *ngIf='!searchError && (suggestions.length || searchResults)' [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 <div *ngIf='!searchResults' class=\"Vlt-dropdown__scroll\">\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i, smart: suggestion.smart }\" (click)='onSuggestionSelect($event, suggestion)' *ngFor='let suggestion of suggestions; let i = index' 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 </div>\n <div *ngIf='searchResults' class=\"Vlt-dropdown__scroll\">\n <div *ngIf='!searchResults.length' class='Vlt-dropdown__block'> No records matching '<b style='pointer-events: none;'>{{searchText}}</b>' were found.</div>\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\" (click)='onSuggestionSelect($event, suggestion)' *ngFor='let suggestion of searchResults; let i = index' 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 </div>\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 </div>\n </div>\n <div class=\"Vlt-composite__prepend\"\n *ngIf='isPolymorphic && showTypes && (multiple || !model || (dropdownVisible && ((suggestions || searchResults || []).length || searchResourceType.resourceType)))'>\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 <div *ngIf='!(isPolymorphic && showTypes && (multiple || !model || dropdownVisible))'>\n <!-- required by css -->\n </div>\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 <svg *ngIf='isSearchable && (!model || multiple)' class='Vlt-grey'>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ multiple ? 'stack' : 'search'}}\" />\n </svg>\n <svg *ngIf='!isSearchable || (model && !multiple)'\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 </div>\n <div *ngIf='suggestions.length' 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 </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;'>{{ (multiple && isPolymorphic) ? '+Add ' : ((model || !isPolymorphic) ? meta.label : ( meta.searchLabel || 'Search')) }}<span *ngIf='validations.required' class='Vlt-red'>*</span> <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;' *ngIf='model'>({{model.type || model.resourceType || model.length}})</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate hidden-desktop' style='padding-left: 25px; padding-right: 42px;'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span> <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;' *ngIf='model'>({{model.type || model.resourceType || model.length}})</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n </label>\n <div *ngIf='searching' class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\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 <a href='#' *ngIf='model && !multiple' 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 <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener' *ngIf='externalLink && (model && !multiple)' 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 </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 <div *ngIf='hasAppendButton && !disabled' class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' *ngIf='!model || multiple'\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 <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' *ngIf='model && !multiple'\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 </div>\n </div>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched && keyListenerActive))'\n class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required</span>\n <span *ngIf=\"f.errors.pattern\">Should match '{{validations.pattern}}' pattern</span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.helpText || meta.hint' class=\"Vlt-form__element__hint\">{{meta.helpText || meta.hint}}</small>\n</div>\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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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 }] }); }
|
|
4917
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldReference, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: MetaMsgService }, { token: MetaContextService }, { token: MetaTrackerService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4918
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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 \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 \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}} </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 }] }); }
|
|
4919
4919
|
}
|
|
4920
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4920
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldReference, decorators: [{
|
|
4921
4921
|
type: Component,
|
|
4922
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview' *ngIf='preview && model && (!multiple || (multiple && model.length))'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div *ngIf='!multiple' 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 <div *ngIf='multiple' class='vgip-meta-field-value __gu'>\n <span *ngFor='let m of (model || [])' class='Vlt-badge Vlt-badge--app'>\n {{m.label || m.id || m}} <span class='Vlt-grey-dark' *ngIf='isPolymorphic'>({{m.type}})</span>\n </span>\n </div>\n <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener'\n *ngIf='externalLink && (model && !multiple)' 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</div>\n<div *ngIf='!preview' 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 <div *ngIf='multiple' class='items-container' [ngClass]='{ creatable: isCreatable }'>\n <div *ngIf='model' class='badges-container keep-focus' (click)='focus()' style='width: 100%;'> <!-- eslint-disable-line -->\n <div *ngFor='let item of model' 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 }} <span *ngIf='isPolymorphic' class='Vlt-grey-darker' style='font-weight: normal;'>({{item.type}})</span></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 </div>\n </div>\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 <div *ngIf='searchError'>\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 <div *ngIf='!searchError && (suggestions.length || searchResults)' [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 <div *ngIf='!searchResults' class=\"Vlt-dropdown__scroll\">\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i, smart: suggestion.smart }\" (click)='onSuggestionSelect($event, suggestion)' *ngFor='let suggestion of suggestions; let i = index' 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 </div>\n <div *ngIf='searchResults' class=\"Vlt-dropdown__scroll\">\n <div *ngIf='!searchResults.length' class='Vlt-dropdown__block'> No records matching '<b style='pointer-events: none;'>{{searchText}}</b>' were found.</div>\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\" (click)='onSuggestionSelect($event, suggestion)' *ngFor='let suggestion of searchResults; let i = index' 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 </div>\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 </div>\n </div>\n <div class=\"Vlt-composite__prepend\"\n *ngIf='isPolymorphic && showTypes && (multiple || !model || (dropdownVisible && ((suggestions || searchResults || []).length || searchResourceType.resourceType)))'>\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 <div *ngIf='!(isPolymorphic && showTypes && (multiple || !model || dropdownVisible))'>\n <!-- required by css -->\n </div>\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 <svg *ngIf='isSearchable && (!model || multiple)' class='Vlt-grey'>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ multiple ? 'stack' : 'search'}}\" />\n </svg>\n <svg *ngIf='!isSearchable || (model && !multiple)'\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 </div>\n <div *ngIf='suggestions.length' 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 </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;'>{{ (multiple && isPolymorphic) ? '+Add ' : ((model || !isPolymorphic) ? meta.label : ( meta.searchLabel || 'Search')) }}<span *ngIf='validations.required' class='Vlt-red'>*</span> <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;' *ngIf='model'>({{model.type || model.resourceType || model.length}})</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate hidden-desktop' style='padding-left: 25px; padding-right: 42px;'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span> <span style='color: var(--vgip-meta-input-color); text-transform: capitalize;' *ngIf='model'>({{model.type || model.resourceType || model.length}})</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n </label>\n <div *ngIf='searching' class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\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 <a href='#' *ngIf='model && !multiple' 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 <a [href]='externalLink || model.externalLink' target='_blank' rel='noopener' *ngIf='externalLink && (model && !multiple)' 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 </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 <div *ngIf='hasAppendButton && !disabled' class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' *ngIf='!model || multiple'\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 <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' *ngIf='model && !multiple'\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 </div>\n </div>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched && keyListenerActive))'\n class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required</span>\n <span *ngIf=\"f.errors.pattern\">Should match '{{validations.pattern}}' pattern</span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.helpText || meta.hint' class=\"Vlt-form__element__hint\">{{meta.helpText || meta.hint}}</small>\n</div>\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"] }]
|
|
4922
|
+
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 \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 \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}} </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"] }]
|
|
4923
4923
|
}], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: MetaMsgService }, { type: MetaContextService }, { type: MetaTrackerService }, { type: i0.ViewContainerRef }] });
|
|
4924
4924
|
|
|
4925
4925
|
var index$7 = /*#__PURE__*/Object.freeze({
|
|
@@ -4999,12 +4999,12 @@ class FieldComposite extends FieldAbstract {
|
|
|
4999
4999
|
onValueChange() {
|
|
5000
5000
|
this.onChange.emit(this.value);
|
|
5001
5001
|
}
|
|
5002
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5003
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
5002
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldComposite, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5003
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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"] }] }); }
|
|
5004
5004
|
}
|
|
5005
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5005
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldComposite, decorators: [{
|
|
5006
5006
|
type: Component,
|
|
5007
|
-
args: [{ standalone: false, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n
|
|
5007
|
+
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"] }]
|
|
5008
5008
|
}] });
|
|
5009
5009
|
|
|
5010
5010
|
var index$6 = /*#__PURE__*/Object.freeze({
|
|
@@ -5050,12 +5050,12 @@ class FieldBoolean extends FieldAbstract {
|
|
|
5050
5050
|
onOptionChange() {
|
|
5051
5051
|
this.onModelChange(this.model);
|
|
5052
5052
|
}
|
|
5053
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5054
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
5053
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldBoolean, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5054
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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}} </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 }] }); }
|
|
5055
5055
|
}
|
|
5056
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5056
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldBoolean, decorators: [{
|
|
5057
5057
|
type: Component,
|
|
5058
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview'
|
|
5058
|
+
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}} </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"] }]
|
|
5059
5059
|
}] });
|
|
5060
5060
|
|
|
5061
5061
|
var index$5 = /*#__PURE__*/Object.freeze({
|
|
@@ -5136,12 +5136,12 @@ class FieldRadio extends FieldAbstract {
|
|
|
5136
5136
|
ev.srcElement.removeEventListener('keydown', this.keydown);
|
|
5137
5137
|
}
|
|
5138
5138
|
}
|
|
5139
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5140
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
5139
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldRadio, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5140
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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 }] }); }
|
|
5141
5141
|
}
|
|
5142
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldRadio, decorators: [{
|
|
5143
5143
|
type: Component,
|
|
5144
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview'
|
|
5144
|
+
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. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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"] }]
|
|
5145
5145
|
}] });
|
|
5146
5146
|
|
|
5147
5147
|
var index$4 = /*#__PURE__*/Object.freeze({
|
|
@@ -5207,12 +5207,12 @@ class FieldList extends FieldAbstract {
|
|
|
5207
5207
|
onChildChange() {
|
|
5208
5208
|
this.onChange.emit(this.model);
|
|
5209
5209
|
}
|
|
5210
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5211
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
5210
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5211
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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}} </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 }] }); }
|
|
5212
5212
|
}
|
|
5213
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5213
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldList, decorators: [{
|
|
5214
5214
|
type: Component,
|
|
5215
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div
|
|
5215
|
+
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}} </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"] }]
|
|
5216
5216
|
}] });
|
|
5217
5217
|
|
|
5218
5218
|
var index$3 = /*#__PURE__*/Object.freeze({
|
|
@@ -5287,18 +5287,18 @@ class FieldRichtext extends FieldAbstract {
|
|
|
5287
5287
|
textToSpeech() {
|
|
5288
5288
|
this.focus();
|
|
5289
5289
|
}
|
|
5290
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5291
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldRichtext, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class='vgip-meta-field-preview' *ngIf='preview && parent[meta.name]'>\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<div *ngIf='!preview' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched) }\">\n <label class=\"Vlt-label\">{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line -->\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 <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched)' class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required</span>\n <span *ngIf=\"f.errors.maxlength\">Length can not exceed {{validations.maxlength}} characters</span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.helpText' class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n</div>\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: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: [
|
|
5290
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldRichtext, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5291
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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}} </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: [
|
|
5292
5292
|
{ provide: ControlContainer, useExisting: NgForm },
|
|
5293
5293
|
// { provide: QUILL_CONFIG_TOKEN, useValue: quillConfig }
|
|
5294
5294
|
] }); }
|
|
5295
5295
|
}
|
|
5296
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5296
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldRichtext, decorators: [{
|
|
5297
5297
|
type: Component,
|
|
5298
5298
|
args: [{ viewProviders: [
|
|
5299
5299
|
{ provide: ControlContainer, useExisting: NgForm },
|
|
5300
5300
|
// { provide: QUILL_CONFIG_TOKEN, useValue: quillConfig }
|
|
5301
|
-
], standalone: false, template: "<div class='vgip-meta-field-preview' *ngIf='preview && parent[meta.name]'>\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<div *ngIf='!preview' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched) }\">\n <label class=\"Vlt-label\">{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line -->\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 <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || (fq | metaModel).touched)' class=\"Vlt-form__element__error\">\n <span *ngIf=\"f.errors.required\">Required</span>\n <span *ngIf=\"f.errors.maxlength\">Length can not exceed {{validations.maxlength}} characters</span>\n <span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n </small>\n <small *ngIf='meta.helpText' class=\"Vlt-form__element__hint\">{{meta.helpText}}</small>\n</div>\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"] }]
|
|
5301
|
+
], standalone: false, 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}} </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"] }]
|
|
5302
5302
|
}], ctorParameters: () => [{ type: MetaContextService }] });
|
|
5303
5303
|
|
|
5304
5304
|
var index$2 = /*#__PURE__*/Object.freeze({
|
|
@@ -5656,12 +5656,12 @@ class FieldDatetime extends FieldAbstract {
|
|
|
5656
5656
|
}
|
|
5657
5657
|
}
|
|
5658
5658
|
}
|
|
5659
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5660
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
5659
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldDatetime, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5660
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", 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. </span>\n }\n @if (f.errors.min) {\n <span>Must be later than {{validations.min}}. </span>\n }\n @if (f.errors.max) {\n <span>Must be no later than {{validations}}. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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 }] }); }
|
|
5661
5661
|
}
|
|
5662
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldDatetime, decorators: [{
|
|
5663
5663
|
type: Component,
|
|
5664
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div class='vgip-meta-field-preview'
|
|
5664
|
+
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. </span>\n }\n @if (f.errors.min) {\n <span>Must be later than {{validations.min}}. </span>\n }\n @if (f.errors.max) {\n <span>Must be no later than {{validations}}. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </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"] }]
|
|
5665
5665
|
}] });
|
|
5666
5666
|
|
|
5667
5667
|
var index$1 = /*#__PURE__*/Object.freeze({
|
|
@@ -5676,10 +5676,10 @@ var index$1 = /*#__PURE__*/Object.freeze({
|
|
|
5676
5676
|
* @Last Modified time: 2019-11-15 13:04:01
|
|
5677
5677
|
*/
|
|
5678
5678
|
class FieldHidden extends FieldAbstract {
|
|
5679
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5680
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
5679
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldHidden, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5680
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.1", type: FieldHidden, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "" }); }
|
|
5681
5681
|
}
|
|
5682
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5682
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: FieldHidden, decorators: [{
|
|
5683
5683
|
type: Component,
|
|
5684
5684
|
args: [{ standalone: false, template: "" }]
|
|
5685
5685
|
}] });
|
|
@@ -5705,10 +5705,10 @@ class MetaIconsPipe {
|
|
|
5705
5705
|
return value; //this.sanitizer.bypassSecurityTrustHtml(value);
|
|
5706
5706
|
}
|
|
5707
5707
|
}
|
|
5708
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5709
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
5708
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaIconsPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
5709
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.1", ngImport: i0, type: MetaIconsPipe, isStandalone: false, name: "metaIcons" }); }
|
|
5710
5710
|
}
|
|
5711
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5711
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaIconsPipe, decorators: [{
|
|
5712
5712
|
type: Pipe,
|
|
5713
5713
|
args: [{
|
|
5714
5714
|
name: 'metaIcons',
|
|
@@ -5726,10 +5726,10 @@ class MetaStripHtmlPipe {
|
|
|
5726
5726
|
transform(value) {
|
|
5727
5727
|
return value.replace(/<[^>]*>/g, '');
|
|
5728
5728
|
}
|
|
5729
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5730
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
5729
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaStripHtmlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
5730
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.2.1", ngImport: i0, type: MetaStripHtmlPipe, isStandalone: false, name: "metaStripHtml" }); }
|
|
5731
5731
|
}
|
|
5732
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5732
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaStripHtmlPipe, decorators: [{
|
|
5733
5733
|
type: Pipe,
|
|
5734
5734
|
args: [{
|
|
5735
5735
|
name: 'metaStripHtml',
|
|
@@ -6020,10 +6020,10 @@ class ResourceDraftsService {
|
|
|
6020
6020
|
this.store.destroyById(COLLECTION, draft.id, cb);
|
|
6021
6021
|
}
|
|
6022
6022
|
}
|
|
6023
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6024
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
6023
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ResourceDraftsService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
6024
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ResourceDraftsService, providedIn: 'root' }); }
|
|
6025
6025
|
}
|
|
6026
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6026
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: ResourceDraftsService, decorators: [{
|
|
6027
6027
|
type: Injectable,
|
|
6028
6028
|
args: [{
|
|
6029
6029
|
providedIn: 'root'
|
|
@@ -6043,8 +6043,8 @@ class MetaModule {
|
|
|
6043
6043
|
providers: customProviders
|
|
6044
6044
|
};
|
|
6045
6045
|
}
|
|
6046
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6047
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
6046
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
6047
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.1", ngImport: i0, type: MetaModule, declarations: [MetaIconsPipe,
|
|
6048
6048
|
MetaModelPipe,
|
|
6049
6049
|
MetaStripHtmlPipe,
|
|
6050
6050
|
MetaField,
|
|
@@ -6075,7 +6075,7 @@ class MetaModule {
|
|
|
6075
6075
|
MetaResource,
|
|
6076
6076
|
MetaResourceCard,
|
|
6077
6077
|
MetaAutofocusDirective] }); }
|
|
6078
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
6078
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaModule, providers: [provideHttpClient(withInterceptorsFromDi())], imports: [CommonModule,
|
|
6079
6079
|
FormsModule,
|
|
6080
6080
|
ReactiveFormsModule,
|
|
6081
6081
|
QuillModule.forRoot()
|
|
@@ -6093,7 +6093,7 @@ class MetaModule {
|
|
|
6093
6093
|
// })
|
|
6094
6094
|
] }); }
|
|
6095
6095
|
}
|
|
6096
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6096
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MetaModule, decorators: [{
|
|
6097
6097
|
type: NgModule,
|
|
6098
6098
|
args: [{ declarations: [
|
|
6099
6099
|
MetaIconsPipe,
|