Allow additionalParameters to also be null

* feat(demo): updated up to bootstrap 5

* feat(demo): deleted commented and extra code

* fix(readme): deleted slack link

* fix(readme): deleted slack link

CHANGELOG.md

@@ -1,3 +1,25 @@
+# [2.0.0-3](https://github.com/valor-software/ng2-file-upload/compare/v2.0.0-2...v2.0.0-3) (2021-09-07)
+
+
+### Features
+
+* **demo:** updated up to bootstrap 5 ([#1186](https://github.com/valor-software/ng2-file-upload/issues/1186)) ([02a1b2a](https://github.com/valor-software/ng2-file-upload/commit/02a1b2a53c331e2088ea05d2202be6eb2b1d051f))
+
+
+
+# [2.0.0-2](https://github.com/valor-software/ng2-file-upload/compare/v2.0.0-1...v2.0.0-2) (2021-09-03)
+
+
+
+# [2.0.0-1](https://github.com/valor-software/ng2-file-upload/compare/v2.0.0-0...v2.0.0-1) (2021-09-03)
+
+
+### Features
+
+* **version:** added npm versions ([#1183](https://github.com/valor-software/ng2-file-upload/issues/1183)) ([326e3ac](https://github.com/valor-software/ng2-file-upload/commit/326e3ac1a884f000f57b3fb6e30cd32f5ec4622c))
+
+
+
 # [2.0.0-0](https://github.com/valor-software/ng2-file-upload/compare/v1.2.0...v2.0.0-0) (2021-09-03)
 
 

README.md

@@ -1,4 +1,4 @@
-# ng2-file-upload [![npm version](https://badge.fury.io/js/ng2-file-upload.svg)](http://badge.fury.io/js/ng2-file-upload) [![npm downloads](https://img.shields.io/npm/dm/ng2-file-upload.svg)](https://npmjs.org/ng2-file-upload)[![slack](https://ngx-slack.herokuapp.com/badge.svg)](https://ngx-slack.herokuapp.com)
+# ng2-file-upload [![npm version](https://badge.fury.io/js/ng2-file-upload.svg)](http://badge.fury.io/js/ng2-file-upload) [![npm downloads](https://img.shields.io/npm/dm/ng2-file-upload.svg)](https://npmjs.org/ng2-file-upload)
 Easy to use Angular2 directives for files upload ([demo](http://valor-software.github.io/ng2-file-upload/))
 
 [![Angular 2 Style Guide](https://mgechev.github.io/angular2-style-guide/images/badge.svg)](https://github.com/mgechev/angular2-style-guide)

angular.json

@@ -6,7 +6,7 @@
   "projects": {
     "ng2-file-upload": {
       "root": "libs/ng2-file-upload",
-      "sourceRoot": "libs/ng2-file-upload/src",
+      "sourceRoot": "libs/ng2-file-upload/",
       "projectType": "library",
       "architect": {
         "build": {
@@ -127,7 +127,6 @@
       }
     }
   },
-  "defaultProject": "ng2-file-upload-demo",
   "schematics": {
     "@schematics/angular:component": {
       "prefix": "",

apps/demo/src/app/app.component.ts

@@ -7,12 +7,24 @@ const gettingStarted = require('html-loader!markdown-loader!../getting-started.m
   template: `
   <main class="bd-pageheader">
     <div class="container">
-      <h1>ng2-file-upload</h1>
-      <p>The Angular2 File Upload directives</p>
-      <a class="btn btn-primary" href="https://github.com/valor-software/ng2-file-upload">View on GitHub</a>
       <div class="row">
-        <div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=star&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
-        <div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=fork&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
+        <h1>ng2-file-upload</h1>
+        <p>The Angular2 File Upload directives</p>
+        <p>
+          <a class="btn btn-light w-auto" href="https://github.com/valor-software/ng2-file-upload">View on GitHub</a>
+        </p>
+      </div>
+      <div class="row" style="padding-top: 15px">
+        <div class="d-flex flex-wrap">
+          <a href="https://npmjs.org/ng2-file-upload" class="me-2 d-flex mb-2">
+            <img src="https://img.shields.io/npm/v/ng2-file-upload/latest.svg" alt="npm latest version" >
+          </a>
+          <a href="https://npmjs.org/ng2-file-upload" class="me-2 d-flex mb-2">
+            <img src="https://img.shields.io/npm/v/ng2-file-upload/next.svg" alt="npm next version" >
+          </a>
+          <iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=star&count=true" frameborder="0" scrolling="0" width="100px" height="20px" class="me-2 mb-2"></iframe>
+          <iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=fork&count=true" frameborder="0" scrolling="0" width="100px" height="20px" class="mb-2"></iframe>
+        </div>
       </div>
     </div>
   </main>

apps/demo/src/app/components/file-upload-section.html

@@ -2,39 +2,42 @@
   <div class="row">
     <tabset>
       <tab *ngFor="let desc of tabs" heading="{{desc.heading}}" (select)="select($event)">
-        <div class="card card-block panel panel-default panel-body">
+        <div class="card card-block p-3 border-top-0">
 
           <simple-demo></simple-demo>
 
           <br>
-
-          <div class="row" style="margin: 0px;">
-            <tabset>
-              <tab heading="Markup">
-                <div class="card card-block panel panel-default panel-body">
-                  <pre class="prettyprint linenums lang-html">{{desc.html}}</pre>
-                </div>
-              </tab>
-              <tab heading="TypeScript">
-                <div class="card card-block panel panel-default panel-body">
-                  <pre class="prettyprint linenums lang-js">{{desc.ts}}</pre>
-                  <pre class="language-typescript"><code class="language-typescript" ng-non-bindable [innerHTML]="desc.ts"></code></pre>
-                </div>
-              </tab>
-              <tab heading="Backend Demo">
-                <div class="card card-block panel panel-default panel-body">
-                  <pre class="prettyprint linenums lang-js">{{desc.js}}</pre>
-                </div>
-              </tab>
-            </tabset>
+          <div class="container p-0">
+            <div class="row" style="margin: 0px;">
+              <tabset class="p-0">
+                <tab heading="Markup">
+                  <div class="card card-block p-3 border-top-0">
+                    <pre class="prettyprint linenums lang-html">{{desc.html}}</pre>
+                  </div>
+                </tab>
+                <tab heading="TypeScript">
+                  <div class="card card-block p-3 border-top-0">
+                    <pre class="prettyprint linenums lang-js">{{desc.ts}}</pre>
+                    <pre class="language-typescript"><code class="language-typescript" ng-non-bindable [innerHTML]="desc.ts"></code></pre>
+                  </div>
+                </tab>
+                <tab heading="Backend Demo">
+                  <div class="card card-block p-3 border-top-0">
+                    <pre class="prettyprint linenums lang-js">{{desc.js}}</pre>
+                  </div>
+                </tab>
+              </tabset>
+            </div>
           </div>
         </div>
       </tab>
     </tabset>
   </div>
 
-  <div class="row">
-    <h2>API</h2>
-    <div class="card card-block panel panel-default panel-body" [innerHTML]="doc"></div>
+  <div class="container">
+    <div class="row mt-3">
+      <h2>API</h2>
+      <div class="card card-block p-3" [innerHTML]="doc"></div>
+    </div>
   </div>
 </section>

apps/demo/src/app/components/file-upload/simple-demo.html

@@ -2,13 +2,12 @@
     .my-drop-zone { border: dotted 3px lightgray; }
     .nv-file-over { border: dotted 3px red; } /* Default class applied to drop zones on over */
     .another-file-over-class { border: dotted 3px green; }
-
     html, body { height: 100%; }
 </style>
 
-<div class="container">
+<div class="container p-0">
 
-    <div class="navbar navbar-default">
+    <div class="navbar">
         <div class="navbar-header">
             <a class="navbar-brand" href>Angular2 File Upload</a>
         </div>
@@ -24,7 +23,7 @@
                  [ngClass]="{'nv-file-over': hasBaseDropZoneOver}"
                  (fileOver)="fileOverBase($event)"
                  [uploader]="uploader"
-                 class="well my-drop-zone">
+                 class="well my-drop-zone p-2 mb-3">
                 Base drop zone
             </div>
 
@@ -32,21 +31,21 @@
                  [ngClass]="{'another-file-over-class': hasAnotherDropZoneOver}"
                  (fileOver)="fileOverAnother($event)"
                  [uploader]="uploader"
-                 class="well my-drop-zone">
+                 class="well my-drop-zone p-2 mb-3">
                 Another drop zone
             </div>
 
-            Multiple
-            <input type="file" ng2FileSelect [uploader]="uploader" multiple  /><br/>
+            Multiple<br>
+            <input class="mt-2 mb-3" type="file" ng2FileSelect [uploader]="uploader" multiple  /><br/>
 
-            Single
-            <input type="file" ng2FileSelect [uploader]="uploader" />
+            Single<br>
+            <input class="mt-2 mb-3" type="file" ng2FileSelect [uploader]="uploader" />
         </div>
 
         <div class="col-md-9" style="margin-bottom: 40px">
 
             <h3>Upload queue</h3>
-            <p>Queue length: {{ uploader?.queue?.length }}</p>
+            <p>Queue length: {{ uploader?.queue?.length ?  uploader?.queue?.length : 'Empty'}}</p>
 
             <table class="table">
                 <thead>
@@ -58,21 +57,21 @@
                     <th>Actions</th>
                 </tr>
                 </thead>
-                <tbody>
+                <tbody *ngIf="uploader?.queue?.length">
                 <tr *ngFor="let item of uploader.queue">
-                    <td><strong>{{ item?.file?.name }}</strong></td>
-                    <td *ngIf="uploader.options.isHTML5" nowrap>{{ item?.file?.size/1024/1024 | number:'.2' }} MB</td>
-                    <td *ngIf="uploader.options.isHTML5">
+                    <td data-label="Name"><strong>{{ item?.file?.name }}</strong></td>
+                    <td data-label="Size" *ngIf="uploader.options.isHTML5" nowrap>{{ item?.file?.size/1024/1024 | number:'.2' }} MB</td>
+                    <td data-label="Progress" *ngIf="uploader.options.isHTML5">
                         <div class="progress" style="margin-bottom: 0;">
                             <div class="progress-bar" role="progressbar" [ngStyle]="{ 'width': item.progress + '%' }"></div>
                         </div>
                     </td>
-                    <td class="text-center">
+                    <td data-label="Status" class="text-center">
                         <span *ngIf="item.isSuccess"><i class="glyphicon glyphicon-ok"></i></span>
                         <span *ngIf="item.isCancel"><i class="glyphicon glyphicon-ban-circle"></i></span>
                         <span *ngIf="item.isError"><i class="glyphicon glyphicon-remove"></i></span>
                     </td>
-                    <td nowrap>
+                    <td data-label="Actions" nowrap>
                         <button type="button" class="btn btn-success btn-xs"
                                 (click)="item.upload()" [disabled]="item.isReady || item.isUploading || item.isSuccess">
                             <span class="glyphicon glyphicon-upload"></span> Upload
@@ -93,15 +92,15 @@
             <div>
                 <div>
                     Queue progress:
-                    <div class="progress" style="">
+                    <div class="progress mt-2 mb-3" style="">
                         <div class="progress-bar" role="progressbar" [ngStyle]="{ 'width': uploader.progress + '%' }"></div>
                     </div>
                 </div>
-                <button type="button" class="btn btn-success btn-s"
+                <button type="button" class="btn btn-success btn-s me-2"
                         (click)="uploader.uploadAll()" [disabled]="!uploader.getNotUploadedItems().length">
                     <span class="glyphicon glyphicon-upload"></span> Upload all
                 </button>
-                <button type="button" class="btn btn-warning btn-s"
+                <button type="button" class="btn btn-warning btn-s me-2"
                         (click)="uploader.cancelAll()" [disabled]="!uploader.isUploading">
                     <span class="glyphicon glyphicon-ban-circle"></span> Cancel all
                 </button>
@@ -119,9 +118,9 @@
 
     <div class="row">
         <div class="col-md-12">
-            <div class="panel panel-default">
-                <div class="panel-heading">Response</div>
-                <div class="panel-body">
+            <div class="card">
+                <div class="card-header">Response</div>
+                <div class="card-body">
                   {{ response }}
                 </div>
             </div>

apps/demo/src/assets/css/style.css

@@ -14,6 +14,15 @@
   font-size: 36px;
 }
 
+td {
+  vertical-align: middle;
+}
+
+a, .nav-tabs a.nav-link  {
+  text-decoration: none;
+  color: #6f5499;
+}
+
 .btn-group-lg > .btn, .btn-lg {
   font-size: 18px;
 }
@@ -22,10 +31,6 @@ section {
   padding-top: 30px;
 }
 
-.bd-pageheader {
-  margin-top: 51px;
-}
-
 .page-header {
   padding-bottom: 9px;
   margin: 40px 0 20px;
@@ -37,43 +42,24 @@ section {
 }
 
 .navbar {
-  padding: 0;
+  padding: 15px;
+  background-color: #f8f8f8;
+  border-color: #e7e7e7;
 }
 
 .navbar-nav .nav-item {
   margin-left: 0 !important;
 }
 
-.nav > li > a {
-  position: relative;
-  display: block;
-  padding: 10px 15px;
-}
-
-.nav .navbar-brand {
-  float: left;
-  height: 50px;
-  padding: 15px 15px;
-  font-size: 18px;
-  line-height: 20px;
-  margin-right: 0 !important;
-}
-
 .navbar-brand {
   color: #777;
-  float: left;
   height: 50px;
   padding: 15px 15px;
   font-size: 18px;
   line-height: 20px;
 }
 
-.navbar-toggler {
-  margin-top: 8px;
-  margin-right: 15px;
-}
-
-.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
+.navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
   color: #333;
   background-color: transparent;
 }
@@ -113,22 +99,8 @@ section {
   margin: 10px 0;
 }
 
-.scrollable-menu .nav-link {
-  color: #337ab7;
-  font-size: 14px;
-}
-
-.scrollable-menu .nav-link:hover {
-  color: #23527c;
-  background-color: #eee;
-}
-
-simple-demo {
-  max-width: 100%;
-}
-
-simple-demo >.container {
-  max-width: 100%;
+.card {
+  border-radius: 0 0 .25rem .25rem;
 }
 
 @media (min-width: 992px) {
@@ -175,6 +147,53 @@ simple-demo >.container {
     padding: 0;
     margin: 0;
   }
+
+  table {
+    border: 0;
+  }
+
+  table caption {
+    font-size: 1.3em;
+  }
+
+  table thead {
+    border: none;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+  }
+
+  table tr {
+    border-bottom: 3px solid #ddd;
+    display: block;
+    margin-bottom: .625em;
+  }
+
+  table td {
+    border-bottom: 1px solid #ddd;
+    font-size: .8em;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  table td::before {
+    content: attr(data-label);
+    font-weight: bold;
+    text-transform: uppercase;
+  }
+
+  table td:last-child {
+    border-bottom: 0;
+  }
+
+  td[data-label="Progress"] .progress {
+    width: 75%;
+  }
 }
 
 @media (max-width: 400px) {
@@ -193,13 +212,6 @@ simple-demo >.container {
     * iOS Resolution Quick Reference: http://www.iosres.com/
     */
 
-.scrollable-menu {
-  height: 90vh !important;
-  width: 100vw;
-  overflow-x: hidden;
-  padding: 0 0 20px;
-}
-
 /**
  * iPad with portrait orientation.
  */
@@ -228,29 +240,22 @@ simple-demo >.container {
   }
 }
 
-.navbar-default .navbar-toggle .icon-bar {
-  background-color: #888;
-}
-
-.navbar-toggle:focus {
-  outline: 0
-}
-
-.navbar-toggle .icon-bar {
-  display: block;
-  width: 22px;
-  height: 2px;
-  border-radius: 1px
-}
-
-.navbar-toggle .icon-bar + .icon-bar {
-  margin-top: 4px
-}
-
 pre {
   white-space: pre-wrap;       /* CSS 3 */
   white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
   white-space: -pre-wrap;      /* Opera 4-6 */
   white-space: -o-pre-wrap;    /* Opera 7 */
   word-wrap: break-word;       /* Internet Explorer 5.5+ */
+  line-height: 1.42857143;
+  color: #333;
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  padding: 15px;
 }
+
+pre.prettyprint {
+  margin-bottom: 0;
+}
+
+

apps/demo/src/index.html

@@ -12,7 +12,7 @@
   <link rel="author" href="https://github.com/valor-software/ng2-file-upload/graphs/contributors">
 
   <!--link to bootstrap.css-->
-  <link rel="stylesheet" crossorigin="anonymous" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
   <link rel="stylesheet" href="assets/css/style.css">
   <link rel="stylesheet" href="assets/css/prettify-angulario.css">
   <style media="screen">

libs/ng2-file-upload/README.md

@@ -1,10 +1,89 @@
-# libs-ng2-file-upload
+# ng2-file-upload [![npm version](https://badge.fury.io/js/ng2-file-upload.svg)](http://badge.fury.io/js/ng2-file-upload) [![npm downloads](https://img.shields.io/npm/dm/ng2-file-upload.svg)](https://npmjs.org/ng2-file-upload)
+Easy to use Angular2 directives for files upload ([demo](http://valor-software.github.io/ng2-file-upload/))
 
-This library was generated with [Nx](https://nx.dev).
+[![Angular 2 Style Guide](https://mgechev.github.io/angular2-style-guide/images/badge.svg)](https://github.com/mgechev/angular2-style-guide)
+[![Build Status](https://travis-ci.org/valor-software/ng2-file-upload.svg?branch=development)](https://travis-ci.org/valor-software/ng2-file-upload)
+[![Dependency Status](https://david-dm.org/valor-software/ng2-file-upload.svg)](https://david-dm.org/valor-software/ng2-file-upload)
 
+## Quick start
 
-## Running unit tests
+1. A recommended way to install ***ng2-file-upload*** is through [npm](https://www.npmjs.com/search?q=ng2-file-upload) package manager using the following command:
 
-Run `nx test libs-ng2-file-upload` to execute the unit tests via [Jest](https://jestjs.io).
+  `npm i ng2-file-upload --save`
 
+  Alternatively, you can [download it in a ZIP file](https://github.com/valor-software/ng2-file-upload/archive/master.zip).
 
+2. Currently `ng2-file-upload` contains two directives: `ng2-file-select` and `ng2-file-drop`. `ng2-file-select` is used for 'file-input' field of form and
+  `ng2-file-drop` is used for area that will be used for dropping of file or files.
+
+3. More information regarding using of ***ng2-file-upload*** is located in
+  [demo](http://valor-software.github.io/ng2-file-upload/) and [demo sources](https://github.com/valor-software/ng2-file-upload/tree/master/demo).
+  
+## Using ***ng2-file-upload*** in a project
+
+1. Install as shown in the above section.
+
+2. Import `FileUploadModule` into the module that declares the component using ***ng2-file-upload***:
+
+```import { FileUploadModule } from 'ng2-file-upload';```
+
+3. Add it to `[imports]` under `@NgModule`:
+
+```imports: [ ... FileUploadModule, ... ]```
+
+4. Import `FileUploader` into the component:
+
+```import {  FileUploader } from 'ng2-file-upload';```
+
+5. Create a variable for the API url:
+
+```const URL = 'path_to_api';```
+
+6. Initialize it:
+
+```public uploader:FileUploader = new FileUploader({url: URL}); ```
+
+## API for `ng2FileSelect`
+
+### Properties
+
+  - `uploader` - (`FileUploader`) - uploader object. See using in [demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts)
+
+### Events
+ - `onFileSelected` - fires when files are selected and added to the uploader queue
+
+## API for `ng2FileDrop`
+
+### Properties
+
+  - `uploader` - (`FileUploader`) - uploader object. See using in [demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts)
+
+  Parameters supported by this object:
+
+  1. `url` - URL of File Uploader's route
+  2. `authToken` - Auth token that will be applied as 'Authorization' header during file send.
+  3. `disableMultipart` - If 'true', disable using a multipart form for file upload and instead stream the file. Some APIs (e.g. Amazon S3) may expect the file to be streamed rather than sent via a form. Defaults to false.
+  4. `itemAlias` - item alias (form name redefinition)
+  5. `formatDataFunction` - Function to modify the request body. 'DisableMultipart' must be 'true' for this function to be called.
+  6. `formatDataFunctionIsAsync` - Informs if the function sent in 'formatDataFunction' is asynchronous. Defaults to false.
+  7. `parametersBeforeFiles` - States if additional parameters should be appended before or after the file. Defaults to false.
+
+### Events
+
+  - `fileOver` - it fires during 'over' and 'out' events for Drop Area; returns `boolean`: `true` if file is over Drop Area, `false` in case of out.
+  See using in [ts demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.ts) and
+  [html demo](https://github.com/valor-software/ng2-file-upload/blob/master/demo/components/file-upload/simple-demo.html)
+  - `onFileDrop` - it fires after a file has been dropped on a Drop Area; you can pass in `$event` to get the list of files that were dropped. i.e. `(onFileDrop)="dropped($event)"`
+
+# Troubleshooting
+
+Please follow these guidelines when reporting bugs and feature requests:
+
+1. Use [GitHub Issues](https://github.com/valor-software/ng2-file-upload/issues) board to report bugs and feature requests (not our email address)
+2. Please **always** write steps to reproduce the error. That way we can focus on fixing the bug, not scratching our heads trying to reproduce it.
+
+Thanks for understanding!
+
+### License
+
+The MIT License (see the [LICENSE](https://github.com/valor-software/ng2-file-upload/blob/master/LICENSE) file for the full text)

libs/ng2-file-upload/file-upload/file-uploader.class.ts

@@ -318,7 +318,7 @@ export class FileUploader {
       }
 
       // For AWS, Additional Parameters must come BEFORE Files
-      if (this.options.additionalParameter !== undefined) {
+      if (this.options.additionalParameter) {
         Object.keys(this.options.additionalParameter).forEach((key: string) => {
           let paramVal = this.options.additionalParameter?.[ key ];
           // Allow an additional parameter to include the filename

libs/ng2-file-upload/index.ts

@@ -1,4 +1,3 @@
-
 export * from  './file-upload/file-drop.directive';
 export * from  './file-upload/file-uploader.class';
 export * from './file-upload/file-item.class';

libs/ng2-file-upload/ng-package.json

@@ -1,6 +1,6 @@
 {
   "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/libs/ng2-file-upload",
+  "dest": "../../dist/libs/ng2-file-upload/",
   "lib": {
     "entryFile": "index.ts"
   }

libs/ng2-file-upload/package.json

@@ -1,8 +1,31 @@
 {
   "name": "ng2-file-upload",
-  "version": "2.0.0-0",
+  "version": "2.0.0-3",
+  "description": "Angular file uploader",
+  "author": "Dmitriy Shekhovtsov <valorkin@gmail.com>",
+  "license": "MIT",
   "peerDependencies": {
-    "@angular/common": "*",
-    "@angular/core": "*"
-  }
+    "@angular/core": "^11.0.0 || ^12.0.0",
+    "@angular/common": "^11.0.0 || ^12.0.0"
+  },
+  "sideEffects": false,
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "tag": "next"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@github.com/valor-software/ng2-file-upload.git"
+  },
+  "bugs": {
+    "url": "https://github.com/valor-software/ng2-file-upload/issues"
+  },
+  "homepage": "https://github.com/valor-software/ng2-file-upload#readme",
+  "keywords": [
+    "angular",
+    "upload file",
+    "ng",
+    "ng2",
+    "angular2"
+  ]
 }

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "ng2-file-upload-base",
-  "version": "2.0.0-0",
+  "version": "2.0.0-3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -21552,10 +21552,13 @@
       }
     },
     "ngx-bootstrap": {
-      "version": "6.2.0",
-      "resolved": "https://registry.npmjs.org/ngx-bootstrap/-/ngx-bootstrap-6.2.0.tgz",
-      "integrity": "sha512-5WKHo6/ltkenw4UyXZwED8rODCgp2RGbWurzYzZsF/gH1JO5SN7TJ+AL6kXYk6XM42sDA2WhN9Db+ZPNjiyHnA==",
-      "dev": true
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/ngx-bootstrap/-/ngx-bootstrap-7.1.0.tgz",
+      "integrity": "sha512-2qUTqq+DtimKpYNEga85G00zdMEZ2fcvtYaZkrdZRtwqyCXbPC69LXXzLkgu5697m83++iFWvwFp0IJDuGev1A==",
+      "dev": true,
+      "requires": {
+        "tslib": "^2.0.0"
+      }
     },
     "nice-try": {
       "version": "1.0.5",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ng2-file-upload-base",
-  "version": "2.0.0-0",
+  "version": "2.0.0-3",
   "private": true,
   "description": "Angular file upload directives",
   "scripts": {
@@ -84,7 +84,7 @@
     "jest-preset-angular": "8.3.2",
     "markdown-loader": "^6.0.0",
     "ng-packagr": "^11.2.4",
-    "ngx-bootstrap": "6.2.0",
+    "ngx-bootstrap": "7.1.0",
     "npm-run-all": "^4.1.5",
     "protractor": "~7.0.0",
     "raw-loader": "^4.0.2",