@acpaas-ui/ngx-forms 5.0.1 → 5.2.0

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.
@@ -389,6 +389,7 @@
389
389
  this.mask = null;
390
390
  this.clearInvalid = false;
391
391
  this.showAllByDefault = false;
392
+ this.autoComplete = 'off';
392
393
  // Eventemitter for searchvalue (parent object should update the results with this param)
393
394
  this.search = new core.EventEmitter();
394
395
  this.select = new core.EventEmitter();
@@ -752,7 +753,7 @@
752
753
  AutoCompleteComponent.decorators = [
753
754
  { type: core.Component, args: [{
754
755
  selector: 'aui-auto-complete',
755
- template: "<div (closed)=\"onFlyoutClosed()\" [toggleClick]=\"false\" aria-haspopup=\"listbox\"\n auiFlyout class=\"m-flyout--scrollable m-flyout--full o-auto-complete\">\n <input (focus)=\"onFocus()\"\n (keyArrowDown)=\"onKeyArrowDown()\"\n (keyArrowUp)=\"onKeyArrowUp()\"\n (keyEnter)=\"onKeyEnter($event)\"\n (keyEscape)=\"onKeyEscape()\"\n [(ngModel)]=\"query\"\n (ngModelChange)=\"doSearch()\"\n *ngIf=\"!mask\"\n [disabled]=\"isDisabled ? true : null\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n aria-autocomplete=\"list\"\n auiFlyoutAction\n auiSelectableActions\n autocomplete=\"off\"\n type=\"text\"\n />\n <input (focus)=\"onFocus()\"\n (keyArrowDown)=\"onKeyArrowDown()\"\n (keyArrowUp)=\"onKeyArrowUp()\"\n (keyEnter)=\"onKeyEnter($event)\"\n (keyEscape)=\"onKeyEscape()\"\n [(ngModel)]=\"query\"\n (ngModelChange)=\"doSearch()\"\n *ngIf=\"mask\"\n [auiMask]=\"mask\"\n [disabled]=\"isDisabled ? true : null\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n aria-autocomplete=\"list\"\n auiFlyoutAction\n auiSelectableActions\n autocomplete=\"off\"\n type=\"text\"\n />\n\n <div *ngIf=\"!isDisabled\" auiFlyoutZone>\n\t\t<span *ngIf=\"focused && loadingText && searching\" class=\"o-auto-complete__info u-text-light u-margin-xs\">\n\t\t\t<span class=\"a-spinner a-spinner--inline a-spinner--sm u-margin-right-xs\"></span>\n {{ loadingText }}\n\t\t</span>\n <span *ngIf=\"focused && searchIncentiveText && !searching && !query && !results.length\"\n class=\"o-auto-complete__info u-text-light u-margin-xs\">{{ searchIncentiveText }}</span>\n <span *ngIf=\"focused && noResultsText && !searching && query && !results.length\"\n class=\"o-auto-complete__info u-text-light u-margin-xs\">{{ noResultsText }}</span>\n\n <aui-selectable-list (selected)=\"onSelect($event)\" *ngIf=\"results.length > 0 && !(focused && loadingText && searching)\" [index]=\"index\" [itemTemplate]=\"template\"\n [items]=\"results\" [label]=\"label\"\n [search]=\"query\"></aui-selectable-list>\n </div>\n</div>\n",
756
+ template: "<div (closed)=\"onFlyoutClosed()\" [toggleClick]=\"false\" aria-haspopup=\"listbox\"\n auiFlyout class=\"m-flyout--scrollable m-flyout--full o-auto-complete\">\n <input (focus)=\"onFocus()\"\n (keyArrowDown)=\"onKeyArrowDown()\"\n (keyArrowUp)=\"onKeyArrowUp()\"\n (keyEnter)=\"onKeyEnter($event)\"\n (keyEscape)=\"onKeyEscape()\"\n [(ngModel)]=\"query\"\n (ngModelChange)=\"doSearch()\"\n *ngIf=\"!mask\"\n [disabled]=\"isDisabled ? true : null\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n aria-autocomplete=\"list\"\n auiFlyoutAction\n auiSelectableActions\n [autocomplete]=\"autoComplete\"\n type=\"text\"\n />\n <input (focus)=\"onFocus()\"\n (keyArrowDown)=\"onKeyArrowDown()\"\n (keyArrowUp)=\"onKeyArrowUp()\"\n (keyEnter)=\"onKeyEnter($event)\"\n (keyEscape)=\"onKeyEscape()\"\n [(ngModel)]=\"query\"\n (ngModelChange)=\"doSearch()\"\n *ngIf=\"mask\"\n [auiMask]=\"mask\"\n [disabled]=\"isDisabled ? true : null\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n aria-autocomplete=\"list\"\n auiFlyoutAction\n auiSelectableActions\n [autocomplete]=\"autoComplete\"\n type=\"text\"\n />\n\n <div *ngIf=\"!isDisabled\" auiFlyoutZone>\n\t\t<span *ngIf=\"focused && loadingText && searching\" class=\"o-auto-complete__info u-text-light u-margin-xs\">\n\t\t\t<span class=\"a-spinner a-spinner--inline a-spinner--sm u-margin-right-xs\"></span>\n {{ loadingText }}\n\t\t</span>\n <span *ngIf=\"focused && searchIncentiveText && !searching && !query && !results.length\"\n class=\"o-auto-complete__info u-text-light u-margin-xs\">{{ searchIncentiveText }}</span>\n <span *ngIf=\"focused && noResultsText && !searching && query && !results.length\"\n class=\"o-auto-complete__info u-text-light u-margin-xs\">{{ noResultsText }}</span>\n\n <aui-selectable-list (selected)=\"onSelect($event)\" *ngIf=\"results.length > 0 && !(focused && loadingText && searching)\" [index]=\"index\" [itemTemplate]=\"template\"\n [items]=\"results\" [label]=\"label\"\n [search]=\"query\"></aui-selectable-list>\n </div>\n</div>\n",
756
757
  providers: [
757
758
  {
758
759
  provide: forms.NG_VALUE_ACCESSOR,
@@ -785,6 +786,7 @@
785
786
  loadingText: [{ type: core.Input }],
786
787
  noResultsText: [{ type: core.Input }],
787
788
  showAllByDefault: [{ type: core.Input }],
789
+ autoComplete: [{ type: core.Input }],
788
790
  label: [{ type: core.Input }],
789
791
  value: [{ type: core.Input }],
790
792
  search: [{ type: core.Output }],
@@ -821,6 +823,8 @@
821
823
  /** @type {?} */
822
824
  AutoCompleteComponent.prototype.showAllByDefault;
823
825
  /** @type {?} */
826
+ AutoCompleteComponent.prototype.autoComplete;
827
+ /** @type {?} */
824
828
  AutoCompleteComponent.prototype.label;
825
829
  /** @type {?} */
826
830
  AutoCompleteComponent.prototype.value;
@@ -2846,8 +2850,10 @@
2846
2850
  var UploadComponent = /** @class */ (function () {
2847
2851
  function UploadComponent() {
2848
2852
  this.id = '';
2853
+ this.accept = [];
2849
2854
  this.ariaLabelRemove = 'Verwijder';
2850
2855
  this.disabled = false;
2856
+ this.multiple = true;
2851
2857
  this.options = UPLOAD_OPTIONS_DEFAULT;
2852
2858
  this.selectUploadedFiles = new core.EventEmitter();
2853
2859
  this.uploadedFiles = [];
@@ -2903,14 +2909,16 @@
2903
2909
  UploadComponent.decorators = [
2904
2910
  { type: core.Component, args: [{
2905
2911
  selector: 'aui-upload',
2906
- template: "<div class=\"m-upload aui-upload\">\n <aui-upload-zone (invalidFiles)=\"onInvalidFiles($event)\" (queuedFiles)=\"onQueuedFiles($event)\" (uploadedFiles)=\"onUploadedFiles($event)\" [ariaId]=\"ariaId\"\n [disabled]=\"disabled\" [id]=\"id\"\n [uploader]=\"uploader\">\n <div class=\"m-upload__message\">\n <ng-content select=\".m-upload__message\"></ng-content>\n </div>\n <div class=\"m-upload__description\">\n <ng-content select=\".m-upload__description\"></ng-content>\n </div>\n <div class=\"m-upload__button\">\n <ng-content select=\".m-upload__button\"></ng-content>\n </div>\n </aui-upload-zone>\n <aui-validation-list [ariaLabelRemove]=\"ariaLabelRemove\" [invalidFiles]=\"invalidFiles\"></aui-validation-list>\n <aui-upload-queue (uploadedFiles)=\"onUploadedFiles($event)\" *ngIf=\"!options?.autoUpload\" [ariaLabelRemove]=\"ariaLabelRemove\"\n [files]=\"queuedFiles\" [uploader]=\"uploader\"></aui-upload-queue>\n</div>\n",
2912
+ template: "<div class=\"m-upload aui-upload\">\n <aui-upload-zone\n [id]=\"id\"\n [accept]=\"accept\"\n [ariaId]=\"ariaId\"\n [disabled]=\"disabled\"\n [multiple]=\"multiple\"\n [uploader]=\"uploader\"\n (invalidFiles)=\"onInvalidFiles($event)\"\n (queuedFiles)=\"onQueuedFiles($event)\"\n (uploadedFiles)=\"onUploadedFiles($event)\">\n <div class=\"m-upload__message\">\n <ng-content select=\".m-upload__message\"></ng-content>\n </div>\n <div class=\"m-upload__description\">\n <ng-content select=\".m-upload__description\"></ng-content>\n </div>\n <div class=\"m-upload__button\">\n <ng-content select=\".m-upload__button\"></ng-content>\n </div>\n </aui-upload-zone>\n <aui-validation-list [ariaLabelRemove]=\"ariaLabelRemove\" [invalidFiles]=\"invalidFiles\"></aui-validation-list>\n <aui-upload-queue (uploadedFiles)=\"onUploadedFiles($event)\" *ngIf=\"!options?.autoUpload\" [ariaLabelRemove]=\"ariaLabelRemove\"\n [files]=\"queuedFiles\" [uploader]=\"uploader\"></aui-upload-queue>\n</div>\n",
2907
2913
  styles: [".m-upload__button>.m-upload__input{display:none}"]
2908
2914
  }] }
2909
2915
  ];
2910
2916
  UploadComponent.propDecorators = {
2911
2917
  id: [{ type: core.Input }],
2918
+ accept: [{ type: core.Input }],
2912
2919
  ariaLabelRemove: [{ type: core.Input }],
2913
2920
  disabled: [{ type: core.Input }],
2921
+ multiple: [{ type: core.Input }],
2914
2922
  options: [{ type: core.Input }],
2915
2923
  selectUploadedFiles: [{ type: core.Output }]
2916
2924
  };
@@ -2920,10 +2928,14 @@
2920
2928
  /** @type {?} */
2921
2929
  UploadComponent.prototype.id;
2922
2930
  /** @type {?} */
2931
+ UploadComponent.prototype.accept;
2932
+ /** @type {?} */
2923
2933
  UploadComponent.prototype.ariaLabelRemove;
2924
2934
  /** @type {?} */
2925
2935
  UploadComponent.prototype.disabled;
2926
2936
  /** @type {?} */
2937
+ UploadComponent.prototype.multiple;
2938
+ /** @type {?} */
2927
2939
  UploadComponent.prototype.options;
2928
2940
  /** @type {?} */
2929
2941
  UploadComponent.prototype.selectUploadedFiles;
@@ -3101,11 +3113,13 @@
3101
3113
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
3102
3114
  */
3103
3115
  var UploadZoneComponent = /** @class */ (function () {
3104
- function UploadZoneComponent() {
3105
- this.disabled = false;
3106
- this.multiple = true;
3116
+ function UploadZoneComponent(renderer) {
3117
+ this.renderer = renderer;
3107
3118
  this.id = '';
3119
+ this.accept = [];
3108
3120
  this.ariaId = '';
3121
+ this.disabled = false;
3122
+ this.multiple = true;
3109
3123
  this.uploadedFiles = new core.EventEmitter();
3110
3124
  this.queuedFiles = new core.EventEmitter();
3111
3125
  this.invalidFiles = new core.EventEmitter();
@@ -3171,6 +3185,36 @@
3171
3185
  var files = this.fileListToArray(this.fileInput.nativeElement.files);
3172
3186
  this.handleFiles(files);
3173
3187
  };
3188
+ /**
3189
+ * @param {?} event
3190
+ * @return {?}
3191
+ */
3192
+ UploadZoneComponent.prototype.onFileClick = /**
3193
+ * @param {?} event
3194
+ * @return {?}
3195
+ */
3196
+ function (event) {
3197
+ // When removing a file make sure you can add it again later
3198
+ // See: https://stackoverflow.com/questions/59870335/ng2-file-upload-not-allowing-me-to-add-same-doc-after-ive-removed-it-from-que
3199
+ event.target.value = '';
3200
+ };
3201
+ /**
3202
+ * @return {?}
3203
+ */
3204
+ UploadZoneComponent.prototype.ngAfterViewInit = /**
3205
+ * @return {?}
3206
+ */
3207
+ function () {
3208
+ if (this.multiple !== false) {
3209
+ this.renderer.setProperty(this.fileInput.nativeElement, 'multiple', 'multiple');
3210
+ }
3211
+ if (this.accept) {
3212
+ this.renderer.setProperty(this.fileInput.nativeElement, 'accept', this.accept.join());
3213
+ }
3214
+ if (this.disabled) {
3215
+ this.renderer.setProperty(this.fileInput.nativeElement, 'disabled', 'disabled');
3216
+ }
3217
+ };
3174
3218
  /**
3175
3219
  * @protected
3176
3220
  * @param {?} files
@@ -3257,16 +3301,21 @@
3257
3301
  UploadZoneComponent.decorators = [
3258
3302
  { type: core.Component, args: [{
3259
3303
  selector: 'aui-upload-zone',
3260
- template: "<div *ngIf=\"uploader.options.type === 'drop'\" [class.is-disabled]=\"disabled\" class=\"m-upload\">\n <div class=\"m-upload__inner\">\n <div class=\"m-upload__dropzone\">\n <input #fileInput (change)=\"updateFiles()\" *ngIf=\"multiple\" [attr.aria-labelledby]=\"ariaId\" [disabled]=\"disabled\" [id]=\"id\"\n class=\"m-upload__input\" multiple type=\"file\">\n <input #fileInput (change)=\"updateFiles()\" *ngIf=\"!multiple\" [attr.aria-labelledby]=\"ariaId\" [disabled]=\"disabled\"\n [id]=\"id\" class=\"m-upload__input\" type=\"file\">\n\n <div *ngIf=\"!uploadProgress || uploadProgress === 0\" class=\"m-upload__content\">\n <p [id]=\"ariaId\" class=\"m-upload__message\">\n <ng-content select=\".m-upload__message\"></ng-content>\n </p>\n </div>\n\n <ng-container *ngIf=\"uploadProgress > 0\">\n <p class=\"m-upload__uploads u-text-bold u-margin-bottom-xs\">\n <ng-container *ngFor=\"let file of uploadingFiles; let last = last\">\n {{ file.name }}\n <ng-container *ngIf=\"!last\">,</ng-container>\n </ng-container>\n </p>\n <aui-progress-bar [value]=\"uploadProgress\" max=\"100\"></aui-progress-bar>\n </ng-container>\n </div>\n </div>\n\n <small class=\"m-upload__description\">\n <ng-content select=\".m-upload__description\"></ng-content>\n </small>\n</div>\n\n<button (click)=\"triggerFile()\" *ngIf=\"uploader.options.type === 'button'\" [disabled]=\"disabled\" class=\"a-button m-upload__button\"\n type=\"button\">\n <span [id]=\"ariaId\"><ng-content select=\".m-upload__button\"></ng-content></span>\n <input #fileInput (change)=\"updateFiles()\" [attr.aria-labelledby]=\"ariaId\" [disabled]=\"disabled\" [id]=\"id\"\n class=\"m-upload__input\" multiple=\"multiple\" type=\"file\">\n</button>\n"
3304
+ template: "<div *ngIf=\"uploader.options.type === 'drop'\" [class.is-disabled]=\"disabled\" class=\"m-upload\">\n <div class=\"m-upload__inner\">\n <div class=\"m-upload__dropzone\">\n <input\n #fileInput\n type=\"file\"\n class=\"m-upload__input\"\n [id]=\"id\"\n [attr.aria-labelledby]=\"ariaId\"\n (click)=\"onFileClick($event)\"\n (change)=\"updateFiles()\">\n\n <div *ngIf=\"!uploadProgress || uploadProgress === 0\" class=\"m-upload__content\">\n <p [id]=\"ariaId\" class=\"m-upload__message\">\n <ng-content select=\".m-upload__message\"></ng-content>\n </p>\n </div>\n\n <ng-container *ngIf=\"uploadProgress > 0\">\n <p class=\"m-upload__uploads u-text-bold u-margin-bottom-xs\">\n <ng-container *ngFor=\"let file of uploadingFiles; let last = last\">\n {{ file.name }}\n <ng-container *ngIf=\"!last\">,</ng-container>\n </ng-container>\n </p>\n <aui-progress-bar [value]=\"uploadProgress\" max=\"100\"></aui-progress-bar>\n </ng-container>\n </div>\n </div>\n\n <small class=\"m-upload__description\">\n <ng-content select=\".m-upload__description\"></ng-content>\n </small>\n</div>\n\n<button (click)=\"triggerFile()\" *ngIf=\"uploader.options.type === 'button'\" [disabled]=\"disabled\" class=\"a-button m-upload__button\"\n type=\"button\">\n <span [id]=\"ariaId\"><ng-content select=\".m-upload__button\"></ng-content></span>\n <input\n #fileInput\n type=\"file\"\n class=\"m-upload__input\"\n [id]=\"id\"\n [attr.aria-labelledby]=\"ariaId\"\n (click)=\"onFileClick($event)\"\n (change)=\"updateFiles()\">\n</button>\n"
3261
3305
  }] }
3262
3306
  ];
3307
+ /** @nocollapse */
3308
+ UploadZoneComponent.ctorParameters = function () { return [
3309
+ { type: core.Renderer2 }
3310
+ ]; };
3263
3311
  UploadZoneComponent.propDecorators = {
3264
3312
  fileInput: [{ type: core.ViewChild, args: ['fileInput', { static: false },] }],
3265
3313
  uploader: [{ type: core.Input }],
3266
- disabled: [{ type: core.Input }],
3267
- multiple: [{ type: core.Input }],
3268
3314
  id: [{ type: core.Input }],
3315
+ accept: [{ type: core.Input }],
3269
3316
  ariaId: [{ type: core.Input }],
3317
+ disabled: [{ type: core.Input }],
3318
+ multiple: [{ type: core.Input }],
3270
3319
  uploadedFiles: [{ type: core.Output }],
3271
3320
  queuedFiles: [{ type: core.Output }],
3272
3321
  invalidFiles: [{ type: core.Output }],
@@ -3282,14 +3331,16 @@
3282
3331
  /** @type {?} */
3283
3332
  UploadZoneComponent.prototype.uploader;
3284
3333
  /** @type {?} */
3285
- UploadZoneComponent.prototype.disabled;
3286
- /** @type {?} */
3287
- UploadZoneComponent.prototype.multiple;
3288
- /** @type {?} */
3289
3334
  UploadZoneComponent.prototype.id;
3290
3335
  /** @type {?} */
3336
+ UploadZoneComponent.prototype.accept;
3337
+ /** @type {?} */
3291
3338
  UploadZoneComponent.prototype.ariaId;
3292
3339
  /** @type {?} */
3340
+ UploadZoneComponent.prototype.disabled;
3341
+ /** @type {?} */
3342
+ UploadZoneComponent.prototype.multiple;
3343
+ /** @type {?} */
3293
3344
  UploadZoneComponent.prototype.uploadedFiles;
3294
3345
  /** @type {?} */
3295
3346
  UploadZoneComponent.prototype.queuedFiles;
@@ -3303,6 +3354,11 @@
3303
3354
  UploadZoneComponent.prototype.uploadProgress;
3304
3355
  /** @type {?} */
3305
3356
  UploadZoneComponent.prototype.uploadingFiles;
3357
+ /**
3358
+ * @type {?}
3359
+ * @private
3360
+ */
3361
+ UploadZoneComponent.prototype.renderer;
3306
3362
  }
3307
3363
 
3308
3364
  /**