@mamba/input - npm Package Compare versions

Comparing version 4.0.0-rc.1 to 4.0.0

Controllers/virtualKeyboard/modules/AbstractKey.js

@@ -0,3 +1,4 @@
+import System from '@mamba/pos/api/system';
+
 class AbstractKey {
-
   /**
@@ -9,4 +10,42 @@ * @param {string} code
   }
+
+  /**
+   * @description handle for beep sound
+   * @private
+   */
+  _handleBeepSound() {
+    System.beep(System.Tones.TONE3, 30);
+  }
+
+  /**
+   * @description handle for issuing the event to the parent component
+   * @param {any} componentScope
+   * @param {string} eventName
+   * @param {string} input
+   */
+  _emitEventToParent({ componentScope, eventName, input }) {
+    componentScope.fire(eventName, { input });
+    this._handleBeepSound();
+  }
+
+  /**
+   * @description responsible for implementing the concrete logic of each element
+   * @param {PointerEvent | TouchEvent} event
+   * @param { {scope: any} } controller
+   * @protected
+   */
+  onClickTemplate(event, controller) {}
+
+  /**
+   * @description responsible for performing standard tasks and completing the template method pattern
+   * @param {PointerEvent | TouchEvent} event
+   * @param { {scope: any} } controller
+   */
+  onClick(event, controller) {
+    event.preventDefault();
+
+    this.onClickTemplate(event, controller);
+  }
 }
 
 export default AbstractKey;

