add after hook

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog for malle
 
+## 2.1.0
+
+* Add `after` hook, triggered after replacement of element.
+
 ## 2.0.0
 
 * The `fun` function now expects a `Promise<string>` as return value

DOCUMENTATION.md

@@ -18,6 +18,12 @@ When instanciating the `Malle` class, you need to give it an `Options` argument.
 
 Available options:
 
+#### after
+`Function(original: HTMLElement, event: Event, value: string): boolean`
+default: `undefined`
+
+This function will be called after everything is processed.
+
 #### before
 `Function(original: HTMLElement, event: Event): boolean`
 default: `undefined`

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deltablot/malle",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "Make text elements malleable, without dependencies.",
   "main": "dist/main.js",
   "typings":  "dist/main.d.ts",

src/main.ts

@@ -34,6 +34,7 @@ export interface SelectOptions {
 }
 
 export interface Options {
+  after?(original: HTMLElement, event:Event, value: string): boolean;
   before?(original: HTMLElement, event:Event): boolean;
   cancel?: string;
   cancelClasses?: Array<string>;
@@ -79,6 +80,7 @@ export class Malle {
    */
   normalizeOptions(options: Options): Options {
     const defaultOptions = {
+      after: undefined,
       before: undefined,
       cancel: '',
       cancelClasses: [],
@@ -161,7 +163,12 @@ export class Malle {
     this.opt.fun.call(this, this.input.value, this.original, event, this.input).then((value: string) => {
       this.original.innerText = this.opt.inputType === InputType.Select ? (this.input as HTMLSelectElement).options[(this.input as HTMLSelectElement).selectedIndex].text : value;
       this.form.replaceWith(this.original);
+      // execute the after hook
+      if (typeof this.opt.after === 'function') {
+        return this.opt.after(this.original, event, value);
+      }
     });
+
     return true;
   }