{"_id":"@ahmedtamseer/tn-file-upload","_rev":"2-feeef38a6dbd24dbdb3e66b034bc764d","name":"@ahmedtamseer/tn-file-upload","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"name":"@ahmedtamseer/tn-file-upload","version":"1.0.0","author":{"name":"Ahamed Thamseer - ahmedtamseer3@gmail.com"},"description":"Angular package for to customize input type file in both reactive and template driven forms","peerDependencies":{"@angular/common":"^10.0.0","@angular/core":"^10.0.0"},"dependencies":{"tslib":"^2.0.0"},"keywords":["angular","File","Upload File","Upload","reactive form input","template driven form input","rxjs"],"license":"MIT","bugs":{"url":"https://github.com/ahmedtamseer/angular-tn-file-upload/issues"},"repository":{"type":"git","url":"git+https://github.com/ahmedtamseer/angular-tn-file-upload.git"},"homepage":"https://github.com/ahmedtamseer/angular-tn-file-upload.git#readme","schematics":"./schematics/collection.json","main":"bundles/tn-file-upload.umd.js","module":"fesm2015/tn-file-upload.js","es2015":"fesm2015/tn-file-upload.js","esm2015":"esm2015/tn-file-upload.js","fesm2015":"fesm2015/tn-file-upload.js","typings":"tn-file-upload.d.ts","metadata":"tn-file-upload.metadata.json","sideEffects":false,"directories":{"lib":"lib"},"devDependencies":{},"scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_id":"@ahmedtamseer/tn-file-upload@1.0.0","_nodeVersion":"14.3.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-jnSdO0JV1SHV8x1WW3YsLFW+G2YpkXbQUsqYexOXRlL+IhcrwfqGV4lw+uKreyD0WyaSGjQwnKSWEffk9hoiDw==","shasum":"739f52cc98cbe96300f1470b3dac591094dcbaa4","tarball":"https://registry.npmjs.org/@ahmedtamseer/tn-file-upload/-/tn-file-upload-1.0.0.tgz","fileCount":22,"unpackedSize":225816,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfBL5lCRA9TVsSAnZWagAAigoQAI40JPXXn9MIHEOspoTP\nYkeeot7yZSRNRathjCIE0KkYGqR5stqhPE3WPytMNluIUP6w6AV+AyOML3Qv\n8QHPNZmkTNN3Oy1TDvIg9rH4Gz1o2SKDjBbGS6yYQWQJijzAi45IvrPQrAQl\niiGxxJbleFkMqvWjN6SCnlKhAofx7gLpg568IPN/fTPcW1FNhomHSXYlE2xF\n1QfLMWANto9lUHS7dasnKzF0BPGZhHqg2xL2rTqv/vNZNL8D/dsVCuqyO1cu\nOphSRQpNk4gOdkR1Qq1qc8U7ngsq5wV/LBgyC+Nf1Eze3ffN0xA+0GboW7ws\nS8WPDFSWlKjr7NvBBeN05OwdsatzpBWSz6U0+zjgPKSCJ78DZiC0oYVOXhZt\nMyukC1PrXZQ4kDpOb9/xqqmar+jCFOqxENyKW5+w4+fzztKTvtea5bpLAPfD\nHRh2lX8ZoMedu0TKABnTDGA6zZpCLzV3lVZEU55JTRLzcG09FjBp70lFmIUj\n6WligW1zSuuRot6hedNiJp3BsZJElxZzEPKEbUtOr0Dwo9JqSWeWZETuCViM\n1k2riZtFHERGltwSa3cWfP+Pzt1Nod9cANTcRxP2yvNL8F97JFJTTibbhe6l\ndbaLb2RsNGqkiBKKGlYm7nSCNR3v1p4gLlpv+f09hSv6ARZ06GnZpSM1d7mb\nQMd9\r\n=lQaY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFrMoVwLEH9ZQJ4/Gzm2aOhFOxkKa87pUwP6h7+oV9kuAiEA75TwZKu4LG27Qns1fCA0gFIWlolN6sLPA3y6uYBiB4I="}]},"maintainers":[{"name":"tn-ahmed","email":"ahmedtamseer3@gmail.com"}],"_npmUser":{"name":"tn-ahmed","email":"ahmedtamseer3@gmail.com"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tn-file-upload_1.0.0_1594146404827_0.9450051878188153"},"_hasShrinkwrap":false},"1.0.1":{"name":"@ahmedtamseer/tn-file-upload","version":"1.0.1","author":{"name":"Ahamed Thamseer - ahmedtamseer3@gmail.com"},"description":"Angular package for to customize input type file in both reactive and template driven forms","peerDependencies":{"@angular/common":"^10.0.0","@angular/core":"^10.0.0"},"dependencies":{"tslib":"^2.0.0"},"keywords":["angular","File","Upload File","Upload","reactive form input","template driven form input","rxjs"],"license":"MIT","bugs":{"url":"https://github.com/ahmedtamseer/angular-tn-file-upload/issues"},"repository":{"type":"git","url":"git+https://github.com/ahmedtamseer/angular-tn-file-upload.git"},"homepage":"https://github.com/ahmedtamseer/angular-tn-file-upload.git#readme","schematics":"./schematics/collection.json","main":"bundles/tn-file-upload.umd.js","module":"fesm2015/tn-file-upload.js","es2015":"fesm2015/tn-file-upload.js","esm2015":"esm2015/tn-file-upload.js","fesm2015":"fesm2015/tn-file-upload.js","typings":"tn-file-upload.d.ts","metadata":"tn-file-upload.metadata.json","sideEffects":false,"directories":{"lib":"lib"},"devDependencies":{},"scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"_id":"@ahmedtamseer/tn-file-upload@1.0.1","_nodeVersion":"14.3.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-64hJ8k7vqEntC9D0b7Y4AvCi8AdBQsQXGHGxMhT83YPPz0cbddS0iOUGdRuNXUzHcF++nFIgOcD+aIM24rpJBg==","shasum":"d664f8555a3fd5afd6c6338652bc7e8ff39d403b","tarball":"https://registry.npmjs.org/@ahmedtamseer/tn-file-upload/-/tn-file-upload-1.0.1.tgz","fileCount":22,"unpackedSize":225617,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfBMhiCRA9TVsSAnZWagAAeQYP/iJ1kTkU792CEt3L8T4I\nhBqT07M+QQyI5wj4M/QGrT1vitatZxkNJ0tU+fxXynF7LPhPsGvmGtAidbVb\nxaTommcTOlgQZ0mb9VADP2bi+gNVjMddJsMbijspmHMMwTCdHAvNm850k1R9\nUMAr8KPclAxSedzs0a5O60dvo0vho/UB6eQqAuJVy7RP2wM5LjJJEGFedcPx\nE9s37Ld/U5KK2i/jidnNEPt8ly+FMjZ/MdDaTcVI2HdzYjQ8nzIFKn7g6LVp\n9VmenjKMt3IVvDu6pa1pCJZVzJROkW5xGlQLaGw0WfdjwMzulHH7Effs3L8X\nbGcLcowhQnYI3OhWD98bRzoHu7bjfnS7cywh0GibCm/DBSRESqwoKEC5kQ5t\n8jPdPeOTJsL7wVMqvGBGKYFJtpADZXyFt7jMHUEwUv8U/56N+GU73VTkEjg5\nFne1Ht/LAreGHO6Qj21yNObmWDO5kDgsoAWX+PbQmAmm8fylrjcuxpqIt5qo\nBT+UEbU2dS3+HLrMPAmXJPmCv1j9uSq67o1NCAmwrk7d1i5IGY04JLWK88+y\n9p9AG1BqHfuJWNuqwRNdhX+cZby6BQQWTzhibDXx5nvZUnhpxAvIVmrrAJar\no49XvaBS6W2m5fNgjCdvbpVNH789dab8beFs/+0/WO0/8T4OCCOfFgwkUVWs\nd084\r\n=kVsg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGJNpgTlxPZOT+Xap0U0W3blLVQ4r+9CLYJiwu/OcJSJAiARU6xv7kDzHMBJv2o652uXfpbR7tpwe9WNDjbM/VdJ9Q=="}]},"maintainers":[{"name":"tn-ahmed","email":"ahmedtamseer3@gmail.com"}],"_npmUser":{"name":"tn-ahmed","email":"ahmedtamseer3@gmail.com"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/tn-file-upload_1.0.1_1594148961623_0.27822006895400886"},"_hasShrinkwrap":false}},"time":{"created":"2020-07-07T18:26:44.532Z","1.0.0":"2020-07-07T18:26:44.993Z","modified":"2022-04-04T12:13:31.995Z","1.0.1":"2020-07-07T19:09:21.805Z"},"maintainers":[{"name":"tn-ahmed","email":"ahmedtamseer3@gmail.com"}],"description":"Angular package for to customize input type file in both reactive and template driven forms","homepage":"https://github.com/ahmedtamseer/angular-tn-file-upload.git#readme","keywords":["angular","File","Upload File","Upload","reactive form input","template driven form input","rxjs"],"repository":{"type":"git","url":"git+https://github.com/ahmedtamseer/angular-tn-file-upload.git"},"author":{"name":"Ahamed Thamseer - ahmedtamseer3@gmail.com"},"bugs":{"url":"https://github.com/ahmedtamseer/angular-tn-file-upload/issues"},"license":"MIT","readme":"# TnFileUpload\nThe [Angular](https://angular.io/) library for [input type file](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file).\n\n```bash\nng add @ahmedtamseer/tn-file-upload\n```\n\n## What is TnFileUpload?\n\nTnFileUpload is angular package for form element (input:file). This package gives new look and good user experience both reactive and template driven forms. This package can return both type File or Base64 value.\n\n## Quickstart\n\n### 1. Create a new project\n\n```bash\nnpm install -g @angular/cli\nng new <project-name>\ncd <project-name>\n```\n\nThe Angular CLI's `new` command will set up the latest Angular build in a new project structure.\n\n### 2. Install Angular Form Error\n\n```bash\nng add @ahmedtamseer/tn-file-upload\n```\n\nNow that you have a new project setup, install Angular Form Error from npm.\n\n### 3. Setup `@NgModule` for the `TnFileUploadModule`\n\nOpen `/src/app/app.module.ts`, inject the TnFileUploadModule.\n\n```ts\nimport { BrowserModule } from '@angular/platform-browser';\nimport { NgModule } from '@angular/core';\nimport { AppComponent } from './app.component';\nimport { ReactiveFormsModule, FormsModule } from '@angular/forms';\nimport { TnFileUploadModule } from '@ahmedtamseer/tn-file-upload';\n\n@NgModule({\n  declarations: [\n    AppComponent\n  ],\n  imports: [\n    BrowserModule,\n    ReactiveFormsModule,\n    FormsModule,\n    TnFileUploadModule\n  ],\n  providers: [],\n  bootstrap: [AppComponent]\n})\nexport class AppModule { }\n```\n\n### 4. Use it in your component\n\n```ts\nimport { Component } from '@angular/core';\nimport { FormGroup, FormControl, Validators } from '@angular/forms';\n\n@Component({\n  selector: 'app-root',\n  template: `\n  <form [formGroup]=\"demoForm\">\n    <div>\n        <label for=\"file\">File</label>\n         <tn-file-upload [(ngModel)]=\"ngModalExample\" #name=\"ngModel\"></tn-file-upload>\n    </div>\n  </form>\n  `\n})\nexport class MyApp {\n\n  demoForm: FormGroup;\n\n  constructor() {\n      this.demoForm = new FormGroup({\n      file: new FormControl('')\n    });\n  }\n}\n```\n\n### 5. Run your app locally\n\n```bash\nng serve\n```\n\n## Resources\n\n[Stackblitz Template](https://stackblitz.com/edit/tn-file-upload) - A demo app which shows how to use package for Reactive and Template Driven form.\n\n## Developer Guide\n\n| attribute   | purpose            |\n| ---------|--------------------|\n| `[multiple]` | Boolean. A Boolean which, if present, indicates that the user may choose more than one file. Default `false` |\n| `[maxFileCount]` | Number. Maximum number of files a user can select. This applies only when `[multiple]=\"true\"`. Default `10` |\n| `[restrictSize]` | Number. Maximum size of file/s. This value is in MB. Default `5` |\n| `[accept]` | String. One or more unique file type specifiers describing file types to allow. [KnowMore](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#Unique_file_type_specifiers) Default `*/*` |\n| `[displayFile]` | Boolean. Whether or not to display (preview) file after selection. Default `true` |\n| `[displayName]` | Boolean. Whether or not to display file name after selection. Default `true` |\n| `[displaySize]` | Boolean. Whether or not to display file size after selection. Default `true` |\n| `[showCustomRemoveButton]` | Boolean. Whether or not allow user to remove a file. Default `true` |\n| `[hidden]` | Boolean. This hides input element. Default `false` |\n| `[isDisabled]` | Boolean. Disabled property of html. Default `false` |\n| `[base64]` | Boolean. Setting this to true will return base64 value along with original file. Default `false` |\n| `[class]` | String. List of classes separated by space. Ex:- `[class]=\"'bg-danger text-white'\"` |\n\n## Base64 return value\n\n```ts\n{\n  url: string;\n  name?: string;\n  size?: number;\n  status?: string;\n  type?: string;\n  ext?: string;\n  preExt?: string;\n  file?: File\n}\n\n```\n\n\n","readmeFilename":"README.md"}