Controllers/virtualKeyboard/modules/ConfirmationKey.js

 import AbstractKey from './AbstractKey';
 
 class ConfirmationKey extends AbstractKey {
-
-  onClick(controller) {
-    controller.confirmKey();
+  onClickTemplate(event, controller) {
+    this._emitEventToParent({
+      componentScope: controller.scope,
+      eventName: 'submit',
+      input: 'submit',
+    });
   }
@@ -8,0 +11,0 @@ }

Controllers/virtualKeyboard/modules/DeleteKey.js

 import AbstractKey from './AbstractKey';
 
 class DeleteKey extends AbstractKey {
-
-  onClick(controller) {
-    controller.deleteKey();
+  onClickTemplate(event, controller) {
+    this._emitEventToParent({
+      componentScope: controller.scope,
+      eventName: 'backspace',
+      input: 'backspace',
+    });
   }
@@ -8,0 +11,0 @@ }

Controllers/virtualKeyboard/modules/Key.js

 import AbstractKey from './AbstractKey';
 
 class Key extends AbstractKey {
-
-  onClick(controller) {
-
-    const inputValue = controller.insertKey(this.code);
-
-    return inputValue;
+  onClickTemplate(event, controller) {
+    this._emitEventToParent({
+      componentScope: controller.scope,
+      eventName: 'keypress',
+      input: this.code,
+    });
   }
@@ -11,0 +11,0 @@ }

Controllers/virtualKeyboard/modules/MathKey.js

 import AbstractKey from './AbstractKey';
 
 class MathKey extends AbstractKey {
-
-  onClick(controller) {
-    controller.emitKeyToParent(this.code);
+  onClickTemplate(event, controller) {
+    this._emitEventToParent({
+      componentScope: controller.scope,
+      eventName: 'mathKeypress',
+      input: this.code,
+    });
   }
@@ -8,0 +11,0 @@ }

Controllers/virtualKeyboard/VirtualKeyboardController.js

@@ -11,37 +11,4 @@ import System from '@mamba/pos/api/system.js';
 
-  insertKey(code) {
-    const inputValue = this.getInputValue();
-
-    const newInputValue = String(inputValue) + String(code);
-
-    this.setInputValue(newInputValue);
-    this.keyboardBeep();
-
-    return newInputValue;
-  }
-
-  confirmKey() {
+  openKeyboard() {
     this.scope.set({
-      isFocused: false,
-    });
-
-    this.scope.fire('submit');
-
-    this.keyboardBeep();
-  }
-
-  deleteKey() {
-    const inputValue = this.getInputValue();
-
-    if (!inputValue) return;
-
-    this.setInputValue(inputValue.slice(0, -1));
-    this.setInputFocus();
-
-    this.keyboardBeep();
-  }
-
-  openKeyboard(inputRef) {
-    this.scope.set({
-      inputRef,
       isFocused: true,
@@ -57,34 +24,25 @@ });
 
-  getInputValue() {
-    const { inputRef } = this.scope.get();
+  /**
+   *
+   * @param {PointerEvent} event
+   * @private
+   */
+  _handleClickOutside(event) {
+    const { target } = event;
 
-    const { value } = inputRef.get();
+    const offsetParentClassList = Array.from(
+      target.offsetParent ? target.offsetParent.classList : [],
+    );
 
-    return value;
-  }
+    const hasClickedOutside = offsetParentClassList.every(
+      className => className !== 'keyboard',
+    );
+    const isInputElement = target instanceof HTMLInputElement;
 
-  setInputValue(value) {
-    const { inputRef } = this.scope.get();
-
-    inputRef.set({ value });
-
-    return value;
+    if (hasClickedOutside && !isInputElement) {
+      this.scope.set({ isFocused: false });
+    }
   }
-
-  setInputFocus() {
-    const { inputRef } = this.scope.get();
-
-    inputRef.focus();
-  }
-
-  keyboardBeep() {
-    System.beep(System.Tones.TONE3, 30);
-  }
-
-  emitKeyToParent(key) {
-    this.scope.fire("addInput", { input: key});
-    this.keyboardBeep();
-  }
 }
 
 export default VirtualKeyboardController;

libs/virtualKeyboard.js

@@ -78,3 +78,2 @@ import Key from '../Controllers/virtualKeyboard/modules/Key.js';
 
-
 export const VIRTUAL_KEYBOARD = {
@@ -93,3 +92,3 @@ KEYS: [
     new Key({ code: '0' }),
-    new ConfirmationKey({ code: 'confirmation'})
+    new ConfirmationKey({ code: 'confirmation' }),
   ],
@@ -102,3 +101,3 @@ MATH: [
     new MathKey({ code: '=' }),
-  ]
-}
+  ],
+};

package.json

 {
   "name": "@mamba/input",
-  "version": "4.0.0-rc.1",
+  "version": "4.0.0",
   "svelte": "Input.html",
@@ -20,3 +20,3 @@ "author": "Stone Payments - Mamba Team",
   },
-  "gitHead": "fa4d98802cffe09958d3cf272ac1d50691ab2ad5"
+  "gitHead": "283dde14e31f37ede09867de186c597041340d33"
 }

README.md

@@ -53,2 +53,14 @@ # Input
 
+#Documentação do teclado virtual numérico
+
+A nova versão do teclado numérico consiste em instanciar o componente e configurar os eventos por ele emitido. Essa versão visa uma maior usabilidade do componente e melhor encapsulamento das responsabilidades do próprio, visto que ele independe do cenário que vai ser colocado e permite com que qualquer lógica seja empregada. Os eventos apesar de retornarem o mesmo payload, foram dividos afim de incentivar uma maior segregação de responsabilidade.
+
+###Eventos
+| Nome         | Descrição                   | Payload           |
+|--------------|-----------------------------|-------------------|
+| keypress     | Teclas comuns do teclado    | { input: string } |
+| mathKeypress | Teclas do teclado numerico  | { input: string } |
+| backspace    | Tecla para apagar caractere | { input: string } |
+| submit       | Tecla de submit             | { input: string } |
+
 ### Money
@@ -55,0 +67,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

120275

increased by1.2%

Lines of code

785

increased by3.15%

Number of low quality alerts

1

decreased by-50%

Number of lines in readme file

190

increased by6.74%

No dependency changes