@acrodata/gui
Version:
JSON powered GUI for configurable panels.
79 lines • 16.7 kB
JavaScript
import { ChangeDetectionStrategy, Component, forwardRef, Input, ViewChild, ViewEncapsulation, } from '@angular/core';
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
import { MatFormField, MatHint, MatPrefix, MatSuffix } from '@angular/material/form-field';
import { MtxSelect, MtxSelectLabelTemplate, MtxSelectOptionTemplate, } from '@ng-matero/extensions/select';
import { GuiFieldLabel } from '../field-label/field-label';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
export class GuiImageSelect {
constructor(cdr) {
this.cdr = cdr;
this.config = {};
this.disabled = false;
this.appendTo = 'body';
this.onChange = () => { };
this.onTouched = () => { };
}
ngAfterViewInit() {
// Add additional class for ng-select's dropdown panel
const { ngSelect } = this.mtxSelect;
ngSelect.classes = (ngSelect.classes || '') + ' gui-image-select';
}
writeValue(value) {
this.value = value;
this.cdr.markForCheck();
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
setDisabledState(isDisabled) {
this.disabled = isDisabled;
this.cdr.markForCheck();
}
onValueChange() {
this.onChange(this.value);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuiImageSelect, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GuiImageSelect, isStandalone: true, selector: "gui-image-select", inputs: { config: "config", disabled: "disabled", appendTo: "appendTo" }, host: { classAttribute: "gui-field gui-image-select" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => GuiImageSelect),
multi: true,
},
], viewQueries: [{ propertyName: "mtxSelect", first: true, predicate: MtxSelect, descendants: true }], ngImport: i0, template: "<mat-form-field>\n @if (config.prefix) {\n <span matPrefix>{{ config.prefix }}</span>\n }\n <mtx-select\n [items]=\"config.options || []\"\n [appendTo]=\"appendTo\"\n bindValue=\"value\"\n [(ngModel)]=\"value\"\n [disabled]=\"disabled\"\n [placeholder]=\"config.placeholder || ''\"\n (change)=\"onValueChange()\"\n >\n <ng-template ng-label-tmp let-opt=\"item\">\n <img [src]=\"opt.src\" [alt]=\"opt.label\" />\n <span>{{ opt.label }}</span>\n </ng-template>\n <ng-template ng-option-tmp let-opt=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n <img [src]=\"opt.src\" [alt]=\"opt.label\" />\n <span>{{ opt.label }}</span>\n </ng-template>\n </mtx-select>\n @if (config.suffix) {\n <span matSuffix>{{ config.suffix }}</span>\n }\n @if (config.parentType === 'inline') {\n <mat-hint>\n <gui-field-label [config]=\"config\" />\n </mat-hint>\n }\n</mat-form-field>\n", styles: [".gui-image-select.ng-dropdown-panel .ng-dropdown-panel-items .ng-option img,.gui-image-select .ng-select .ng-value img{height:100%;max-width:7.5rem;object-fit:contain;border-radius:.25rem;background-color:var(--mat-option-hover-state-layer-color)}.gui-image-select{--mat-form-field-container-vertical-padding: 0}.gui-image-select .ng-select{padding:0 .5rem;margin:0 -.5rem}.gui-image-select .ng-select .ng-value-container{height:4rem}.gui-image-select .ng-select .ng-value{display:inline-flex;align-items:center;gap:.5rem;height:100%;padding:.5rem 0}.gui-image-select .ng-select .ng-clear-wrapper .ng-clear{font-family:math;font-size:12px}.gui-image-select .ng-select .ng-arrow{vertical-align:-1px}.gui-image-select.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;gap:.5rem;height:4rem;padding:.5rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: MtxSelect, selector: "mtx-select", inputs: ["addTag", "addTagText", "appearance", "appendTo", "bindLabel", "bindValue", "closeOnSelect", "clearAllText", "clearable", "clearOnBackspace", "compareWith", "dropdownPosition", "groupBy", "groupValue", "bufferAmount", "selectableGroup", "selectableGroupAsModel", "hideSelected", "loading", "loadingText", "labelForId", "markFirst", "maxSelectedItems", "multiple", "notFoundText", "searchable", "readonly", "searchFn", "searchWhileComposing", "selectOnTab", "trackByFn", "inputAttrs", "tabIndex", "openOnEnter", "minTermLength", "editableSearchTerm", "keyDownFn", "virtualScroll", "typeToSearchText", "typeahead", "isOpen", "fixedPlaceholder", "deselectOnClick", "clearSearchOnAdd", "items", "value", "id", "placeholder", "disabled", "required", "errorStateMatcher", "aria-label", "aria-labelledby"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"], exportAs: ["mtxSelect"] }, { kind: "directive", type: MtxSelectLabelTemplate, selector: "[ng-label-tmp]" }, { kind: "directive", type: MtxSelectOptionTemplate, selector: "[ng-option-tmp]" }, { kind: "component", type: GuiFieldLabel, selector: "gui-field-label", inputs: ["config", "index"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuiImageSelect, decorators: [{
type: Component,
args: [{ selector: 'gui-image-select', host: {
class: 'gui-field gui-image-select',
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => GuiImageSelect),
multi: true,
},
], standalone: true, imports: [
FormsModule,
MatFormField,
MatPrefix,
MatSuffix,
MatHint,
MtxSelect,
MtxSelectLabelTemplate,
MtxSelectOptionTemplate,
GuiFieldLabel,
], template: "<mat-form-field>\n @if (config.prefix) {\n <span matPrefix>{{ config.prefix }}</span>\n }\n <mtx-select\n [items]=\"config.options || []\"\n [appendTo]=\"appendTo\"\n bindValue=\"value\"\n [(ngModel)]=\"value\"\n [disabled]=\"disabled\"\n [placeholder]=\"config.placeholder || ''\"\n (change)=\"onValueChange()\"\n >\n <ng-template ng-label-tmp let-opt=\"item\">\n <img [src]=\"opt.src\" [alt]=\"opt.label\" />\n <span>{{ opt.label }}</span>\n </ng-template>\n <ng-template ng-option-tmp let-opt=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n <img [src]=\"opt.src\" [alt]=\"opt.label\" />\n <span>{{ opt.label }}</span>\n </ng-template>\n </mtx-select>\n @if (config.suffix) {\n <span matSuffix>{{ config.suffix }}</span>\n }\n @if (config.parentType === 'inline') {\n <mat-hint>\n <gui-field-label [config]=\"config\" />\n </mat-hint>\n }\n</mat-form-field>\n", styles: [".gui-image-select.ng-dropdown-panel .ng-dropdown-panel-items .ng-option img,.gui-image-select .ng-select .ng-value img{height:100%;max-width:7.5rem;object-fit:contain;border-radius:.25rem;background-color:var(--mat-option-hover-state-layer-color)}.gui-image-select{--mat-form-field-container-vertical-padding: 0}.gui-image-select .ng-select{padding:0 .5rem;margin:0 -.5rem}.gui-image-select .ng-select .ng-value-container{height:4rem}.gui-image-select .ng-select .ng-value{display:inline-flex;align-items:center;gap:.5rem;height:100%;padding:.5rem 0}.gui-image-select .ng-select .ng-clear-wrapper .ng-clear{font-family:math;font-size:12px}.gui-image-select .ng-select .ng-arrow{vertical-align:-1px}.gui-image-select.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{display:flex;align-items:center;gap:.5rem;height:4rem;padding:.5rem}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { mtxSelect: [{
type: ViewChild,
args: [MtxSelect]
}], config: [{
type: Input
}], disabled: [{
type: Input
}], appendTo: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW1hZ2Utc2VsZWN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvZ3VpL2ltYWdlLXNlbGVjdC9pbWFnZS1zZWxlY3QudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ndWkvaW1hZ2Utc2VsZWN0L2ltYWdlLXNlbGVjdC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFFTCx1QkFBdUIsRUFFdkIsU0FBUyxFQUNULFVBQVUsRUFDVixLQUFLLEVBQ0wsU0FBUyxFQUNULGlCQUFpQixHQUNsQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQXdCLFdBQVcsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ3RGLE9BQU8sRUFBRSxZQUFZLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQztBQUMzRixPQUFPLEVBQ0wsU0FBUyxFQUNULHNCQUFzQixFQUN0Qix1QkFBdUIsR0FDeEIsTUFBTSw4QkFBOEIsQ0FBQztBQUN0QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7OztBQWdDM0QsTUFBTSxPQUFPLGNBQWM7SUFZekIsWUFBb0IsR0FBc0I7UUFBdEIsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUFUakMsV0FBTSxHQUF3QixFQUFFLENBQUM7UUFDakMsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUNqQixhQUFRLEdBQUcsTUFBTSxDQUFDO1FBSW5CLGFBQVEsR0FBNkIsR0FBRyxFQUFFLEdBQUUsQ0FBQyxDQUFDO1FBQzlDLGNBQVMsR0FBZSxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7SUFFSSxDQUFDO0lBRTlDLGVBQWU7UUFDYixzREFBc0Q7UUFDdEQsTUFBTSxFQUFFLFFBQVEsRUFBRSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUM7UUFDcEMsUUFBUSxDQUFDLE9BQU8sR0FBRyxDQUFDLFFBQVEsQ0FBQyxPQUFPLElBQUksRUFBRSxDQUFDLEdBQUcsbUJBQW1CLENBQUM7SUFDcEUsQ0FBQztJQUVELFVBQVUsQ0FBQyxLQUFjO1FBQ3ZCLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO1FBQ25CLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDMUIsQ0FBQztJQUVELGdCQUFnQixDQUFDLEVBQTRCO1FBQzNDLElBQUksQ0FBQyxRQUFRLEdBQUcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFFRCxpQkFBaUIsQ0FBQyxFQUFjO1FBQzlCLElBQUksQ0FBQyxTQUFTLEdBQUcsRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFFRCxnQkFBZ0IsQ0FBQyxVQUFtQjtRQUNsQyxJQUFJLENBQUMsUUFBUSxHQUFHLFVBQVUsQ0FBQztRQUMzQixJQUFJLENBQUMsR0FBRyxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQzFCLENBQUM7SUFFRCxhQUFhO1FBQ1gsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDNUIsQ0FBQzsrR0F4Q1UsY0FBYzttR0FBZCxjQUFjLGlNQXBCZDtZQUNUO2dCQUNFLE9BQU8sRUFBRSxpQkFBaUI7Z0JBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsY0FBYyxDQUFDO2dCQUM3QyxLQUFLLEVBQUUsSUFBSTthQUNaO1NBQ0YscUVBZVUsU0FBUyxnRENsRHRCLHc3QkErQkEsaTRCRE9JLFdBQVcsK1ZBQ1gsWUFBWSw0TEFDWixTQUFTLHFIQUNULFNBQVMscUhBQ1QsT0FBTyw4RUFDUCxTQUFTLDYrQkFDVCxzQkFBc0IsMkRBQ3RCLHVCQUF1Qiw0REFDdkIsYUFBYTs7NEZBR0osY0FBYztrQkE3QjFCLFNBQVM7K0JBQ0Usa0JBQWtCLFFBR3RCO3dCQUNKLEtBQUssRUFBRSw0QkFBNEI7cUJBQ3BDLGlCQUNjLGlCQUFpQixDQUFDLElBQUksbUJBQ3BCLHVCQUF1QixDQUFDLE1BQU0sYUFDcEM7d0JBQ1Q7NEJBQ0UsT0FBTyxFQUFFLGlCQUFpQjs0QkFDMUIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsZUFBZSxDQUFDOzRCQUM3QyxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRixjQUNXLElBQUksV0FDUDt3QkFDUCxXQUFXO3dCQUNYLFlBQVk7d0JBQ1osU0FBUzt3QkFDVCxTQUFTO3dCQUNULE9BQU87d0JBQ1AsU0FBUzt3QkFDVCxzQkFBc0I7d0JBQ3RCLHVCQUF1Qjt3QkFDdkIsYUFBYTtxQkFDZDtzRkFHcUIsU0FBUztzQkFBOUIsU0FBUzt1QkFBQyxTQUFTO2dCQUVYLE1BQU07c0JBQWQsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBBZnRlclZpZXdJbml0LFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgZm9yd2FyZFJlZixcbiAgSW5wdXQsXG4gIFZpZXdDaGlsZCxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29udHJvbFZhbHVlQWNjZXNzb3IsIEZvcm1zTW9kdWxlLCBOR19WQUxVRV9BQ0NFU1NPUiB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7IE1hdEZvcm1GaWVsZCwgTWF0SGludCwgTWF0UHJlZml4LCBNYXRTdWZmaXggfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9mb3JtLWZpZWxkJztcbmltcG9ydCB7XG4gIE10eFNlbGVjdCxcbiAgTXR4U2VsZWN0TGFiZWxUZW1wbGF0ZSxcbiAgTXR4U2VsZWN0T3B0aW9uVGVtcGxhdGUsXG59IGZyb20gJ0BuZy1tYXRlcm8vZXh0ZW5zaW9ucy9zZWxlY3QnO1xuaW1wb3J0IHsgR3VpRmllbGRMYWJlbCB9IGZyb20gJy4uL2ZpZWxkLWxhYmVsL2ZpZWxkLWxhYmVsJztcbmltcG9ydCB7IEd1aUNvbnRyb2wgfSBmcm9tICcuLi9pbnRlcmZhY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdndWktaW1hZ2Utc2VsZWN0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL2ltYWdlLXNlbGVjdC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL2ltYWdlLXNlbGVjdC5zY3NzJyxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnZ3VpLWZpZWxkIGd1aS1pbWFnZS1zZWxlY3QnLFxuICB9LFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgcHJvdmlkZXJzOiBbXG4gICAge1xuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBHdWlJbWFnZVNlbGVjdCksXG4gICAgICBtdWx0aTogdHJ1ZSxcbiAgICB9LFxuICBdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXG4gICAgRm9ybXNNb2R1bGUsXG4gICAgTWF0Rm9ybUZpZWxkLFxuICAgIE1hdFByZWZpeCxcbiAgICBNYXRTdWZmaXgsXG4gICAgTWF0SGludCxcbiAgICBNdHhTZWxlY3QsXG4gICAgTXR4U2VsZWN0TGFiZWxUZW1wbGF0ZSxcbiAgICBNdHhTZWxlY3RPcHRpb25UZW1wbGF0ZSxcbiAgICBHdWlGaWVsZExhYmVsLFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBHdWlJbWFnZVNlbGVjdCBpbXBsZW1lbnRzIENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBBZnRlclZpZXdJbml0IHtcbiAgQFZpZXdDaGlsZChNdHhTZWxlY3QpIG10eFNlbGVjdCE6IE10eFNlbGVjdDtcblxuICBASW5wdXQoKSBjb25maWc6IFBhcnRpYWw8R3VpQ29udHJvbD4gPSB7fTtcbiAgQElucHV0KCkgZGlzYWJsZWQgPSBmYWxzZTtcbiAgQElucHV0KCkgYXBwZW5kVG8gPSAnYm9keSc7XG5cbiAgdmFsdWU6IHVua25vd247XG5cbiAgcHJpdmF0ZSBvbkNoYW5nZTogKHZhbHVlOiB1bmtub3duKSA9PiB2b2lkID0gKCkgPT4ge307XG4gIHByaXZhdGUgb25Ub3VjaGVkOiAoKSA9PiB2b2lkID0gKCkgPT4ge307XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBjZHI6IENoYW5nZURldGVjdG9yUmVmKSB7fVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpOiB2b2lkIHtcbiAgICAvLyBBZGQgYWRkaXRpb25hbCBjbGFzcyBmb3Igbmctc2VsZWN0J3MgZHJvcGRvd24gcGFuZWxcbiAgICBjb25zdCB7IG5nU2VsZWN0IH0gPSB0aGlzLm10eFNlbGVjdDtcbiAgICBuZ1NlbGVjdC5jbGFzc2VzID0gKG5nU2VsZWN0LmNsYXNzZXMgfHwgJycpICsgJyBndWktaW1hZ2Utc2VsZWN0JztcbiAgfVxuXG4gIHdyaXRlVmFsdWUodmFsdWU6IHVua25vd24pIHtcbiAgICB0aGlzLnZhbHVlID0gdmFsdWU7XG4gICAgdGhpcy5jZHIubWFya0ZvckNoZWNrKCk7XG4gIH1cblxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiAodmFsdWU6IHVua25vd24pID0+IHZvaWQpIHtcbiAgICB0aGlzLm9uQ2hhbmdlID0gZm47XG4gIH1cblxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogKCkgPT4gdm9pZCkge1xuICAgIHRoaXMub25Ub3VjaGVkID0gZm47XG4gIH1cblxuICBzZXREaXNhYmxlZFN0YXRlKGlzRGlzYWJsZWQ6IGJvb2xlYW4pIHtcbiAgICB0aGlzLmRpc2FibGVkID0gaXNEaXNhYmxlZDtcbiAgICB0aGlzLmNkci5tYXJrRm9yQ2hlY2soKTtcbiAgfVxuXG4gIG9uVmFsdWVDaGFuZ2UoKSB7XG4gICAgdGhpcy5vbkNoYW5nZSh0aGlzLnZhbHVlKTtcbiAgfVxufVxuIiwiPG1hdC1mb3JtLWZpZWxkPlxuICBAaWYgKGNvbmZpZy5wcmVmaXgpIHtcbiAgICA8c3BhbiBtYXRQcmVmaXg+e3sgY29uZmlnLnByZWZpeCB9fTwvc3Bhbj5cbiAgfVxuICA8bXR4LXNlbGVjdFxuICAgIFtpdGVtc109XCJjb25maWcub3B0aW9ucyB8fCBbXVwiXG4gICAgW2FwcGVuZFRvXT1cImFwcGVuZFRvXCJcbiAgICBiaW5kVmFsdWU9XCJ2YWx1ZVwiXG4gICAgWyhuZ01vZGVsKV09XCJ2YWx1ZVwiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICBbcGxhY2Vob2xkZXJdPVwiY29uZmlnLnBsYWNlaG9sZGVyIHx8ICcnXCJcbiAgICAoY2hhbmdlKT1cIm9uVmFsdWVDaGFuZ2UoKVwiXG4gID5cbiAgICA8bmctdGVtcGxhdGUgbmctbGFiZWwtdG1wIGxldC1vcHQ9XCJpdGVtXCI+XG4gICAgICA8aW1nIFtzcmNdPVwib3B0LnNyY1wiIFthbHRdPVwib3B0LmxhYmVsXCIgLz5cbiAgICAgIDxzcGFuPnt7IG9wdC5sYWJlbCB9fTwvc3Bhbj5cbiAgICA8L25nLXRlbXBsYXRlPlxuICAgIDxuZy10ZW1wbGF0ZSBuZy1vcHRpb24tdG1wIGxldC1vcHQ9XCJpdGVtXCIgbGV0LWluZGV4PVwiaW5kZXhcIiBsZXQtc2VhcmNoPVwic2VhcmNoVGVybVwiPlxuICAgICAgPGltZyBbc3JjXT1cIm9wdC5zcmNcIiBbYWx0XT1cIm9wdC5sYWJlbFwiIC8+XG4gICAgICA8c3Bhbj57eyBvcHQubGFiZWwgfX08L3NwYW4+XG4gICAgPC9uZy10ZW1wbGF0ZT5cbiAgPC9tdHgtc2VsZWN0PlxuICBAaWYgKGNvbmZpZy5zdWZmaXgpIHtcbiAgICA8c3BhbiBtYXRTdWZmaXg+e3sgY29uZmlnLnN1ZmZpeCB9fTwvc3Bhbj5cbiAgfVxuICBAaWYgKGNvbmZpZy5wYXJlbnRUeXBlID09PSAnaW5saW5lJykge1xuICAgIDxtYXQtaGludD5cbiAgICAgIDxndWktZmllbGQtbGFiZWwgW2NvbmZpZ109XCJjb25maWdcIiAvPlxuICAgIDwvbWF0LWhpbnQ+XG4gIH1cbjwvbWF0LWZvcm0tZmllbGQ+XG4iXX0=