import { __spreadArray } from '../../node_modules/tslib/tslib.es6.js';
import React, { useState } from 'react';
import RangeSlider from './index.js';

var RangeSliderWithScale = function (_a) {
    var scale = _a.scale, selection = _a.selection, onSliderChange = _a.onSliderChange, onSliderRelease = _a.onSliderRelease, renderChart = _a.renderChart;
    var _b = useState(null), startRange = _b[0], setStartRange = _b[1];
    var sortedScale = scale.sort(function (a, b) { return a - b; });
    var toIndex = function (value) {
        var closestValue = sortedScale.reduce(function (prev, curr) {
            return Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev;
        }, 0);
        return sortedScale.indexOf(closestValue);
    };
    var toValue = function (index) {
        if (index === sortedScale.length) {
            return null;
        }
        return sortedScale[index];
    };
    var toMinMax = function (minIndex, maxIndex, previousSelection) { return ({
        min: minIndex ? toValue(minIndex) : null,
        max: maxIndex ? toValue(maxIndex) : previousSelection.max,
    }); };
    var toRange = function (_a) {
        var min = _a.min, max = _a.max;
        var maxValue = max ? toIndex(max) : sortedScale.length;
        var minValue = min ? toIndex(min) : 0;
        var range = [minValue, maxValue];
        var sortedRange = __spreadArray([], range, true).sort(function (a, b) { return a - b; });
        return JSON.stringify(range) === JSON.stringify(sortedRange)
            ? range
            : [minValue, minValue];
    };
    var getChangedThumb = function (initial, current) {
        var initialMinIndex = initial[0], initialMaxIndex = initial[1];
        var currentMinIndex = current[0], currentMaxIndex = current[1];
        if (initialMinIndex === currentMinIndex &&
            initialMaxIndex === currentMaxIndex) {
            return null;
        }
        return initialMinIndex !== currentMinIndex ? 'min' : 'max';
    };
    var getChangeEvent = function (_a) {
        var newMinIndex = _a[0], newMaxIndex = _a[1];
        var changedThumb = getChangedThumb(startRange || toRange(selection), [
            newMinIndex,
            newMaxIndex,
        ]);
        if (!changedThumb)
            return null;
        return {
            touched: changedThumb,
            value: toMinMax(newMinIndex, newMaxIndex, selection),
        };
    };
    var handleChange = function (newValues, callback) {
        var changeEvent = getChangeEvent(newValues);
        if (changeEvent) {
            callback(changeEvent);
        }
    };
    return (React.createElement(React.Fragment, null,
        renderChart ? renderChart(toRange(selection)) : null,
        React.createElement(RangeSlider, { h: "sm", step: 1, min: 0, max: sortedScale.length, onChange: function (newValues) { return handleChange(newValues, onSliderChange); }, onChangeEnd: function (newValues) {
                var callback = function (event) {
                    onSliderRelease(event);
                    setStartRange(newValues);
                };
                handleChange(newValues, callback);
            }, onChangeStart: setStartRange, value: toRange(selection) })));
};

export { RangeSliderWithScale as default };
//# sourceMappingURL=RangeSliderWithScale.js.map
