Merge pull request #33 from github/add-committed-event

Add `text-expander-committed` event
github · Oct 28, 2022 · 5b5f7ad · 5b5f7ad
2 parents fb4fc53 + fd03764
commit 5b5f7ad
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -91,6 +91,18 @@ expander.addEventListener('text-expander-value', function(event) {
 })
 ```
 
+**`text-expander-committed`** is fired after the underlying `input` value has been updated in the DOM. In `event.detail` you can find:
+
+- `input`: The `HTMLInputElement` or `HTMLTextAreaElement` that just had `value` changes committed to the DOM.
+
+```js
+const expander = document.querySelector('text-expander')
+
+expander.addEventListener('text-expander-committed', function(event) {
+  const {input}  = event.detail
+})
+```
+
 ## Browser support
 
 Browsers without native [custom element support][support] require a [polyfill][].

diff --git a/src/text-expander-element.ts b/src/text-expander-element.ts
@@ -140,6 +140,10 @@ class TextExpander {
     this.input.selectionEnd = cursor
     this.lookBackIndex = cursor
     this.match = null
+
+    this.expander.dispatchEvent(
+      new CustomEvent('text-expander-committed', {cancelable: false, detail: {input: this.input}})
+    )
   }
 
   private onBlur() {