@vendasta/store/order-form/fields/field.component.js

Components and data for Store

import { Input, Component } from '@angular/core';
var FieldComponent = /** @class */ (function () {
    function FieldComponent() {
    }
    Object.defineProperty(FieldComponent.prototype, "isValid", {
        get: function () {
            return this.form.controls[this.field.id].valid || this.form.controls[this.field.id].pristine;
        },
        enumerable: true,
        configurable: true
    });
    FieldComponent.decorators = [
        { type: Component, args: [{
                    selector: 'va-field',
                    styles: ["input { font-size: 16px; } .hide { display: none; } mat-select { width: 100%; } .help-block { white-space: pre-wrap; } .hint-description { color: #9e9e9e; font-size: 12px; margin-top: -24px; } .checkbox-description { margin-top: -14px; margin-left: 32px; } .form-field-container { font-size: 16px; width: 100%; margin: 10px 0; text-overflow: ellipsis; } .form-field-container input { color: rgba(0, 0, 0, 0.87); } .form-field-container textarea { overflow: hidden; } .checkbox { display: flex; padding: 5px 0; color: rgba(0, 0, 0, 0.54); margin-top: 30px; } .textarea-description { margin-bottom: 10px; } mat-checkbox { display: flex; } .checkbox-placeholder { margin-left: 10px; } "],
                    template: "<ng-container [ngSwitch]=\"field.controlType\" [formGroup]=\"form\"> <ng-container *ngSwitchCase=\"'dropdown'\"> <mat-form-field class=\"form-field-container dropdown\"> <mat-select class=\"test-class\" matInput [formControlName]=\"field.id\" [id]=\"field.id\" [placeholder]=\"field.getLabel()\"> <mat-option *ngFor=\"let option of field.options\" [value]=\"option.value\">{{ option.label }}</mat-option> </mat-select> </mat-form-field> <div *ngIf=\"field.description\" class=\"hint-description\">{{ field.description }}</div> </ng-container> <ng-container *ngSwitchCase=\"'textbox'\"> <mat-form-field class=\"form-field-container\"> <input [type]=\"field.textboxType\" [id]=\"field.id\" [formControlName]=\"field.id\" matInput [placeholder]=\"field.getLabel()\"> </mat-form-field> <div class=\"hint-description\" *ngIf=\"field.description\">{{ field.description }}</div> </ng-container> <ng-container *ngSwitchCase=\"'checkbox'\"> <div class=\"form-field-container checkbox\"> <mat-checkbox [formControlName]=\"field.id\" [id]=\"field.id\" ngControlDefault></mat-checkbox> <div class=\"checkbox-placeholder\"> {{field.label}}</div> </div> <div class=\"hint-description checkbox-description\" *ngIf=\"field.description\">{{ field.description }}</div> </ng-container> <ng-container *ngSwitchCase=\"'textarea'\"> <mat-form-field class=\"form-field-container\"> <textarea matInput [formControlName]=\"field.id\" [placeholder]=\"field.getLabel()\" [id]=\"field.id\"></textarea> </mat-form-field> <div class=\"hint-description textarea-description\" *ngIf=\"field.description\">{{ field.description }}</div> </ng-container> <ng-container *ngSwitchCase=\"'file'\"> <div class=\"form-field-container\"> <file-group-uploader [uploadUrl]=\"field.uploadUrl\" [label]=\"field.getLabel()\" [description]=\"field.description\" [formGroup]=\"form\" [formControlName]=\"field.id\" [numFiles]=\"field.numFiles\" class=\"form-field-container\"></file-group-uploader> </div> </ng-container> </ng-container> "
                },] },
    ];
    /** @nocollapse */
    FieldComponent.ctorParameters = function () { return []; };
    FieldComponent.propDecorators = {
        'field': [{ type: Input },],
        'form': [{ type: Input },],
    };
    return FieldComponent;
}());
export { FieldComponent };