@vgip/meta-ui 2.3.9 → 2.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -821,6 +821,7 @@ const metaNormalizer = (meta, integration, resourceType) => {
|
|
|
821
821
|
else if (resourceType === 'contact') {
|
|
822
822
|
metaV3.fieldsMap = {
|
|
823
823
|
phoneNumber: 'telephone1',
|
|
824
|
+
email: 'emailaddress1',
|
|
824
825
|
firstName: 'firstname',
|
|
825
826
|
lastName: 'lastname'
|
|
826
827
|
};
|
|
@@ -828,6 +829,7 @@ const metaNormalizer = (meta, integration, resourceType) => {
|
|
|
828
829
|
else if (resourceType === 'account') {
|
|
829
830
|
metaV3.fieldsMap = {
|
|
830
831
|
phoneNumber: 'telephone1',
|
|
832
|
+
email: 'emailaddress1',
|
|
831
833
|
displayName: 'name'
|
|
832
834
|
};
|
|
833
835
|
}
|
|
@@ -1213,6 +1215,9 @@ class MetaContextService {
|
|
|
1213
1215
|
if (context.displayName) {
|
|
1214
1216
|
this.displayName = context.displayName;
|
|
1215
1217
|
}
|
|
1218
|
+
if (context.email) {
|
|
1219
|
+
this.email = context.email;
|
|
1220
|
+
}
|
|
1216
1221
|
}
|
|
1217
1222
|
}
|
|
1218
1223
|
setOnClick2Dial(callback) {
|
|
@@ -2582,6 +2587,7 @@ class MetaResource {
|
|
|
2582
2587
|
if (this.metaContext && this.fieldsMap) {
|
|
2583
2588
|
setTimeout(() => {
|
|
2584
2589
|
this.suggestFieldProperty(this.fieldsMap.phoneNumber, this.metaContext.phoneNumber);
|
|
2590
|
+
this.suggestFieldProperty(this.fieldsMap.email, this.metaContext.email);
|
|
2585
2591
|
if (this.fieldsMap.firstName || this.fieldsMap.lastName) {
|
|
2586
2592
|
const names = (this.metaContext.displayName || '').split(' ');
|
|
2587
2593
|
this.suggestFieldProperty(this.fieldsMap.firstName, names[0]);
|
|
@@ -4095,11 +4101,11 @@ class FieldSelect extends FieldAbstract {
|
|
|
4095
4101
|
});
|
|
4096
4102
|
}
|
|
4097
4103
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldSelect, deps: [{ token: MetaReferenceService }, { token: MetaResourceService }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4098
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldSelect, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
|
|
4104
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: FieldSelect, isStandalone: false, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel__content{display:none}.Vlt-dropdown--expanded .Vlt-dropdown__panel__content{display:flex}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: MetaModelPipe, name: "metaModel" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
|
|
4099
4105
|
}
|
|
4100
4106
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: FieldSelect, decorators: [{
|
|
4101
4107
|
type: Component,
|
|
4102
|
-
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}\n"] }]
|
|
4108
|
+
args: [{ viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: false, template: "@if (preview && model) {\n <div class='vgip-meta-field-preview'>\n <div class='vgip-meta-field-label' [title]='meta.label || meta.name'>{{meta.label || meta.name}}</div>\n <div class='vgip-meta-field-value __gu'>\n {{showText}}\n </div>\n </div>\n}\n@if (!preview) {\n <div class=\"Vlt-form__element\"\n [ngClass]=\"{ 'Vlt-form__element--big': !meta.small ,'has-value': f.value, active: keyListenerActive, 'Vlt-form__element--error': f.invalid && ((f | metaModel)._parent.submitted || (ft | metaModel ).touched), 'no-x': meta.noX }\">\n <div class=\"Vlt-composite Vlt-dropdown Vlt-input\" style='display: block;'\n [ngClass]=\"{ 'has-append-button': isCreatable && !disabled }\">\n <div class=\"Vlt-select\">\n <label class='wrapper'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n <label class='Vlt-truncate'> <!-- eslint-disable-line @angular-eslint/template/label-has-associated-control-->\n {{meta.label || meta.name}}\n @if (validations.required && options.length) {\n <span class='Vlt-red'>*</span>\n }\n </label>\n <input class='main' [required]='validations.required && !!options.length' readonly [ngModel]='showText' #ft='ngModel'\n [ngModelOptions]=\"{standalone: true}\" type=\"text\" [placeholder]=\"meta.placeholder || ' '\"\n (click)='onActivated($event)' (focus)='onActivated($event)' (blur)='onBlur($event)'\n [ngClass]=\"{ 'standalone': meta.standalone }\" [disabled]='disabled' [attr.aria-label]='meta.label'\n [attr.title]=\"showText\" />\n </label>\n <select class='model' [required]='validations.required && !!options.length' style='display: none;'\n [(ngModel)]='model' [ngModelOptions]=\"{standalone: meta.standalone}\"\n (ngModelChange)=\"onModelChange($event)\" #f='ngModel' [name]='name'></select>\n @if (searching) {\n <div class='search-progress'>\n <div class=\"container\">\n <div class=\"bar Vlt-bg-purple\"></div>\n </div>\n </div>\n }\n <div class='Vlt-composite__append right-actions'>\n @if (model && !meta.noX && !disabled) {\n <a href='#' class=\"Vlt-composite__append--icon\"\n (click)='clear($event)'>\n <div class=\"Vlt-composite__icon\">\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\" />\n </svg>\n </div>\n </a>\n }\n </div>\n </div>\n <div class='Vlt-dropdown__panel'>\n <div class=\"Vlt-dropdown__panel__content Vlt-dropdown__panel__content--scroll-area\">\n <!-- <div class=\"Vlt-dropdown__title\" style='padding-left: 15px;'>\n Select ({{options.length}})\n <div class=\"Vlt-dropdown__close Vlt-white\" (click)='dismissDropdown($event)'>\n <svg class='Vlt-icon Vlt-icon--small'><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/></svg>\n </div>\n </div> -->\n <div class=\"Vlt-dropdown__block Vlt-search_wrap\">\n @if (optionsBackup.length > 12) {\n <div class=\"Vlt-composite\" [ngClass]=\"{'vgip-disable': disabled}\">\n <div class=\"Vlt-composite__prepend Vlt-composite__prepend--icon\"\n style=\"top: 0; padding-top: 15px;\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-grey'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-search\"></use>\n </svg>\n </div>\n </div>\n <div class=\"Vlt-input\">\n <input type=\"text\" class=\"vgip-search_input\" [(ngModel)]=\"searchInputText\" placeholder=\"Search\" (input)=\"onSearchChange()\" (blur)='onBlur($event)' [ngModelOptions]=\"{standalone: true}\">\n </div>\n <a href='#' class=\"Vlt-composite__append--icon\" style=\"top: 2px;\" (click)=\"clearSearchField($event)\" [hidden]=\"!searchInputText\">\n <div class=\"Vlt-composite__icon\">\n <svg class='Vlt-icon Vlt-icon--small'>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-cross\"/>\n </svg>\n </div>\n </a>\n </div>\n }\n </div>\n @if (dropdown) {\n <div class='Vlt-dropdown__scroll'>\n @for (option of options; track option; let i = $index) {\n <a href='#' [ngClass]=\"{ 'Vlt-dropdown__link--selected': activeSuggestionIndex === i }\"\n (click)='onOptionSelect($event, option)' class=\"Vlt-dropdown__link\"\n [attr.title]=\"option.label || option.id || option\">\n @if (multiple) {\n <div class=\"Vlt-checkbox\" style='width: 100%;'>\n <label>\n <span class=\"Vlt-checkbox__button\">\n <input type=\"checkbox\" [checked]='model && model.indexOf(option) !== -1' />\n <span class=\"Vlt-checkbox__icon\"></span>\n </span>\n {{option.label || (option.id === '' ? '--empty--' : option)}}\n </label>\n </div>\n }\n @if (!multiple) {\n <div style='padding: 12px 20px;overflow: hidden;text-overflow: ellipsis;'>{{option.label || (option.id === '' ?\n '--empty--' : option)}}</div>\n }\n </a>\n }\n <!-- No Option Found -->\n @if (options.length === 0) {\n <div class=\"Vlt-dropdown__link\">\n <span style='padding: 12px 20px;'>\n No Option Found\n </span>\n @if (isCreatable && !disabled) {\n <button type=\"button\" class=\"Vlt-btn Vlt-btn--link\" (click)='openResource($event)'>\n <svg>\n <use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\" />\n </svg> Add new\n </button>\n }\n </div>\n }\n </div>\n }\n @if (!multiple) {\n <div class=\"Vlt-dropdown__block\"></div>\n }\n @if (multiple) {\n <div class=\"Vlt-dropdown__block Vlt-dropdown__block--nowrap\"\n style='padding: 8px 16px 16px;'>\n <button (click)='clear($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small Vlt-btn--outline\"\n style='margin-right: 8px;'>Clear all</button>\n <button (click)='dismissDropdown($event)' type='button'\n class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--app Vlt-btn--small\">Done</button>\n </div>\n }\n </div>\n </div>\n <!-- <span *ngIf='isCreatable'>\n <button type='button' (click)='openResource($event)' class=\"Vlt-btn Vlt-btn--secondary Vlt-btn--icon Vlt-btn--large\" style='margin-left: 12px;'>\n <svg><use xlink:href=\"volta/volta-icons.svg#Vlt-icon-plus\"/></svg>\n </button>\n </span> -->\n @if (isCreatable && !disabled) {\n <div class=\"Vlt-composite__append\">\n <button (focus)='onActivated($event)' (blur)='onBlur($event)' type='button' (click)='openResource($event)'\n class=\"Vlt-btn Vlt-btn--white Vlt-btn--icon add-button\" aria-label='Add new'>\n <svg>\n <use attr.xlink:href=\"volta/volta-icons.svg#Vlt-icon-{{ (isUpdatable && model) ? 'edit' : 'plus'}}\" />\n </svg>\n </button>\n </div>\n }\n</div>\n@if (f.invalid && ((f | metaModel)._parent.submitted || ((ft | metaModel).touched))) {\n <small\n class=\"Vlt-form__element__error\">\n @if (f.errors.required) {\n <span>Required. </span>\n }\n @if (f.errors.custom) {\n <span>{{f.errors.custom}} </span>\n }\n </small>\n}\n@if (meta.hint) {\n <small class=\"Vlt-form__element__hint\">{{meta.hint}}</small>\n}\n</div>\n}\n", styles: [".Vlt-form__element.no-x input.main{padding-right:40px}.Vlt-form__element--big:not(.has-value)>.Vlt-input>.Vlt-select>label>label{font-size:1.6rem;margin-top:-.8rem;top:50%}.Vlt-form__element--big input[readonly].main:not([disabled]){background:var(--vgip-meta-input-bg-color);border:1px solid var(--vgip-meta-input-border-color)}.Vlt-form__element--big:hover input[readonly].main,.Vlt-form__element--big:hover .Vlt-composite__append button,.Vlt-form__element--big:focus input[readonly].main,.Vlt-form__element--big:focus .Vlt-composite__append button,.Vlt-form__element--big.active input[readonly].main,.Vlt-form__element--big.active .Vlt-composite__append button{border-color:var(--vgip-meta-input-active-border-color)}.Vlt-form__element--big.Vlt-form__element--error input[readonly].main,.Vlt-form__element--big.Vlt-form__element--error .Vlt-composite__append button{border-color:#f25a6b;box-shadow:none}.Vlt-form__element--big .Vlt-select:after{background-image:var(--vgip-meta-dropdown-icon);margin-right:2px}.Vlt-form__element--big .Vlt-form__element__hint{color:var(--vgip-meta-input-hint-color)}.Vlt-composite.has-append-button input[readonly].main{border-top-right-radius:0;border-bottom-right-radius:0;border-right:0}.Vlt-composite.has-append-button .Vlt-select:after{margin-right:-10px}.Vlt-composite__append{z-index:initial}.Vlt-composite__append button{height:48px;background:var(--vgip-meta-input-bg-color);border-color:var(--vgip-meta-input-border-color);padding-right:16px;padding-left:16px;border-left:0;border-top-right-radius:6px;border-bottom-right-radius:6px}.Vlt-composite__append button:hover{background:var(--vgip-meta-input-action-hover-bg-color)}.Vlt-composite__append button svg{margin:-2px 0 0;fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel{width:100%}.Vlt-dropdown__panel .Vlt-dropdown__link{padding:0 20px 0 0}.Vlt-dropdown__panel .Vlt-dropdown__link.Vlt-dropdown__link--selected{background:#2c2d300d}.Vlt-dropdown__panel label{margin-top:0;padding:12px 20px;top:0;left:0;pointer-events:initial;position:initial;color:initial;font-size:inherit;transition:none;cursor:pointer}.Vlt-dropdown__panel label input{height:0}input.main{cursor:pointer}input.main:disabled{cursor:not-allowed}input.main{padding-right:76px}.Vlt-input.has-append-button .Vlt-composite__append.right-actions{right:42px}.Vlt-composite__append.right-actions{position:absolute;top:5px;right:53px;cursor:pointer}.Vlt-composite__append.right-actions .Vlt-composite__append--icon{width:36px;outline:none;position:initial;display:inline-block}.Vlt-composite__append.right-actions .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-composite__append.right-actions .Vlt-composite__append--icon:hover svg,.Vlt-composite__append.right-actions .Vlt-composite__append--icon:focus svg{fill:var(--vgip-meta-input-accent-color)}.vgip-disable .Vlt-composite__append{cursor:not-allowed;pointer-events:none}.Vlt-search_wrap{padding-top:10px}.Vlt-search_wrap .vgip-search_input{padding:8px 36px 8px 38px;width:100%;border:1px solid var(--vgip-meta-input-border-color)!important;border-radius:6px!important}.Vlt-search_wrap .vgip-search_input:focus,.Vlt-search_wrap .vgip-search_input:active,.Vlt-search_wrap .vgip-search_input:hover{border-color:var(--vgip-meta-input-active-border-color)!important}.Vlt-search_wrap .Vlt-composite__append--icon{cursor:pointer}.Vlt-search_wrap .Vlt-composite__append--icon svg{height:14px;width:14px}.Vlt-search_wrap .Vlt-composite__append--icon:focus svg,.Vlt-search_wrap .Vlt-composite__append--icon:active svg,.Vlt-search_wrap .Vlt-composite__append--icon:hover svg{fill:var(--vgip-meta-input-accent-color)}.Vlt-dropdown__panel__content{display:none}.Vlt-dropdown--expanded .Vlt-dropdown__panel__content{display:flex}\n"] }]
|
|
4103
4109
|
}], ctorParameters: () => [{ type: MetaReferenceService }, { type: MetaResourceService }, { type: i0.ViewContainerRef }] });
|
|
4104
4110
|
|
|
4105
4111
|
var index$8 = /*#__PURE__*/Object.freeze({
|