ngx-form-draft 2.2.11 → 2.2.12

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2026 Neokyuubi
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2026 Neokyuubi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,206 +1,206 @@
-# ngx-form-draft
-
-Zero-dependency Angular form draft auto-save and restore. Works with Angular 14-20.
-
-## Features
-
-- Auto-saves form values to localStorage
-- Restores drafts on page reload
-- Works with Reactive and Template-driven forms
-- Handles nested FormGroups and FormArrays
-- Visual banner with discard option
-- 7-day draft expiration
-- Zero external dependencies
-- No Angular animations required (pure CSS)
-
-## Requirements
-
-- Angular 14-20
-- TypeScript 4.7+
-
-> **Note:** Angular 21+ support is not yet tested. The package uses stable Angular APIs that should work, but may require updates for newer versions. Please report any issues.
-
-## Installation
-
-```bash
-npm install ngx-form-draft
-```
-
-## Demo
-
-**Live demo:** https://neokyuubi.github.io/ngx-form-draft/
-
-## Setup
-
-### 1. Import the module
-
-```typescript
-import { NgxFormDraftModule } from 'ngx-form-draft';
-
-@NgModule({
-  imports: [NgxFormDraftModule]
-})
-export class AppModule {}
-```
-
-## Usage
-
-### Reactive Forms
-
-```html
-<form [formGroup]="myForm" ngxFormDraft="uniqueFormId">
-  <input formControlName="name">
-  <input formControlName="email">
-</form>
-```
-
-### Template-driven Forms
-
-```html
-<form #myForm="ngForm" ngxFormDraft="uniqueFormId">
-  <input name="name" [(ngModel)]="model.name">
-  <input name="email" [(ngModel)]="model.email">
-</form>
-```
-
-### Scoped drafts (per entity)
-
-```html
-<!-- Reactive -->
-<form [formGroup]="editForm" [ngxFormDraft]="'edit_' + userId">
-
-<!-- Template-driven -->
-<form #editForm="ngForm" [ngxFormDraft]="'edit_' + userId">
-```
-
-## Options
-
-### Reactive Forms
-```html
-<form 
-  [formGroup]="myForm"
-  [ngxFormDraft]="'myForm_' + entityId"
-  [draftDebounce]="1000"
-  [draftExcludeFields]="['password', 'confirmPassword']"
-  [draftShowOnChange]="true"
-  [draftRestoredText]="'Draft restored'"
-  [draftSavedText]="'Draft saved'"
-  [draftSavedLabel]="'saved'"
-  [draftDiscardText]="'Discard'">
-</form>
-```
-
-### Template-driven Forms
-```html
-<form 
-  #myForm="ngForm"
-  [ngxFormDraft]="'myForm_' + entityId"
-  [draftDebounce]="1000"
-  [draftExcludeFields]="['password', 'confirmPassword']"
-  [draftShowOnChange]="true"
-  [draftRestoredText]="'Draft restored'"
-  [draftSavedText]="'Draft saved'"
-  [draftSavedLabel]="'saved'"
-  [draftDiscardText]="'Discard'">
-</form>
-```
-
-### Input Properties
-
-- `ngxFormDraft` (string): Unique form identifier
-- `draftDebounce` (number): Debounce time in ms (default: 800)
-- `draftExcludeFields` (string[]): Fields to exclude from draft
-- `draftShowOnChange` (boolean): Show banner immediately on change (default: false)
-- `draftRestoredText` (string): Banner text for restored draft
-- `draftSavedText` (string): Banner text for saved draft
-- `draftSavedLabel` (string): Label before timestamp
-- `draftDiscardText` (string): Discard button text
-
-## Clearing the draft
-
-The draft is not cleared automatically on form submit. To clear it (e.g. after a successful submit), use **FormDraftService** — the same for both reactive and template-driven forms.
-
-Inject the service and call `clear(formId)` with the same `formId` you use on the form:
-
-```typescript
-import { FormDraftService } from 'ngx-form-draft';
-
-export class MyComponent {
-  constructor(private draftService: FormDraftService) {}
-
-  onSubmit() {
-    this.myForm.markAllAsTouched();
-    if (this.myForm.invalid) return;
-    // ... submit to API ...
-    this.draftService.clear('uniqueFormId');  // same id as ngxFormDraft
-  }
-}
-```
-
-Users can also clear the draft at any time via the banner’s **Discard** button.
-
-## Internationalization (i18n)
-
-The package has **zero dependencies** and supports any i18n solution. Just pass translated strings via inputs:
-
-### With ngx-translate:
-```html
-<form 
-  [formGroup]="myForm"
-  ngxFormDraft="myForm"
-  [draftRestoredText]="'form_draft.restored' | translate"
-  [draftSavedText]="'form_draft.saved' | translate"
-  [draftSavedLabel]="'form_draft.saved_label' | translate"
-  [draftDiscardText]="'form_draft.discard' | translate">
-</form>
-```
-
-### With Angular i18n:
-```html
-<form 
-  [formGroup]="myForm"
-  ngxFormDraft="myForm"
-  [draftRestoredText]="restoredText"
-  [draftSavedText]="savedText"
-  [draftDiscardText]="discardText"
-  i18n-draftRestoredText="@@formDraftRestored"
-  i18n-draftSavedText="@@formDraftSaved"
-  i18n-draftDiscardText="@@formDraftDiscard">
-</form>
-```
-
-### With component properties:
-```typescript
-// component.ts
-export class MyComponent {
-  draftTexts = {
-    restored: 'Brouillon restauré',
-    saved: 'Brouillon sauvegardé',
-    savedLabel: 'sauvegardé',
-    discard: 'Supprimer'
-  };
-}
-```
-
-```html
-<!-- template.html -->
-<form 
-  [formGroup]="myForm"
-  ngxFormDraft="myForm"
-  [draftRestoredText]="draftTexts.restored"
-  [draftSavedText]="draftTexts.saved"
-  [draftSavedLabel]="draftTexts.savedLabel"
-  [draftDiscardText]="draftTexts.discard">
-</form>
-```
-
-### Default English text:
-If you don't provide any text inputs, defaults are:
-- `draftRestoredText`: "Draft restored"
-- `draftSavedText`: "Draft saved"
-- `draftSavedLabel`: "saved"
-- `draftDiscardText`: "Discard"
-
-## License
-
-MIT
+# ngx-form-draft
+
+Zero-dependency Angular form draft auto-save and restore. Works with Angular 14-20.
+
+## Features
+
+- Auto-saves form values to localStorage
+- Restores drafts on page reload
+- Works with Reactive and Template-driven forms
+- Handles nested FormGroups and FormArrays
+- Visual banner with discard option
+- 7-day draft expiration
+- Zero external dependencies
+- No Angular animations required (pure CSS)
+
+## Requirements
+
+- Angular 14-20
+- TypeScript 4.7+
+
+> **Note:** Angular 21+ support is not yet tested. The package uses stable Angular APIs that should work, but may require updates for newer versions. Please report any issues.
+
+## Installation
+
+```bash
+npm install ngx-form-draft
+```
+
+## Demo
+
+**Live demo:** https://neokyuubi.github.io/ngx-form-draft/
+
+## Setup
+
+### 1. Import the module
+
+```typescript
+import { NgxFormDraftModule } from 'ngx-form-draft';
+
+@NgModule({
+  imports: [NgxFormDraftModule]
+})
+export class AppModule {}
+```
+
+## Usage
+
+### Reactive Forms
+
+```html
+<form [formGroup]="myForm" ngxFormDraft="uniqueFormId">
+  <input formControlName="name">
+  <input formControlName="email">
+</form>
+```
+
+### Template-driven Forms
+
+```html
+<form #myForm="ngForm" ngxFormDraft="uniqueFormId">
+  <input name="name" [(ngModel)]="model.name">
+  <input name="email" [(ngModel)]="model.email">
+</form>
+```
+
+### Scoped drafts (per entity)
+
+```html
+<!-- Reactive -->
+<form [formGroup]="editForm" [ngxFormDraft]="'edit_' + userId">
+
+<!-- Template-driven -->
+<form #editForm="ngForm" [ngxFormDraft]="'edit_' + userId">
+```
+
+## Options
+
+### Reactive Forms
+```html
+<form 
+  [formGroup]="myForm"
+  [ngxFormDraft]="'myForm_' + entityId"
+  [draftDebounce]="1000"
+  [draftExcludeFields]="['password', 'confirmPassword']"
+  [draftShowOnChange]="true"
+  [draftRestoredText]="'Draft restored'"
+  [draftSavedText]="'Draft saved'"
+  [draftSavedLabel]="'saved'"
+  [draftDiscardText]="'Discard'">
+</form>
+```
+
+### Template-driven Forms
+```html
+<form 
+  #myForm="ngForm"
+  [ngxFormDraft]="'myForm_' + entityId"
+  [draftDebounce]="1000"
+  [draftExcludeFields]="['password', 'confirmPassword']"
+  [draftShowOnChange]="true"
+  [draftRestoredText]="'Draft restored'"
+  [draftSavedText]="'Draft saved'"
+  [draftSavedLabel]="'saved'"
+  [draftDiscardText]="'Discard'">
+</form>
+```
+
+### Input Properties
+
+- `ngxFormDraft` (string): Unique form identifier
+- `draftDebounce` (number): Debounce time in ms (default: 800)
+- `draftExcludeFields` (string[]): Fields to exclude from draft
+- `draftShowOnChange` (boolean): Show banner immediately on change (default: false)
+- `draftRestoredText` (string): Banner text for restored draft
+- `draftSavedText` (string): Banner text for saved draft
+- `draftSavedLabel` (string): Label before timestamp
+- `draftDiscardText` (string): Discard button text
+
+## Clearing the draft
+
+The draft is not cleared automatically on form submit. To clear it (e.g. after a successful submit), use **FormDraftService** — the same for both reactive and template-driven forms.
+
+Inject the service and call `clear(formId)` with the same `formId` you use on the form:
+
+```typescript
+import { FormDraftService } from 'ngx-form-draft';
+
+export class MyComponent {
+  constructor(private draftService: FormDraftService) {}
+
+  onSubmit() {
+    this.myForm.markAllAsTouched();
+    if (this.myForm.invalid) return;
+    // ... submit to API ...
+    this.draftService.clear('uniqueFormId');  // same id as ngxFormDraft
+  }
+}
+```
+
+Users can also clear the draft at any time via the banner’s **Discard** button.
+
+## Internationalization (i18n)
+
+The package has **zero dependencies** and supports any i18n solution. Just pass translated strings via inputs:
+
+### With ngx-translate:
+```html
+<form 
+  [formGroup]="myForm"
+  ngxFormDraft="myForm"
+  [draftRestoredText]="'form_draft.restored' | translate"
+  [draftSavedText]="'form_draft.saved' | translate"
+  [draftSavedLabel]="'form_draft.saved_label' | translate"
+  [draftDiscardText]="'form_draft.discard' | translate">
+</form>
+```
+
+### With Angular i18n:
+```html
+<form 
+  [formGroup]="myForm"
+  ngxFormDraft="myForm"
+  [draftRestoredText]="restoredText"
+  [draftSavedText]="savedText"
+  [draftDiscardText]="discardText"
+  i18n-draftRestoredText="@@formDraftRestored"
+  i18n-draftSavedText="@@formDraftSaved"
+  i18n-draftDiscardText="@@formDraftDiscard">
+</form>
+```
+
+### With component properties:
+```typescript
+// component.ts
+export class MyComponent {
+  draftTexts = {
+    restored: 'Brouillon restauré',
+    saved: 'Brouillon sauvegardé',
+    savedLabel: 'sauvegardé',
+    discard: 'Supprimer'
+  };
+}
+```
+
+```html
+<!-- template.html -->
+<form 
+  [formGroup]="myForm"
+  ngxFormDraft="myForm"
+  [draftRestoredText]="draftTexts.restored"
+  [draftSavedText]="draftTexts.saved"
+  [draftSavedLabel]="draftTexts.savedLabel"
+  [draftDiscardText]="draftTexts.discard">
+</form>
+```
+
+### Default English text:
+If you don't provide any text inputs, defaults are:
+- `draftRestoredText`: "Draft restored"
+- `draftSavedText`: "Draft saved"
+- `draftSavedLabel`: "saved"
+- `draftDiscardText`: "Discard"
+
+## License
+
+MIT