@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
134 lines • 4.84 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.buildAriaDescribedBy = exports.calcNewValueAfterKeyPress = exports.decrementValue = exports.incrementValue = void 0;
const keyboardKeys_1 = require("../../../constants/keyboardKeys/keyboardKeys");
const incrementValue = ({ activePointer, range, max, step, value, }) => {
if (range) {
return incrementRangeValue({ activePointer, max, step, value: value });
}
return incrementNoRangeValue({ max, step, value: value });
};
exports.incrementValue = incrementValue;
const incrementNoRangeValue = ({ max, step, value, }) => {
if (value + step > max) {
return max;
}
return value + step;
};
const incrementRangeValue = ({ activePointer, max, step, value, }) => {
if (activePointer === 'left') {
if (value[0] + step >= value[1]) {
return undefined;
}
return [value[0] + step, value[1]];
}
// right
if (value[1] + step > max) {
return [value[0], max];
}
return [value[0], value[1] + step];
};
const decrementValue = ({ activePointer, range, min, step, value, }) => {
if (range) {
return decrementRangeValue({ activePointer, min, step, value: value });
}
return decrementNoRangeValue({ min, step, value: value });
};
exports.decrementValue = decrementValue;
const decrementNoRangeValue = ({ min, step, value, }) => {
if (value - step < min) {
return min;
}
return value - step;
};
const decrementRangeValue = ({ activePointer, min, step, value, }) => {
if (activePointer === 'left') {
if (value[0] - step < min) {
return [min, value[1]];
}
return [value[0] - step, value[1]];
}
// right
if (value[1] - step <= value[0]) {
return undefined;
}
return [value[0], value[1] - step];
};
const incrementValueToMax = ({ range, activePointer, max, step, value, }) => {
if (range) {
return incrementRangeValueToMax({ activePointer, max, step, value: value });
}
return incrementNoRangeValueToMax({ max });
};
const incrementNoRangeValueToMax = ({ max }) => {
return max;
};
const incrementRangeValueToMax = ({ activePointer, max, step, value, }) => {
if (activePointer === 'left') {
return [value[1] - step, value[1]];
}
return [value[0], max];
};
const decrementValueToMin = ({ range, activePointer, min, step, value, }) => {
if (range) {
return decrementRangeValueToMin({ activePointer, min, step, value: value });
}
return decrementNoRangeValueToMin({ min });
};
const decrementNoRangeValueToMin = ({ min }) => {
return min;
};
const decrementRangeValueToMin = ({ activePointer, min, step, value, }) => {
if (activePointer === 'left') {
return [min, value[1]];
}
// Right
return [value[0], value[0] + step];
};
/**
* @name calcNewValueAfterKeyPress
* @description
* Calculate the new value after a key press
* @param {React.KeyboardEvent<HTMLInputElement>} event - The key press event
* @param {boolean} range - If the slider is a range slider
* @param {string} activePointer - The active pointer
* @param {number} max - The max value
* @param {number} min - The min value
* @param {number} step - The step value
* @param {number | number[]} value - The current value
* @returns {number | number[] | undefined} - The new value
* @example
* calcNewValueAfterKeyPress(event, range, activePointer, max, min, step, value);
* @private
* @ignore
*/
const calcNewValueAfterKeyPress = ({ event, range, activePointer, max, min, step, value, }) => {
if ([keyboardKeys_1.ARROW_DOWN.key, keyboardKeys_1.ARROW_LEFT.key].includes(event.key)) {
event.preventDefault();
return (0, exports.decrementValue)({ activePointer, range, min, step, value });
}
if ([keyboardKeys_1.ARROW_UP.key, keyboardKeys_1.ARROW_RIGHT.key].includes(event.key)) {
event.preventDefault();
return (0, exports.incrementValue)({ activePointer, range, max, step, value });
}
if ([keyboardKeys_1.HOME.key].includes(event.key)) {
event.preventDefault();
return decrementValueToMin({ range, activePointer, min, step, value });
}
if ([keyboardKeys_1.END.key].includes(event.key)) {
event.preventDefault();
return incrementValueToMax({ range, activePointer, max, step, value });
}
return undefined;
};
exports.calcNewValueAfterKeyPress = calcNewValueAfterKeyPress;
// Arias
const buildAriaDescribedBy = (listHelperText) => {
const res = listHelperText
.filter(helper => helper.helperText)
.map(helper => helper.helperTextId)
.join(' ');
return res || undefined;
};
exports.buildAriaDescribedBy = buildAriaDescribedBy;
//# sourceMappingURL=accessibility.utils.js.map