import React from 'react';
import { Box } from '@chakra-ui/react';
import RangeSliderWithScale from './RangeSliderWithScale.js';
import Chart from './Chart.js';

var RangeSliderWithChart = function (_a) {
    var facets = _a.facets, selection = _a.selection, onSliderChange = _a.onSliderChange, onSliderRelease = _a.onSliderRelease, _b = _a.chartHeight, chartHeight = _b === void 0 ? '3xl' : _b;
    var sortedFacetsByFromKey = facets.sort(function (a, b) { return a.from - b.from; });
    var scale = sortedFacetsByFromKey.map(function (_a) {
        var from = _a.from;
        return from;
    });
    return (React.createElement(RangeSliderWithScale, { onSliderChange: onSliderChange, onSliderRelease: onSliderRelease, selection: selection, scale: scale, renderChart: function (range) { return (React.createElement(Box, { position: "relative", top: "sm", h: chartHeight },
            React.createElement(Chart, { range: range, facets: sortedFacetsByFromKey }))); } }));
};

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