@yandex/ui/Slider/Slider.utils.js

Yandex UI components

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useSliderState = exports.getDirection = exports.normalizeValue = exports.getTicks = exports.getRangePosition = void 0;
var tslib_1 = require("tslib");
var react_1 = require("react");
var react_range_1 = require("react-range");
/**
 * Возвращает позицию элемента Range.
 *
 * @param values - Текущее значение слайдера
 * @param min - Минимальное значение слайдера
 * @param max - Максимальное значение слайдера
 */
function getRangePosition(values, min, max, reverse) {
    var positions = values.map(function (value) { return ((value - min) / (max - min)) * 100; });
    // TODO: Необходим рефакторинг.
    if (values.length === 1) {
        if (reverse) {
            return { left: 100 - positions[positions.length - 1] + "%", right: '0%' };
        }
        return { left: '0%', right: 100 - positions[positions.length - 1] + "%" };
    }
    if (reverse) {
        return { left: 100 - positions[positions.length - 1] + "%", right: positions[0] + "%" };
    }
    return { left: positions[0] + "%", right: 100 - positions[positions.length - 1] + "%" };
}
exports.getRangePosition = getRangePosition;
/**
 * Возвращает список пометок на линии.
 *
 * @param min - Минимальное значение слайдера
 * @param max - Максимальное значение слайдера
 * @param step - Шаг смещения бегунка
 */
function getTicks(min, max, step) {
    // Добавляем единицу чтобы учесть нулевую позицию.
    var ticksLength = (max - min) / step + 1;
    return Array.from({ length: ticksLength }).map(function (_, idx) { return min + step * idx; });
}
exports.getTicks = getTicks;
/**
 * Нормализует значения в пределах диапазона.
 *
 * @param values - Текущее значение слайдера
 * @param min - Минимальное значение слайдера
 * @param max - Максимальное значение слайдера
 */
function normalizeValue(values, min, max) {
    if (values.length === 0 || values.length > 2) {
        throw new RangeError('Свойство "value" должно принимать одно или два значения.');
    }
    return values.map(function (value) {
        if (value > max)
            return max;
        if (value < min)
            return min;
        return value;
    });
}
exports.normalizeValue = normalizeValue;
/**
 * Возвращает направление слайдера.
 *
 * @param vertical - Вертикальное положение слайдера
 * @param reverse - Обратное направление слайдера
 */
function getDirection(vertical, reverse) {
    if (vertical && reverse)
        return react_range_1.Direction.Down;
    if (vertical && !reverse)
        return react_range_1.Direction.Up;
    if (!vertical && reverse)
        return react_range_1.Direction.Left;
    return react_range_1.Direction.Right;
}
exports.getDirection = getDirection;
/**
 * Реакт-хук состояния для компонента Slider.
 *
 * @experimental
 *
 * @example
 *
 * const state = useSliderState({ value: [10] })
 * return <Slider {...state} />
 */
function useSliderState(options) {
    var _a = tslib_1.__read(react_1.useState(options.value), 2), value = _a[0], setValue = _a[1];
    var onInput = react_1.useCallback(function (_, nextValue) { return setValue(nextValue); }, []);
    return { onInput: onInput, value: value };
}
exports.useSliderState = useSliderState;