@acrodata/gui
Version:
JSON powered GUI for configurable panels.
85 lines • 17.5 kB
JavaScript
import { ChangeDetectionStrategy, Component, forwardRef, Input, ViewEncapsulation, } from '@angular/core';
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
import { MatFormField, MatHint, MatPrefix, MatSuffix } from '@angular/material/form-field';
import { MatInput } from '@angular/material/input';
import { MtxColorpicker, MtxColorpickerInput, MtxColorpickerToggle, } from '@ng-matero/extensions/colorpicker';
import { GuiFieldLabel } from '../field-label/field-label';
import { GuiIconButtonWrapper } from '../icon-button-wrapper/icon-button-wrapper';
import { GuiFillPicker } from './fill-picker';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
export class GuiFill {
constructor(cdr) {
this.cdr = cdr;
this.config = {};
this.disabled = false;
this.type = 'all';
this.value = '';
this.onChange = () => { };
this.onTouched = () => { };
}
ngOnChanges(changes) {
if (changes['config']) {
this.type = (this.config.mode || 'all');
}
}
writeValue(value) {
if (typeof value === 'string') {
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: GuiFill, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: GuiFill, isStandalone: true, selector: "gui-fill", inputs: { config: "config", disabled: "disabled", type: "type" }, host: { classAttribute: "gui-field gui-fill" }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => GuiFill),
multi: true,
},
], usesOnChanges: true, ngImport: i0, template: "<mat-form-field>\n <ng-container matPrefix>\n <span class=\"gui-color-block\">\n <span\n class=\"gui-color-block-bg\"\n [style.background]=\"value + ' center / contain no-repeat'\"\n ></span>\n </span>\n </ng-container>\n\n <input\n matInput\n [(ngModel)]=\"value\"\n [disabled]=\"disabled\"\n [placeholder]=\"config.placeholder || ''\"\n [mtxColorpicker]=\"cp\"\n (colorChange)=\"onValueChange()\"\n />\n\n <mtx-colorpicker #cp [content]=\"customPickerContent\" />\n <gui-icon-button-wrapper matSuffix>\n <mtx-colorpicker-toggle [for]=\"cp\" />\n </gui-icon-button-wrapper>\n\n @if (config.parentType === 'inline') {\n <mat-hint>\n <gui-field-label [config]=\"config\" />\n </mat-hint>\n }\n</mat-form-field>\n\n<ng-template #customPickerContent>\n <gui-fill-picker [type]=\"type\" [(ngModel)]=\"cp.selected\" (ngModelChange)=\"cp.select($event)\" />\n</ng-template>\n", styles: [".gui-color-block{position:relative;display:inline-block;width:1.5rem;height:1.5rem;background-color:#fff;background-image:conic-gradient(transparent 25%,#ccc 25% 50%,transparent 50% 75%,#ccc 75%);background-size:.5rem .5rem}.gui-color-block-bg{display:inline-block;width:100%;height:100%}.gui-color-block-bg:after{display:inline-block;width:100%;height:100%;box-sizing:border-box;border:1px solid currentColor;border-top-left-radius:var(--mdc-filled-text-field-container-shape);border-bottom-left-radius:var(--mdc-filled-text-field-container-shape);opacity:.12;content:\"\"}[dir=rtl] .gui-color-block-bg:after{border-radius:0;border-top-right-radius:var(--mdc-filled-text-field-container-shape);border-bottom-right-radius:var(--mdc-filled-text-field-container-shape)}.gui-fill .mat-mdc-icon-button{display:inline-flex;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.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: 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: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MtxColorpickerInput, selector: "input[mtxColorpicker]", inputs: ["mtxColorpicker", "disabled", "value", "format"], outputs: ["colorChange", "colorInput"], exportAs: ["mtxColorpickerInput"] }, { kind: "component", type: MtxColorpicker, selector: "mtx-colorpicker", inputs: ["content", "disabled", "xPosition", "yPosition", "restoreFocus", "opened", "color", "format"], outputs: ["opened", "closed"], exportAs: ["mtxColorpicker"] }, { kind: "component", type: MtxColorpickerToggle, selector: "mtx-colorpicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["mtxColorpickerToggle"] }, { kind: "component", type: GuiFieldLabel, selector: "gui-field-label", inputs: ["config", "index"] }, { kind: "component", type: GuiIconButtonWrapper, selector: "gui-icon-button-wrapper" }, { kind: "component", type: GuiFillPicker, selector: "gui-fill-picker", inputs: ["disabled", "type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GuiFill, decorators: [{
type: Component,
args: [{ selector: 'gui-fill', host: {
class: 'gui-field gui-fill',
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => GuiFill),
multi: true,
},
], standalone: true, imports: [
FormsModule,
MatFormField,
MatPrefix,
MatInput,
MatSuffix,
MatHint,
MtxColorpickerInput,
MtxColorpicker,
MtxColorpickerToggle,
GuiFieldLabel,
GuiIconButtonWrapper,
GuiFillPicker,
], template: "<mat-form-field>\n <ng-container matPrefix>\n <span class=\"gui-color-block\">\n <span\n class=\"gui-color-block-bg\"\n [style.background]=\"value + ' center / contain no-repeat'\"\n ></span>\n </span>\n </ng-container>\n\n <input\n matInput\n [(ngModel)]=\"value\"\n [disabled]=\"disabled\"\n [placeholder]=\"config.placeholder || ''\"\n [mtxColorpicker]=\"cp\"\n (colorChange)=\"onValueChange()\"\n />\n\n <mtx-colorpicker #cp [content]=\"customPickerContent\" />\n <gui-icon-button-wrapper matSuffix>\n <mtx-colorpicker-toggle [for]=\"cp\" />\n </gui-icon-button-wrapper>\n\n @if (config.parentType === 'inline') {\n <mat-hint>\n <gui-field-label [config]=\"config\" />\n </mat-hint>\n }\n</mat-form-field>\n\n<ng-template #customPickerContent>\n <gui-fill-picker [type]=\"type\" [(ngModel)]=\"cp.selected\" (ngModelChange)=\"cp.select($event)\" />\n</ng-template>\n", styles: [".gui-color-block{position:relative;display:inline-block;width:1.5rem;height:1.5rem;background-color:#fff;background-image:conic-gradient(transparent 25%,#ccc 25% 50%,transparent 50% 75%,#ccc 75%);background-size:.5rem .5rem}.gui-color-block-bg{display:inline-block;width:100%;height:100%}.gui-color-block-bg:after{display:inline-block;width:100%;height:100%;box-sizing:border-box;border:1px solid currentColor;border-top-left-radius:var(--mdc-filled-text-field-container-shape);border-bottom-left-radius:var(--mdc-filled-text-field-container-shape);opacity:.12;content:\"\"}[dir=rtl] .gui-color-block-bg:after{border-radius:0;border-top-right-radius:var(--mdc-filled-text-field-container-shape);border-bottom-right-radius:var(--mdc-filled-text-field-container-shape)}.gui-fill .mat-mdc-icon-button{display:inline-flex;justify-content:center;align-items:center}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { config: [{
type: Input
}], disabled: [{
type: Input
}], type: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsbC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3Byb2plY3RzL2d1aS9maWxsL2ZpbGwudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9ndWkvZmlsbC9maWxsLmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNMLHVCQUF1QixFQUV2QixTQUFTLEVBQ1QsVUFBVSxFQUNWLEtBQUssRUFHTCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUF3QixXQUFXLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUN0RixPQUFPLEVBQUUsWUFBWSxFQUFFLE9BQU8sRUFBRSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDM0YsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ25ELE9BQU8sRUFDTCxjQUFjLEVBQ2QsbUJBQW1CLEVBQ25CLG9CQUFvQixHQUNyQixNQUFNLG1DQUFtQyxDQUFDO0FBQzNDLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQztBQUMzRCxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUVsRixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFrQzlDLE1BQU0sT0FBTyxPQUFPO0lBVWxCLFlBQW9CLEdBQXNCO1FBQXRCLFFBQUcsR0FBSCxHQUFHLENBQW1CO1FBVGpDLFdBQU0sR0FBd0IsRUFBRSxDQUFDO1FBQ2pDLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsU0FBSSxHQUFnQixLQUFLLENBQUM7UUFFbkMsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUVILGFBQVEsR0FBNEIsR0FBRyxFQUFFLEdBQUUsQ0FBQyxDQUFDO1FBQzdDLGNBQVMsR0FBZSxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7SUFFSSxDQUFDO0lBRTlDLFdBQVcsQ0FBQyxPQUFzQjtRQUNoQyxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsRUFBRSxDQUFDO1lBQ3RCLElBQUksQ0FBQyxJQUFJLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksSUFBSSxLQUFLLENBQWdCLENBQUM7UUFDekQsQ0FBQztJQUNILENBQUM7SUFFRCxVQUFVLENBQUMsS0FBVTtRQUNuQixJQUFJLE9BQU8sS0FBSyxLQUFLLFFBQVEsRUFBRSxDQUFDO1lBQzlCLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDO1lBQ25CLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLENBQUM7UUFDMUIsQ0FBQztJQUNILENBQUM7SUFFRCxnQkFBZ0IsQ0FBQyxFQUEyQjtRQUMxQyxJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsQ0FBQztJQUNyQixDQUFDO0lBRUQsaUJBQWlCLENBQUMsRUFBYztRQUM5QixJQUFJLENBQUMsU0FBUyxHQUFHLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRUQsZ0JBQWdCLENBQUMsVUFBbUI7UUFDbEMsSUFBSSxDQUFDLFFBQVEsR0FBRyxVQUFVLENBQUM7UUFDM0IsSUFBSSxDQUFDLEdBQUcsQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUMxQixDQUFDO0lBRUQsYUFBYTtRQUNYLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQzVCLENBQUM7K0dBeENVLE9BQU87bUdBQVAsT0FBTyx5S0F2QlA7WUFDVDtnQkFDRSxPQUFPLEVBQUUsaUJBQWlCO2dCQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLE9BQU8sQ0FBQztnQkFDdEMsS0FBSyxFQUFFLElBQUk7YUFDWjtTQUNGLCtDQ3RDSCwrNkJBa0NBLHU1QkRPSSxXQUFXLCttQkFDWCxZQUFZLDRMQUNaLFNBQVMscUhBQ1QsUUFBUSxpVUFDUixTQUFTLHFIQUNULE9BQU8sOEVBQ1AsbUJBQW1CLHdNQUNuQixjQUFjLGlPQUNkLG9CQUFvQiwrS0FDcEIsYUFBYSx5RkFDYixvQkFBb0Isb0VBQ3BCLGFBQWE7OzRGQUdKLE9BQU87a0JBaENuQixTQUFTOytCQUNFLFVBQVUsUUFHZDt3QkFDSixLQUFLLEVBQUUsb0JBQW9CO3FCQUM1QixpQkFDYyxpQkFBaUIsQ0FBQyxJQUFJLG1CQUNwQix1QkFBdUIsQ0FBQyxNQUFNLGFBQ3BDO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLFFBQVEsQ0FBQzs0QkFDdEMsS0FBSyxFQUFFLElBQUk7eUJBQ1o7cUJBQ0YsY0FDVyxJQUFJLFdBQ1A7d0JBQ1AsV0FBVzt3QkFDWCxZQUFZO3dCQUNaLFNBQVM7d0JBQ1QsUUFBUTt3QkFDUixTQUFTO3dCQUNULE9BQU87d0JBQ1AsbUJBQW1CO3dCQUNuQixjQUFjO3dCQUNkLG9CQUFvQjt3QkFDcEIsYUFBYTt3QkFDYixvQkFBb0I7d0JBQ3BCLGFBQWE7cUJBQ2Q7c0ZBR1EsTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENoYW5nZURldGVjdG9yUmVmLFxuICBDb21wb25lbnQsXG4gIGZvcndhcmRSZWYsXG4gIElucHV0LFxuICBPbkNoYW5nZXMsXG4gIFNpbXBsZUNoYW5nZXMsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBGb3Jtc01vZHVsZSwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5pbXBvcnQgeyBNYXRGb3JtRmllbGQsIE1hdEhpbnQsIE1hdFByZWZpeCwgTWF0U3VmZml4IH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZm9ybS1maWVsZCc7XG5pbXBvcnQgeyBNYXRJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2lucHV0JztcbmltcG9ydCB7XG4gIE10eENvbG9ycGlja2VyLFxuICBNdHhDb2xvcnBpY2tlcklucHV0LFxuICBNdHhDb2xvcnBpY2tlclRvZ2dsZSxcbn0gZnJvbSAnQG5nLW1hdGVyby9leHRlbnNpb25zL2NvbG9ycGlja2VyJztcbmltcG9ydCB7IEd1aUZpZWxkTGFiZWwgfSBmcm9tICcuLi9maWVsZC1sYWJlbC9maWVsZC1sYWJlbCc7XG5pbXBvcnQgeyBHdWlJY29uQnV0dG9uV3JhcHBlciB9IGZyb20gJy4uL2ljb24tYnV0dG9uLXdyYXBwZXIvaWNvbi1idXR0b24td3JhcHBlcic7XG5pbXBvcnQgeyBHdWlDb250cm9sLCBHdWlGaWxsTW9kZSB9IGZyb20gJy4uL2ludGVyZmFjZSc7XG5pbXBvcnQgeyBHdWlGaWxsUGlja2VyIH0gZnJvbSAnLi9maWxsLXBpY2tlcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2d1aS1maWxsJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2ZpbGwuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9maWxsLnNjc3MnLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdndWktZmllbGQgZ3VpLWZpbGwnLFxuICB9LFxuICBlbmNhcHN1bGF0aW9uOiBWaWV3RW5jYXBzdWxhdGlvbi5Ob25lLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgcHJvdmlkZXJzOiBbXG4gICAge1xuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBHdWlGaWxsKSxcbiAgICAgIG11bHRpOiB0cnVlLFxuICAgIH0sXG4gIF0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtcbiAgICBGb3Jtc01vZHVsZSxcbiAgICBNYXRGb3JtRmllbGQsXG4gICAgTWF0UHJlZml4LFxuICAgIE1hdElucHV0LFxuICAgIE1hdFN1ZmZpeCxcbiAgICBNYXRIaW50LFxuICAgIE10eENvbG9ycGlja2VySW5wdXQsXG4gICAgTXR4Q29sb3JwaWNrZXIsXG4gICAgTXR4Q29sb3JwaWNrZXJUb2dnbGUsXG4gICAgR3VpRmllbGRMYWJlbCxcbiAgICBHdWlJY29uQnV0dG9uV3JhcHBlcixcbiAgICBHdWlGaWxsUGlja2VyLFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBHdWlGaWxsIGltcGxlbWVudHMgQ29udHJvbFZhbHVlQWNjZXNzb3IsIE9uQ2hhbmdlcyB7XG4gIEBJbnB1dCgpIGNvbmZpZzogUGFydGlhbDxHdWlDb250cm9sPiA9IHt9O1xuICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuICBASW5wdXQoKSB0eXBlOiBHdWlGaWxsTW9kZSA9ICdhbGwnO1xuXG4gIHZhbHVlID0gJyc7XG5cbiAgcHJpdmF0ZSBvbkNoYW5nZTogKHZhbHVlOiBzdHJpbmcpID0+IHZvaWQgPSAoKSA9PiB7fTtcbiAgcHJpdmF0ZSBvblRvdWNoZWQ6ICgpID0+IHZvaWQgPSAoKSA9PiB7fTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNkcjogQ2hhbmdlRGV0ZWN0b3JSZWYpIHt9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIGlmIChjaGFuZ2VzWydjb25maWcnXSkge1xuICAgICAgdGhpcy50eXBlID0gKHRoaXMuY29uZmlnLm1vZGUgfHwgJ2FsbCcpIGFzIEd1aUZpbGxNb2RlO1xuICAgIH1cbiAgfVxuXG4gIHdyaXRlVmFsdWUodmFsdWU6IGFueSkge1xuICAgIGlmICh0eXBlb2YgdmFsdWUgPT09ICdzdHJpbmcnKSB7XG4gICAgICB0aGlzLnZhbHVlID0gdmFsdWU7XG4gICAgICB0aGlzLmNkci5tYXJrRm9yQ2hlY2soKTtcbiAgICB9XG4gIH1cblxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiAodmFsdWU6IHN0cmluZykgPT4gdm9pZCkge1xuICAgIHRoaXMub25DaGFuZ2UgPSBmbjtcbiAgfVxuXG4gIHJlZ2lzdGVyT25Ub3VjaGVkKGZuOiAoKSA9PiB2b2lkKSB7XG4gICAgdGhpcy5vblRvdWNoZWQgPSBmbjtcbiAgfVxuXG4gIHNldERpc2FibGVkU3RhdGUoaXNEaXNhYmxlZDogYm9vbGVhbikge1xuICAgIHRoaXMuZGlzYWJsZWQgPSBpc0Rpc2FibGVkO1xuICAgIHRoaXMuY2RyLm1hcmtGb3JDaGVjaygpO1xuICB9XG5cbiAgb25WYWx1ZUNoYW5nZSgpIHtcbiAgICB0aGlzLm9uQ2hhbmdlKHRoaXMudmFsdWUpO1xuICB9XG59XG4iLCI8bWF0LWZvcm0tZmllbGQ+XG4gIDxuZy1jb250YWluZXIgbWF0UHJlZml4PlxuICAgIDxzcGFuIGNsYXNzPVwiZ3VpLWNvbG9yLWJsb2NrXCI+XG4gICAgICA8c3BhblxuICAgICAgICBjbGFzcz1cImd1aS1jb2xvci1ibG9jay1iZ1wiXG4gICAgICAgIFtzdHlsZS5iYWNrZ3JvdW5kXT1cInZhbHVlICsgJyBjZW50ZXIgLyBjb250YWluIG5vLXJlcGVhdCdcIlxuICAgICAgPjwvc3Bhbj5cbiAgICA8L3NwYW4+XG4gIDwvbmctY29udGFpbmVyPlxuXG4gIDxpbnB1dFxuICAgIG1hdElucHV0XG4gICAgWyhuZ01vZGVsKV09XCJ2YWx1ZVwiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICBbcGxhY2Vob2xkZXJdPVwiY29uZmlnLnBsYWNlaG9sZGVyIHx8ICcnXCJcbiAgICBbbXR4Q29sb3JwaWNrZXJdPVwiY3BcIlxuICAgIChjb2xvckNoYW5nZSk9XCJvblZhbHVlQ2hhbmdlKClcIlxuICAvPlxuXG4gIDxtdHgtY29sb3JwaWNrZXIgI2NwIFtjb250ZW50XT1cImN1c3RvbVBpY2tlckNvbnRlbnRcIiAvPlxuICA8Z3VpLWljb24tYnV0dG9uLXdyYXBwZXIgbWF0U3VmZml4PlxuICAgIDxtdHgtY29sb3JwaWNrZXItdG9nZ2xlIFtmb3JdPVwiY3BcIiAvPlxuICA8L2d1aS1pY29uLWJ1dHRvbi13cmFwcGVyPlxuXG4gIEBpZiAoY29uZmlnLnBhcmVudFR5cGUgPT09ICdpbmxpbmUnKSB7XG4gICAgPG1hdC1oaW50PlxuICAgICAgPGd1aS1maWVsZC1sYWJlbCBbY29uZmlnXT1cImNvbmZpZ1wiIC8+XG4gICAgPC9tYXQtaGludD5cbiAgfVxuPC9tYXQtZm9ybS1maWVsZD5cblxuPG5nLXRlbXBsYXRlICNjdXN0b21QaWNrZXJDb250ZW50PlxuICA8Z3VpLWZpbGwtcGlja2VyIFt0eXBlXT1cInR5cGVcIiBbKG5nTW9kZWwpXT1cImNwLnNlbGVjdGVkXCIgKG5nTW9kZWxDaGFuZ2UpPVwiY3Auc2VsZWN0KCRldmVudClcIiAvPlxuPC9uZy10ZW1wbGF0ZT5cbiJdfQ==