@netgrif/components
Version:
Netgrif Application Engine frontend Angular components
34 lines • 11 kB
JavaScript
import { Component, Inject } from '@angular/core';
import { AbstractOptionSelectorComponent, NAE_SIDE_MENU_CONTROL } from '@netgrif/components-core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@ngbracket/ngx-layout";
import * as i3 from "@angular/material/autocomplete";
import * as i4 from "@angular/material/core";
import * as i5 from "@angular/material/button";
import * as i6 from "@angular/material/input";
import * as i7 from "@angular/material/form-field";
import * as i8 from "@angular/material/toolbar";
import * as i9 from "@angular/forms";
import * as i10 from "@ngx-translate/core";
import * as i11 from "@netgrif/components-core";
/**
* @deprecated
* */
export class OptionSelectorComponent extends AbstractOptionSelectorComponent {
_sideMenuControl;
constructor(_sideMenuControl) {
super(_sideMenuControl);
this._sideMenuControl = _sideMenuControl;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OptionSelectorComponent, deps: [{ token: NAE_SIDE_MENU_CONTROL }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: OptionSelectorComponent, selector: "nc-option-selector", usesInheritance: true, ngImport: i0, template: "<mat-toolbar color=\"primary\">{{ data.title | translate}}</mat-toolbar>\n<div fxLayout=\"column\" fxLayoutAlign=\"start stretch\" class=\"netgrif-input\">\n <mat-form-field class=\"select-field-margin\" appearance=\"outline\">\n <input type=\"text\" matInput required\n [placeholder]=\"'side-menu.option-selector.choose-one-option' | translate\"\n [formControl]=\"selectorFormControl\"\n [matAutocomplete]=\"auto\"\n (keyup.enter)=\"submit()\">\n <mat-autocomplete #auto=\"matAutocomplete\" [displayWith]=\"displayFn\">\n <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n {{option.text}}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n <button mat-raised-button (click)=\"submit()\">{{'side-menu.option-selector.select' | translate}}</button>\n </div>\n</div>\n", styles: [".select-field-margin{margin:8px 16px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "component", type: i3.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i3.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i6.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: "component", type: i7.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i8.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i9.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: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i9.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.TranslatePipe, name: "translate" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OptionSelectorComponent, decorators: [{
type: Component,
args: [{ selector: 'nc-option-selector', template: "<mat-toolbar color=\"primary\">{{ data.title | translate}}</mat-toolbar>\n<div fxLayout=\"column\" fxLayoutAlign=\"start stretch\" class=\"netgrif-input\">\n <mat-form-field class=\"select-field-margin\" appearance=\"outline\">\n <input type=\"text\" matInput required\n [placeholder]=\"'side-menu.option-selector.choose-one-option' | translate\"\n [formControl]=\"selectorFormControl\"\n [matAutocomplete]=\"auto\"\n (keyup.enter)=\"submit()\">\n <mat-autocomplete #auto=\"matAutocomplete\" [displayWith]=\"displayFn\">\n <mat-option *ngFor=\"let option of filteredOptions | async\" [value]=\"option\">\n {{option.text}}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n <button mat-raised-button (click)=\"submit()\">{{'side-menu.option-selector.select' | translate}}</button>\n </div>\n</div>\n", styles: [".select-field-margin{margin:8px 16px}\n"] }]
}], ctorParameters: () => [{ type: i11.SideMenuControl, decorators: [{
type: Inject,
args: [NAE_SIDE_MENU_CONTROL]
}] }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3B0aW9uLXNlbGVjdG9yLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25ldGdyaWYtY29tcG9uZW50cy9zcmMvbGliL3NpZGUtbWVudS9jb250ZW50LWNvbXBvbmVudHMvb3B0aW9uLXNlbGVjdG9yL29wdGlvbi1zZWxlY3Rvci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZXRncmlmLWNvbXBvbmVudHMvc3JjL2xpYi9zaWRlLW1lbnUvY29udGVudC1jb21wb25lbnRzL29wdGlvbi1zZWxlY3Rvci9vcHRpb24tc2VsZWN0b3IuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxNQUFNLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDaEQsT0FBTyxFQUFDLCtCQUErQixFQUFFLHFCQUFxQixFQUFrQixNQUFNLDBCQUEwQixDQUFDOzs7Ozs7Ozs7Ozs7O0FBRWpIOztLQUVLO0FBTUwsTUFBTSxPQUFPLHVCQUF3QixTQUFRLCtCQUErQjtJQUVuQjtJQUFyRCxZQUFxRCxnQkFBaUM7UUFDbEYsS0FBSyxDQUFDLGdCQUFnQixDQUFDLENBQUM7UUFEeUIscUJBQWdCLEdBQWhCLGdCQUFnQixDQUFpQjtJQUV0RixDQUFDO3dHQUpRLHVCQUF1QixrQkFFWixxQkFBcUI7NEZBRmhDLHVCQUF1QixpRkNYcEMsdStCQWtCQTs7NEZEUGEsdUJBQXVCO2tCQUxuQyxTQUFTOytCQUNJLG9CQUFvQjs7MEJBTWpCLE1BQU07MkJBQUMscUJBQXFCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIEluamVjdH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0Fic3RyYWN0T3B0aW9uU2VsZWN0b3JDb21wb25lbnQsIE5BRV9TSURFX01FTlVfQ09OVFJPTCwgU2lkZU1lbnVDb250cm9sfSBmcm9tICdAbmV0Z3JpZi9jb21wb25lbnRzLWNvcmUnO1xuXG4vKipcbiAqIEBkZXByZWNhdGVkXG4gKiAqL1xuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICduYy1vcHRpb24tc2VsZWN0b3InLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9vcHRpb24tc2VsZWN0b3IuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL29wdGlvbi1zZWxlY3Rvci5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIE9wdGlvblNlbGVjdG9yQ29tcG9uZW50IGV4dGVuZHMgQWJzdHJhY3RPcHRpb25TZWxlY3RvckNvbXBvbmVudCB7XG5cbiAgICBjb25zdHJ1Y3RvcihASW5qZWN0KE5BRV9TSURFX01FTlVfQ09OVFJPTCkgcHJvdGVjdGVkIF9zaWRlTWVudUNvbnRyb2w6IFNpZGVNZW51Q29udHJvbCkge1xuICAgICAgICBzdXBlcihfc2lkZU1lbnVDb250cm9sKTtcbiAgICB9XG59XG4iLCI8bWF0LXRvb2xiYXIgY29sb3I9XCJwcmltYXJ5XCI+e3sgZGF0YS50aXRsZSB8IHRyYW5zbGF0ZX19PC9tYXQtdG9vbGJhcj5cbjxkaXYgZnhMYXlvdXQ9XCJjb2x1bW5cIiBmeExheW91dEFsaWduPVwic3RhcnQgc3RyZXRjaFwiIGNsYXNzPVwibmV0Z3JpZi1pbnB1dFwiPlxuICAgIDxtYXQtZm9ybS1maWVsZCBjbGFzcz1cInNlbGVjdC1maWVsZC1tYXJnaW5cIiBhcHBlYXJhbmNlPVwib3V0bGluZVwiPlxuICAgICAgICA8aW5wdXQgdHlwZT1cInRleHRcIiBtYXRJbnB1dCByZXF1aXJlZFxuICAgICAgICAgICAgICAgW3BsYWNlaG9sZGVyXT1cIidzaWRlLW1lbnUub3B0aW9uLXNlbGVjdG9yLmNob29zZS1vbmUtb3B0aW9uJyB8IHRyYW5zbGF0ZVwiXG4gICAgICAgICAgICAgICBbZm9ybUNvbnRyb2xdPVwic2VsZWN0b3JGb3JtQ29udHJvbFwiXG4gICAgICAgICAgICAgICBbbWF0QXV0b2NvbXBsZXRlXT1cImF1dG9cIlxuICAgICAgICAgICAgICAgKGtleXVwLmVudGVyKT1cInN1Ym1pdCgpXCI+XG4gICAgICAgIDxtYXQtYXV0b2NvbXBsZXRlICNhdXRvPVwibWF0QXV0b2NvbXBsZXRlXCIgW2Rpc3BsYXlXaXRoXT1cImRpc3BsYXlGblwiPlxuICAgICAgICAgICAgPG1hdC1vcHRpb24gKm5nRm9yPVwibGV0IG9wdGlvbiBvZiBmaWx0ZXJlZE9wdGlvbnMgfCBhc3luY1wiIFt2YWx1ZV09XCJvcHRpb25cIj5cbiAgICAgICAgICAgICAgICB7e29wdGlvbi50ZXh0fX1cbiAgICAgICAgICAgIDwvbWF0LW9wdGlvbj5cbiAgICAgICAgPC9tYXQtYXV0b2NvbXBsZXRlPlxuICAgIDwvbWF0LWZvcm0tZmllbGQ+XG4gICAgPGRpdiBmeExheW91dD1cInJvd1wiIGZ4TGF5b3V0QWxpZ249XCJjZW50ZXIgY2VudGVyXCI+XG4gICAgICAgIDxidXR0b24gbWF0LXJhaXNlZC1idXR0b24gKGNsaWNrKT1cInN1Ym1pdCgpXCI+e3snc2lkZS1tZW51Lm9wdGlvbi1zZWxlY3Rvci5zZWxlY3QnIHwgdHJhbnNsYXRlfX08L2J1dHRvbj5cbiAgICA8L2Rpdj5cbjwvZGl2PlxuIl19