@bnsights/bbsf-controls 1.0.60 → 1.0.62
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -0
- package/bnsights-bbsf-controls-1.0.61.tgz +0 -0
- package/bnsights-bbsf-controls-1.0.62.tgz +0 -0
- package/bnsights-bbsf-controls.metadata.json +1 -1
- package/bundles/bnsights-bbsf-controls.umd.js +42 -9
- package/bundles/bnsights-bbsf-controls.umd.js.map +1 -1
- package/esm2015/lib/Shared/Models/FormOptions.js +3 -1
- package/esm2015/lib/Shared/components/ng-tag-input.js +17 -4
- package/esm2015/lib/controls/Form/Form.component.js +8 -5
- package/esm2015/lib/controls/TagsInput/TagsInput.component.js +21 -3
- package/fesm2015/bnsights-bbsf-controls.js +45 -9
- package/fesm2015/bnsights-bbsf-controls.js.map +1 -1
- package/lib/Shared/Models/FormOptions.d.ts +1 -0
- package/lib/Shared/components/ng-tag-input.d.ts +2 -0
- package/lib/controls/TagsInput/TagsInput.component.d.ts +2 -0
- package/package.json +1 -1
- package/bnsights-bbsf-controls-1.0.60.tgz +0 -0
|
@@ -4474,6 +4474,7 @@
|
|
|
4474
4474
|
this.markAllAsTouched = false;
|
|
4475
4475
|
this.validationRules = [];
|
|
4476
4476
|
this.validationRulesasync = [];
|
|
4477
|
+
this.SearchResultHasItems = false;
|
|
4477
4478
|
this.resetError = function () {
|
|
4478
4479
|
_this.controlValidationService.RemoveGlobalError();
|
|
4479
4480
|
};
|
|
@@ -4622,6 +4623,9 @@
|
|
|
4622
4623
|
};
|
|
4623
4624
|
TagsInputComponent.prototype.AddTag = function (event, key) {
|
|
4624
4625
|
var _a, _b;
|
|
4626
|
+
//Check if input is yab press
|
|
4627
|
+
if (event.key === "Tab")
|
|
4628
|
+
return;
|
|
4625
4629
|
//Check if input is enter press
|
|
4626
4630
|
if (this.IsNoMatch == true && event.key == "Enter" && this.options.AllowNewSelection && key.selected) {
|
|
4627
4631
|
if (!(this.tags.length >= this.options.MaxNumberTags)) {
|
|
@@ -4639,7 +4643,7 @@
|
|
|
4639
4643
|
}
|
|
4640
4644
|
//Check if input is charachter
|
|
4641
4645
|
else if (String.fromCharCode(event.keyCode).match(/(\w|\s)/g)) {
|
|
4642
|
-
if (this.IsNoMatch
|
|
4646
|
+
if (this.IsNoMatch && !this.options.AllowNewSelection && key.selected) {
|
|
4643
4647
|
this.TagsFormControl.setErrors({ "errorMassage": this.options.NoResultText });
|
|
4644
4648
|
this.TagsFormControl.markAsTouched();
|
|
4645
4649
|
}
|
|
@@ -4683,6 +4687,20 @@
|
|
|
4683
4687
|
TagsInputComponent.prototype.onNoOptionsMatch = function (event) {
|
|
4684
4688
|
this.IsNoMatch = event;
|
|
4685
4689
|
};
|
|
4690
|
+
TagsInputComponent.prototype.onTagsInputBlur = function (SearchKey) {
|
|
4691
|
+
if (SearchKey.selected && this.options.AllowNewSelection && this.IsNoMatch && this.tags.length < this.options.MaxNumberTags) {
|
|
4692
|
+
this.tags.push({ name: SearchKey.selected });
|
|
4693
|
+
this.group.get(this.options.Name).setValue(this.tags);
|
|
4694
|
+
this.group.get(this.options.Name).markAllAsTouched();
|
|
4695
|
+
this.group.updateValueAndValidity();
|
|
4696
|
+
if (this.group.get(this.options.Name).valid) {
|
|
4697
|
+
SearchKey.selected = null;
|
|
4698
|
+
return;
|
|
4699
|
+
}
|
|
4700
|
+
else
|
|
4701
|
+
this.tags.pop();
|
|
4702
|
+
}
|
|
4703
|
+
};
|
|
4686
4704
|
return TagsInputComponent;
|
|
4687
4705
|
}());
|
|
4688
4706
|
TagsInputComponent.controlContainerstatic = null;
|
|
@@ -4690,7 +4708,7 @@
|
|
|
4690
4708
|
{ type: i0.Component, args: [{
|
|
4691
4709
|
// tslint:disable-next-line: component-selector
|
|
4692
4710
|
selector: 'BBSF-TagsInput',
|
|
4693
|
-
template: "<div class=\"b-control b-tags-input\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n <div class=\"form-group row\" [formGroup]=\"TagsFormGroup\">\r\n\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n
|
|
4711
|
+
template: "<div class=\"b-control b-tags-input\">\r\n <div class=\"form-group validate is-invalid\" [formGroup]=\"group\">\r\n <div class=\"form-group row\" [formGroup]=\"TagsFormGroup\">\r\n\r\n <label class=\"b-label col-form-label col-sm-12 \" [ngClass]=\"(options.ViewType==1)?'col-md-12':'col-md-3'\"\r\n [hidden]=\"options.HideLabel\">\r\n {{options.LabelValue}}\r\n <span *ngIf=\"(options.ShowAsterisk&&options.IsRequired)||(options.IsRequired)\" class=\"text-danger Required-text\"\r\n aria-required=\"true\">*</span>\r\n </label>\r\n <div class=\"col-sm-12\" [ngClass]=\"(options.ViewType==1)?'':'col-md-9'\">\r\n <b-tags-input id=\"typeahead-http\" type=\"text\" class=\"form-control bnsights-control {{options.ExtraClasses}}\"\r\n dir=\"{{options.ForceDirection==2?'rtl':''}}\" [disabled]=\"options.IsDisabled\" aria-describedby=\"email-error\"\r\n aria-invalid=\"true\" formControlName=\"tags\"\r\n [class.is-invalid]=\"TagsFormControl.invalid && TagsFormControl.touched\" placeholder=\"{{options.Placeholder}}\"\r\n id=\"{{options.Name}}\" (onTagsChanged)=\"onTagsChanged($event)\" [(ngModel)]=\"tags\"\r\n removeLastOnBackspace=\"{{options.RemoveLastOnBackspace}}\" (onNoOptionsMatch)=\"onNoOptionsMatch($event)\"\r\n [options]=\"searchFunctionFactory(SearchKey.selected)\" #SearchKey\r\n scrollableOptions=\"{{options.ScrollableOptions}}\" scrollableOptionsInView=\"{{options.MaxSearchResultsCount}}\"\r\n (keydown)=\"AddTag($event,SearchKey)\" [ViewMode]=\"options.TagInputMode\"\r\n maxTags=\"{{options.MaxNumberTags}}\" minLengthBeforeOptions=\"{{options.MinSearchLength}}\"\r\n [showDescription]=\"options.ShowDescription\" [defaultImageURL]=\"options.DefaultImgUrl\" name=\"tags\"\r\n (onBlurInput)=\"onTagsInputBlur(SearchKey)\">\r\n </b-tags-input>\r\n <div class=\"text-danger Required-text\" *ngIf=\"(TagsFormControl.invalid && TagsFormControl.touched)\">\r\n {{getErrorValidation(TagsFormControl.errors|keyvalue)}}\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"control-desc text-dark\">{{options.LabelDescription}}</div>\r\n </div>\r\n\r\n <div *ngIf=\"(group.valid&&group.dirty&&group.touched )||(group.untouched&&group.invalid&&group.dirty) \">\r\n {{resetError()}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
4694
4712
|
styles: [".example-form{min-width:150px;max-width:500px;width:100%}.example-full-width{width:100%}.flip_V{transform:scaleY(-1)}\n"]
|
|
4695
4713
|
},] }
|
|
4696
4714
|
];
|
|
@@ -6075,10 +6093,13 @@
|
|
|
6075
6093
|
var submitModel = this.options.GetModelFunction();
|
|
6076
6094
|
var submittedService = this.options.ServiceSubmitFunction.apply(null, submitModel);
|
|
6077
6095
|
submittedService.subscribe(function (result) {
|
|
6078
|
-
|
|
6079
|
-
|
|
6080
|
-
var
|
|
6081
|
-
|
|
6096
|
+
if (!_this.options.DisableModalDismiss) {
|
|
6097
|
+
//Dismiss closest modal of the form only
|
|
6098
|
+
var modal = document.getElementById(_this.fromName).closest('.modal.show');
|
|
6099
|
+
if (modal) {
|
|
6100
|
+
var closeButton = modal.querySelector("[data-dismiss='modal']");
|
|
6101
|
+
closeButton.click();
|
|
6102
|
+
}
|
|
6082
6103
|
}
|
|
6083
6104
|
if (!_this.options.DisableSuccessNotification)
|
|
6084
6105
|
_this.utilityService.notifySuccessMessage();
|
|
@@ -7568,7 +7589,7 @@
|
|
|
7568
7589
|
|
|
7569
7590
|
var noop = function () { };
|
|
7570
7591
|
var ɵ0$1 = noop;
|
|
7571
|
-
var TAGS_INPUT_TEMPLATE = "\n \n<div class=\"tags-input\">\n<span class=\"tags-input__tag label label-primary badge badge-primary\" *ngFor=\"let tag of tags\">\n\n<span [ngSwitch]=\"ViewMode\">\n<span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n<img style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\nsrc=\"{{(tag.imageURL?tag.imageURL:defaultImageURL)}}\" />\n</span>\n\n<span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n<div class=\"user-initials\">{{calculateInitials(tag.name)}}</div>\n</span>\n\n<span *ngSwitchDefault>\n</span>\n\n</span>\n {{tag[displayField]}}\n <span *ngIf=\"isDeleteable(tag)\" role=\"button\" class=\"tags-input__tag-remove-btn\" (click)=\"removeTag(tag)\"\n (touch)=\"removeTag(tag)\">\n <span aria-hidden=\"true\">×</span>\n <span class=\"sr-only\">Close</span>\n </span>\n</span>\n\n<input *ngIf=\"options === null; else withTypeahead\" class=\"tags-input__input-field\" type=\"text\"\n [placeholder]=\"getPlaceholder()\" name=\"tags\" (keyup.enter)=\"addTag(tagInput)\"\n (keydown.backspace)=\"removeLastTag(tagInput)\" [disabled]=\"!canAddTags || maximumOfTagsReached()\"\n [hidden]=\"!canAddTags || maximumOfTagsReached()\" #tagInput />\n\n<ng-template #withTypeahead>\n <span [ngSwitch]=\"ViewMode\">\n
|
|
7592
|
+
var TAGS_INPUT_TEMPLATE = "\n \n<div class=\"tags-input\">\n<span class=\"tags-input__tag label label-primary badge badge-primary\" *ngFor=\"let tag of tags\">\n\n<span [ngSwitch]=\"ViewMode\">\n<span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n<img style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\nsrc=\"{{(tag.imageURL?tag.imageURL:defaultImageURL)}}\" />\n</span>\n\n<span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n<div class=\"user-initials\">{{calculateInitials(tag.name)}}</div>\n</span>\n\n<span *ngSwitchDefault>\n</span>\n\n</span>\n {{tag[displayField]}}\n <span *ngIf=\"isDeleteable(tag)\" role=\"button\" class=\"tags-input__tag-remove-btn\" (click)=\"removeTag(tag)\"\n (touch)=\"removeTag(tag)\">\n <span aria-hidden=\"true\">×</span>\n <span class=\"sr-only\">Close</span>\n </span>\n</span>\n\n<input *ngIf=\"options === null; else withTypeahead\" class=\"tags-input__input-field\" type=\"text\"\n [placeholder]=\"getPlaceholder()\" name=\"tags\" (keyup.enter)=\"addTag(tagInput)\"\n (keydown.backspace)=\"removeLastTag(tagInput)\" [disabled]=\"!canAddTags || maximumOfTagsReached()\"\n [hidden]=\"!canAddTags || maximumOfTagsReached()\" #tagInput />\n\n<ng-template #withTypeahead>\n <span [ngSwitch]=\"ViewMode\">\n <span *ngSwitchCase=\"tagInputViewEnum.WithImage\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithImage\" [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchCase=\"tagInputViewEnum.WithoutImage\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutImage\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchCase=\"tagInputViewEnum.WithInitial\">\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutInitial\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n <span *ngSwitchDefault>\n <input *ngIf=\"(options !== null)\" class=\"tags-input__input-field\" type=\"text\" [placeholder]=\"getPlaceholder()\"\n name=\"tags\" (keydown.backspace)=\"removeLastTag(tagInput)\" [(ngModel)]=\"selected\" [typeahead]=\"options\"\n [typeaheadOptionField]=\"displayField\" (typeaheadOnSelect)=\"typeaheadOnSelect($event)\"\n (typeaheadNoResults)=\"typeaheadOnNoMatch($event)\" [typeaheadMinLength]=\"minLengthBeforeOptions\"\n [typeaheadScrollable]=\"scrollableOptions\" [typeaheadLatinize]=\"true\"\n [typeaheadItemTemplate]=\"itemTemplateWithoutImage\"\n [typeaheadOptionsInScrollableView]=\"scrollableOptionsInView\"\n [disabled]=\"!canAddTags || maximumOfTagsReached()\" [hidden]=\"!canAddTags || maximumOfTagsReached()\"\n (blur)=\"onBlur()\" autocomplete=\"off\"\n #tagInput />\n </span>\n\n </span>\n\n</ng-template>\n\n<ng-template #itemTemplateWithImage let-model=\"item\" let-index=\"index\">\n <img\n style=\"border-radius:50%; height:40px; width: 40px; float:left; margin-left:5px ; margin-top: 5px;margin-right: 5px;\"\n src=\"{{(model.imageURL?model.imageURL:defaultImageURL)}}\" />\n <div>\n <a [innerHTML]=\"model.name\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n\n<ng-template #itemTemplateWithoutImage let-model=\"item\" let-index=\"index\">\n <div>\n <a [innerHTML]=\"model.name\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n\n<ng-template #itemTemplateWithoutInitial let-model=\"item\" let-index=\"index\">\n <div class=\"user-image\">\n <div class=\"user-initials\">{{calculateInitials(model.name)}}</div>\n </div>\n <div>\n <a [innerHTML]=\"model.name\"></a>\n <p *ngIf=\"showDescription\">\n {{model.description}}\n </p>\n </div>\n</ng-template>\n</div>\n";
|
|
7572
7593
|
var TAGS_INPUT_STYLE = "\n :host {\n overflow: auto;\n white-space: nowrap;\n }\n\n .tags-input {\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n }\n\n .tags-input__tag {\n display: inline-block;\n margin-bottom: 2px;\n margin-right: 5px;\n padding-right: 0.3em;\n }\n\n .tags-input__tag-remove-btn {\n cursor: pointer;\n display: inline-block;\n font-size: 12px;\n margin: -3px 0 0 3px;\n padding: 0;\n vertical-align: top;\n }\n\n .tags-input__input-field {\n border: none;\n flex-grow: 1;\n outline: none;\n }\n";
|
|
7573
7594
|
var CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR = {
|
|
7574
7595
|
provide: forms.NG_VALUE_ACCESSOR,
|
|
@@ -7597,6 +7618,13 @@
|
|
|
7597
7618
|
this.onTagsChanged = new i0.EventEmitter();
|
|
7598
7619
|
this.onMaxTagsReached = new i0.EventEmitter();
|
|
7599
7620
|
this.onNoOptionsMatch = new i0.EventEmitter();
|
|
7621
|
+
this.onBlurInput = new i0.EventEmitter();
|
|
7622
|
+
// (keydown.Tab) = "onTab($event)"
|
|
7623
|
+
//onTab(event) {
|
|
7624
|
+
// this.onTabInput.emit();
|
|
7625
|
+
// event.preventDefault();
|
|
7626
|
+
// event.stopPropagation();
|
|
7627
|
+
//}
|
|
7600
7628
|
}
|
|
7601
7629
|
BTagsInputComponent.prototype.getPlaceholder = function () {
|
|
7602
7630
|
if (this.tags && this.tags.length > 0) {
|
|
@@ -7686,7 +7714,6 @@
|
|
|
7686
7714
|
this.onTouchedCallback = fn;
|
|
7687
7715
|
};
|
|
7688
7716
|
BTagsInputComponent.prototype.calculateInitials = function (name) {
|
|
7689
|
-
debugger;
|
|
7690
7717
|
var fullName = name.split(' ');
|
|
7691
7718
|
var initials = "";
|
|
7692
7719
|
if (fullName.length > 1)
|
|
@@ -7695,6 +7722,9 @@
|
|
|
7695
7722
|
initials = fullName.shift().charAt(0);
|
|
7696
7723
|
return initials.toUpperCase();
|
|
7697
7724
|
};
|
|
7725
|
+
BTagsInputComponent.prototype.onBlur = function () {
|
|
7726
|
+
this.onBlurInput.emit();
|
|
7727
|
+
};
|
|
7698
7728
|
return BTagsInputComponent;
|
|
7699
7729
|
}());
|
|
7700
7730
|
BTagsInputComponent.decorators = [
|
|
@@ -7720,7 +7750,8 @@
|
|
|
7720
7750
|
scrollableOptionsInView: [{ type: i0.Input }],
|
|
7721
7751
|
onTagsChanged: [{ type: i0.Output }],
|
|
7722
7752
|
onMaxTagsReached: [{ type: i0.Output }],
|
|
7723
|
-
onNoOptionsMatch: [{ type: i0.Output }]
|
|
7753
|
+
onNoOptionsMatch: [{ type: i0.Output }],
|
|
7754
|
+
onBlurInput: [{ type: i0.Output }]
|
|
7724
7755
|
};
|
|
7725
7756
|
|
|
7726
7757
|
var options;
|
|
@@ -8222,6 +8253,8 @@
|
|
|
8222
8253
|
this.DisableErrorNotification = false;
|
|
8223
8254
|
//If ="true" disable startblockui before submission
|
|
8224
8255
|
this.DisableBlockUI = false;
|
|
8256
|
+
//If ="true" disable modal from dismiss automatically
|
|
8257
|
+
this.DisableModalDismiss = false;
|
|
8225
8258
|
}
|
|
8226
8259
|
return FormOptions;
|
|
8227
8260
|
}());
|