Add password strength meter
This commit is contained in:
parent
1301b4eecf
commit
d0c5fac853
38
src-ui/package-lock.json
generated
38
src-ui/package-lock.json
generated
@ -20,6 +20,9 @@
|
||||
"@ng-select/ng-select": "^10.0.4",
|
||||
"@ngneat/dirty-check-forms": "^3.0.3",
|
||||
"@popperjs/core": "^2.11.7",
|
||||
"@zxcvbn-ts/core": "^2.2.1",
|
||||
"@zxcvbn-ts/language-en": "^2.1.0",
|
||||
"angular-password-strength-meter": "^6.0.0",
|
||||
"bootstrap": "^5.2.3",
|
||||
"file-saver": "^2.0.5",
|
||||
"mime-names": "^1.0.0",
|
||||
@ -5609,6 +5612,19 @@
|
||||
"integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ==",
|
||||
"devOptional": true
|
||||
},
|
||||
"node_modules/@zxcvbn-ts/core": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@zxcvbn-ts/core/-/core-2.2.1.tgz",
|
||||
"integrity": "sha512-Cg1JyRpCDIF+Dh3nauqygmmCYxogNVZDxSn+9PgkPD1HZ2QiJe4elruVJrGmYRS7muGmZ1hNJq8ySQdPv6GHaw==",
|
||||
"dependencies": {
|
||||
"fastest-levenshtein": "1.0.16"
|
||||
}
|
||||
},
|
||||
"node_modules/@zxcvbn-ts/language-en": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@zxcvbn-ts/language-en/-/language-en-2.1.0.tgz",
|
||||
"integrity": "sha512-I3n4AAbArjPAZtwCrk9MQnSrcj5+9rq8sic2rUU44fP5QaR17Vk8zDt61+R9dnP9ZRsj09aAUYML4Ash05qZjQ=="
|
||||
},
|
||||
"node_modules/abab": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.6.tgz",
|
||||
@ -5794,6 +5810,20 @@
|
||||
"ajv": "^8.8.2"
|
||||
}
|
||||
},
|
||||
"node_modules/angular-password-strength-meter": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/angular-password-strength-meter/-/angular-password-strength-meter-6.0.0.tgz",
|
||||
"integrity": "sha512-lSnoXkV4dcH4nzRA3Eo2bdK9NXM/FASU0wI1pLYyhJDvsjqQcfBcetn30JzINuAXHA3YOC5Ax0eBE3hZWsSsfg==",
|
||||
"dependencies": {
|
||||
"tslib": "^2.5.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@angular/common": "^15.0.0",
|
||||
"@angular/core": "^15.0.0",
|
||||
"@zxcvbn-ts/core": "^2.0.1",
|
||||
"@zxcvbn-ts/language-en": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/ansi-colors": {
|
||||
"version": "4.1.3",
|
||||
"resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.3.tgz",
|
||||
@ -9112,6 +9142,14 @@
|
||||
"integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fastest-levenshtein": {
|
||||
"version": "1.0.16",
|
||||
"resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz",
|
||||
"integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==",
|
||||
"engines": {
|
||||
"node": ">= 4.9.1"
|
||||
}
|
||||
},
|
||||
"node_modules/fastq": {
|
||||
"version": "1.15.0",
|
||||
"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz",
|
||||
|
@ -25,6 +25,9 @@
|
||||
"@ng-select/ng-select": "^10.0.4",
|
||||
"@ngneat/dirty-check-forms": "^3.0.3",
|
||||
"@popperjs/core": "^2.11.7",
|
||||
"@zxcvbn-ts/core": "^2.2.1",
|
||||
"@zxcvbn-ts/language-en": "^2.1.0",
|
||||
"angular-password-strength-meter": "^6.0.0",
|
||||
"bootstrap": "^5.2.3",
|
||||
"file-saver": "^2.0.5",
|
||||
"mime-names": "^1.0.0",
|
||||
|
@ -113,7 +113,8 @@ import localeSl from '@angular/common/locales/sl'
|
||||
import localeSr from '@angular/common/locales/sr'
|
||||
import localeSv from '@angular/common/locales/sv'
|
||||
import localeTr from '@angular/common/locales/tr'
|
||||
import localeZh from '@angular/common/locales/zh';
|
||||
import localeZh from '@angular/common/locales/zh'
|
||||
import { PasswordStrengthMeterModule } from 'angular-password-strength-meter'
|
||||
import { FolderCreateDialogComponent } from './components/common/create-dialog/folder-create-dialog/folder-create-dialog.component'
|
||||
|
||||
registerLocaleData(localeAr)
|
||||
@ -230,6 +231,7 @@ function initializeApp(settings: SettingsService) {
|
||||
NgSelectModule,
|
||||
ColorSliderModule,
|
||||
TourNgBootstrapModule,
|
||||
PasswordStrengthMeterModule.forRoot(),
|
||||
],
|
||||
providers: [
|
||||
{
|
||||
|
@ -1,8 +1,26 @@
|
||||
<div class="mb-3">
|
||||
<label class="form-label" [for]="inputId">{{title}}</label>
|
||||
<input #inputField type="password" class="form-control" [class.is-invalid]="error" [id]="inputId" [(ngModel)]="value" (change)="onChange(value)">
|
||||
<small *ngIf="hint" class="form-text text-muted" [innerHTML]="hint | safeHtml"></small>
|
||||
<label class="form-label" [for]="inputId">{{ title }}</label>
|
||||
|
||||
<input
|
||||
#inputField
|
||||
type="password"
|
||||
class="form-control"
|
||||
[class.is-invalid]="error"
|
||||
[id]="inputId"
|
||||
[(ngModel)]="value"
|
||||
(change)="onChange(value)"
|
||||
/>
|
||||
<password-strength-meter
|
||||
[(password)]="value"
|
||||
[enableFeedback]="true"
|
||||
></password-strength-meter>
|
||||
|
||||
<small
|
||||
*ngIf="hint"
|
||||
class="form-text text-muted"
|
||||
[innerHTML]="hint | safeHtml"
|
||||
></small>
|
||||
<div class="invalid-feedback">
|
||||
{{error}}
|
||||
{{ error }}
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user