@vgip/meta-ui 2.1.5 → 2.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/vgip-meta-ui.mjs +188 -141
- package/fesm2022/vgip-meta-ui.mjs.map +1 -1
- package/index.d.ts +1 -0
- package/package.json +3 -3
|
@@ -9,7 +9,7 @@ import { HttpParams, HttpHeaders, provideHttpClient, withInterceptorsFromDi } fr
|
|
|
9
9
|
import * as i4 from 'ngx-quill';
|
|
10
10
|
import { QuillModule } from 'ngx-quill';
|
|
11
11
|
import { BehaviorSubject, Observable, Subject } from 'rxjs';
|
|
12
|
-
import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
|
|
12
|
+
import { debounceTime, distinctUntilChanged, finalize } from 'rxjs/operators';
|
|
13
13
|
import * as i1$1 from '@angular/router';
|
|
14
14
|
import * as i1$3 from '@angular/platform-browser';
|
|
15
15
|
|
|
@@ -304,13 +304,13 @@ const richtextFieldNormalizer = (field) => {
|
|
|
304
304
|
/*
|
|
305
305
|
* @Author: Alexander.Vangelov@vonage.com
|
|
306
306
|
* @Date: 2021-03-22 17:09:12
|
|
307
|
-
* @Last Modified by: Alexander.Vangelov@vonage.com
|
|
308
|
-
* @Last Modified time:
|
|
307
|
+
* @Last Modified by: Alexander.Vangelov@vonage.com
|
|
308
|
+
* @Last Modified time: 2026-02-11 20:29:50
|
|
309
309
|
*/
|
|
310
310
|
const uniqueNameFilter = (fields, uniqFieldNames, allowDuplicates = false) => {
|
|
311
311
|
if (fields instanceof Array) {
|
|
312
312
|
return allowDuplicates ? fields : fields.filter((f) => {
|
|
313
|
-
if (f.name) {
|
|
313
|
+
if (f.name && !f.visible && !f.hidden) {
|
|
314
314
|
if (uniqFieldNames.indexOf(f.name) !== -1) {
|
|
315
315
|
return false;
|
|
316
316
|
}
|
|
@@ -1023,10 +1023,10 @@ class MetaHttpClient {
|
|
|
1023
1023
|
};
|
|
1024
1024
|
return options;
|
|
1025
1025
|
}
|
|
1026
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1027
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1026
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaHttpClient, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1027
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaHttpClient, providedIn: 'root' }); }
|
|
1028
1028
|
}
|
|
1029
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1029
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaHttpClient, decorators: [{
|
|
1030
1030
|
type: Injectable,
|
|
1031
1031
|
args: [{
|
|
1032
1032
|
providedIn: 'root'
|
|
@@ -1161,10 +1161,10 @@ class MetaResourceService {
|
|
|
1161
1161
|
return this.httpClient.post(`${this.baseResourceUrl}`, payload);
|
|
1162
1162
|
}
|
|
1163
1163
|
}
|
|
1164
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1165
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1164
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceService, deps: [{ token: MetaHttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1165
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceService, providedIn: 'root' }); }
|
|
1166
1166
|
}
|
|
1167
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceService, decorators: [{
|
|
1168
1168
|
type: Injectable,
|
|
1169
1169
|
args: [{
|
|
1170
1170
|
providedIn: 'root'
|
|
@@ -1210,10 +1210,10 @@ class MetaContextService {
|
|
|
1210
1210
|
delete this.onClick2Dial;
|
|
1211
1211
|
}
|
|
1212
1212
|
}
|
|
1213
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1214
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1213
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1214
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaContextService, providedIn: 'root' }); }
|
|
1215
1215
|
}
|
|
1216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1216
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaContextService, decorators: [{
|
|
1217
1217
|
type: Injectable,
|
|
1218
1218
|
args: [{
|
|
1219
1219
|
providedIn: 'root'
|
|
@@ -1291,10 +1291,10 @@ class MetaMsgService {
|
|
|
1291
1291
|
}
|
|
1292
1292
|
}
|
|
1293
1293
|
}
|
|
1294
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1295
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1294
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaMsgService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1295
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaMsgService, providedIn: 'root' }); }
|
|
1296
1296
|
}
|
|
1297
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1297
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaMsgService, decorators: [{
|
|
1298
1298
|
type: Injectable,
|
|
1299
1299
|
args: [{
|
|
1300
1300
|
providedIn: 'root'
|
|
@@ -1405,10 +1405,10 @@ class MetaReferenceService {
|
|
|
1405
1405
|
});
|
|
1406
1406
|
return modalObservable;
|
|
1407
1407
|
}
|
|
1408
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1409
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
1408
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaReferenceService, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1409
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaReferenceService, providedIn: 'root' }); }
|
|
1410
1410
|
}
|
|
1411
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1411
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaReferenceService, decorators: [{
|
|
1412
1412
|
type: Injectable,
|
|
1413
1413
|
args: [{
|
|
1414
1414
|
providedIn: 'root'
|
|
@@ -1450,7 +1450,7 @@ const extractBooleanValueBySmartProp = (rootValue, visibleObj) => {
|
|
|
1450
1450
|
* @Author: Alexander.Vangelov@vonage.com
|
|
1451
1451
|
* @Date: 2019-09-19 17:34:44
|
|
1452
1452
|
* @Last Modified by: Alexander.Vangelov@vonage.com
|
|
1453
|
-
* @Last Modified time:
|
|
1453
|
+
* @Last Modified time: 2026-02-12 08:11:45
|
|
1454
1454
|
*/
|
|
1455
1455
|
// export interface IMetaField<T extends FieldAbstract> {
|
|
1456
1456
|
// meta: any;
|
|
@@ -1569,20 +1569,27 @@ class FieldAbstract {
|
|
|
1569
1569
|
else {
|
|
1570
1570
|
const value = extractValueBySmartProp(this.parent, par);
|
|
1571
1571
|
const parValue = value ? (value.id || value.value || value) : value;
|
|
1572
|
-
|
|
1572
|
+
if (this.meta.hidden[par] instanceof Array) {
|
|
1573
|
+
this.meta.$hidden = this.meta.hidden[par].indexOf(parValue) !== -1;
|
|
1574
|
+
}
|
|
1575
|
+
else {
|
|
1576
|
+
this.meta.$hidden = this.meta.hidden[par] === parValue;
|
|
1577
|
+
}
|
|
1573
1578
|
}
|
|
1574
1579
|
};
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1580
|
+
setTimeout(() => {
|
|
1581
|
+
for (const par of Object.keys(this.meta.hidden)) {
|
|
1582
|
+
setHiddenByPropertyConfig(par);
|
|
1583
|
+
this.parentChangeSubject.subscribe((value) => {
|
|
1584
|
+
if (value && value.hasOwnProperty(par.split('.')[0])) {
|
|
1585
|
+
setHiddenByPropertyConfig(par);
|
|
1586
|
+
if (this.meta.$hidden) {
|
|
1587
|
+
delete this.parent[this.meta.name];
|
|
1588
|
+
}
|
|
1582
1589
|
}
|
|
1583
|
-
}
|
|
1584
|
-
}
|
|
1585
|
-
}
|
|
1590
|
+
});
|
|
1591
|
+
}
|
|
1592
|
+
}, 0);
|
|
1586
1593
|
}
|
|
1587
1594
|
else if (typeof (this.meta.hidden) === 'string') {
|
|
1588
1595
|
if (this.meta.hidden.toUpperCase() === 'CREATE') {
|
|
@@ -1611,20 +1618,27 @@ class FieldAbstract {
|
|
|
1611
1618
|
else {
|
|
1612
1619
|
const value = extractValueBySmartProp(this.parent, par);
|
|
1613
1620
|
const parValue = value ? (value.id || value.value || value) : value;
|
|
1614
|
-
|
|
1621
|
+
if (this.meta.visible[par] instanceof Array) {
|
|
1622
|
+
this.meta.$invisible = this.meta.visible[par].indexOf(parValue) === -1;
|
|
1623
|
+
}
|
|
1624
|
+
else {
|
|
1625
|
+
this.meta.$invisible = this.meta.visible[par] !== parValue;
|
|
1626
|
+
}
|
|
1615
1627
|
}
|
|
1616
1628
|
};
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
this.parentChangeSubject.subscribe(() => {
|
|
1620
|
-
// if (value && value.hasOwnProperty(par.split('.')[0])) {
|
|
1629
|
+
setTimeout(() => {
|
|
1630
|
+
for (const par of Object.keys(this.meta.visible)) {
|
|
1621
1631
|
setInvisibleByPropertyConfig(par);
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1632
|
+
this.parentChangeSubject.subscribe(() => {
|
|
1633
|
+
// if (value && value.hasOwnProperty(par.split('.')[0])) {
|
|
1634
|
+
setInvisibleByPropertyConfig(par);
|
|
1635
|
+
if (this.meta.$invisible) {
|
|
1636
|
+
delete this.parent[this.meta.name];
|
|
1637
|
+
}
|
|
1638
|
+
// }
|
|
1639
|
+
});
|
|
1640
|
+
}
|
|
1641
|
+
}, 0);
|
|
1628
1642
|
}
|
|
1629
1643
|
else if (typeof (this.meta.visible) === 'string') {
|
|
1630
1644
|
if (this.meta.visible.toUpperCase() === 'CREATE') {
|
|
@@ -1693,7 +1707,7 @@ class FieldAbstract {
|
|
|
1693
1707
|
this.parent[this.meta.name] = this.modelToValue(model, this.meta.valueType);
|
|
1694
1708
|
}
|
|
1695
1709
|
this.onChange.emit(model);
|
|
1696
|
-
this.onSubjectChange(
|
|
1710
|
+
this.onSubjectChange(this.parent[this.meta.name]);
|
|
1697
1711
|
// console.log('onChange', model);
|
|
1698
1712
|
this.changeEvent.initMouseEvent('change', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
|
|
1699
1713
|
this.elementRef.nativeElement.dispatchEvent(this.changeEvent);
|
|
@@ -1717,10 +1731,10 @@ class FieldAbstract {
|
|
|
1717
1731
|
}
|
|
1718
1732
|
});
|
|
1719
1733
|
}
|
|
1720
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1721
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
1734
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldAbstract, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1735
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: FieldAbstract, isStandalone: true, ngImport: i0 }); }
|
|
1722
1736
|
}
|
|
1723
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1737
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldAbstract, decorators: [{
|
|
1724
1738
|
type: Directive
|
|
1725
1739
|
}] });
|
|
1726
1740
|
class MetaElem {
|
|
@@ -1798,10 +1812,10 @@ class MetaFieldContentDirective {
|
|
|
1798
1812
|
constructor(viewContainerRef) {
|
|
1799
1813
|
this.viewContainerRef = viewContainerRef;
|
|
1800
1814
|
}
|
|
1801
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1802
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
1815
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFieldContentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1816
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: MetaFieldContentDirective, isStandalone: false, selector: "[metaFieldContent]", ngImport: i0 }); }
|
|
1803
1817
|
}
|
|
1804
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1818
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFieldContentDirective, decorators: [{
|
|
1805
1819
|
type: Directive,
|
|
1806
1820
|
args: [{
|
|
1807
1821
|
selector: '[metaFieldContent]',
|
|
@@ -1846,12 +1860,12 @@ class MetaField extends FieldAbstract {
|
|
|
1846
1860
|
enumerable: false
|
|
1847
1861
|
});
|
|
1848
1862
|
}
|
|
1849
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
1850
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", 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" }, 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]" }] }); }
|
|
1863
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaField, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1864
|
+
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" }, 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]" }] }); }
|
|
1851
1865
|
}
|
|
1852
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
1866
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaField, decorators: [{
|
|
1853
1867
|
type: Component,
|
|
1854
|
-
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"] }]
|
|
1868
|
+
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"] }]
|
|
1855
1869
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { meta: [{
|
|
1856
1870
|
type: Input
|
|
1857
1871
|
}], parent: [{
|
|
@@ -2061,10 +2075,10 @@ class MetaLayout {
|
|
|
2061
2075
|
this.el.nativeElement.style.setProperty(key, metaTheme.properties[key]);
|
|
2062
2076
|
}
|
|
2063
2077
|
}
|
|
2064
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
2065
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
2078
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaLayout, deps: [{ token: i0.ViewContainerRef }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaReferenceService }, { token: MetaMsgService }, { token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2079
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaLayout, isStandalone: false, selector: "vgip-meta-layout", inputs: { meta: "meta", resource: "resource", integration: "integration", type: "type", preview: "preview", theme: "theme", delegate: "delegate" }, usesOnChanges: true, ngImport: i0, template: "<div *ngFor='let section of meta.sections' class='Vlt-section' [ngClass]=\"{ shown: showAll || section.visible || (!meta.oneTimeOptional && !section.$optional) || (meta.oneTimeOptional && !optionalFieldsCount) }\">\n\t<h5 *ngIf='section.label' class=\"Vlt-section__title\">{{section.label}}</h5>\n\t<div style='overflow: visible;' [ngClass]=\"{ 'for-preview': preview }\">\n\t\t<small *ngIf='section.description' class=\"Vlt-form__element__hint\">{{section.description}}</small>\n\t\t<div>\n\t\t\t<ng-container *ngFor='let field of section.fields'>\n\t\t\t\t<vgip-meta-field *ngIf='!field.$hidden && (showAll || section.visible || !field.$optional)' [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\t\t\t</ng-container>\n\t\t</div>\n\t</div>\n</div>\n<div *ngIf='isPersistedResource && meta.children && preview'>\n\t<div *ngFor='let child of meta.children'>\n\t\t<h5 class='Vlt-children__title'>\n\t\t\t<svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-stack\" /></svg> \n\t\t\t{{child.label}} <span class='Vlt-grey'>({{(resource[child.name] || []).length}})</span>\n\t\t</h5>\n\t\t<div *ngFor=\"let c of resource[child.name]\" style='position: relative;'>\n\n\t\t\t<div class=\"Vlt-card Vlt-bg-white\">\n\t\t\t\t<div class=\"Vlt-card__content Vlt-btn-on-hover\">\n\t\t\t\t\t<h5>{{childResourceCardLabel(c)}}</h5>\n\t\t\t\t\t<div style='font-size: 12px; line-height: 16px;'>\n\t\t\t\t\t\tCreated: <span class='Vlt-black'>{{c._vgis.createdDate | date:'mediumDate'}}</span>\n\t\t\t\t\t\tEdited: <span class='Vlt-black'>{{c._vgis.modifiedDate | date:'medium'}}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{c._vgis.resourceType}}</div>\n\t\t\t\t\t<div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n\t\t\t\t\t\t<a *ngIf='c._vgis.externalLink' 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\t\t\t\t\t\t<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\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<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\t\t\t<svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{child.reference.label}}\n\t\t</button>\n\t</div>\n</div>\n<div *ngIf='!(meta.oneTimeOptional && showAll)' [ngClass]='{ centered: !meta.oneTimeOptional }'>\n\t<button *ngIf='!preview && optionalFieldsCount' type='button' (click)='toggleOptionalFields()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--link more-button\" style='margin: 0; margin-bottom: 10px;'>\n\t\t<svg><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-chevron-{{ showAll ? 'up' : 'down' }}\"/></svg>\n\t\t{{ showAll ? 'Hide' : 'Show' }} Optional Fields ({{optionalFieldsCount}})\n\t</button>\n</div>\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: "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: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
|
|
2066
2080
|
}
|
|
2067
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2081
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaLayout, decorators: [{
|
|
2068
2082
|
type: Component,
|
|
2069
2083
|
args: [{ selector: "vgip-meta-layout", standalone: false, template: "<div *ngFor='let section of meta.sections' class='Vlt-section' [ngClass]=\"{ shown: showAll || section.visible || (!meta.oneTimeOptional && !section.$optional) || (meta.oneTimeOptional && !optionalFieldsCount) }\">\n\t<h5 *ngIf='section.label' class=\"Vlt-section__title\">{{section.label}}</h5>\n\t<div style='overflow: visible;' [ngClass]=\"{ 'for-preview': preview }\">\n\t\t<small *ngIf='section.description' class=\"Vlt-form__element__hint\">{{section.description}}</small>\n\t\t<div>\n\t\t\t<ng-container *ngFor='let field of section.fields'>\n\t\t\t\t<vgip-meta-field *ngIf='!field.$hidden && (showAll || section.visible || !field.$optional)' [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\t\t\t</ng-container>\n\t\t</div>\n\t</div>\n</div>\n<div *ngIf='isPersistedResource && meta.children && preview'>\n\t<div *ngFor='let child of meta.children'>\n\t\t<h5 class='Vlt-children__title'>\n\t\t\t<svg class=\"Vlt-icon\"><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-stack\" /></svg> \n\t\t\t{{child.label}} <span class='Vlt-grey'>({{(resource[child.name] || []).length}})</span>\n\t\t</h5>\n\t\t<div *ngFor=\"let c of resource[child.name]\" style='position: relative;'>\n\n\t\t\t<div class=\"Vlt-card Vlt-bg-white\">\n\t\t\t\t<div class=\"Vlt-card__content Vlt-btn-on-hover\">\n\t\t\t\t\t<h5>{{childResourceCardLabel(c)}}</h5>\n\t\t\t\t\t<div style='font-size: 12px; line-height: 16px;'>\n\t\t\t\t\t\tCreated: <span class='Vlt-black'>{{c._vgis.createdDate | date:'mediumDate'}}</span>\n\t\t\t\t\t\tEdited: <span class='Vlt-black'>{{c._vgis.modifiedDate | date:'medium'}}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{c._vgis.resourceType}}</div>\n\t\t\t\t\t<div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n\t\t\t\t\t\t<a *ngIf='c._vgis.externalLink' 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\t\t\t\t\t\t<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\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<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\t\t\t<svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>{{child.reference.label}}\n\t\t</button>\n\t</div>\n</div>\n<div *ngIf='!(meta.oneTimeOptional && showAll)' [ngClass]='{ centered: !meta.oneTimeOptional }'>\n\t<button *ngIf='!preview && optionalFieldsCount' type='button' (click)='toggleOptionalFields()' class=\"Vlt-btn Vlt-btn--small Vlt-btn--link more-button\" style='margin: 0; margin-bottom: 10px;'>\n\t\t<svg><use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-chevron-{{ showAll ? 'up' : 'down' }}\"/></svg>\n\t\t{{ showAll ? 'Hide' : 'Show' }} Optional Fields ({{optionalFieldsCount}})\n\t</button>\n</div>\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"] }]
|
|
2070
2084
|
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: MetaResourceService }, { type: MetaReferenceService }, { type: MetaMsgService }, { type: MetaContextService }], propDecorators: { meta: [{
|
|
@@ -2103,10 +2117,10 @@ class MetaAutofocusDirective {
|
|
|
2103
2117
|
}, 300);
|
|
2104
2118
|
}
|
|
2105
2119
|
}
|
|
2106
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
2107
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.
|
|
2120
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaAutofocusDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2121
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: MetaAutofocusDirective, isStandalone: false, selector: "[vgipMetaFormAutofocus]", inputs: { vgipMetaFormAutofocus: "vgipMetaFormAutofocus" }, ngImport: i0 }); }
|
|
2108
2122
|
}
|
|
2109
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2123
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaAutofocusDirective, decorators: [{
|
|
2110
2124
|
type: Directive,
|
|
2111
2125
|
args: [{
|
|
2112
2126
|
// eslint-disable-next-line
|
|
@@ -2239,8 +2253,20 @@ class MetaResource {
|
|
|
2239
2253
|
if (!refresh && this.isPersistent && (!this.isEditable || this.editMode === false || this.meta.layout.children)) {
|
|
2240
2254
|
this.edit = false;
|
|
2241
2255
|
}
|
|
2242
|
-
|
|
2243
|
-
|
|
2256
|
+
if (this.isPersistent && meta.layout.isCustom && meta.layout.origLayoutId && this.integrationCode === 'HUBSPOT') { // VGIS-10996, TBD enable for all integrations when there is room for testing
|
|
2257
|
+
this.service.getMetadata(meta.layout.origLayoutId, refresh).pipe(finalize(() => {
|
|
2258
|
+
delete this.busy;
|
|
2259
|
+
this.getDetails();
|
|
2260
|
+
})).subscribe({
|
|
2261
|
+
next: (parentMeta) => {
|
|
2262
|
+
this.extractFieldsToPreserve(metaNormalizer(parentMeta, this.integrationCode, this.resource.resourceType));
|
|
2263
|
+
}
|
|
2264
|
+
});
|
|
2265
|
+
}
|
|
2266
|
+
else {
|
|
2267
|
+
delete this.busy;
|
|
2268
|
+
this.getDetails();
|
|
2269
|
+
}
|
|
2244
2270
|
this.getFieldsMap();
|
|
2245
2271
|
},
|
|
2246
2272
|
error: (metaError) => {
|
|
@@ -2285,7 +2311,7 @@ class MetaResource {
|
|
|
2285
2311
|
if (resource._vgis.eventId) {
|
|
2286
2312
|
this.metaContext.vgipEventId = resource._vgis.eventId;
|
|
2287
2313
|
}
|
|
2288
|
-
this.lockedLayoutId = resource._vgis.layoutId || resource._vgis.recordTypeId
|
|
2314
|
+
// this.lockedLayoutId = resource._vgis.layoutId || resource._vgis.recordTypeId // not needed anymore, TBD: cleanup code
|
|
2289
2315
|
// sample orig layoutId: 012000000000000AAA, custom layoutId: 66ccbb3d1810985aa3a16202:012000000000000AAA
|
|
2290
2316
|
// so if the current layout is not inherited from the original one, reload the orig meta
|
|
2291
2317
|
// CCOMNI-155 - allow form layout change (*unless we are certain that the current and locked match)
|
|
@@ -2301,7 +2327,8 @@ class MetaResource {
|
|
|
2301
2327
|
}
|
|
2302
2328
|
/* eslint-enable no-underscore-dangle */
|
|
2303
2329
|
for (const p in resource) {
|
|
2304
|
-
if ((typeof (resource[p]) !== 'undefined') && (this.fieldNames.indexOf(p) !== -1 || p === '_vgis')
|
|
2330
|
+
if ((typeof (resource[p]) !== 'undefined') && (this.fieldNames.indexOf(p) !== -1 || p === '_vgis') ||
|
|
2331
|
+
(this.resource.preserveFieldsNames || []).indexOf(p) !== -1) {
|
|
2305
2332
|
this.model[p] = resource[p];
|
|
2306
2333
|
}
|
|
2307
2334
|
}
|
|
@@ -2603,12 +2630,28 @@ class MetaResource {
|
|
|
2603
2630
|
e.initEvent('click', true, false);
|
|
2604
2631
|
this.el.nativeElement.dispatchEvent(e);
|
|
2605
2632
|
}
|
|
2606
|
-
|
|
2607
|
-
|
|
2633
|
+
extractFieldsToPreserve(parentMeta) {
|
|
2634
|
+
const extractPreserveSectionFields = (s) => {
|
|
2635
|
+
for (const f of s.fields) {
|
|
2636
|
+
if (f.name && f.flags?.updatable !== false) {
|
|
2637
|
+
this.resource.preserveFieldsNames.push(f.name);
|
|
2638
|
+
}
|
|
2639
|
+
if (f.fields && f.fields.length) {
|
|
2640
|
+
extractPreserveSectionFields(f);
|
|
2641
|
+
}
|
|
2642
|
+
}
|
|
2643
|
+
};
|
|
2644
|
+
this.resource.preserveFieldsNames = [];
|
|
2645
|
+
for (const s of (parentMeta.layout?.sections || [])) {
|
|
2646
|
+
extractPreserveSectionFields(s);
|
|
2647
|
+
}
|
|
2648
|
+
}
|
|
2649
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResource, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: MetaResourceService }, { token: MetaContextService }, { token: MetaMsgService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2650
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaResource, isStandalone: false, selector: "vgip-meta-resource", inputs: { resource: "resource", model: "model", metaResourceServiceDelegated: "metaResourceServiceDelegated", theme: "theme", editMode: "editMode" }, outputs: { done: "done", resourceChange: "resourceChange" }, viewQueries: [{ propertyName: "resourceForm", first: true, predicate: ["resourceForm"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div *ngIf='generalError' class=\"Vlt-callout Vlt-callout--critical\" style='overflow: auto; margin: 20px;'>\n\t<i></i>\n\t<div class=\"Vlt-callout__content\">\n\t\t<p>{{generalError}}</p>\n\t</div>\n</div>\n<div *ngIf='!meta' class=\"Vlt-progress\">\n\t<div class=\"Vlt-progress__bar\" [ngClass]=\"{ loading: metaLoading }\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuetext=\"Loading Metadata\" aria-valuemax=\"100\"></div>\n</div>\n<form [vgipMetaFormAutofocus]='!resource || !resource.externalId' *ngIf='meta && !generalError' #resourceForm=\"ngForm\" [name]='resource.resourceType' (ngSubmit)='submit(resourceForm)' (change)='onFormChange()' novalidate>\n\t<div class='form-content' style='overflow: hidden;'>\n\t\t<div [ngClass]=\"{ 'Vlt-callout--dismissed': !formErrors }\" class=\"Vlt-callout Vlt-callout--banner Vlt-callout--critical\">\n\t\t\t<i></i>\n\t\t\t<div class=\"Vlt-callout__content\" style=\"margin-top: auto;\">\n\t\t\t\t<p>There is a problem with one or more fields</p>\n\t\t\t\t<small style='font-weight: 600; font-size: 1.0em;' *ngIf='formErrors'>{{ formErrors.message || formErrors }}</small>\n\t\t\t</div>\n\t\t\t<button type='button' class=\"Vlt-callout__dismiss\" (click)='clearFormErrors()' aria-label=\"Dismiss\"></button>\n\t\t</div>\n\t\t<div class=\"Vlt-card__content\" style='min-height: 40px;'>\n\t\t\t<vgip-meta-layout *ngIf='edit' [meta]='meta.layout' [resource]='model' [preview]='false' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit'></vgip-meta-layout>\n\t\t\t<vgip-meta-layout *ngIf='!edit' [meta]='meta.layout' [resource]='model' [preview]='true' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit' [attr.data-vrn]='resourceVrn'></vgip-meta-layout>\n\t\t</div>\n\t</div>\n\t<div class=\"Vlt-card__footer\">\n\t\t<button class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--outline\" type='button' aria-label='Cancel' (click)='close()'>\n\t\t\t{{ edit ? 'Cancel' : 'Close' }}\n\t\t</button>\n\t\t<button *ngIf='edit' class=\"Vlt-btn Vlt-btn--app\" [ngClass]=\"{ 'Vlt-btn--primary': isPersistent, 'Vlt-btn--secondary': !isPersistent }\" type='submit'>\n\t\t\t{{ (resource && resource.externalId) ? 'Update' : 'Create' }}\n\t\t</button>\n\t\t<button (click)='setEditMode()' *ngIf='!edit && isEditable' [disabled]='!isEditable' class=\"Vlt-btn Vlt-btn--app Vlt-btn--primary\" type='button' aria-label='Edit'>\n\t\t\tEdit\n\t\t</button>\n\t\t<div style='margin-right: 8px; flex: 1;'>\n\t\t\t<div *ngIf='meta.availableLayouts && meta.availableLayouts.length' class=\"Vlt-form__element Vlt-form__element--big\" style='padding: 0; margin: -8px -18px -8px 0;'>\n\t\t\t\t<div class=\"Vlt-select\">\n\t\t\t\t\t<label style='all: inherit;'>\n\t\t\t\t\t\t<select style='border: 0; margin-top: 3px; background: transparent;' (change)='changeLayout()' [(ngModel)]='currentLayoutId' [ngModelOptions]='{ standalone: true }' [disabled]='lockedLayoutId === currentLayoutId'>\n\t\t\t\t\t\t\t<option selected disabled>Select layout</option>\n\t\t\t\t\t\t\t<option *ngFor='let layout of meta.availableLayouts' [ngValue]='layout.id'>{{layout.name}}</option>\n\t\t\t\t\t\t</select>\n\t\t\t\t\t\t<label>Layout</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n\t\t\t\t\t</label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div class=\"Vlt-dropdown resource-menu\" [ngClass]=\"{ 'Vlt-dropdown--expanded': resourceMenuVisible }\" style='margin-left: 2px;'>\n\t\t\t<div class=\"Vlt-dropdown__panel\" style='bottom: 40px; right: -4px; top: initial;'>\n\t\t\t\t<div class=\"Vlt-dropdown__panel__content\">\n\t\t\t\t\t<a href='#' class=\"Vlt-dropdown__link\" (click)='loadMetadata(currentLayoutId, true, $event)'>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<svg class='Vlt-icon Vlt-icon--smaller'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-refresh\"/></svg> Refresh metadata\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div class=\"Vlt-dropdown__trigger\">\n\t\t\t\t<button type='button' (click)='openResourceMenu()' class=\"Vlt-btn Vlt-btn--link\" aria-label='Resource menu'>\n\t\t\t\t\t<svg class='Vlt-icon Vlt-icon--small' style='margin: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-more-v-negative\"/></svg>\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</form>\n<div class='busy-mask' [ngClass]=\"{ active: busy }\">\n\t<div style='height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;'>\n\t\t<div class=\"Vlt-spinner\"></div>\n\t</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: 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.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: MetaLayout, selector: "vgip-meta-layout", inputs: ["meta", "resource", "integration", "type", "preview", "theme", "delegate"] }, { kind: "directive", type: MetaAutofocusDirective, selector: "[vgipMetaFormAutofocus]", inputs: ["vgipMetaFormAutofocus"] }] }); }
|
|
2608
2651
|
}
|
|
2609
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2652
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResource, decorators: [{
|
|
2610
2653
|
type: Component,
|
|
2611
|
-
args: [{ selector: 'vgip-meta-resource', standalone: false, template: "<div *ngIf='generalError' class=\"Vlt-callout Vlt-callout--critical\" style='overflow: auto; margin: 20px;'>\n\t<i></i>\n\t<div class=\"Vlt-callout__content\">\n\t\t<p>{{generalError}}</p>\n\t</div>\n</div>\n<div *ngIf='!meta' class=\"Vlt-progress\">\n\t<div class=\"Vlt-progress__bar\" [ngClass]=\"{ loading: metaLoading }\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuetext=\"Loading Metadata\" aria-valuemax=\"100\"></div>\n</div>\n<form [vgipMetaFormAutofocus]='!resource || !resource.externalId' *ngIf='meta && !generalError' #resourceForm=\"ngForm\" [name]='resource.resourceType' (ngSubmit)='submit(resourceForm)' (change)='onFormChange()' novalidate>\n\t<div class='form-content' style='overflow: hidden;'>\n\t\t<div [ngClass]=\"{ 'Vlt-callout--dismissed': !formErrors }\" class=\"Vlt-callout Vlt-callout--banner Vlt-callout--critical\">\n\t\t\t<i></i>\n\t\t\t<div class=\"Vlt-callout__content\" style=\"margin-top: auto;\">\n\t\t\t\t<p>There is a problem with one or more fields</p>\n\t\t\t\t<small style='font-weight: 600; font-size: 1.0em;' *ngIf='formErrors'>{{ formErrors.message || formErrors }}</small>\n\t\t\t</div>\n\t\t\t<button type='button' class=\"Vlt-callout__dismiss\" (click)='clearFormErrors()' aria-label=\"Dismiss\"></button>\n\t\t</div>\n\t\t<div class=\"Vlt-card__content\" style='min-height: 40px;'>\n\t\t\t<vgip-meta-layout *ngIf='edit' [meta]='meta.layout' [resource]='model' [preview]='false' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit'></vgip-meta-layout>\n\t\t\t<vgip-meta-layout *ngIf='!edit' [meta]='meta.layout' [resource]='model' [preview]='true' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit' [attr.data-vrn]='resourceVrn'></vgip-meta-layout>\n\t\t</div>\n\t</div>\n\t<div class=\"Vlt-card__footer\">\n\t\t<button class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--outline\" type='button' aria-label='Cancel' (click)='close()'>\n\t\t\t{{ edit ? 'Cancel' : 'Close' }}\n\t\t</button>\n\t\t<button *ngIf='edit' class=\"Vlt-btn Vlt-btn--app\" [ngClass]=\"{ 'Vlt-btn--primary': isPersistent, 'Vlt-btn--secondary': !isPersistent }\" type='submit'>\n\t\t\t{{ (resource && resource.externalId) ? 'Update' : 'Create' }}\n\t\t</button>\n\t\t<button (click)='setEditMode()' *ngIf='!edit && isEditable' [disabled]='!isEditable' class=\"Vlt-btn Vlt-btn--app Vlt-btn--primary\" type='button' aria-label='Edit'>\n\t\t\tEdit\n\t\t</button>\n\t\t<div style='margin-right: 8px; flex: 1;'>\n\t\t\t<div *ngIf='meta.availableLayouts && meta.availableLayouts.length' class=\"Vlt-form__element Vlt-form__element--big\" style='padding: 0; margin: -8px -18px -8px 0;'>\n\t\t\t\t<div class=\"Vlt-select\">\n\t\t\t\t\t<label style='all: inherit;'>\n\t\t\t\t\t\t<select style='border: 0; margin-top: 3px; background: transparent;' (change)='changeLayout()' [(ngModel)]='currentLayoutId' [ngModelOptions]='{ standalone: true }' [disabled]='lockedLayoutId === currentLayoutId'>\n\t\t\t\t\t\t\t<option selected disabled>Select layout</option>\n\t\t\t\t\t\t\t<option *ngFor='let layout of meta.availableLayouts' [ngValue]='layout.id'>{{layout.name}}</option>\n\t\t\t\t\t\t</select>\n\t\t\t\t\t\t<label>Layout</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n\t\t\t\t\t</label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div class=\"Vlt-dropdown resource-menu\" [ngClass]=\"{ 'Vlt-dropdown--expanded': resourceMenuVisible }\" style='margin-left: 2px;'>\n\t\t\t<div class=\"Vlt-dropdown__panel\" style='bottom: 40px; right: -4px; top: initial;'>\n\t\t\t\t<div class=\"Vlt-dropdown__panel__content\">\n\t\t\t\t\t<a href='#' class=\"Vlt-dropdown__link\" (click)='loadMetadata(currentLayoutId, true, $event)'>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<svg class='Vlt-icon Vlt-icon--smaller'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-refresh\"/></svg> Refresh metadata\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div class=\"Vlt-dropdown__trigger\">\n\t\t\t\t<button type='button' (click)='openResourceMenu()' class=\"Vlt-btn Vlt-btn--link\" aria-label='Resource menu'>\n\t\t\t\t\t<svg class='Vlt-icon Vlt-icon--small' style='margin: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-more-v-negative\"/></svg>\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</form>\n<div class='busy-mask' [ngClass]=\"{ active: busy }\">\n\t<div style='height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;'>\n\t\t<div class=\"Vlt-spinner\"></div>\n\t</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
|
|
2654
|
+
args: [{ selector: 'vgip-meta-resource', standalone: false, template: "<div *ngIf='generalError' class=\"Vlt-callout Vlt-callout--critical\" style='overflow: auto; margin: 20px;'>\n\t<i></i>\n\t<div class=\"Vlt-callout__content\">\n\t\t<p>{{generalError}}</p>\n\t</div>\n</div>\n<div *ngIf='!meta' class=\"Vlt-progress\">\n\t<div class=\"Vlt-progress__bar\" [ngClass]=\"{ loading: metaLoading }\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuetext=\"Loading Metadata\" aria-valuemax=\"100\"></div>\n</div>\n<form [vgipMetaFormAutofocus]='!resource || !resource.externalId' *ngIf='meta && !generalError' #resourceForm=\"ngForm\" [name]='resource.resourceType' (ngSubmit)='submit(resourceForm)' (change)='onFormChange()' novalidate>\n\t<div class='form-content' style='overflow: hidden;'>\n\t\t<div [ngClass]=\"{ 'Vlt-callout--dismissed': !formErrors }\" class=\"Vlt-callout Vlt-callout--banner Vlt-callout--critical\">\n\t\t\t<i></i>\n\t\t\t<div class=\"Vlt-callout__content\" style=\"margin-top: auto;\">\n\t\t\t\t<p>There is a problem with one or more fields</p>\n\t\t\t\t<small style='font-weight: 600; font-size: 1.0em;' *ngIf='formErrors'>{{ formErrors.message || formErrors }}</small>\n\t\t\t</div>\n\t\t\t<button type='button' class=\"Vlt-callout__dismiss\" (click)='clearFormErrors()' aria-label=\"Dismiss\"></button>\n\t\t</div>\n\t\t<div class=\"Vlt-card__content\" style='min-height: 40px;'>\n\t\t\t<vgip-meta-layout *ngIf='edit' [meta]='meta.layout' [resource]='model' [preview]='false' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit'></vgip-meta-layout>\n\t\t\t<vgip-meta-layout *ngIf='!edit' [meta]='meta.layout' [resource]='model' [preview]='true' [integration]='meta.integration' [type]='resource.resourceType' theme='inherit' [attr.data-vrn]='resourceVrn'></vgip-meta-layout>\n\t\t</div>\n\t</div>\n\t<div class=\"Vlt-card__footer\">\n\t\t<button class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--outline\" type='button' aria-label='Cancel' (click)='close()'>\n\t\t\t{{ edit ? 'Cancel' : 'Close' }}\n\t\t</button>\n\t\t<button *ngIf='edit' class=\"Vlt-btn Vlt-btn--app\" [ngClass]=\"{ 'Vlt-btn--primary': isPersistent, 'Vlt-btn--secondary': !isPersistent }\" type='submit'>\n\t\t\t{{ (resource && resource.externalId) ? 'Update' : 'Create' }}\n\t\t</button>\n\t\t<button (click)='setEditMode()' *ngIf='!edit && isEditable' [disabled]='!isEditable' class=\"Vlt-btn Vlt-btn--app Vlt-btn--primary\" type='button' aria-label='Edit'>\n\t\t\tEdit\n\t\t</button>\n\t\t<div style='margin-right: 8px; flex: 1;'>\n\t\t\t<div *ngIf='meta.availableLayouts && meta.availableLayouts.length' class=\"Vlt-form__element Vlt-form__element--big\" style='padding: 0; margin: -8px -18px -8px 0;'>\n\t\t\t\t<div class=\"Vlt-select\">\n\t\t\t\t\t<label style='all: inherit;'>\n\t\t\t\t\t\t<select style='border: 0; margin-top: 3px; background: transparent;' (change)='changeLayout()' [(ngModel)]='currentLayoutId' [ngModelOptions]='{ standalone: true }' [disabled]='lockedLayoutId === currentLayoutId'>\n\t\t\t\t\t\t\t<option selected disabled>Select layout</option>\n\t\t\t\t\t\t\t<option *ngFor='let layout of meta.availableLayouts' [ngValue]='layout.id'>{{layout.name}}</option>\n\t\t\t\t\t\t</select>\n\t\t\t\t\t\t<label>Layout</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n\t\t\t\t\t</label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t\t<div class=\"Vlt-dropdown resource-menu\" [ngClass]=\"{ 'Vlt-dropdown--expanded': resourceMenuVisible }\" style='margin-left: 2px;'>\n\t\t\t<div class=\"Vlt-dropdown__panel\" style='bottom: 40px; right: -4px; top: initial;'>\n\t\t\t\t<div class=\"Vlt-dropdown__panel__content\">\n\t\t\t\t\t<a href='#' class=\"Vlt-dropdown__link\" (click)='loadMetadata(currentLayoutId, true, $event)'>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<svg class='Vlt-icon Vlt-icon--smaller'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-refresh\"/></svg> Refresh metadata\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</a>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div class=\"Vlt-dropdown__trigger\">\n\t\t\t\t<button type='button' (click)='openResourceMenu()' class=\"Vlt-btn Vlt-btn--link\" aria-label='Resource menu'>\n\t\t\t\t\t<svg class='Vlt-icon Vlt-icon--small' style='margin: 0;'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-more-v-negative\"/></svg>\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</form>\n<div class='busy-mask' [ngClass]=\"{ active: busy }\">\n\t<div style='height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;'>\n\t\t<div class=\"Vlt-spinner\"></div>\n\t</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"] }]
|
|
2612
2655
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: MetaResourceService }, { type: MetaContextService }, { type: MetaMsgService }], propDecorators: { resource: [{
|
|
2613
2656
|
type: Input
|
|
2614
2657
|
}], model: [{
|
|
@@ -2750,12 +2793,12 @@ class MetaRefDialog {
|
|
|
2750
2793
|
this.el.nativeElement.style.setProperty(key, metaTheme.properties[key]);
|
|
2751
2794
|
}
|
|
2752
2795
|
}
|
|
2753
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
2754
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
2796
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaRefDialog, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2797
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaRefDialog, isStandalone: false, selector: "ng-component", ngImport: i0, template: "<div class='Vlt-modal Vlt-modal--large'>\n <div class=\"Vlt-modal__panel\">\n <div class=\"Vlt-tabs\">\n <div class='Vlt-tabs__header--background'>\n <div class=\"Vlt-tabs__header Vlt-tabs__header--shadow\">\n <svg class=\"Vlt-icon\" [ngStyle]=\"{fill: integrationIcon === 'Brand-icon-vonage' ? 'var(--vgip-meta-input-color)' : ''}\"><use attr.xlink:href=\"volta/volta-brand-icons.svg#{{integrationIcon}}\" /></svg>\n <a href='#' *ngFor='let r of resources | keyvalue: keepOrder' (click)='selectResource($event, r.key)' class=\"Vlt-tabs__link\" [ngClass]=\"{ 'Vlt-tabs__link_active': currentResource === r.key}\">\n {{r.key}}\n </a>\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 <ng-container *ngFor='let r of resources | keyvalue: keepOrder'>\n <div *ngIf='currentResource === r.key' 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 </ng-container>\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.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: "component", type: MetaResource, selector: "vgip-meta-resource", inputs: ["resource", "model", "metaResourceServiceDelegated", "theme", "editMode"], outputs: ["done", "resourceChange"] }, { kind: "pipe", type: i1$2.KeyValuePipe, name: "keyvalue" }] }); }
|
|
2755
2798
|
}
|
|
2756
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2799
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaRefDialog, decorators: [{
|
|
2757
2800
|
type: Component,
|
|
2758
|
-
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 <a href='#' *ngFor='let r of resources | keyvalue: keepOrder' (click)='selectResource($event, r.key)' class=\"Vlt-tabs__link\" [ngClass]=\"{ 'Vlt-tabs__link_active': currentResource === r.key}\">\n {{r.key}}\n </a>\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 <ng-container *ngFor='let r of resources | keyvalue: keepOrder'>\n <div *ngIf='currentResource === r.key' 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 </ng-container>\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:
|
|
2801
|
+
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 <a href='#' *ngFor='let r of resources | keyvalue: keepOrder' (click)='selectResource($event, r.key)' class=\"Vlt-tabs__link\" [ngClass]=\"{ 'Vlt-tabs__link_active': currentResource === r.key}\">\n {{r.key}}\n </a>\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 <ng-container *ngFor='let r of resources | keyvalue: keepOrder'>\n <div *ngIf='currentResource === r.key' 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 </ng-container>\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"] }]
|
|
2759
2802
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
2760
2803
|
|
|
2761
2804
|
var index$c = /*#__PURE__*/Object.freeze({
|
|
@@ -2785,10 +2828,10 @@ class MetaResourceCard {
|
|
|
2785
2828
|
// }
|
|
2786
2829
|
});
|
|
2787
2830
|
}
|
|
2788
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
2789
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
2831
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceCard, deps: [{ token: MetaResourceService }, { token: MetaReferenceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2832
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaResourceCard, isStandalone: false, selector: "vgip-meta-resource-card", inputs: { resource: "resource", model: "model" }, ngImport: i0, template: "<div class=\"Vlt-card Vlt-bg-white\">\n\t<div class=\"Vlt-card__content Vlt-btn-on-hover\">\n\t\t<h5>{{model.Subject || model.subject || model.summary || model.title || model.CaseNumber || model.comment || model.body || model.name || model.topic || '...' }}</h5>\n\t\t<div style='font-size: 12px; line-height: 16px;'>\n\t\t\tCreated: <span class='Vlt-black'>{{model._vgis.createdDate | date:'mediumDate'}}</span>\n\t\t\tEdited: <span class='Vlt-black'>{{model._vgis.modifiedDate | date:'medium'}}</span>\n\t\t</div>\n\t\t<div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{model._vgis.resourceType}}</div>\n\t\t<div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n\t\t\t<a *ngIf='model._vgis.externalLink' 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\t\t\t<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\t\t</div>\n\t</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: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
|
|
2790
2833
|
}
|
|
2791
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2834
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaResourceCard, decorators: [{
|
|
2792
2835
|
type: Component,
|
|
2793
2836
|
args: [{ selector: 'vgip-meta-resource-card', standalone: false, template: "<div class=\"Vlt-card Vlt-bg-white\">\n\t<div class=\"Vlt-card__content Vlt-btn-on-hover\">\n\t\t<h5>{{model.Subject || model.subject || model.summary || model.title || model.CaseNumber || model.comment || model.body || model.name || model.topic || '...' }}</h5>\n\t\t<div style='font-size: 12px; line-height: 16px;'>\n\t\t\tCreated: <span class='Vlt-black'>{{model._vgis.createdDate | date:'mediumDate'}}</span>\n\t\t\tEdited: <span class='Vlt-black'>{{model._vgis.modifiedDate | date:'medium'}}</span>\n\t\t</div>\n\t\t<div class=\"Vlt-badge Vlt-badge--app Vlt-badge--purple Vlt-badge--small\">{{model._vgis.resourceType}}</div>\n\t\t<div class=\"Vlt-btn-group Vlt-btn-group--hover\">\n\t\t\t<a *ngIf='model._vgis.externalLink' 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\t\t\t<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\t\t</div>\n\t</div>\n</div>\n", styles: [".Vlt-card{margin-bottom:8px;padding:16px}.Vlt-card .Vlt-btn-group.Vlt-btn-group--hover{right:-8px}\n"] }]
|
|
2794
2837
|
}], ctorParameters: () => [{ type: MetaResourceService }, { type: MetaReferenceService }, { type: i0.ViewContainerRef }], propDecorators: { resource: [{
|
|
@@ -2804,10 +2847,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImpor
|
|
|
2804
2847
|
* @Last Modified time: 2019-11-15 13:04:01
|
|
2805
2848
|
*/
|
|
2806
2849
|
class FieldUnknown extends FieldAbstract {
|
|
2807
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
2808
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
2850
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldUnknown, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2851
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldUnknown, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"Vlt-form__element Vlt-form__element--big\">\n <div class=\"Vlt-input\">\n <label class='wrapper'>\n <input class='main model' type=\"text\" placeholder=\"\" value=\"Unknown field type '{{meta.type}}'.\" disabled/>\n <label class=\"Vlt-label Vlt-truncate\" style='padding-right: 20px;'>{{meta.label || meta.name}}</label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </label>\n </div>\n <small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\n", dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
2809
2852
|
}
|
|
2810
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2853
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldUnknown, decorators: [{
|
|
2811
2854
|
type: Component,
|
|
2812
2855
|
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 <small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\n" }]
|
|
2813
2856
|
}] });
|
|
@@ -2876,10 +2919,10 @@ class MetaModelPipe {
|
|
|
2876
2919
|
transform(value) {
|
|
2877
2920
|
return value;
|
|
2878
2921
|
}
|
|
2879
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
2880
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.
|
|
2922
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModelPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
2923
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaModelPipe, isStandalone: false, name: "metaModel" }); }
|
|
2881
2924
|
}
|
|
2882
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
2925
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModelPipe, decorators: [{
|
|
2883
2926
|
type: Pipe,
|
|
2884
2927
|
args: [{
|
|
2885
2928
|
name: 'metaModel',
|
|
@@ -3344,12 +3387,12 @@ class FieldInput extends FieldAbstract {
|
|
|
3344
3387
|
}
|
|
3345
3388
|
}
|
|
3346
3389
|
}
|
|
3347
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
3348
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", 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 }] }); }
|
|
3390
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldInput, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3391
|
+
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 }] }); }
|
|
3349
3392
|
}
|
|
3350
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
3393
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldInput, decorators: [{
|
|
3351
3394
|
type: Component,
|
|
3352
|
-
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:
|
|
3395
|
+
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"] }]
|
|
3353
3396
|
}], ctorParameters: () => [{ type: MetaContextService }] });
|
|
3354
3397
|
|
|
3355
3398
|
var index$a = /*#__PURE__*/Object.freeze({
|
|
@@ -3422,10 +3465,10 @@ class FieldText extends FieldAbstract {
|
|
|
3422
3465
|
textToSpeech() {
|
|
3423
3466
|
this.focus();
|
|
3424
3467
|
}
|
|
3425
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
3426
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
3468
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldText, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3469
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldText, 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'>{{parent[meta.name]}}</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) }\">\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\">{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </div>\n </label>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((f | 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--big .Vlt-textarea .Vlt-label{right:18px;background:transparent}.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: 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.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 }] }); }
|
|
3427
3470
|
}
|
|
3428
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
3471
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldText, decorators: [{
|
|
3429
3472
|
type: Component,
|
|
3430
3473
|
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'>{{parent[meta.name]}}</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) }\">\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\">{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n </div>\n </label>\n <small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((f | 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--big .Vlt-textarea .Vlt-label{right:18px;background:transparent}.Vlt-form__element--error textarea{border-color:#f25a6b;background:var(--vgip-meta-input-bg-color)}\n"] }]
|
|
3431
3474
|
}], ctorParameters: () => [{ type: MetaContextService }] });
|
|
@@ -3550,7 +3593,6 @@ class FieldSelect extends FieldAbstract {
|
|
|
3550
3593
|
}
|
|
3551
3594
|
// static setup(instance, parent, meta) { } // eslint-disable-line @typescript-eslint/no-unused-vars
|
|
3552
3595
|
ngOnInit() {
|
|
3553
|
-
// console.log('parent', this.parent);
|
|
3554
3596
|
this.validationAttributes = ['required'];
|
|
3555
3597
|
this.multiple = (this.meta.type === 'multipicklist') || this.meta.multiple;
|
|
3556
3598
|
const origValue = this.parent[this.meta.name];
|
|
@@ -3606,12 +3648,14 @@ class FieldSelect extends FieldAbstract {
|
|
|
3606
3648
|
break;
|
|
3607
3649
|
}
|
|
3608
3650
|
}
|
|
3609
|
-
if (this.meta.acceptNew && this.model !== value) { // VGIS-10948
|
|
3651
|
+
if (this.meta.acceptNew && (this.model?.id || this.model) !== value) { // VGIS-10948
|
|
3610
3652
|
const newOption = {
|
|
3611
3653
|
id: value.id || value,
|
|
3612
3654
|
label: value.id || value
|
|
3613
3655
|
};
|
|
3614
|
-
this.options.
|
|
3656
|
+
if (!this.options.find((o) => o.id === newOption.id)) { // VGIS-10985
|
|
3657
|
+
this.options.push(newOption);
|
|
3658
|
+
}
|
|
3615
3659
|
this.model = newOption;
|
|
3616
3660
|
this.value = this.modelToValue(newOption, this.meta.valueType);
|
|
3617
3661
|
this.showText = newOption.label;
|
|
@@ -3623,7 +3667,7 @@ class FieldSelect extends FieldAbstract {
|
|
|
3623
3667
|
delete this.showText;
|
|
3624
3668
|
}
|
|
3625
3669
|
}
|
|
3626
|
-
this.onSubjectChange(this.
|
|
3670
|
+
this.onSubjectChange(this.value);
|
|
3627
3671
|
this.meta.$optional = this.isOptional;
|
|
3628
3672
|
},
|
|
3629
3673
|
get: () => this.value,
|
|
@@ -3641,7 +3685,7 @@ class FieldSelect extends FieldAbstract {
|
|
|
3641
3685
|
}, 0);
|
|
3642
3686
|
}
|
|
3643
3687
|
if (typeof (this.meta.enabled) !== 'undefined') {
|
|
3644
|
-
if (typeof (this.meta.enabled) === 'object') {
|
|
3688
|
+
if (typeof (this.meta.enabled) === 'object') { // TODO move me up
|
|
3645
3689
|
for (const par of Object.keys(this.meta.enabled)) {
|
|
3646
3690
|
console.log('this.meta.enabled', this.meta.enabled);
|
|
3647
3691
|
const parValue = this.parent[par];
|
|
@@ -3689,6 +3733,9 @@ class FieldSelect extends FieldAbstract {
|
|
|
3689
3733
|
}
|
|
3690
3734
|
}
|
|
3691
3735
|
}
|
|
3736
|
+
if ((this.meta.options || []).find((o) => o.for)) { // there are dependent options
|
|
3737
|
+
this.filterOptions();
|
|
3738
|
+
}
|
|
3692
3739
|
}
|
|
3693
3740
|
onActivated(ev) {
|
|
3694
3741
|
// ev.preventDefault();
|
|
@@ -3897,7 +3944,7 @@ class FieldSelect extends FieldAbstract {
|
|
|
3897
3944
|
}
|
|
3898
3945
|
}
|
|
3899
3946
|
filterOptions() {
|
|
3900
|
-
console.log('filterOptions')
|
|
3947
|
+
// console.log('filterOptions')
|
|
3901
3948
|
this.asyncOptions = [];
|
|
3902
3949
|
if (!this.logicalDisabled) {
|
|
3903
3950
|
for (const o of this.meta.options) {
|
|
@@ -3996,12 +4043,12 @@ class FieldSelect extends FieldAbstract {
|
|
|
3996
4043
|
delete this.searching;
|
|
3997
4044
|
});
|
|
3998
4045
|
}
|
|
3999
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
4000
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", 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\">\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 }] }); }
|
|
4046
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldSelect, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4047
|
+
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 }] }); }
|
|
4001
4048
|
}
|
|
4002
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
4049
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldSelect, decorators: [{
|
|
4003
4050
|
type: Component,
|
|
4004
|
-
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\">\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"] }]
|
|
4051
|
+
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"] }]
|
|
4005
4052
|
}], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: i0.ViewContainerRef }] });
|
|
4006
4053
|
|
|
4007
4054
|
var index$8 = /*#__PURE__*/Object.freeze({
|
|
@@ -4028,10 +4075,10 @@ class MetaTrackerService {
|
|
|
4028
4075
|
}
|
|
4029
4076
|
this.events.emit(event);
|
|
4030
4077
|
}
|
|
4031
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
4032
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
4078
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaTrackerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
4079
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaTrackerService, providedIn: 'root' }); }
|
|
4033
4080
|
}
|
|
4034
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
4081
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaTrackerService, decorators: [{
|
|
4035
4082
|
type: Injectable,
|
|
4036
4083
|
args: [{
|
|
4037
4084
|
providedIn: 'root'
|
|
@@ -4850,12 +4897,12 @@ class FieldReference extends FieldAbstract {
|
|
|
4850
4897
|
});
|
|
4851
4898
|
}
|
|
4852
4899
|
}
|
|
4853
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
4854
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", 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"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
|
|
4900
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldReference, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: MetaMsgService }, { token: MetaContextService }, { token: MetaTrackerService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4901
|
+
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"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
|
|
4855
4902
|
}
|
|
4856
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
4903
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldReference, decorators: [{
|
|
4857
4904
|
type: Component,
|
|
4858
|
-
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"] }]
|
|
4905
|
+
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"] }]
|
|
4859
4906
|
}], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: MetaMsgService }, { type: MetaContextService }, { type: MetaTrackerService }, { type: i0.ViewContainerRef }] });
|
|
4860
4907
|
|
|
4861
4908
|
var index$7 = /*#__PURE__*/Object.freeze({
|
|
@@ -4932,12 +4979,12 @@ class FieldComposite extends FieldAbstract {
|
|
|
4932
4979
|
onValueChange() {
|
|
4933
4980
|
this.onChange.emit(this.value);
|
|
4934
4981
|
}
|
|
4935
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
4936
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
4982
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldComposite, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
4983
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldComposite, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n <ng-container *ngFor='let field of fields'>\n <div *ngIf='!field.$hidden && !field.$invisible' style='margin: 0;' [ngClass]=\"{ 'Vlt-col': isRow, 'Vlt-col--1of3': isRow && fields.length > 3 }\">\n <vgip-meta-field *ngIf='!meta.$invisible' [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 </div>\n </ng-container>\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: "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: "component", type: MetaField, selector: "vgip-meta-field", inputs: ["meta", "parent", "integrationCode", "resourceType", "index", "scope", "preview", "theme", "overlayContainer", "delegate"], outputs: ["onChange", "onLeave"] }] }); }
|
|
4937
4984
|
}
|
|
4938
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
4985
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldComposite, decorators: [{
|
|
4939
4986
|
type: Component,
|
|
4940
|
-
args: [{ standalone: false, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n <ng-container *ngFor='let field of fields'>\n <div style='margin: 0;' [ngClass]=\"{ 'Vlt-col': isRow, 'Vlt-col--1of3': isRow && fields.length > 3 }\"
|
|
4987
|
+
args: [{ standalone: false, template: "<div [ngClass]=\"{ 'Vlt-grid Vlt-grid--narrow': isRow }\">\n <ng-container *ngFor='let field of fields'>\n <div *ngIf='!field.$hidden && !field.$invisible' style='margin: 0;' [ngClass]=\"{ 'Vlt-col': isRow, 'Vlt-col--1of3': isRow && fields.length > 3 }\">\n <vgip-meta-field *ngIf='!meta.$invisible' [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 </div>\n </ng-container>\n</div>\n", styles: ["div>vgip-meta-field{display:none}div>vgip-meta-field.shown{display:initial}\n"] }]
|
|
4941
4988
|
}] });
|
|
4942
4989
|
|
|
4943
4990
|
var index$6 = /*#__PURE__*/Object.freeze({
|
|
@@ -4983,10 +5030,10 @@ class FieldBoolean extends FieldAbstract {
|
|
|
4983
5030
|
onOptionChange() {
|
|
4984
5031
|
this.onModelChange(this.model);
|
|
4985
5032
|
}
|
|
4986
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
4987
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
5033
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldBoolean, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5034
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldBoolean, 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 {{ model ? '\u2714' : '\u2718'}}\n </div>\n</div>\n<div *ngIf='!preview' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n\t<input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n\t<div class=\"Vlt-switch\" *ngIf=\"meta.subtype === 'switch'\">\n\t\t<label style='vertical-align: middle;'>\n\t\t\t<input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n\t\t\t<span class=\"Vlt-switch__slider\"></span>\n\t\t\t<span style='margin-left: 60px; line-height: 30px; white-space: nowrap;'>{{meta.label || meta.name}}</span>\n\t\t</label>\n\t</div>\n\t<div class=\"Vlt-checkbox\" *ngIf=\"meta.subtype !== 'switch'\">\n\t\t<label style='cursor: pointer;'>\n\t\t\t<span class=\"Vlt-checkbox__button\">\n\t\t\t\t<input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n\t\t\t\t<span class=\"Vlt-checkbox__icon\"></span>\n\t\t\t</span>\n\t\t\t{{meta.label || meta.name}}\n\t\t</label>\n\t</div>\n\t<small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))' 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\t<small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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: 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.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 }] }); }
|
|
4988
5035
|
}
|
|
4989
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5036
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldBoolean, decorators: [{
|
|
4990
5037
|
type: Component,
|
|
4991
5038
|
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 {{ model ? '\u2714' : '\u2718'}}\n </div>\n</div>\n<div *ngIf='!preview' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n\t<input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n\t<div class=\"Vlt-switch\" *ngIf=\"meta.subtype === 'switch'\">\n\t\t<label style='vertical-align: middle;'>\n\t\t\t<input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n\t\t\t<span class=\"Vlt-switch__slider\"></span>\n\t\t\t<span style='margin-left: 60px; line-height: 30px; white-space: nowrap;'>{{meta.label || meta.name}}</span>\n\t\t</label>\n\t</div>\n\t<div class=\"Vlt-checkbox\" *ngIf=\"meta.subtype !== 'switch'\">\n\t\t<label style='cursor: pointer;'>\n\t\t\t<span class=\"Vlt-checkbox__button\">\n\t\t\t\t<input class='model' type=\"checkbox\" [(ngModel)]='model' (change)='onOptionChange()' [name]='name'/>\n\t\t\t\t<span class=\"Vlt-checkbox__icon\"></span>\n\t\t\t</span>\n\t\t\t{{meta.label || meta.name}}\n\t\t</label>\n\t</div>\n\t<small *ngIf='f.invalid && ((f | metaModel)._parent.submitted || ((f | metaModel ).touched))' 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\t<small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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"] }]
|
|
4992
5039
|
}] });
|
|
@@ -5069,10 +5116,10 @@ class FieldRadio extends FieldAbstract {
|
|
|
5069
5116
|
ev.srcElement.removeEventListener('keydown', this.keydown);
|
|
5070
5117
|
}
|
|
5071
5118
|
}
|
|
5072
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5073
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
5119
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRadio, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5120
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldRadio, 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 {{ model.label || model }}\n </div>\n</div>\n<div *ngIf='!preview' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n\t<label class=\"Vlt-label\">{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n\t<input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n\t<fieldset *ngFor='let option of options' class=\"Vlt-radio Vlt-radio--inline\">\n\t\t<label style='cursor: pointer;'>\n\t\t\t<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\t\t\t<span style='white-space: nowrap;'>{{option.label || option}}</span>\n\t\t</label>\n\t</fieldset>\n\t<small *ngIf='f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched)' class=\"Vlt-form__element__error\">\n\t\t<span *ngIf=\"f.errors.required\">Required. </span>\n\t\t<span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n\t</small>\n\t<small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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: 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.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 }] }); }
|
|
5074
5121
|
}
|
|
5075
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5122
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRadio, decorators: [{
|
|
5076
5123
|
type: Component,
|
|
5077
5124
|
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 {{ model.label || model }}\n </div>\n</div>\n<div *ngIf='!preview' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched) }\">\n\t<label class=\"Vlt-label\">{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n\t<input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n\t<fieldset *ngFor='let option of options' class=\"Vlt-radio Vlt-radio--inline\">\n\t\t<label style='cursor: pointer;'>\n\t\t\t<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\t\t\t<span style='white-space: nowrap;'>{{option.label || option}}</span>\n\t\t</label>\n\t</fieldset>\n\t<small *ngIf='f && f.invalid && ((f | metaModel)._parent.submitted || (f | metaModel ).touched)' class=\"Vlt-form__element__error\">\n\t\t<span *ngIf=\"f.errors.required\">Required. </span>\n\t\t<span *ngIf=\"f.errors.custom\">{{f.errors.custom}} </span>\n\t</small>\n\t<small *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n</div>\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"] }]
|
|
5078
5125
|
}] });
|
|
@@ -5140,10 +5187,10 @@ class FieldList extends FieldAbstract {
|
|
|
5140
5187
|
onChildChange() {
|
|
5141
5188
|
this.onChange.emit(this.model);
|
|
5142
5189
|
}
|
|
5143
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5144
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
5190
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldList, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5191
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldList, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div *ngIf='true' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': (f | metaModel)._parent.submitted && f.invalid }\">\n <label class=\"Vlt-label\">{{meta.label || meta.name}} ({{(model || []).length}})<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n <small style='margin-bottom: 4px;' *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n <ng-container *ngIf='model'>\n <div *ngFor='let item of model; let i = index;' 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 <vgip-meta-field *ngIf='meta.selectable' [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 <div *ngIf='!preview' 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 </div>\n </ng-container>\n <button *ngIf='!preview && (!validations.max || !model || model.length < validations.max)' 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 <small *ngIf='(f | metaModel)._parent.submitted && f.invalid' 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-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: 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.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"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
|
|
5145
5192
|
}
|
|
5146
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5193
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldList, decorators: [{
|
|
5147
5194
|
type: Component,
|
|
5148
5195
|
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "<div *ngIf='true' class=\"Vlt-form__element\" [ngClass]=\"{ 'Vlt-form__element--error': (f | metaModel)._parent.submitted && f.invalid }\">\n <label class=\"Vlt-label\">{{meta.label || meta.name}} ({{(model || []).length}})<span *ngIf='validations.required' class='Vlt-red'>*</span></label> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control -->\n <small style='margin-bottom: 4px;' *ngIf='meta.hint' class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n <input class='model' type='hidden' [required]='validations.required' [(ngModel)]='model' #f='ngModel' [name]='name' />\n <ng-container *ngIf='model'>\n <div *ngFor='let item of model; let i = index;' 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 <vgip-meta-field *ngIf='meta.selectable' [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 <div *ngIf='!preview' 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 </div>\n </ng-container>\n <button *ngIf='!preview && (!validations.max || !model || model.length < validations.max)' 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 <small *ngIf='(f | metaModel)._parent.submitted && f.invalid' 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-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"] }]
|
|
5149
5196
|
}] });
|
|
@@ -5220,18 +5267,18 @@ class FieldRichtext extends FieldAbstract {
|
|
|
5220
5267
|
textToSpeech() {
|
|
5221
5268
|
this.focus();
|
|
5222
5269
|
}
|
|
5223
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5224
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", 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: [
|
|
5270
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRichtext, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5271
|
+
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: [
|
|
5225
5272
|
{ provide: ControlContainer, useExisting: NgForm },
|
|
5226
5273
|
// { provide: QUILL_CONFIG_TOKEN, useValue: quillConfig }
|
|
5227
5274
|
] }); }
|
|
5228
5275
|
}
|
|
5229
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5276
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldRichtext, decorators: [{
|
|
5230
5277
|
type: Component,
|
|
5231
5278
|
args: [{ viewProviders: [
|
|
5232
5279
|
{ provide: ControlContainer, useExisting: NgForm },
|
|
5233
5280
|
// { provide: QUILL_CONFIG_TOKEN, useValue: quillConfig }
|
|
5234
|
-
], 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"] }]
|
|
5281
|
+
], 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"] }]
|
|
5235
5282
|
}], ctorParameters: () => [{ type: MetaContextService }] });
|
|
5236
5283
|
|
|
5237
5284
|
var index$2 = /*#__PURE__*/Object.freeze({
|
|
@@ -5589,12 +5636,12 @@ class FieldDatetime extends FieldAbstract {
|
|
|
5589
5636
|
}
|
|
5590
5637
|
}
|
|
5591
5638
|
}
|
|
5592
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5593
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
5639
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldDatetime, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5640
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldDatetime, 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'>{{model}}</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), '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'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</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' 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 </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.min\">Must be later than {{validations.min}}. </span>\n <span *ngIf=\"f.errors.max\">Must be no later than {{validations}}. </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-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: 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 }] }); }
|
|
5594
5641
|
}
|
|
5595
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5642
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldDatetime, decorators: [{
|
|
5596
5643
|
type: Component,
|
|
5597
|
-
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'>{{model}}</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), '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'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</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' 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 </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.min\">Must be later than {{validations.min}}. </span>\n <span *ngIf=\"f.errors.max\">Must be no later than {{validations}}. </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-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:
|
|
5644
|
+
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'>{{model}}</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), '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'>{{meta.label || meta.name}}<span *ngIf='validations.required' class='Vlt-red'>*</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' 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 </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.min\">Must be later than {{validations.min}}. </span>\n <span *ngIf=\"f.errors.max\">Must be no later than {{validations}}. </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-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"] }]
|
|
5598
5645
|
}] });
|
|
5599
5646
|
|
|
5600
5647
|
var index$1 = /*#__PURE__*/Object.freeze({
|
|
@@ -5609,10 +5656,10 @@ var index$1 = /*#__PURE__*/Object.freeze({
|
|
|
5609
5656
|
* @Last Modified time: 2019-11-15 13:04:01
|
|
5610
5657
|
*/
|
|
5611
5658
|
class FieldHidden extends FieldAbstract {
|
|
5612
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5613
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.
|
|
5659
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldHidden, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5660
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FieldHidden, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "" }); }
|
|
5614
5661
|
}
|
|
5615
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5662
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FieldHidden, decorators: [{
|
|
5616
5663
|
type: Component,
|
|
5617
5664
|
args: [{ standalone: false, template: "" }]
|
|
5618
5665
|
}] });
|
|
@@ -5638,10 +5685,10 @@ class MetaIconsPipe {
|
|
|
5638
5685
|
return value; //this.sanitizer.bypassSecurityTrustHtml(value);
|
|
5639
5686
|
}
|
|
5640
5687
|
}
|
|
5641
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5642
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.
|
|
5688
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaIconsPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
5689
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaIconsPipe, isStandalone: false, name: "metaIcons" }); }
|
|
5643
5690
|
}
|
|
5644
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5691
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaIconsPipe, decorators: [{
|
|
5645
5692
|
type: Pipe,
|
|
5646
5693
|
args: [{
|
|
5647
5694
|
name: 'metaIcons',
|
|
@@ -5659,10 +5706,10 @@ class MetaStripHtmlPipe {
|
|
|
5659
5706
|
transform(value) {
|
|
5660
5707
|
return value.replace(/<[^>]*>/g, '');
|
|
5661
5708
|
}
|
|
5662
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5663
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.
|
|
5709
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStripHtmlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
5710
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaStripHtmlPipe, isStandalone: false, name: "metaStripHtml" }); }
|
|
5664
5711
|
}
|
|
5665
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
5712
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStripHtmlPipe, decorators: [{
|
|
5666
5713
|
type: Pipe,
|
|
5667
5714
|
args: [{
|
|
5668
5715
|
name: 'metaStripHtml',
|
|
@@ -5953,10 +6000,10 @@ class ResourceDraftsService {
|
|
|
5953
6000
|
this.store.destroyById(COLLECTION, draft.id, cb);
|
|
5954
6001
|
}
|
|
5955
6002
|
}
|
|
5956
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5957
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.
|
|
6003
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResourceDraftsService, deps: [{ token: MetaContextService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
6004
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResourceDraftsService, providedIn: 'root' }); }
|
|
5958
6005
|
}
|
|
5959
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
6006
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ResourceDraftsService, decorators: [{
|
|
5960
6007
|
type: Injectable,
|
|
5961
6008
|
args: [{
|
|
5962
6009
|
providedIn: 'root'
|
|
@@ -5976,8 +6023,8 @@ class MetaModule {
|
|
|
5976
6023
|
providers: customProviders
|
|
5977
6024
|
};
|
|
5978
6025
|
}
|
|
5979
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.
|
|
5980
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.
|
|
6026
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
6027
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, declarations: [MetaIconsPipe,
|
|
5981
6028
|
MetaModelPipe,
|
|
5982
6029
|
MetaStripHtmlPipe,
|
|
5983
6030
|
MetaField,
|
|
@@ -6008,7 +6055,7 @@ class MetaModule {
|
|
|
6008
6055
|
MetaResource,
|
|
6009
6056
|
MetaResourceCard,
|
|
6010
6057
|
MetaAutofocusDirective] }); }
|
|
6011
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.
|
|
6058
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, providers: [provideHttpClient(withInterceptorsFromDi())], imports: [CommonModule,
|
|
6012
6059
|
FormsModule,
|
|
6013
6060
|
ReactiveFormsModule,
|
|
6014
6061
|
QuillModule.forRoot()
|
|
@@ -6026,7 +6073,7 @@ class MetaModule {
|
|
|
6026
6073
|
// })
|
|
6027
6074
|
] }); }
|
|
6028
6075
|
}
|
|
6029
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.
|
|
6076
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaModule, decorators: [{
|
|
6030
6077
|
type: NgModule,
|
|
6031
6078
|
args: [{ declarations: [
|
|
6032
6079
|
MetaIconsPipe,
|