From 4597616db0438eb366d5f7057ef125ca17619b77 Mon Sep 17 00:00:00 2001 From: Dmytro Soldatov Date: Mon, 2 Dec 2024 16:03:29 +0200 Subject: [PATCH] Feat: Add paste functionality to the input component (#213) --- src/Input.ts | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/Input.ts b/src/Input.ts index 2522f18..aa95bee 100644 --- a/src/Input.ts +++ b/src/Input.ts @@ -72,6 +72,7 @@ export class Input extends Container protected onKeyUpBinding = this.onKeyUp.bind(this); protected stopEditingBinding = this.stopEditing.bind(this); protected onInputBinding = this.onInput.bind(this); + protected onPasteBinding = this.onPaste.bind(this); /** Fires when input loses focus. */ onEnter: Signal<(text: string) => void>; @@ -162,6 +163,9 @@ export class Input extends Container if (keysToSkip.includes(key)) return; + if (e.metaKey) return; + if (e.ctrlKey) return; + if (key === 'Backspace') { this._delete(); @@ -341,6 +345,7 @@ export class Input extends Container this.input.removeEventListener('blur', this.stopEditingBinding); this.input.removeEventListener('keydown', this.onKeyUpBinding); this.input.removeEventListener('input', this.onInputBinding as EventListener); + this.input.removeEventListener('paste', this.onPasteBinding); this.input?.blur(); this.input?.remove(); @@ -379,6 +384,7 @@ export class Input extends Container input.addEventListener('blur', this.stopEditingBinding); input.addEventListener('keydown', this.onKeyUpBinding); input.addEventListener('input', this.onInputBinding as EventListener); + input.addEventListener('paste', this.onPasteBinding); this.input = input; @@ -713,4 +719,14 @@ export class Input extends Container this.inputMask.position.set(this.paddingLeft, this.paddingTop); } + + protected onPaste(e: any) { + e.preventDefault(); + + const text = (e.clipboardData || (window as any).clipboardData).getData("text"); + + if (!text) return; + + this._add(text); + } }