import { isNil, merge, clamp, isValid, array, isObject, isArray, clampRange } from "@visactor/vutils";

import { graphicCreator, vglobal } from "@visactor/vrender-core";

import { AbstractComponent } from "../core/base";

import { SLIDER_ELEMENT_NAME } from "./constant";

import { loadSliderComponent } from "./register";

import { getEndTriggersOfDrag } from "../util/event";

function convertValueToRange(value) {
    return isArray(value) ? value : [ value, value ];
}

function getDefaultCursor(isHorizontal) {
    return isHorizontal ? "ew-resize" : "ns-resize";
}

loadSliderComponent();

export class Slider extends AbstractComponent {
    get track() {
        return this._track;
    }
    get currentValue() {
        return this._currentValue;
    }
    get startHandler() {
        return this._startHandler;
    }
    get endHandler() {
        return this._endHandler;
    }
    get tooltipShape() {
        return this._tooltipShape;
    }
    constructor(attributes, options) {
        super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, Slider.defaultAttributes, attributes)), 
        this.name = "slider", this._isHorizontal = !0, this._startHandler = null, this._endHandler = null, 
        this._startHandlerText = null, this._endHandlerText = null, this._currentHandler = null, 
        this._currentValue = {}, this._onTooltipShow = e => {
            this._isChanging || this._tooltipState && this._tooltipState.isActive || (this._tooltipState ? this._tooltipState.isActive = !0 : this._tooltipState = {
                isActive: !0
            }, this._onTooltipUpdate(e), this._dispatchTooltipEvent("sliderTooltipShow"));
        }, this._onTooltipUpdate = e => {
            if (this._isChanging || !this._tooltipState || !this._tooltipState.isActive) return;
            const railLen = this._isHorizontal ? this._rail.globalAABBBounds.width() : this._rail.globalAABBBounds.height(), pos = clamp(this._isHorizontal ? (e.viewX - this._rail.globalAABBBounds.x1) / railLen : (e.viewY - this._rail.globalAABBBounds.y1) / railLen, 0, 1);
            pos !== this._tooltipState.pos && (this._tooltipState.pos = pos, this._tooltipState.value = this.calculateValueByPos(pos * railLen), 
            this._updateTooltip(), this._dispatchTooltipEvent("sliderTooltipUpdate"));
        }, this._onTooltipHide = () => {
            const {tooltip: tooltip} = this.attribute;
            tooltip && tooltip.alwaysShow || (this._tooltipState = null, this._tooltipShape && this._tooltipShape.setAttribute("visible", !1), 
            this._tooltipText && this._tooltipText.setAttribute("visible", !1), this._dispatchTooltipEvent("sliderTooltipHide"));
        }, this._onHandlerPointerdown = e => {
            this._clearAllDragEvents(), this._isChanging = !0;
            const {x: x, y: y} = this.stage.eventPointTransform(e);
            this._currentHandler = e.target, this._prePos = this._isHorizontal ? x : y;
            const triggers = getEndTriggersOfDrag(), obj = "browser" === vglobal.env ? vglobal : this.stage;
            obj.addEventListener("pointermove", this._onHandlerPointerMove, {
                capture: !0,
                passive: !1
            }), triggers.forEach((trigger => {
                obj.addEventListener(trigger, this._onHandlerPointerUp);
            }));
        }, this._onHandlerPointerMove = e => {
            var _a, _b;
            e.preventDefault(), this._isChanging = !0;
            const {railWidth: railWidth, railHeight: railHeight, min: min, max: max} = this.attribute;
            if (max === min) return;
            const {x: x, y: y} = this.stage.eventPointTransform(e);
            let currentPos, originPos, railLen, delta = 0;
            this._isHorizontal ? (currentPos = x, delta = currentPos - this._prePos, originPos = null === (_b = this._currentHandler) || void 0 === _b ? void 0 : _b.attribute.x, 
            railLen = railWidth) : (currentPos = y, delta = currentPos - this._prePos, originPos = null === (_a = this._currentHandler) || void 0 === _a ? void 0 : _a.attribute.y, 
            railLen = railHeight);
            const newPos = clamp(originPos + delta, 0, railLen), currentValue = this.calculateValueByPos(newPos);
            "text" === this._currentHandler.type ? this._updateHandlerText(this._currentHandler, newPos, currentValue) : this._updateHandler(this._currentHandler, newPos, currentValue), 
            this._updateTrack(), this._prePos = currentPos, this._dispatchChangeEvent();
        }, this._onHandlerPointerUp = e => {
            this._isChanging = !1, this._currentHandler = null, this._clearAllDragEvents();
        }, this._handleTouchMove = e => {
            this._isChanging && e.preventDefault();
        }, this._onTrackPointerdown = e => {
            this._clearAllDragEvents(), this._isChanging = !0;
            const {x: x, y: y} = this.stage.eventPointTransform(e);
            this._prePos = this._isHorizontal ? x : y;
            const triggers = getEndTriggersOfDrag(), obj = "browser" === vglobal.env ? vglobal : this.stage;
            obj.addEventListener("pointermove", this._onTrackPointerMove, {
                capture: !0,
                passive: !1
            }), triggers.forEach((trigger => {
                obj.addEventListener(trigger, this._onTrackPointerUp);
            }));
        }, this._onTrackPointerMove = e => {
            e.preventDefault(), this._isChanging = !0;
            const {railWidth: railWidth, railHeight: railHeight, min: min, max: max, inverse: inverse} = this.attribute;
            if (max === min) return;
            const {startHandler: startHandler, endHandler: endHandler} = this._getHandlers();
            let currentPos, trackLen, railLen;
            const {x: x, y: y} = this.stage.eventPointTransform(e);
            this._isHorizontal ? (currentPos = x, trackLen = this._track.attribute.width, railLen = railWidth) : (currentPos = y, 
            trackLen = this._track.attribute.height, railLen = railHeight);
            const delta = currentPos - this._prePos;
            if (startHandler) {
                const originPos = this._isHorizontal ? startHandler.attribute.x : startHandler.attribute.y, newPos = inverse ? clamp(originPos + delta, trackLen, railLen) : clamp(originPos + delta, 0, railLen - trackLen), currentValue = this.calculateValueByPos(newPos);
                this._updateHandler(startHandler, newPos, currentValue);
            }
            if (endHandler) {
                const originPos = this._isHorizontal ? endHandler.attribute.x : endHandler.attribute.y, newPos = inverse ? clamp(originPos + delta, 0, railLen - trackLen) : clamp(originPos + delta, trackLen, railLen), currentValue = this.calculateValueByPos(newPos), startHandlerAttribute = null == startHandler ? void 0 : startHandler.attribute;
                this._updateHandler(endHandler, newPos, currentValue), this._track.setAttributes(this._isHorizontal ? {
                    x: Math.min(startHandlerAttribute.x, endHandler.attribute.x),
                    width: Math.abs(startHandlerAttribute.x - endHandler.attribute.x)
                } : {
                    y: Math.min(startHandlerAttribute.y, endHandler.attribute.y),
                    height: Math.abs(startHandlerAttribute.y - endHandler.attribute.y)
                });
            }
            this._prePos = currentPos, this._dispatchChangeEvent();
        }, this._onTrackPointerUp = e => {
            this._isChanging = !1, this._clearAllDragEvents();
        }, this._onRailPointerDown = e => {
            this._clearAllDragEvents(), this._isChanging = !0;
            const {railWidth: railWidth, railHeight: railHeight, min: min, max: max} = this.attribute;
            if (max === min) return;
            const startHandler = this._startHandler, endHandler = this._endHandler;
            let currentPos, startHandlerPos, endHandlerPos, railLen;
            this._isHorizontal ? (currentPos = e.viewX - this._rail.globalAABBBounds.x1, startHandlerPos = null == startHandler ? void 0 : startHandler.attribute.x, 
            endHandlerPos = null == endHandler ? void 0 : endHandler.attribute.x, railLen = railWidth) : (currentPos = e.viewY - this._rail.globalAABBBounds.y1, 
            startHandlerPos = null == startHandler ? void 0 : startHandler.attribute.y, endHandlerPos = null == endHandler ? void 0 : endHandler.attribute.y, 
            railLen = railHeight);
            const currentValue = this.calculateValueByPos(currentPos);
            if (isValid(endHandlerPos)) {
                const updateHandler = Math.abs(currentPos - startHandlerPos) > Math.abs(currentPos - endHandlerPos) ? endHandler : startHandler;
                this._updateHandler(updateHandler, currentPos, currentValue);
            } else this._updateHandler(startHandler, currentPos, currentValue);
            this._updateTrack(), this._dispatchChangeEvent();
        };
    }
    calculatePosByValue(value, pos) {
        const {layout: layout, railWidth: railWidth, railHeight: railHeight, min: min, max: max, inverse: inverse} = this.attribute;
        let ratio = 0;
        ratio = min === max ? "start" === pos ? 0 : "end" === pos ? 1 : 0 : (value - min) / (max - min);
        return (inverse ? 1 - ratio : ratio) * ("vertical" === layout ? railHeight : railWidth);
    }
    calculateValueByPos(pos) {
        const {layout: layout, railWidth: railWidth, railHeight: railHeight, min: min, max: max, inverse: inverse} = this.attribute, railLen = "vertical" === layout ? railHeight : railWidth;
        return min + (max - min) * (inverse ? 1 - pos / railLen : pos / railLen);
    }
    setValue(value) {
        const {min: min, max: max} = this.attribute;
        if (max === min) return;
        const [startValue, endValue] = array(value), {startHandler: startHandler, endHandler: endHandler} = this._getHandlers();
        startHandler && this._updateHandler(startHandler, this.calculatePosByValue(startValue), startValue), 
        endHandler && this._updateHandler(endHandler, this.calculatePosByValue(endValue), endValue), 
        this._updateTrack();
    }
    render() {
        var _a, _b;
        this.removeAllChild(!0);
        const {layout: layout = "horizontal", railWidth: railWidth, railHeight: railHeight, startText: startText, endText: endText, min: min, max: max, showHandler: showHandler = !0, showTooltip: showTooltip} = this.attribute;
        let {value: value} = this.attribute;
        isNil(value) && (value = [ min, max ]), this._currentValue = {
            startValue: convertValueToRange(value)[0],
            endValue: convertValueToRange(value)[1]
        };
        const isHorizontal = "horizontal" === layout;
        this._isHorizontal = isHorizontal;
        const innerView = graphicCreator.group({
            x: 0,
            y: 0
        });
        innerView.name = SLIDER_ELEMENT_NAME.innerView, this.add(innerView), this._innerView = innerView;
        let startTextShape, startLen = 0;
        if (startText && startText.visible) {
            startTextShape = graphicCreator.text(Object.assign({
                x: isHorizontal ? 0 : railWidth / 2,
                y: isHorizontal ? railHeight / 2 : 0,
                textAlign: isHorizontal ? "start" : "center",
                textBaseline: isHorizontal ? "middle" : "top",
                text: startText.text,
                lineHeight: null === (_a = startText.style) || void 0 === _a ? void 0 : _a.fontSize
            }, startText.style)), startTextShape.name = SLIDER_ELEMENT_NAME.startText, innerView.add(startTextShape);
            const space = isValid(startText.space) ? startText.space : 0;
            startLen += (isHorizontal ? startTextShape.AABBBounds.width() : startTextShape.AABBBounds.height()) + space;
        }
        const mainContainer = graphicCreator.group({
            x: isHorizontal ? startLen : 0,
            y: isHorizontal ? 0 : startLen
        });
        innerView.add(mainContainer);
        const railContainer = graphicCreator.group({
            x: 0,
            y: 0
        });
        let endTextShape;
        if (railContainer.name = SLIDER_ELEMENT_NAME.railContainer, this._railContainer = railContainer, 
        mainContainer.add(railContainer), this._mainContainer = mainContainer, this._renderRail(railContainer), 
        startLen += isHorizontal ? railWidth : railHeight, endText && endText.visible) {
            const space = isValid(endText.space) ? endText.space : 0;
            endTextShape = graphicCreator.text(Object.assign({
                x: isHorizontal ? startLen + space : railWidth / 2,
                y: isHorizontal ? railHeight / 2 : startLen + space,
                textAlign: isHorizontal ? "start" : "center",
                textBaseline: isHorizontal ? "middle" : "top",
                text: endText.text,
                lineHeight: null === (_b = endText.style) || void 0 === _b ? void 0 : _b.fontSize
            }, endText.style)), endTextShape.name = SLIDER_ELEMENT_NAME.endText, innerView.add(endTextShape);
        }
        this._renderTrack(railContainer), showHandler && (this._renderHandlers(mainContainer), 
        this._bindEvents()), showTooltip && (this._renderTooltip(), this._bindTooltipEvents());
    }
    _renderRail(container) {
        const {railWidth: railWidth, railHeight: railHeight, railStyle: railStyle, slidable: slidable} = this.attribute;
        let cursor = "default";
        !1 !== slidable && (cursor = "pointer");
        const railShape = graphicCreator.rect(Object.assign({
            x: 0,
            y: 0,
            width: railWidth,
            height: railHeight,
            cursor: cursor
        }, railStyle));
        return railShape.name = SLIDER_ELEMENT_NAME.rail, container.add(railShape), this._rail = railShape, 
        railShape;
    }
    _renderHandlers(container) {
        const {range: range, min: min, max: max, handlerSize: handlerSize = 14, handlerStyle: handlerStyle, handlerText: handlerText, railHeight: railHeight, railWidth: railWidth, slidable: slidable} = this.attribute;
        let {value: value} = this.attribute;
        isNil(value) && (value = [ min, max ]);
        const handlerTextVisible = handlerText && handlerText.visible, isHorizontal = this._isHorizontal, [startValue, endValue] = convertValueToRange(value), startPos = this.calculatePosByValue(startValue, range ? "start" : "end"), startHandler = this._renderHandler(Object.assign({
            x: isHorizontal ? startPos : railWidth / 2,
            y: isHorizontal ? railHeight / 2 : startPos,
            size: handlerSize,
            strokeBoundsBuffer: 0,
            cursor: !1 === slidable ? "default" : getDefaultCursor(isHorizontal)
        }, handlerStyle));
        if (startHandler.name = SLIDER_ELEMENT_NAME.startHandler, this._startHandler = startHandler, 
        container.add(startHandler), this._currentValue.startPos = startPos, handlerTextVisible) {
            const startHandlerText = this._renderHandlerText(startValue, range ? "start" : "end");
            startHandlerText.name = SLIDER_ELEMENT_NAME.startHandlerText, container.add(startHandlerText), 
            this._startHandlerText = startHandlerText;
        }
        if (range) {
            const endPos = this.calculatePosByValue(endValue, "end"), endHandler = this._renderHandler(Object.assign({
                x: isHorizontal ? endPos : railWidth / 2,
                y: isHorizontal ? railHeight / 2 : endPos,
                size: handlerSize,
                strokeBoundsBuffer: 0,
                cursor: !1 === slidable ? "default" : getDefaultCursor(isHorizontal)
            }, handlerStyle));
            if (endHandler.name = SLIDER_ELEMENT_NAME.endHandler, this._endHandler = endHandler, 
            container.add(endHandler), this._currentValue.endPos = endPos, handlerTextVisible) {
                const endHandlerText = this._renderHandlerText(endValue, "end");
                endHandlerText.name = SLIDER_ELEMENT_NAME.endHandlerText, container.add(endHandlerText), 
                this._endHandlerText = endHandlerText;
            }
        }
    }
    _renderTrack(container) {
        const {range: range, min: min, max: max, railHeight: railHeight, railWidth: railWidth, trackStyle: trackStyle, railStyle: railStyle, slidable: slidable, value: value} = this.attribute;
        let startValue, endValue;
        if (isNil(value)) range ? (startValue = min, endValue = max) : startValue = endValue = min; else if (range) {
            const clampValue = clampRange(value, min, max);
            startValue = clampValue[0], endValue = clampValue[1];
        } else startValue = min, endValue = clamp(value, min, max);
        const isHorizontal = this._isHorizontal;
        range || (startValue = min);
        const trackContainer = graphicCreator.group({
            x: 0,
            y: 0,
            width: railWidth,
            height: railHeight,
            cornerRadius: null == railStyle ? void 0 : railStyle.cornerRadius,
            clip: !0,
            pickable: !1
        });
        trackContainer.name = SLIDER_ELEMENT_NAME.trackContainer;
        const draggableTrack = isObject(range) && !0 === range.draggableTrack;
        let cursor;
        cursor = !1 === slidable ? "default" : !1 === range || !1 === draggableTrack ? "pointer" : getDefaultCursor(isHorizontal);
        const startPos = this.calculatePosByValue(startValue, "start"), endPos = this.calculatePosByValue(endValue, range ? "end" : "start"), track = graphicCreator.rect(Object.assign({
            x: isHorizontal ? Math.min(startPos, endPos) : 0,
            y: isHorizontal ? 0 : Math.min(startPos, endPos),
            width: isHorizontal ? Math.abs(endPos - startPos) : railWidth,
            height: isHorizontal ? railHeight : Math.abs(endPos - startPos),
            cursor: cursor
        }, trackStyle));
        track.name = SLIDER_ELEMENT_NAME.track, this._track = track, trackContainer.add(track), 
        container.add(trackContainer);
    }
    _renderHandler(style) {
        return graphicCreator.symbol(style);
    }
    _renderHandlerText(value, position) {
        var _a, _b, _c;
        const {align: align, handlerSize: handlerSize = 14, handlerText: handlerText = {}, railHeight: railHeight, railWidth: railWidth, slidable: slidable} = this.attribute, isHorizontal = this._isHorizontal, pos = this.calculatePosByValue(value, position), textSpace = null !== (_a = handlerText.space) && void 0 !== _a ? _a : 4, textStyle = {
            text: handlerText.formatter ? handlerText.formatter(value) : value.toFixed(null !== (_b = handlerText.precision) && void 0 !== _b ? _b : 0),
            lineHeight: null === (_c = handlerText.style) || void 0 === _c ? void 0 : _c.lineHeight,
            cursor: !1 === slidable ? "default" : getDefaultCursor(isHorizontal)
        };
        isHorizontal ? "top" === align ? (textStyle.textBaseline = "bottom", textStyle.textAlign = "center", 
        textStyle.x = pos, textStyle.y = (railHeight - handlerSize) / 2 - textSpace) : (textStyle.textBaseline = "top", 
        textStyle.textAlign = "center", textStyle.x = pos, textStyle.y = (railHeight + handlerSize) / 2 + textSpace) : "left" === align ? (textStyle.textBaseline = "middle", 
        textStyle.textAlign = "end", textStyle.x = (railWidth - handlerSize) / 2 - textSpace, 
        textStyle.y = pos) : (textStyle.textBaseline = "middle", textStyle.textAlign = "start", 
        textStyle.x = (railWidth + handlerSize) / 2 + textSpace, textStyle.y = pos);
        return graphicCreator.text(Object.assign(Object.assign({}, textStyle), handlerText.style));
    }
    _renderTooltip() {
        var _a;
        const {tooltip: tooltip, railHeight: railHeight, railWidth: railWidth, align: align} = this.attribute;
        tooltip && tooltip.alwaysShow ? this._tooltipState = {
            value: this._currentValue.startValue,
            pos: this._currentValue.startPos
        } : this._tooltipState = null;
        const cx = this._isHorizontal ? 0 : railWidth / 2, cy = this._isHorizontal ? railHeight / 2 : 0;
        if (tooltip && tooltip.shape) {
            const shape = graphicCreator.symbol(Object.assign({
                pickable: !1,
                visible: !!this._tooltipState,
                x: cx,
                y: cy,
                symbolType: "circle"
            }, tooltip.shapeStyle));
            this._tooltipShape = shape, this._mainContainer.add(shape);
        }
        const textConfig = tooltip && tooltip.text || {}, space = null !== (_a = textConfig.space) && void 0 !== _a ? _a : 6, textStyle = {
            pickable: !1,
            visible: !!this._tooltipState,
            text: ""
        };
        this._isHorizontal ? (textStyle.x = cx, textStyle.y = "top" === align ? cy - railHeight / 2 - space : cy + railHeight / 2 + space, 
        textStyle.textAlign = "center", textStyle.textBaseline = "top" === align ? "bottom" : "top") : (textStyle.y = cy, 
        textStyle.x = "left" === align ? cx - railWidth / 2 - space : cy + railWidth / 2 + space, 
        textStyle.textAlign = "left" === align ? "end" : "start", textStyle.textBaseline = "middle");
        const text = graphicCreator.text(Object.assign(Object.assign({}, textStyle), textConfig.style));
        this._mainContainer.add(text), this._tooltipText = text, this._tooltipState && this._updateTooltip();
    }
    _updateTooltip() {
        var _a, _b;
        if (!this._tooltipShape && !this._tooltipText || !this._tooltipState) return;
        const {railWidth: railWidth, railHeight: railHeight} = this.attribute, railLen = this._isHorizontal ? railWidth : railHeight, coord = this._tooltipState.pos * railLen, coordKey = this._isHorizontal ? "x" : "y";
        this._tooltipShape && this._tooltipShape.setAttributes({
            visible: !0,
            [coordKey]: coord
        });
        const {align: align} = this.attribute;
        if (this._tooltipText) {
            const textConfig = this.attribute.tooltip && this.attribute.tooltip.text || {};
            this._tooltipText.setAttributes({
                visible: !0,
                [coordKey]: coord,
                text: textConfig.formatter ? textConfig.formatter(this._tooltipState.value) : this._isHorizontal || "left" !== align ? `≈ ${this._tooltipState.value.toFixed(null !== (_b = textConfig.precision) && void 0 !== _b ? _b : 0)}` : `${this._tooltipState.value.toFixed(null !== (_a = textConfig.precision) && void 0 !== _a ? _a : 0)} ≈`
            });
        }
    }
    _bindEvents() {
        if (this.attribute.disableTriggerEvent) return;
        const {slidable: slidable, range: range} = this.attribute;
        slidable && (this._startHandler && this._startHandler.addEventListener("pointerdown", this._onHandlerPointerdown), 
        this._startHandlerText && this._startHandlerText.addEventListener("pointerdown", this._onHandlerPointerdown), 
        this._endHandler && this._endHandler.addEventListener("pointerdown", this._onHandlerPointerdown), 
        this._endHandlerText && this._endHandlerText.addEventListener("pointerdown", this._onHandlerPointerdown), 
        isObject(range) && range.draggableTrack && this._track.addEventListener("pointerdown", this._onTrackPointerdown), 
        this._railContainer.addEventListener("pointerdown", this._onRailPointerDown), ("browser" === vglobal.env ? vglobal : this.stage).addEventListener("touchmove", this._handleTouchMove, {
            passive: !1
        }));
    }
    _bindTooltipEvents() {
        this.attribute.disableTriggerEvent || (this._mainContainer.addEventListener("pointerenter", this._onTooltipShow), 
        this._mainContainer.addEventListener("pointermove", this._onTooltipUpdate), this._mainContainer.addEventListener("pointerleave", this._onTooltipHide));
    }
    _clearAllDragEvents() {
        const triggers = getEndTriggersOfDrag(), obj = "browser" === vglobal.env ? vglobal : this.stage;
        obj.removeEventListener("pointermove", this._onHandlerPointerMove, {
            capture: !0,
            passive: !1
        }), triggers.forEach((trigger => {
            obj.removeEventListener(trigger, this._onHandlerPointerUp);
        })), obj.removeEventListener("pointermove", this._onTrackPointerMove, {
            capture: !0,
            passive: !1
        }), triggers.forEach((trigger => {
            obj.removeEventListener(trigger, this._onTrackPointerUp);
        }));
    }
    _updateTrack() {
        const {inverse: inverse, railWidth: railWidth, railHeight: railHeight} = this.attribute, startHandler = this._startHandler, endHandler = this._endHandler;
        if (this._isHorizontal) {
            const startHandlerPos = null == startHandler ? void 0 : startHandler.attribute.x;
            if (endHandler) {
                const endHandlerPos = null == endHandler ? void 0 : endHandler.attribute.x;
                this._track.setAttributes({
                    x: Math.min(startHandlerPos, endHandlerPos),
                    width: Math.abs(startHandlerPos - endHandlerPos)
                });
            } else inverse ? this._track.setAttributes({
                x: startHandlerPos,
                width: railWidth - startHandlerPos
            }) : this._track.setAttributes({
                width: startHandlerPos
            });
        } else {
            const startHandlerPos = null == startHandler ? void 0 : startHandler.attribute.y;
            if (endHandler) {
                const endHandlerPos = null == endHandler ? void 0 : endHandler.attribute.y;
                this._track.setAttributes({
                    y: Math.min(startHandlerPos, endHandlerPos),
                    height: Math.abs(startHandlerPos - endHandlerPos)
                });
            } else inverse ? this._track.setAttributes({
                y: startHandlerPos,
                height: railHeight - startHandlerPos
            }) : this._track.setAttributes({
                height: startHandlerPos
            });
        }
    }
    _updateHandler(handler, position, value) {
        var _a;
        const isHorizontal = this._isHorizontal;
        handler.setAttribute(isHorizontal ? "x" : "y", position);
        const updateHandlerText = handler.name === SLIDER_ELEMENT_NAME.startHandler ? this._startHandlerText : this._endHandlerText;
        if (updateHandlerText) {
            const {handlerText: handlerText = {}} = this.attribute;
            updateHandlerText.setAttributes({
                text: handlerText.formatter ? handlerText.formatter(value) : value.toFixed(null !== (_a = handlerText.precision) && void 0 !== _a ? _a : 0),
                [isHorizontal ? "x" : "y"]: position
            });
        }
        handler.name === SLIDER_ELEMENT_NAME.startHandler ? (this._currentValue.startValue = value, 
        this._currentValue.startPos = position) : (this._currentValue.endValue = value, 
        this._currentValue.endPos = position);
    }
    _updateHandlerText(handlerText, position, value) {
        var _a;
        const isHorizontal = this._isHorizontal, {handlerText: handlerTextAttr = {}} = this.attribute;
        handlerText.setAttributes({
            [isHorizontal ? "x" : "y"]: position,
            text: handlerTextAttr.formatter ? handlerTextAttr.formatter(value) : value.toFixed(null !== (_a = handlerTextAttr.precision) && void 0 !== _a ? _a : 0)
        });
        const updateHandler = handlerText.name === SLIDER_ELEMENT_NAME.startHandlerText ? this._startHandler : this._endHandler;
        updateHandler && updateHandler.setAttributes({
            [isHorizontal ? "x" : "y"]: position
        }), handlerText.name === SLIDER_ELEMENT_NAME.startHandlerText ? (this._currentValue.startValue = value, 
        this._currentValue.startPos = position) : (this._currentValue.endValue = value, 
        this._currentValue.endPos = position);
    }
    _dispatchChangeEvent() {
        const isRange = !!this.attribute.range, currentValue = this._currentValue;
        this._dispatchEvent("change", {
            value: isRange ? [ Math.min(currentValue.endValue, currentValue.startValue), Math.max(currentValue.endValue, currentValue.startValue) ] : currentValue.startValue,
            position: isRange ? [ Math.min(currentValue.endPos, currentValue.startPos), Math.max(currentValue.endPos, currentValue.startPos) ] : currentValue.startPos
        });
    }
    _dispatchTooltipEvent(type) {
        this._dispatchEvent("sliderTooltip", {
            type: type,
            position: this._tooltipState && this._tooltipState.pos,
            value: this._tooltipState && this._tooltipState.value
        });
    }
    _getHandlers() {
        const {inverse: inverse} = this.attribute;
        let startHandler = this._startHandler, endHandler = this._endHandler;
        return endHandler ? (this._isHorizontal ? (!inverse && endHandler.attribute.x < (null == startHandler ? void 0 : startHandler.attribute.x) || inverse && endHandler.attribute.x > (null == startHandler ? void 0 : startHandler.attribute.x)) && ([startHandler, endHandler] = [ endHandler, startHandler ]) : (!inverse && endHandler.attribute.y < (null == startHandler ? void 0 : startHandler.attribute.y) || inverse && endHandler.attribute.y > (null == startHandler ? void 0 : startHandler.attribute.y)) && ([startHandler, endHandler] = [ endHandler, startHandler ]), 
        {
            startHandler: startHandler,
            endHandler: endHandler
        }) : {
            startHandler: startHandler,
            endHandler: endHandler
        };
    }
    release(all) {
        super.release(all), ("browser" === vglobal.env ? vglobal : this.stage).addEventListener("touchmove", this._handleTouchMove, {
            passive: !1
        }), this._clearAllDragEvents();
    }
}

Slider.defaultAttributes = {
    slidable: !0,
    layout: "horizontal",
    align: "bottom",
    height: 8,
    showHandler: !0,
    handlerSize: 14,
    handlerStyle: {
        symbolType: "circle",
        fill: "#fff",
        stroke: "#91caff",
        lineWidth: 2
    },
    tooltip: {
        shapeStyle: {
            symbolType: "circle",
            fill: "#fff",
            stroke: "#91caff",
            lineWidth: 2
        },
        text: {
            style: {
                fill: "#2C3542",
                fontSize: 12
            }
        }
    },
    railStyle: {
        fill: "rgba(0,0,0,.04)"
    },
    trackStyle: {
        fill: "#91caff"
    },
    showValue: !0,
    valueStyle: {
        fill: "#2C3542",
        fontSize: 12
    },
    startText: {
        style: {
            fill: "#2C3542",
            fontSize: 12
        }
    },
    endText: {
        style: {
            fill: "#2C3542",
            fontSize: 12
        }
    },
    handlerText: {
        visible: !0,
        space: 4,
        precision: 0,
        style: {
            fill: "#2C3542",
            fontSize: 12
        }
    }
};
//# sourceMappingURL=slider.js.map
