survey-angular-ui
Version:
survey.js is a JavaScript Survey Library. It is a modern way to add a survey to your website. It uses JSON for survey metadata and results.
59 lines • 12.6 kB
JavaScript
import { Component, Input } from "@angular/core";
import { DropdownMultiSelectListModel } from "survey-core";
import * as i0 from "@angular/core";
import * as i1 from "./tagbox-item.component";
import * as i2 from "../action-bar/action-bar.component";
import * as i3 from "../popup/popup.component";
import * as i4 from "../../survey-string.component";
import * as i5 from "@angular/common";
import * as i6 from "../../utils/dynamic.directive";
export class TagboxComponent {
get dropdownModel() {
var _a;
return (_a = this.model) === null || _a === void 0 ? void 0 : _a.dropdownListModel;
}
getModel() {
return this.model;
}
ngOnInit() {
if (!this.model.dropdownListModel) {
this.model.dropdownListModel = new DropdownMultiSelectListModel(this.model);
}
}
click(event) {
var _a;
(_a = this.dropdownModel) === null || _a === void 0 ? void 0 : _a.onClick(event);
}
chevronPointerDown(event) {
var _a;
(_a = this.dropdownModel) === null || _a === void 0 ? void 0 : _a.chevronPointerDown(event);
}
clear(event) {
var _a;
(_a = this.dropdownModel) === null || _a === void 0 ? void 0 : _a.onClear(event);
}
keyhandler(event) {
var _a;
(_a = this.dropdownModel) === null || _a === void 0 ? void 0 : _a.keyHandler(event);
}
blur(event) {
var _a;
(_a = this.model) === null || _a === void 0 ? void 0 : _a.onBlur(event);
}
focus(event) {
var _a;
(_a = this.model) === null || _a === void 0 ? void 0 : _a.onFocus(event);
}
}
TagboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TagboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
TagboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TagboxComponent, selector: "sv-ng-tagbox, '[sv-ng-tagbox]'", inputs: { model: "model" }, ngImport: i0, template: "<div [class]=\"model.cssClasses.selectWrapper\" (click)=\"click($event)\">\n <div *ngIf=\"!model.isReadOnly\" [attr.tabindex]=\"dropdownModel.noTabIndex ? null : 0\"\n [class]=\"model.getControlClass()\" [attr.disabled]=\"model.isDisabledAttr ? true : null\" (blur)=\"blur($event)\"\n (keydown)=\"keyhandler($event)\" [attr.id]=\"model.inputId\" [attr.role]=\"dropdownModel.ariaQuestionRole\"\n [attr.aria-required]=\"dropdownModel.ariaQuestionRequired\" [attr.aria-label]=\"dropdownModel.ariaQuestionLabel\"\n [attr.aria-labelledby]=\"dropdownModel.ariaQuestionLabelledby\"\n [attr.aria-describedby]=\"dropdownModel.ariaQuestionDescribedby\"\n [attr.aria-invalid]=\"dropdownModel.ariaQuestionInvalid\"\n [attr.aria-errormessage]=\"dropdownModel.ariaQuestionErrorMessage\"\n [attr.aria-controls]=\"dropdownModel.ariaQuestionControls\"\n [attr.aria-expanded]=\"dropdownModel.ariaQuestionExpanded\"\n [attr.aria-activedescendant]=\"dropdownModel.ariaQuestionActivedescendant\">\n <div [class]=\"model.cssClasses.controlValue\">\n <ng-container *ngIf=\"!model.isEmpty()\">\n <sv-ng-tagbox-item *ngFor=\"let item of model.selectedChoices\" [item]=\"item\" [question]=\"model\">\n </sv-ng-tagbox-item>\n </ng-container>\n <ng-template *ngIf=\"dropdownModel.needRenderInput\"\n [component]=\"{ name: 'sv-tagbox-filter', data: { model: dropdownModel, question: model } }\"></ng-template>\n </div>\n <sv-ng-action-bar [model]=\"dropdownModel.editorButtons\"></sv-ng-action-bar>\n </div>\n <sv-ng-popup *ngIf=\"!model.isInputReadOnly\" [popupModel]=\"model.popupModel\"></sv-ng-popup>\n <div *ngIf=\"model.isReadOnly\" [class]=\"model.getControlClass()\" [attr.id]=\"model.inputId\"\n [attr.tabindex]=\"model.isDisabledAttr ? null : 0\" [attr.disabled]=\"model.isDisabledAttr ? true : null\"\n [attr.role]=\"dropdownModel?.ariaQuestionRole\" [attr.aria-label]=\"dropdownModel?.ariaQuestionLabel\"\n [attr.aria-labelledby]=\"dropdownModel?.ariaQuestionLabelledby\"\n [attr.aria-describedby]=\"dropdownModel?.ariaQuestionDescribedby\" [attr.aria-expanded]=\"false\"\n [attr.aria-readonly]=\"true\" [attr.aria-disabled]=\"true\">\n <div [class]=\"model.cssClasses.controlValue\">\n <sv-ng-string *ngIf=\"model.locReadOnlyText\" [model]=\"model.locReadOnlyText\"></sv-ng-string>\n </div>\n <sv-ng-action-bar [model]=\"dropdownModel.editorButtons\"></sv-ng-action-bar>\n </div>\n</div>", components: [{ type: i1.TagboxItemComponent, selector: "sv-ng-tagbox-item, '[sv-ng-tagbox-item]'", inputs: ["item", "question"] }, { type: i2.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: i3.PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel"] }, { type: i4.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TagboxComponent, decorators: [{
type: Component,
args: [{
selector: "sv-ng-tagbox, '[sv-ng-tagbox]'",
templateUrl: "./tagbox.component.html"
}]
}], propDecorators: { model: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnYm94LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3RhZ2JveC90YWdib3guY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdGFnYm94L3RhZ2JveC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxNQUFNLGVBQWUsQ0FBQztBQUN6RCxPQUFPLEVBQUUsNEJBQTRCLEVBQUUsTUFBTSxhQUFhLENBQUM7Ozs7Ozs7O0FBTTNELE1BQU0sT0FBTyxlQUFlO0lBR3hCLElBQUksYUFBYTs7UUFDZixPQUFPLE1BQUEsSUFBSSxDQUFDLEtBQUssMENBQUUsaUJBQWlCLENBQUM7SUFDdkMsQ0FBQztJQUVELFFBQVE7UUFDTixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDcEIsQ0FBQztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxpQkFBaUIsRUFBRTtZQUNqQyxJQUFJLENBQUMsS0FBSyxDQUFDLGlCQUFpQixHQUFHLElBQUksNEJBQTRCLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO1NBQzdFO0lBQ0gsQ0FBQztJQUVELEtBQUssQ0FBQyxLQUFVOztRQUNkLE1BQUEsSUFBSSxDQUFDLGFBQWEsMENBQUUsT0FBTyxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3JDLENBQUM7SUFDRCxrQkFBa0IsQ0FBQyxLQUFVOztRQUMzQixNQUFBLElBQUksQ0FBQyxhQUFhLDBDQUFFLGtCQUFrQixDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2hELENBQUM7SUFDRCxLQUFLLENBQUMsS0FBVTs7UUFDZCxNQUFBLElBQUksQ0FBQyxhQUFhLDBDQUFFLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNyQyxDQUFDO0lBQ0QsVUFBVSxDQUFDLEtBQVU7O1FBQ25CLE1BQUEsSUFBSSxDQUFDLGFBQWEsMENBQUUsVUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3hDLENBQUM7SUFDRCxJQUFJLENBQUMsS0FBVTs7UUFDYixNQUFBLElBQUksQ0FBQyxLQUFLLDBDQUFFLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM1QixDQUFDO0lBQ0QsS0FBSyxDQUFDLEtBQVU7O1FBQ2QsTUFBQSxJQUFJLENBQUMsS0FBSywwQ0FBRSxPQUFPLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDN0IsQ0FBQzs7NkdBbENRLGVBQWU7aUdBQWYsZUFBZSxrR0NQNUIsZ2tGQWtDTTs0RkQzQk8sZUFBZTtrQkFKM0IsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZ0NBQWdDO29CQUMxQyxXQUFXLEVBQUUseUJBQXlCO2lCQUN2Qzs4QkFFWSxLQUFLO3NCQUFiLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkluaXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgRHJvcGRvd25NdWx0aVNlbGVjdExpc3RNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwic3YtbmctdGFnYm94LCAnW3N2LW5nLXRhZ2JveF0nXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vdGFnYm94LmNvbXBvbmVudC5odG1sXCJcbn0pXG5leHBvcnQgY2xhc3MgVGFnYm94Q29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICBASW5wdXQoKSBtb2RlbDogYW55O1xuXG4gICAgZ2V0IGRyb3Bkb3duTW9kZWwoKTogRHJvcGRvd25NdWx0aVNlbGVjdExpc3RNb2RlbCB7XG4gICAgICByZXR1cm4gdGhpcy5tb2RlbD8uZHJvcGRvd25MaXN0TW9kZWw7XG4gICAgfVxuXG4gICAgZ2V0TW9kZWwoKSB7XG4gICAgICByZXR1cm4gdGhpcy5tb2RlbDtcbiAgICB9XG5cbiAgICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICAgIGlmICghdGhpcy5tb2RlbC5kcm9wZG93bkxpc3RNb2RlbCkge1xuICAgICAgICB0aGlzLm1vZGVsLmRyb3Bkb3duTGlzdE1vZGVsID0gbmV3IERyb3Bkb3duTXVsdGlTZWxlY3RMaXN0TW9kZWwodGhpcy5tb2RlbCk7XG4gICAgICB9XG4gICAgfVxuXG4gICAgY2xpY2soZXZlbnQ6IGFueSkge1xuICAgICAgdGhpcy5kcm9wZG93bk1vZGVsPy5vbkNsaWNrKGV2ZW50KTtcbiAgICB9XG4gICAgY2hldnJvblBvaW50ZXJEb3duKGV2ZW50OiBhbnkpIHtcbiAgICAgIHRoaXMuZHJvcGRvd25Nb2RlbD8uY2hldnJvblBvaW50ZXJEb3duKGV2ZW50KTtcbiAgICB9XG4gICAgY2xlYXIoZXZlbnQ6IGFueSkge1xuICAgICAgdGhpcy5kcm9wZG93bk1vZGVsPy5vbkNsZWFyKGV2ZW50KTtcbiAgICB9XG4gICAga2V5aGFuZGxlcihldmVudDogYW55KSB7XG4gICAgICB0aGlzLmRyb3Bkb3duTW9kZWw/LmtleUhhbmRsZXIoZXZlbnQpO1xuICAgIH1cbiAgICBibHVyKGV2ZW50OiBhbnkpIHtcbiAgICAgIHRoaXMubW9kZWw/Lm9uQmx1cihldmVudCk7XG4gICAgfVxuICAgIGZvY3VzKGV2ZW50OiBhbnkpIHtcbiAgICAgIHRoaXMubW9kZWw/Lm9uRm9jdXMoZXZlbnQpO1xuICAgIH1cbn0iLCI8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnNlbGVjdFdyYXBwZXJcIiAoY2xpY2spPVwiY2xpY2soJGV2ZW50KVwiPlxuICAgIDxkaXYgKm5nSWY9XCIhbW9kZWwuaXNSZWFkT25seVwiIFthdHRyLnRhYmluZGV4XT1cImRyb3Bkb3duTW9kZWwubm9UYWJJbmRleCA/IG51bGwgOiAwXCJcbiAgICAgICAgW2NsYXNzXT1cIm1vZGVsLmdldENvbnRyb2xDbGFzcygpXCIgW2F0dHIuZGlzYWJsZWRdPVwibW9kZWwuaXNEaXNhYmxlZEF0dHIgPyB0cnVlIDogbnVsbFwiIChibHVyKT1cImJsdXIoJGV2ZW50KVwiXG4gICAgICAgIChrZXlkb3duKT1cImtleWhhbmRsZXIoJGV2ZW50KVwiIFthdHRyLmlkXT1cIm1vZGVsLmlucHV0SWRcIiBbYXR0ci5yb2xlXT1cImRyb3Bkb3duTW9kZWwuYXJpYVF1ZXN0aW9uUm9sZVwiXG4gICAgICAgIFthdHRyLmFyaWEtcmVxdWlyZWRdPVwiZHJvcGRvd25Nb2RlbC5hcmlhUXVlc3Rpb25SZXF1aXJlZFwiIFthdHRyLmFyaWEtbGFiZWxdPVwiZHJvcGRvd25Nb2RlbC5hcmlhUXVlc3Rpb25MYWJlbFwiXG4gICAgICAgIFthdHRyLmFyaWEtbGFiZWxsZWRieV09XCJkcm9wZG93bk1vZGVsLmFyaWFRdWVzdGlvbkxhYmVsbGVkYnlcIlxuICAgICAgICBbYXR0ci5hcmlhLWRlc2NyaWJlZGJ5XT1cImRyb3Bkb3duTW9kZWwuYXJpYVF1ZXN0aW9uRGVzY3JpYmVkYnlcIlxuICAgICAgICBbYXR0ci5hcmlhLWludmFsaWRdPVwiZHJvcGRvd25Nb2RlbC5hcmlhUXVlc3Rpb25JbnZhbGlkXCJcbiAgICAgICAgW2F0dHIuYXJpYS1lcnJvcm1lc3NhZ2VdPVwiZHJvcGRvd25Nb2RlbC5hcmlhUXVlc3Rpb25FcnJvck1lc3NhZ2VcIlxuICAgICAgICBbYXR0ci5hcmlhLWNvbnRyb2xzXT1cImRyb3Bkb3duTW9kZWwuYXJpYVF1ZXN0aW9uQ29udHJvbHNcIlxuICAgICAgICBbYXR0ci5hcmlhLWV4cGFuZGVkXT1cImRyb3Bkb3duTW9kZWwuYXJpYVF1ZXN0aW9uRXhwYW5kZWRcIlxuICAgICAgICBbYXR0ci5hcmlhLWFjdGl2ZWRlc2NlbmRhbnRdPVwiZHJvcGRvd25Nb2RlbC5hcmlhUXVlc3Rpb25BY3RpdmVkZXNjZW5kYW50XCI+XG4gICAgICAgIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMuY29udHJvbFZhbHVlXCI+XG4gICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiIW1vZGVsLmlzRW1wdHkoKVwiPlxuICAgICAgICAgICAgICAgIDxzdi1uZy10YWdib3gtaXRlbSAqbmdGb3I9XCJsZXQgaXRlbSBvZiBtb2RlbC5zZWxlY3RlZENob2ljZXNcIiBbaXRlbV09XCJpdGVtXCIgW3F1ZXN0aW9uXT1cIm1vZGVsXCI+XG4gICAgICAgICAgICAgICAgPC9zdi1uZy10YWdib3gtaXRlbT5cbiAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlICpuZ0lmPVwiZHJvcGRvd25Nb2RlbC5uZWVkUmVuZGVySW5wdXRcIlxuICAgICAgICAgICAgICAgIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtdGFnYm94LWZpbHRlcicsIGRhdGE6IHsgbW9kZWw6IGRyb3Bkb3duTW9kZWwsIHF1ZXN0aW9uOiBtb2RlbCB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPHN2LW5nLWFjdGlvbi1iYXIgW21vZGVsXT1cImRyb3Bkb3duTW9kZWwuZWRpdG9yQnV0dG9uc1wiPjwvc3YtbmctYWN0aW9uLWJhcj5cbiAgICA8L2Rpdj5cbiAgICA8c3YtbmctcG9wdXAgKm5nSWY9XCIhbW9kZWwuaXNJbnB1dFJlYWRPbmx5XCIgW3BvcHVwTW9kZWxdPVwibW9kZWwucG9wdXBNb2RlbFwiPjwvc3YtbmctcG9wdXA+XG4gICAgPGRpdiAqbmdJZj1cIm1vZGVsLmlzUmVhZE9ubHlcIiBbY2xhc3NdPVwibW9kZWwuZ2V0Q29udHJvbENsYXNzKClcIiBbYXR0ci5pZF09XCJtb2RlbC5pbnB1dElkXCJcbiAgICAgICAgW2F0dHIudGFiaW5kZXhdPVwibW9kZWwuaXNEaXNhYmxlZEF0dHIgPyBudWxsIDogMFwiIFthdHRyLmRpc2FibGVkXT1cIm1vZGVsLmlzRGlzYWJsZWRBdHRyID8gdHJ1ZSA6IG51bGxcIlxuICAgICAgICBbYXR0ci5yb2xlXT1cImRyb3Bkb3duTW9kZWw/LmFyaWFRdWVzdGlvblJvbGVcIiBbYXR0ci5hcmlhLWxhYmVsXT1cImRyb3Bkb3duTW9kZWw/LmFyaWFRdWVzdGlvbkxhYmVsXCJcbiAgICAgICAgW2F0dHIuYXJpYS1sYWJlbGxlZGJ5XT1cImRyb3Bkb3duTW9kZWw/LmFyaWFRdWVzdGlvbkxhYmVsbGVkYnlcIlxuICAgICAgICBbYXR0ci5hcmlhLWRlc2NyaWJlZGJ5XT1cImRyb3Bkb3duTW9kZWw/LmFyaWFRdWVzdGlvbkRlc2NyaWJlZGJ5XCIgW2F0dHIuYXJpYS1leHBhbmRlZF09XCJmYWxzZVwiXG4gICAgICAgIFthdHRyLmFyaWEtcmVhZG9ubHldPVwidHJ1ZVwiIFthdHRyLmFyaWEtZGlzYWJsZWRdPVwidHJ1ZVwiPlxuICAgICAgICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLmNvbnRyb2xWYWx1ZVwiPlxuICAgICAgICAgICAgPHN2LW5nLXN0cmluZyAqbmdJZj1cIm1vZGVsLmxvY1JlYWRPbmx5VGV4dFwiIFttb2RlbF09XCJtb2RlbC5sb2NSZWFkT25seVRleHRcIj48L3N2LW5nLXN0cmluZz5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxzdi1uZy1hY3Rpb24tYmFyIFttb2RlbF09XCJkcm9wZG93bk1vZGVsLmVkaXRvckJ1dHRvbnNcIj48L3N2LW5nLWFjdGlvbi1iYXI+XG4gICAgPC9kaXY+XG48L2Rpdj4iXX0=