updated

src/widgets/pin-box/PinBox.js

@@ -1,5 +1,6 @@
 import './pin-box.css';
 
+import { Ut } from '../../utils/Ut';
 import { El } from '../../utils/dom';
 
 export class PinBox {
@@ -7,7 +8,7 @@ export class PinBox {
 	/**
 	 * PinBox, Contructor
 	 */
-	constructor(target, opts, events) {
+	constructor(target, opts) {
 
 		this.target = target;
 
@@ -21,8 +22,6 @@ export class PinBox {
 			digits: this.target.dataset.pinboxDigits || 6,		
 		}, ... opts };
 
-		this.events = events || {};
-
 		this.ui = El('div', { class: 'sp-pinbox' });
 
 		this.target.after(this.ui);
@@ -49,31 +48,28 @@ export class PinBox {
 	 */
 	change(target) {
 
-		let code = '';
+		this.code = '';
 
 		let val = target.value.replace(/\D/g, '');
 
 		target.value = val;
 		
-		if (val) {
+		if (!val) {
+			this.target.value = '';
+			return;
+		}
 
 		target.nextElementSibling?.focus();
 
-			this.ui.dxFind('input[type="text"]', t => code += t.value);
+		this.ui.dxFind('input[type="text"]', t => this.code += t.value);
 
-			if (code.length == this.opts.digits) {
-				
-				this.target.dxVal(code).dxTrigger('complete');
-
-				Ut.trigger(this.events.complete, code, this);
-			}
-			else {
-				this.target.value = '';
-			}
-		}
-		else {
+		if (this.code.length != this.opts.digits) {
 			this.target.value = '';
+			return;
 		}
+
+		this.target.dxVal(this.code).dxTrigger('complete');
+		Ut.trigger(this.opts.complete, this);	
 	}
 
 	/**
@@ -126,7 +122,7 @@ export class PinBox {
 	destroy() {
 		this.ui.remove();
 		this.target.dxRemoveData('pinbox');
-		Ut.trigger(this.events.destroy, this);
+		Ut.trigger(this.opts.destroy, this);
 	}
 }