UNPKG

@narik/ui-ng-bootstrap

Version:

Framework to create angular application

37 lines 10.1 kB
import { Component, forwardRef, Injector, Input } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import { NarikSelect } from '@narik/ui-core'; import { NARIK_DATA_DISPLAY_VALUE_INPUTS, NARIK_SELECT_INPUTS, NARIK_DATA_DISPLAY_VALUE_OUTPUTS, } from '../input-output-items'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; import * as i2 from "@angular/forms"; export class NarikNgbSelect extends NarikSelect { constructor(injector) { super(injector); this.optionData = []; } useData(data) { this.optionData = data; } } /** @nocollapse */ /** @nocollapse */ NarikNgbSelect.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: NarikNgbSelect, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); /** @nocollapse */ /** @nocollapse */ NarikNgbSelect.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: NarikNgbSelect, selector: "narik-ngb-select , narik-select", inputs: { displayField: "displayField", valueField: "valueField", listenForDataChange: "listenForDataChange", dataSource: "dataSource", dataKey: "dataKey", dataUrl: "dataUrl", dataInfo: "dataInfo", dataProviderKey: "dataProviderKey", dataParameters: "dataParameters", moduleKey: "moduleKey", dataMethod: "dataMethod", dataUrlMethod: "dataUrlMethod", id: "id", name: "name", label: "label", disabled: "disabled", required: "required", readOnly: "readOnly", placeHolder: "placeHolder", options: "options", multiple: "multiple", icon: "icon" }, outputs: { dataChange: "dataChange", selectedItemChange: "selectedItemChange" }, providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => NarikNgbSelect)), multi: true, }, ], usesInheritance: true, ngImport: i0, template: "<div class=\"form-group\">\n <label for=\"{{id}}\">{{label}}</label>\n <div class=\"input-group mb-3\" *ngIf=\"icon\">\n <div class=\"input-group-prepend\">\n <span class=\"input-group-text\"><i class=\"fa fa-{{icon}}\"></i></span>\n </div>\n <ng-container *ngTemplateOutlet=\"inputElement\"></ng-container>\n </div>\n <ng-container *ngIf=\"!icon\">\n <ng-container *ngTemplateOutlet=\"inputElement\"></ng-container>\n </ng-container>\n\n</div>\n<ng-template #inputElement>\n\n <select [required]=\"required\" class=\"custom-select\" [(ngModel)]=\"value\" [attr.disabled]=\"disabled || null\"\n id=\"{{id}}\">\n <option *ngFor=\"let item of optionData\" [value]=\"item[valueField]\">{{item[displayField]}}</option>\n </select>\n\n\n\n</ng-template>", styles: [".select-clear{position:absolute;left:-2px;top:-30px}.search-input{padding:16px;box-sizing:border-box}.search-continer{border-bottom:1px solid rgba(0,0,0,.12);top:0;width:100%;position:sticky;background-color:#fff;z-index:10000}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] }); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: NarikNgbSelect, decorators: [{ type: Component, args: [{ selector: 'narik-ngb-select , narik-select', inputs: [...NARIK_DATA_DISPLAY_VALUE_INPUTS, ...NARIK_SELECT_INPUTS], outputs: [...NARIK_DATA_DISPLAY_VALUE_OUTPUTS], providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((() => NarikNgbSelect)), multi: true, }, ], template: "<div class=\"form-group\">\n <label for=\"{{id}}\">{{label}}</label>\n <div class=\"input-group mb-3\" *ngIf=\"icon\">\n <div class=\"input-group-prepend\">\n <span class=\"input-group-text\"><i class=\"fa fa-{{icon}}\"></i></span>\n </div>\n <ng-container *ngTemplateOutlet=\"inputElement\"></ng-container>\n </div>\n <ng-container *ngIf=\"!icon\">\n <ng-container *ngTemplateOutlet=\"inputElement\"></ng-container>\n </ng-container>\n\n</div>\n<ng-template #inputElement>\n\n <select [required]=\"required\" class=\"custom-select\" [(ngModel)]=\"value\" [attr.disabled]=\"disabled || null\"\n id=\"{{id}}\">\n <option *ngFor=\"let item of optionData\" [value]=\"item[valueField]\">{{item[displayField]}}</option>\n </select>\n\n\n\n</ng-template>", styles: [".select-clear{position:absolute;left:-2px;top:-30px}.search-input{padding:16px;box-sizing:border-box}.search-continer{border-bottom:1px solid rgba(0,0,0,.12);top:0;width:100%;position:sticky;background-color:#fff;z-index:10000}\n"] }] }], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { icon: [{ type: Input }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmFyaWstbmdiLXNlbGVjdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uYXJpay11aS1uZy1ib290c3RyYXAvc3JjL2xpYi9uYXJpay1uZ2Itc2VsZWN0L25hcmlrLW5nYi1zZWxlY3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmFyaWstdWktbmctYm9vdHN0cmFwL3NyYy9saWIvbmFyaWstbmdiLXNlbGVjdC9uYXJpay1uZ2Itc2VsZWN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLFFBQVEsRUFBVSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDL0UsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbkQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQzdDLE9BQU8sRUFDSCwrQkFBK0IsRUFDL0IsbUJBQW1CLEVBQ25CLGdDQUFnQyxHQUNuQyxNQUFNLHVCQUF1QixDQUFDOzs7O0FBZ0IvQixNQUFNLE9BQU8sY0FBZSxTQUFRLFdBQVc7SUFLM0MsWUFBWSxRQUFrQjtRQUMxQixLQUFLLENBQUMsUUFBUSxDQUFDLENBQUM7UUFMcEIsZUFBVSxHQUFVLEVBQUUsQ0FBQztJQU12QixDQUFDO0lBRVMsT0FBTyxDQUFDLElBQVc7UUFDekIsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUM7SUFDM0IsQ0FBQzs7aUpBWFEsY0FBYztxSUFBZCxjQUFjLHlxQkFSWjtRQUNQO1lBQ0ksT0FBTyxFQUFFLGlCQUFpQjtZQUMxQixXQUFXLEVBQUUsVUFBVSxFQUFDLEdBQUcsRUFBRSxDQUFDLGNBQWMsRUFBQztZQUM3QyxLQUFLLEVBQUUsSUFBSTtTQUNkO0tBQ0osaURDckJMLDR3QkFzQmM7MkZEQ0QsY0FBYztrQkFkMUIsU0FBUzsrQkFDSSxpQ0FBaUMsVUFHbkMsQ0FBQyxHQUFHLCtCQUErQixFQUFFLEdBQUcsbUJBQW1CLENBQUMsV0FDM0QsQ0FBQyxHQUFHLGdDQUFnQyxDQUFDLGFBQ25DO3dCQUNQOzRCQUNJLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLEVBQUMsR0FBRyxFQUFFLGVBQWUsRUFBQzs0QkFDN0MsS0FBSyxFQUFFLElBQUk7eUJBQ2Q7cUJBQ0o7K0ZBS0QsSUFBSTtzQkFESCxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBmb3J3YXJkUmVmLCBJbmplY3RvciwgT25Jbml0LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBOR19WQUxVRV9BQ0NFU1NPUiB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgTmFyaWtTZWxlY3QgfSBmcm9tICdAbmFyaWsvdWktY29yZSc7XHJcbmltcG9ydCB7XHJcbiAgICBOQVJJS19EQVRBX0RJU1BMQVlfVkFMVUVfSU5QVVRTLFxyXG4gICAgTkFSSUtfU0VMRUNUX0lOUFVUUyxcclxuICAgIE5BUklLX0RBVEFfRElTUExBWV9WQUxVRV9PVVRQVVRTLFxyXG59IGZyb20gJy4uL2lucHV0LW91dHB1dC1pdGVtcyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnbmFyaWstbmdiLXNlbGVjdCAsIG5hcmlrLXNlbGVjdCcsXHJcbiAgICB0ZW1wbGF0ZVVybDogJ25hcmlrLW5nYi1zZWxlY3QuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJ25hcmlrLW5nYi1zZWxlY3QuY29tcG9uZW50LmNzcyddLFxyXG4gICAgaW5wdXRzOiBbLi4uTkFSSUtfREFUQV9ESVNQTEFZX1ZBTFVFX0lOUFVUUywgLi4uTkFSSUtfU0VMRUNUX0lOUFVUU10sXHJcbiAgICBvdXRwdXRzOiBbLi4uTkFSSUtfREFUQV9ESVNQTEFZX1ZBTFVFX09VVFBVVFNdLFxyXG4gICAgcHJvdmlkZXJzOiBbXHJcbiAgICAgICAge1xyXG4gICAgICAgICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcclxuICAgICAgICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gTmFyaWtOZ2JTZWxlY3QpLFxyXG4gICAgICAgICAgICBtdWx0aTogdHJ1ZSxcclxuICAgICAgICB9LFxyXG4gICAgXSxcclxufSlcclxuZXhwb3J0IGNsYXNzIE5hcmlrTmdiU2VsZWN0IGV4dGVuZHMgTmFyaWtTZWxlY3QgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gICAgb3B0aW9uRGF0YTogYW55W10gPSBbXTtcclxuICAgIEBJbnB1dCgpXHJcbiAgICBpY29uOiBhbnk7XHJcblxyXG4gICAgY29uc3RydWN0b3IoaW5qZWN0b3I6IEluamVjdG9yKSB7XHJcbiAgICAgICAgc3VwZXIoaW5qZWN0b3IpO1xyXG4gICAgfVxyXG5cclxuICAgIHByb3RlY3RlZCB1c2VEYXRhKGRhdGE6IGFueVtdKSB7XHJcbiAgICAgICAgdGhpcy5vcHRpb25EYXRhID0gZGF0YTtcclxuICAgIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwiZm9ybS1ncm91cFwiPlxuICA8bGFiZWwgZm9yPVwie3tpZH19XCI+e3tsYWJlbH19PC9sYWJlbD5cbiAgPGRpdiBjbGFzcz1cImlucHV0LWdyb3VwIG1iLTNcIiAqbmdJZj1cImljb25cIj5cbiAgICA8ZGl2IGNsYXNzPVwiaW5wdXQtZ3JvdXAtcHJlcGVuZFwiPlxuICAgICAgPHNwYW4gY2xhc3M9XCJpbnB1dC1ncm91cC10ZXh0XCI+PGkgY2xhc3M9XCJmYSBmYS17e2ljb259fVwiPjwvaT48L3NwYW4+XG4gICAgPC9kaXY+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImlucHV0RWxlbWVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbiAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIiFpY29uXCI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cImlucHV0RWxlbWVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L25nLWNvbnRhaW5lcj5cblxuPC9kaXY+XG48bmctdGVtcGxhdGUgI2lucHV0RWxlbWVudD5cblxuICA8c2VsZWN0IFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiIGNsYXNzPVwiY3VzdG9tLXNlbGVjdFwiIFsobmdNb2RlbCldPVwidmFsdWVcIiBbYXR0ci5kaXNhYmxlZF09XCJkaXNhYmxlZCB8fCBudWxsXCJcbiAgICBpZD1cInt7aWR9fVwiPlxuICAgIDxvcHRpb24gKm5nRm9yPVwibGV0IGl0ZW0gb2Ygb3B0aW9uRGF0YVwiIFt2YWx1ZV09XCJpdGVtW3ZhbHVlRmllbGRdXCI+e3tpdGVtW2Rpc3BsYXlGaWVsZF19fTwvb3B0aW9uPlxuICA8L3NlbGVjdD5cblxuXG5cbjwvbmctdGVtcGxhdGU+Il19