@open-tender/store
Version:
A library of hooks, reducers, utility functions, and types for use with Open Tender applications that utilize our in-store POS API
28 lines (27 loc) • 1.25 kB
JavaScript
import { useCallback, useMemo, useState } from 'react';
import { useAppSelector } from '../app/hooks';
import { selectKioskConfig } from '../slices';
import { getKeyboardValue } from '../utils';
var Keypad = function (_a) {
var children = _a.children, maxLength = _a.maxLength, type = _a.type, value = _a.value, handlers = _a.handlers, isEmail = _a.isEmail;
var _b = useAppSelector(selectKioskConfig), keypad = _b.keypad, numpad = _b.numpad;
var isDollar = type === 'dollar';
var config = type === 'numeric' || isDollar ? numpad : keypad;
var _c = useState(false), isShiftOn = _c[0], setIsShiftOn = _c[1];
var handleOnKeyPress = useCallback(function (key) {
setIsShiftOn(function (prev) { return (key === '\u21E7' ? !prev : prev); });
handlers.change(getKeyboardValue(key, value, maxLength, isShiftOn));
}, [handlers, value, maxLength, isShiftOn]);
var viewHandlers = useMemo(function () { return ({ keyPress: handleOnKeyPress }); }, [handleOnKeyPress]);
if (!config)
return null;
return children({
config: config,
handlers: viewHandlers,
value: value,
type: type,
isEmail: isEmail,
isShiftOn: isShiftOn
});
};
export default Keypad;