@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.
193 lines (164 loc) • 5.96 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "InputStepperStateless", {
enumerable: true,
get: function get() {
return _InputStepperStateless.default;
}
});
exports.default = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var React = _interopRequireWildcard(require("react"));
var _consts = require("../InputField/consts");
var _keyMaps = _interopRequireDefault(require("../common/keyMaps"));
var _InputStepperStateless = _interopRequireDefault(require("./InputStepperStateless"));
var _validateIncrement = _interopRequireDefault(require("../utils/validateIncrement"));
var _validateDecrement = _interopRequireDefault(require("../utils/validateDecrement"));
var _useStateWithCallback3 = _interopRequireDefault(require("../hooks/useStateWithCallback"));
var _useTranslate = _interopRequireDefault(require("../hooks/useTranslate"));
var InputStepper = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
var onChange = _ref.onChange,
_ref$defaultValue = _ref.defaultValue,
defaultValue = _ref$defaultValue === void 0 ? 0 : _ref$defaultValue,
_ref$disabled = _ref.disabled,
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
props = (0, _objectWithoutProperties2.default)(_ref, ["onChange", "defaultValue", "disabled"]);
var translate = (0, _useTranslate.default)();
var _useStateWithCallback = (0, _useStateWithCallback3.default)(defaultValue, onChange),
_useStateWithCallback2 = (0, _slicedToArray2.default)(_useStateWithCallback, 2),
value = _useStateWithCallback2[0],
setValue = _useStateWithCallback2[1];
var incrementCounter = function incrementCounter() {
var _props$maxValue = props.maxValue,
maxValue = _props$maxValue === void 0 ? Number.POSITIVE_INFINITY : _props$maxValue,
_props$step = props.step,
step = _props$step === void 0 ? 1 : _props$step;
if (!disabled) {
setValue((0, _validateIncrement.default)({
value: value,
maxValue: maxValue,
step: step
}));
}
};
var decrementCounter = function decrementCounter() {
var _props$minValue = props.minValue,
minValue = _props$minValue === void 0 ? Number.NEGATIVE_INFINITY : _props$minValue,
_props$step2 = props.step,
step = _props$step2 === void 0 ? 1 : _props$step2;
if (!disabled) {
setValue((0, _validateDecrement.default)({
value: value,
minValue: minValue,
step: step
}));
}
};
var handleIncrementCounter = function handleIncrementCounter(ev) {
if (ev && ev.type === "click") {
incrementCounter();
}
if (ev && ev.type === "keydown") {
if (ev.keyCode === _keyMaps.default.SPACE) {
ev.preventDefault();
incrementCounter();
} else if (ev.keyCode === _keyMaps.default.ENTER) {
incrementCounter();
}
}
};
var handleDecrementCounter = function handleDecrementCounter(ev) {
if (ev && ev.type === "click") {
decrementCounter();
}
if (ev && ev.type === "keydown") {
if (ev.keyCode === _keyMaps.default.SPACE) {
ev.preventDefault();
decrementCounter();
} else if (ev.keyCode === _keyMaps.default.ENTER) {
decrementCounter();
}
}
};
var handleKeyDown = function handleKeyDown(ev) {
if (ev.keyCode === _keyMaps.default.ARROW_DOWN) {
ev.preventDefault();
decrementCounter();
}
if (ev.keyCode === _keyMaps.default.ARROW_UP) {
ev.preventDefault();
incrementCounter();
}
};
var handleChange = function handleChange(ev) {
var eventValue = ev && parseInt(ev.target.value, 10);
var prevValue = value;
var maxValue = props.maxValue,
minValue = props.minValue;
if (disabled) return;
if (prevValue <= eventValue) {
setValue((0, _validateIncrement.default)({
value: value,
maxValue: maxValue,
step: 0
}));
}
if (prevValue >= eventValue) {
setValue((0, _validateDecrement.default)({
value: value,
minValue: minValue,
step: 0
}));
}
};
var label = props.label,
error = props.error,
onBlur = props.onBlur,
onFocus = props.onFocus,
help = props.help,
name = props.name,
dataTest = props.dataTest,
_props$size = props.size,
size = _props$size === void 0 ? _consts.SIZE_OPTIONS.NORMAL : _props$size,
required = props.required,
readOnly = props.readOnly,
minValue = props.minValue,
maxValue = props.maxValue,
tabIndex = props.tabIndex,
spaceAfter = props.spaceAfter,
titleIncrement = props.titleIncrement,
titleDecrement = props.titleDecrement;
return /*#__PURE__*/React.createElement(_InputStepperStateless.default, {
dataTest: dataTest,
size: size,
label: label,
disabled: disabled,
required: required,
readOnly: readOnly,
name: name,
error: error,
help: help,
onChange: handleChange,
onBlur: onBlur,
onFocus: onFocus,
onKeyDown: handleKeyDown,
value: value || 0,
minValue: minValue,
maxValue: maxValue,
tabIndex: tabIndex,
forwardedRef: ref,
spaceAfter: spaceAfter,
onDecrement: handleDecrementCounter,
onIncrement: handleIncrementCounter,
titleIncrement: titleIncrement || translate("increment_value"),
titleDecrement: titleDecrement || translate("decrement_value")
});
});
InputStepper.displayName = "InputStepper";
var _default = InputStepper;
exports.default = _default;